novnc： 有瀏覽器就可以連上線的遠端桌面

VNC 是遠端桌面連線程式， 也可以當成電子白板或廣播教學軟體來用。 以前就有聽說過： 如果採用 novnc， 那麼客戶端可以不必安裝任何程式， 只要有瀏覽器就可以連線。 這學期我終於開始用這個方法上課。

如上圖： 以廣播教學為例， 在老師機上除了啟動 vnc 伺服器之外， 另外再啟動 websockify (圖中的 "novnc_proxy" 會去呼叫 websockify)。 後者的功能基本上就是把 vnc 協定與 http 協定互相翻譯， 。 你也可以說它是一個 vnc 與 http 之間的轉接頭。 這樣一來， 不論是老師或學生， 都可以用瀏覽器透過 websockify 跟 vnc 伺服器連線。

首先安裝軟體。 建議不要用 apt 的方式安裝 python-websockify 套件 (如果已有， 請先刪除) 因為等一下 novnc 會自動下載相容性最佳版本的 websockify。 請直接從 github 頁面 下載 novnc。

在老師機上啟動服務， 需要很簡單的兩個步驟：

1. 啟動 vnc 服務： tigervncserver -geometry 800x600 :7 這裡的 :7 可改成任意二位數字。 這裡的 :7 會讓 vnc 佔用 port 5907。 關於 vnc 伺服器的更多細節， 詳見本文第一個連結。
2. 啟動 websockify： 某路徑/noVNC/utils/novnc_proxy --vnc localhost:5907 這個 shell script 會試著去找系統裡的 websockify， 如果找不到， 就自己從 github 下載最新版的 websockify。

啟動 websockify 時， 它也會印出一個網址。 把那個網址剪貼到瀏覽器上， 就可以連線登入了！ 朝陽資工王德譽老師的 VNC建置電腦教室廣播系統 有更詳細的說明。

如果想用加密的 https 連線， 就必須先自己產生一個 https 的憑證： openssl req -new -x509 -days 365 -nodes -out ckhung.pem -keyout ckhung.pem 而啟動 websockify 的時候， 要加上一個選項指定憑證的位置： 某路徑/noVNC/utils/novnc_proxy --vnc localhost:5907 --cert ckhung.pem 於是客戶端連線時， 就可以用 https 開頭的網址。 當然， 因為這張憑證是自己發給自己的， 所以瀏覽器會警告， 說對方不安全。 不要理它， 堅持要加入例外、 要信任這個憑證， 就可以 https 連線了。 詳見 官網 wiki 說明。

本機跟 novnc 之間的視窗也可以剪貼文字資料， 不過要比平常的剪貼多一個步驟。 先在瀏覽器裡的遠端桌面上啟動一支小程式： tigervncconfig -display :7 & 叫出來的這個視窗我們並不特別有興趣； 但一定要有它， 剪貼簿才有作用。 在瀏覽器裡的遠端桌面左側， 可以叫出剪貼簿。 剪貼時必須這樣做： 本機 <==> 剪貼簿 <==> 遠端桌面。 這個功能我找了好久才從 這個問答 得到解答。

跟傳統的 vnc 比起來， novnc 還有一個好處： 在手機上不必安裝任何客戶端軟體， 有瀏覽器就可以看。 理論上啦。 但我在 android 上 (我的手機刷成 cyanogenmod 版作業系統) 測試， 畫面無法放大縮小， 甚至無法滑動。 唯一勉強可用的組合是採用 lightning browser 連線， 網址改成 vnc_lite.html 而不是 vnc.html。

學生們超喜歡我用 vnc 廣播的， 還叫我要推廣到其他課程去。 應該是因為他們可以 繼續做自己的事 一邊看著老師的廣播一邊馬上跟著下指令。 而且這還可以用系統的螢幕快照或 firefox 的網頁快照 取代手機照相來抄筆記。 不過多數學生好像還是偏好用拍照的， 大概是因為我沒花時間教他們 adb 傳檔 所以他們寧可犧牲畫質、 覺得還是直接放進自己的手機比較方便吧。