CHIRIMEN for Raspberry Pi 3 におけるセキュリティーエラーへの対処方法

概要

CHIRIMEN for Raspberry Pi 3 を使っていて「あれ？exampleが動かない！」というときに試してください。

対象Version

Ver. 2017.10.17

原因はセキュリティーエラーかも?

CHIRIMEN for Raspberry Pi 3 では、下図のようにブラウザからPolyfill経由でRaspberry Pi 3（以下「Raspi3」）上のサーバへWebSocket経由で通信することで、GPIOやI2Cへのアクセスを行います。

WebSocketでアクセスするサーバドメインはwss://localhost:33330ですが、ここで利用しているSSL証明書が自己署名証明書のため、ブラウザがセキュリティエラーでアクセスをブロックすることがあります。

セキュリティーエラーにようるアクセスブロックは下記手順で確認できます。

1.デベロッパーツールを起動

ブラウザの画面でマウスを右クリックするとコンテキストメニューが表示されます。
ここで、「検証」を選びます。

するとデベロッパーツールが起動します。

2.デベロッパーツール画面でConsoleを確認

デベロッパーツールの「Console」タブを見て下記のようなエラー（WebSocket polyfill.js:xx connection to 'wss://localhost:33330' failed: Error in connection establishment: net::ERR_INSECURE_RESPONSE）が出ていたらセキュリティーエラーによるアクセスブロックが発生しています。

セキュリティーエラーへの対処方法

上記のようなセキュリティエラーが出たら、ブラウザから https://localhost:33330へアクセスしてみてください。
下記のようなエラー画面が表示されるはずです。

ここで、詳細設定をクリックしてください。

次の画面でlocalhostにアクセスする(安全ではありません)をクリックしてください。(その後画面は変わりません)

これで、wss://localhost:33330 へアクセスできるようになったはずです。
再度 examples を実行してみて、正常に動作するか確認してみてください。