まずは GitHub 公開リポジトリの URL を貼っておきます。
すぐに動くものを見たい方はこちらをご確認ください。
GitHubリポジトリ
※サンプルコードも同梱されていますので、実行時はご注意ください。

開発動機

前回も述べたとおり、Raspberry Pi Pico W をはじめとする無線LAN機能搭載の IoT 機器では、エンドユーザーが自身の WiFi 接続情報を機器に設定する必要があるという課題があります。

近年では WPS のような規格も存在しますが、Raspberry Pi Pico W のようなリソースの限られたデバイスでは実装が困難です。

現実的な解決策として、以下のような手法があり、Qiitaでも多くの記事が公開されています。

これらは有効な手法ですが、それぞれに以下のような課題があります。

「Raspberry Pi Pico W（を組み込んだIoT機器）を実用的に使うには、これらの課題を解決する必要がある」と考えていたところ、次の情報を目にしました。

Raspberry Pi Pico の MicroPython 開発環境で利用する REPL（Read-Eval-Print Loop）は、単なるシリアル通信である

この情報をきっかけに、

「Web Serial API を使えば、ブラウザと USB ケーブルだけで、外部通信を維持したまま、安全に設定ファイルの書き換えができるのでは？」

というアイデアが浮かび、今回のツールキット（と呼ぶのは少し大げさですが）を作成しました。

従来手法に対する利点

今回のアプローチが、既存の手法と比較して優れていると考える点は以下のとおりです。

これらの利点により、「Raspberry Pi Pico W + MicroPython」を活用した IoT 機器の実用的かつ安全な運用が現実のものになったと考えています。

このツールキットでは、以下の技術を使用しています。

なお、Vue.js に関しては補足があります。

近年の Vue 解説では .vue ファイルを用いた SFC（Single File Component）形式が主流ですが、本プロジェクトではCDN版 Vue.js をクライアントサイドのみに限定して使用しています。

SSR（サーバーサイドレンダリング）との併用や、既存Webアプリへの部分的な導入など、再利用性や柔軟性を重視した Vue の使い方として、同じ考えを持つ方の参考になれば幸いです。

次回は、GitHub に公開しているソースコードをベースに、Web Serial API の基本的な使い方や動作原理について解説する予定です。

どうぞよろしくお願いします。