Raspberry PiのデスクトップにWebブラウザからアクセス noVNC

執筆者:

hide

カテゴリ:

シングルボードコンピュータ

このような感じで、PCのWebブラウザからRaspberry Piのデスクトップにアクセスしてみました。

図ではデスクトップの解像度は1280×720ですが、お好みの解像度の設定が可能です。

Webブラウザのみ使用しますので、VNCビューア等のソフトウェアのインストールは不要です。PCでもスマートフォンでも、ブラウザがあれば、いつでもどこでもデスクトップへアクセスできるようです。

設定手順を記録しておこうと思います。

Raspberry PiのnoVNC設定手順

使用するOS

OSはRaspbianを使用しました。初期設定は、宜しければこちらの記事を御覧ください。

Raspbianのインストールと初期設定 2019年10月版

VNCサーバ有効化

最初にVNCを有効化して、デスクトップの解像度を指定しておきます。

raspi-configを起動します。
```
sudo raspi-config
```
5番、Interfacing OptionsのVNC Serverを有効にします。
次に3番、Boot OptionsのDesktop/CLIを選択、Desktop Autologinを有効にしました。試していませんが、Desktopでも大丈夫なのでしょうか？

ディスプレイを接続しない(ヘッドレスの)場合

Raspberry Piにディスプレイを接続しない場合、config.txtで解像度を指定しておきます。

/boot/config.txtを編集します。
```
sudo vi /boot/config.txt
```
21行目付近、framebuffer_widthとframebuffer_heightをアンコメントして有効にします。既定値は1280×720ですが、値を変更してお好きな解像度を指定できます。
再起動して設定を反映します。
```
sudo reboot
```

noVNC設定

Webブラウザからアクセスできるように、noVNCを使用しました。Raspberry Piの中で、VNCクライアントをWebサーバとして動かす設定になりますが、先程有効にしたVNCサーバ側の設定を変えて、noVNCのクライアントに合わせておく必要がありました。

デスクトップの画面右上、VNCアイコンを右クリック、「Options」を選択します。
Authenticationを「VNC password」に変更します。
VNC認証用のパスワードを新しく聞かれますので入力します。
左側の「Expert」をクリック、Parameterの中から「ProtocolVersion」を探して、値を「4.1」に変更します。既定値の「5.0」ではnoVNCが動きませんが、「4.1」なら問題無いようです。
「RemapKeys」の値に「ja-jp」をセットしました。これで日本語キーボードで正しく入力できるかと思います。

noVNCをインストールします。

sudo apt-get update
sudo apt-get install -y novnc

/usr/share/novnc/utilsにインストールされた、launch.shを実行します。
```
cd /usr/share/novnc/utils
./launch.sh
```
Webブラウザから、表示されたURLにアクセスします。ホスト名が埋め込まれていますが、ネットワークが別のセグメントからアクセスしたい場合、IPアドレスに置き換えます。
```
http://<Raspberry PiのIPアドレス>:6080/vnc.html?host=<Raspberry PiのIPアドレス>&port=6080
```
パスワードを入力して「Connect」ボタンをクリックします。
パスワードを入力して、「Connect」ボタンをクリックします。デスクトップが表示されましたでしょうか？

全角文字の入力も問題無いようです

画面右上のキーボードアイコンをクリックすると、アイコンが「あ」に変わるかと思います。その状態で文字を入力すると、変換候補が表示されるようです。アイコンクリックの代わりに、CTRL+スペースで半角入力←→全角入力の切替が可能のようです。

launch.shの自動起動設定

自動でlaunch.shを起動したい場合、systemdの設定を変更します。

novnc.serviceファイルを作成します。

sudo vi /etc/systemd/system/novnc.service

次の内容になります

[Unit]
Description=noVNC service
After=vncserver-x11-serviced.service

[Service]
ExecStart=/usr/share/novnc/utils/launch.sh
Restart=always
Type=simple
User=pi
Group=pi

[Install]
WantedBy=multi-user.target

ポート番号等を変更したい場合、launch.shにオプションを追加してみて下さい。

systemdに設定変更を反映します。

sudo systemctl daemon-reload
sudo systemctl enable novnc.service --now

/boot/config.txtにて解像度を指定しておきましたので、Raspberry Piにディスプレイを接続しなくても、問題なくデスクトップにアクセスできるようです。

お部屋の温度記録用のRaspberry Piは、ディスプレイを接続しておりませんが。

Raspberry Piでお部屋の温度・湿度・気圧・照度を記録するには

PCのWebブラウザからデスクトップにアクセス、温度を確認することができました。

外出先からVPN接続した場合も、問題なくアクセスできました。

令和二年(2020年)秋冬 VPNサーバ機能付きWi-Fiルータはどれが良いのか

Raspberry Piを持ち歩く場合も、スマートフォンから簡単にデスクトップにアクセスできれば、応用範囲が広がりそうですね。

Raspberry PiをWi-Fi親機にする設定は、宜しければこちらを御覧ください。

スマートフォンでRaspberry Piカメラを操作するには

[amazonjs asin=”B07G9QKTHN” locale=”JP” title=”サンワサプライ Magnet脱着式USBType-Cケーブル(データ&充電)1m KU-MGDCA1″]

Raspberry Pi