2018年11月4日 星期日

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

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

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

首先安裝軟體。 你可以用 apt 的方式安裝 python-websockify 套件, 也可以省略此步驟, 等一下讓 novnc 自動幫你處理。 另外, 也要從 github 頁面 下載 novnc。

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

  1. 啟動 vnc 服務: tigervncserver -geometry 800x600 :7 這裡的 :7 可改成任意二位數字。 這裡的 :7 會讓 vnc 佔用 port 5907。 關於 vnc 伺服器的更多細節, 詳見本文第一個連結。
  2. 啟動 websockify: 某路徑/noVNC/utils/launch.sh --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/launch.sh --vnc localhost:5907 --cert ckhung.pem 於是客戶端連線時, 就可以用 https 開頭的網址。 當然, 因為這張憑證是自己發給自己的, 所以瀏覽器會警告, 說對方不安全。 不要理它, 堅持要加入例外、 要信任這個憑證, 就可以 https 連線了。 詳見 官網 wiki 說明

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

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

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

沒有留言:

張貼留言