きっかけ
当アカウントでは、約2年前より 【SPIKE-RTでロボコンに出よう!!】 と題し記事を連載しています。
LEGO社製の教育用ロボットキット「SPIKE Prime」に、名古屋大学 大学院 情報学研究科 組込みリアルタイムシステム研究室が開発されたRTOS 「SPIKE-RT」 を導入し、C言語で開発しよう!という内容です。
SPIKE-RT開発環境で作成したC言語プログラムは、バイナリファイルにコンパイルして、SPIKE Prime Hubに転送します。この転送の流れが若干面倒だなと感じていました。
上記シリーズで記した方法は、Pythonスクリプトを用いて転送するという方式です。
ただこの方法、セットアップが簡単とはいえず、トラブルの元になり得ると思っていました。
また、Windowsで実行する場合、USBIPDという仕組みを用いてWSLに接続する必要があるのですが、上手く繋がらないことが多々あります。(恐らくWSLとの相性がよろしくない…)
そこでふと思ったのが、
これWebブラウザで転送出来たら便利だな…
というアイデアでした。
最近のブラウザは直接USBで接続された端末にアクセス出来ますし、SPIKE Primeのマイコンに書き込むファームウェア DFU に関しても、JavaScriptライブラリで何とかなりそうです。
そこでGeminiに頼んでプログラムを書かせて、 Webアプリ化 してしまいました!
本記事ではこのWebアプリの使い方を解説していきたいと思います。
【そもそも】SPIKE Primeとは
SPIKE PrimeはLEGO社が販売している教育用ロボットキットです。Hubと、そこに接続するモータやセンサ、さらにロボットを構築するLEGOパーツで構成させています。
Hubは要するにマイコンのこと。中には STM32F413(Cortex-M4) が入っています。
ここに、バイナリ形式のファームウェアを書き込んでいきます。
使い方
今回作成したWebアプリはこちら👇からアクセス出来ます。
Windows、macOS、Linux(Ubuntu)全てで動作確認済みです。
(ブラウザはChromeを使用しています。Firefoxは現時点で動作していません。)
順に使い方を解説していきます。
準備
【Windows向け】ドライバの置き換え
【SPIKE-RTでロボコンに出よう!!】 シリーズをご覧の方は、SPIKE Prime用のドライバは書き換えず進めて来たかと思いますが、本Webアプリを使用する上でSPIKE Hubをブラウザに接続するには、ドライバの置き換えが必要です。
ドライバを書き換えた後でも、今まで通りの方法( write.sh 経由でPythonスクリプトを用いて転送する方法)は使える事を確認済みなので、以下の手順で進めて下さい。
はじめに、以下のページより Zadig というソフトをダウンロードします。
Download欄にある最新のもので大丈夫です。
ダウンロード出来たら、SPIKE Hubを 「DFUモード」 (Bluetoothボタンを押しながらUSB接続し、赤→緑→青と点滅し始めたらOK)で接続し、ソフトを立ち上げます。
「Options」の「List All Devices」にチェックを入れておきます。
プルダウンから 「LEGO Technic Large Hub in DFU Mode」 を選びます。
⚠️ここで違うデバイスを選ぶと大変なことになるので注意しましょう。
Driverのところを 「WinUSB」 にして、下の 「Replace Driver」 を押します。
(※上記画像とは表記が異なります)
恐らくデフォルトの状態では libusb というドライバがあたっているはずなので、それを WinUSB に置き換える形ですね。
置き換えが完了したら、デバイスの接続準備完了です。
【Linux向け】権限設定
Linux(Ubuntu)では、OSのセキュリティにより一般ユーザーがUSBデバイス(特に生のデバイス)を直接操作することが制限されているようなので、udevルール(権限設定ファイル)の作成 をしていきます。
ターミナルを開き、以下のコマンドを順に実行していきます。
echo 'SUBSYSTEM=="usb", ATTRS{idVendor}=="0694", ATTRS{idProduct}=="0008", MODE="0666", GROUP="plugdev"' | sudo tee /etc/udev/rules.d/99-spike.rules
echo 'SUBSYSTEM=="usb", ATTRS{idVendor}=="0483", MODE="0666", GROUP="plugdev"' | sudo tee -a /etc/udev/rules.d/99-spike.rules
sudo udevadm control --reload-rules
sudo udevadm trigger
これでデバイス接続の準備が完了しました。
デバイス接続
まずは、SPIKE HubをPCとDFUモードで接続します。
Bluetoothボタンを押しながらUSB接続し、赤→緑→青と点滅し始めたらDFUモードで接続出来たことになります。
接続出来たらWebアプリへアクセスし、 「1. デバイス接続」 の「SPIKE Primeを接続」と書かれたボタンを押します。
すると、ポップアップが表示されるので、「LEGO Technic Large Hub in DFU Mode」を選んで接続します。
(ここで、「Pybricks Hub」と出てしまう場合は、DFUモードで接続出来ていません。もう一度接続からやり直して下さい。)
正しく接続出来たら、ボタン横に緑色の文字で表示されるほか、画面下部のログにも「✅ 接続成功」と出力されます。
ファームウェア書き込み
続いて、ファームウェア(アプリケーション)の書き込みをやってみます。
SPIKE-RT開発環境で、コンパイルを行ったバイナリファイル( asp.bin など)を用意して下さい。
用意したバイナリファイルを、「ここにファイルをドロップ」にドラッグ&ドロップします。
ドロップ出来ない場合は「ここにファイルをドロップ」部分をクリックすれば、ファイル選択画面が表示されるので、そちらからでもアップロード可能です。
アップロード出来たら、ファイル名とファイルサイズが表示されます。
ここまで出来たら、後は「書き込み開始」を押すだけです!
インジケータが動き、ログも適宜出力されます。
「🎉 書き込み成功」まで出力されたら、書き込み完了です!!
ファームウェア吸い出し
今度は、SPIKE Hub内に既に入っているファームウェア(アプリ)を吸い出してみます。
これはSPIKE-RTで開発したものを吸い出したい、というよりは、LEGO社製のデフォルトファームウェアをバックアップする用途に使います。
現状、SPIKE-RTにファームウェアを書き換えたのを元に戻そうとすると、かなり複雑な手順を踏む必要があります。
(LEGO公式のSPIKE2へのダウングレードツールを使って一度SPIKE2ファームウェアを書き込み、必要に応じてSPIKE3へアプリを使ってアップデートする)
これは非常に面倒で時間のかかる作業なので、このWebアプリ上で吸い出してバックアップ出来るようにしておきました。
「吸い出し(Dump)」のタブを開きます。
オプションとして「アプリ領域のみ (推奨)」と「フルバックアップ」の二つがありますが、基本的に前者を選択しておいて下さい。
これは、SPIKE Hubのメモリ上のどの部分から吸い出すかというオプションですが、「アプリ領域のみ」で吸い出さないと、再度書き込んだ時に正しく動作しなくなってしまいます。
DFUモードで接続していることを確認し、緑色の「吸い出し開始」ボタンを押してください。
無事吸出しが完了すると、 dump_app.bin というファイル名で自動的にPC上へダウンロードされます。
これを再度、「書き込み(Flash)」の方でアップロードしてあげれば、バックアップがすぐに復元可能ということです!
ローカルで実行する
今回のWebアプリですが、実はフロントエンドだけで作られています。
つまりは、HTML/CSS/JavaScriptだけです。
よって、ソースコードをダウンロードしてもらうだけで、ご自身のローカル環境でも実行可能です。
ネット環境が使えないような状況では、このローカルで実行する方法を使用してもらえればと思います。
ソースコードは、私のGithubリポジトリにアップロードしてあります。
緑色の「<> Code」ボタンを押して、「Download ZIP」を選択すれば、ソースコードがZip形式でダウンロードされます。
このなかの index.htmlをブラウザで開いてもらえれば、同じ環境がローカルで実行出来ます。
免責事項
Webアプリ上にも記してありますが、一応こちらにも記載しておきます。
本ソフトウェアの使用によって生じた、データの消失、利益の損失、
デバイスの故障(正常に起動しなくなる等)、またはその他の直接的、
間接的、特別、偶発的、あるいは派生的な損害について、著作者は一切の責任を負いません。
すべての操作は、利用者ご自身の責任において行ってください。
最後に
昨日思いついてその日のうちにプロトタイプが完成しました。
そして今日、記事を書くに至っています。
流石AI、流石Gemini Proといったスピード感です。。。
機能面もUIも含めて良いものが出来ました。
あと、静的サーバーを無料で提供してくれているXServer Staticにも感謝です🙏
またSPIKE-RT開発で「こんな機能が欲しいな」と思ったら追加していきたいと思います。
良かったら【SPIKE-RTでロボコンに出よう!!】 シリーズの方もご覧ください!











