良くある質問と回答

CHIRIMEN Raspi3 を利用していて良くある質問や回答のメモページです

できること・できないこと

CHIRIMEN Raspi3 では何が出来ますか?

CHIRIMEN Raspi3 は一般的な Web アプリケーションの開発環境に、GPIO と I2C という IoT プロトタイピングなどでよく使われるハードウェアインターフェイスを JavaScript から直接制御可能にしたものです。

デスクトップの Web アプリで出来ることは全て同じようにして実装可能ですし、Web アプリで出来ないことはローカルのサーバと通信させたり拡張機能を作って通信させたりして他のコンテキストや言語の環境で実行させることもあります。

GPIO, I2C 以外によく見聞きするハードのインターフェイスについては次の通りです:

動作環境

Raspberry Pi Zero はサポートしないの?

論理的には移植可能だと思いますが未検証・未対応です。

Raspberry Pi 以外のボードでは動作しないの?

CHRIMEN コミュニティで公式にサポートしている環境はありませんが、Chrome (Chromium) や Firefox のようなブラウザが動作し、Node サーバなどがインストールできる環境であればほぼ同様にして動作するように移植可能と考えられます (実際いくつかのボードで試して使っているコミュニティメンバーもいます)。

もちろん、ポート番号など物理配線が違う場合はそれに合わせてコードを書き換える必要があることには注意が必要です。

トラブルシューティング

同時に複数のタブで開くと動作しない

制限事項です。API では特に規定されていませんが排他制御をしており同一のページを複数タブで開くなど、同じポートを同時に扱うコードを書くと正しく動作しなくなることがあります。全てのタブを閉じてから目的のページだけを開き直してください。

コンソールに Uncaught (in promise) TypeError: navigator.requestGPIOAccess is not a function などと表示される

関数 (メソッド) 呼び出ししようとしているがその関数が定義されていないというエラーです。この場合 navigator.requestGPIOAccess が関数ではないと言うことですが、polyfill スクリプトを読み込んでいないか、読み込みより前にアクセスしようとしている場合に発生します。

JS Bin のコンソールに error: ws error: [object Event] と表示される

コンソールに WebSocket connection to 'wss://localhost:33330/' failed: Error in connection establishment: net::ERR_CONNECTION_REFUSED などと表示される

CHIRIMEN Raspi3 のバックエンドサーバに接続できていません。デスクトップの reset.sh で再起動してください。

JavaScript から特定の URL にアクセスできない

コンソールに Failed to load https://.../: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://...' is therefore not allowed access. などと表示される

CHIRIMEN に限らず一般的な Web 開発でよく見かけるエラーです。Web には 同一オリジンポリシー (Same Origin Policy) というセキュリティ制約があり、JavaScript を読み込んでいるのと異なるドメインの URL には相手側のサーバが オリジン管理ソース共有 (CORS) で明示的に許可している場合以外は JavaScript のコード中で XMLHttpRequest や fetch からアクセスできません。

単純化して言えば、サーバからの HTTP レスポンスヘッダに access-control-allow-origin: * が付与されていれば JavaScript からのアクセスが許可されるため、任意の URL へのアクセスをプロキシ (中継) してレスポンスヘッダを勝手に追加してくれるようなサーバを用意すれば任意のドメインから任意の URL にアクセスが可能になります。

そのようなサービスには例えば https://cors.io/ などがあります。なお、フォーム送信など GET ではなく POST メソッドなどで送信されるリクエストについては一般的にプライバシー問題などもあるため、自前で専用のプロキシーを立てるなどの工夫をする必要があります。

コードも配線も正しいのにとにかく動作しない!

いろいろな原因が考えらるため、ひとつずつ確認していく必要があります。

ハンズオン・ハッカソン・講義など、講師やチューターなどのいる時は、色々試して分からないときは一人で悩まず遠慮なく質問しましょう。 ひとつのことに悩んで糸口が見つけられないまま何十分も過ごさず、どんどん質問してデバッグテクニックや回避策などを教わってスキルを向上させていってください。