noVNC — 虚拟机Web控制台

不管是 VMware, Xen 还是 KVM都可以通过 VNC 客户端访问这些虚拟机的控制台，如果要开发虚拟机的 web 控制面板的话当然最好能配一个 web 的 VNC 客户端。noVNC 正是我们需要的 HTML5 VNC 客户端，其采用 HTML 5 WebSockets, Canvas 和 JavaScript 实现，并且被普遍用在各大云计算、虚拟机控制面板中，比如 OpenStack Dashboard 和 OpenNebula Sunstone 。

前面说了 noVNC 采用 WebSockets 实现，但是目前大多数 VNC 服务器都不支持 WebSockets，所以 noVNC 是不能直接连接 VNC 服务器的，怎么办呢？需要一个代理来做 WebSockets （Http socket）和 TCP sockets 之间的转换，理解这一点很重要。这个代理也已经有了，在 noVNC 的目录里，叫做 websockify。

vncServer

1. 安装vnc4server，使用noVNC访问服务器的虚拟机控制器，首选需要在服务器如192.168.110.179安装该服务；

   xy@tnode07:~$ sudo apt-get install vnc4server

   配置vnc的xstartup文件：vi /home/xy/.vnc/xstartup

   
   #!/bin/sh
   
   [ -x /etc/vnc/xstartup ] && exec /etc/vnc/xstartup
   [ -r $HOME/.Xresources ] && xrdb $HOME/.Xresources
   xsetroot -solid grey
   vncconfig -iconic &
   x-terminal-emulator -geometry 80x24+10+10 -ls -title "$VNCDESKTOP Desktop" &
   x-window-manager &

2. 启动vncserver服务

   xy@tnode07:~$ vncserver         //启动vncserver服务
   
   You will require a password to access your desktops.
   
   Password:
   Verify:
   xauth:  file /home/xy/.Xauthority does not exist
   
   New 'tnode07:1 (nsr)' desktop is tnode07:1
   
   Creating default startup script /home/xy/.vnc/xstartup
   Starting applications specified in /home/xy/.vnc/xstartup
   Log file is /home/xy/.vnc/tnode07:1.log

3. 命令查看vncserver状态

   xy@tnode07:~/noVNC/websockify$ ps axu|grep vnc4
   xy     6867  0.0  0.0  23880  9456 pts/0    S    16:00   0:00 Xvnc4 :1 -desktop tnode07:1 (xy) -auth /home/xy/.Xauthority -geometry 1024x768 -depth 16 -rfbwait 30000 -rfbauth /home/xy/.vnc/passwd -rfbport 5901 -pn -fp /xy/X11R6/lib/X11/fonts/Type1/,/xy/X11R6/lib/X11/fonts/Speedo/,/xy/X11R6/lib/X11/fonts/misc/,/xy/X11R6/lib/X11/fonts/75dpi/,/xy/X11R6/lib/X11/fonts/100dpi/,/xy/share/fonts/X11/misc/,/xy/share/fonts/X11/Type1/,/xy/share/fonts/X11/75dpi/,/xy/share/fonts/X11/100dpi/ -co /etc/X11/rgb
   xy     6900  0.0  0.0  10472  2144 pts/0    S+   16:02   0:00 grep --color=auto vnc4
   

VNC（Virtual Network Computing）网络遥控技术是指由一部计算机（主控端）去控制另一部计算机（被控端），而且当主控端在控制端时，就如同用户亲自坐在被控端前操作一样，可以执行被控端的应用程序，及使用被控端的系统资源。

noVNC提供一种在网页上通过html5的Canvas，访问机器上vncserver提供的vnc服务，需要做tcp到websocket的转化，才能在html5中显示出来。网页就是一个客户端，类似win下面的vncviewer，只是此时填的不是裸露的vnc服务的ip+port，而是由noVNC提供的websockets的代理，在noVNC代理服务器上要配置每个vnc服务，noVNC提供一个标识，去反向代理所配置的vnc服务。深入理解其原理，见博文示例：http://www.cnblogs.com/yanghuahui/p/3574388.html

noVNC

1. 首先，从Git上下载 noVNC 软件代码：

   xy@tnode07:~$ git clone https://github.com/kanaka/noVNC
        博文链接： http://blog.csdn.net/qiqishuang
   sudo git clone https://github.com/kanaka/websockify.git

2. 然后运行 noVNC/utils/websockify.py开启代理服务，把本机 VNC 服务（localhost）的端口（5900）和 noVNC 的代理端口（8000）连接起来，这样通过 noVNC/vnc.html 访问 8000 端口就自动转换到 5900 端口上。

   xy@tnode07:~/noVNC$ ./utils/launch.sh --vnc localhost:5900
   Warning: could not find self.pem  
   Starting webserver and WebSockets proxy on port 6080  
   WARNING: no 'numpy' module, HyBi protocol will be slower  
   WebSocket server settings:  
     - Listen on :6080  
     - Flash security policy server  
     - Web server. Web root: /home/xiaofei/work/noVNC  
     - No SSL/TLS support (no cert file)  
     - proxying from :6080 to 192.168.110.179:5900  
   

   其流程大概是这样：vnc.html -> 192.168.2.20:8000 -> websockify.py -> localhost:5900
   当然代理和 VNC 服务可以不在同一机器上，比如代理在 192.168.110.179, VNC 服务在 192.168.110.180：

   xy@tnode07:~/noVNC$ ./websockify.py 8000 192.168.110.180:5900

   其流程大概是这样：vnc.html -> 192.168.110.179:8000 -> websockify.py -> 192.168.110.180:5900

   理解了上面的过程，应该有想法如何集成 noVNC 到自己的程序了，很简单，先用 websockify 架一个代理，然后用 vnc.html 访问这个代理，vnc.html 和 vnc_auto.html 可以当作我们的范例程序参考。集成 noVNC 到自己的程序也没啥难度，按照官方文档修改相应参数就可以了，特别注意 INCLUDE_URI 这个变量。
   如果给每个运行的 VNC 服务器开一个代理（和端口）是不是很繁琐？如果有成百上千个虚拟机呢？这么多虚拟机这么多端口怎么编程实现一一对应呢，是不是很麻烦？难道这么点东西还要个数据库来记录这些对应关系吗？

3. 咱们可以使用 websockify.py 带 –target-config 参数的办法启动了代理，所有代理都在一个端口（6080）下，并会在指定的目录下（/home/xy/noVNC/websockify）生成一个对应的文件（vnc_token），其将 VNC 服务（主机名：端口）对应起来，具体如下。

   vm1: localhost:7900
   vm2: localhost:7910
   vm3: localhost:7920
   vm4: localhost:7930
   vm5: localhost:7940
   vm6: localhost:7950
   vm7: localhost:7960
   vm8: localhost:7970
   vm9: localhost:7980
   vm10: localhost:7990

   这样一个（启动了 VNC 服务的，启动命令如下）虚拟机生成这样一个token文件，根据该文件内容能识别这个代理对应到哪个主机上的 VNC 服务。

   xy@tnode07:~/noVNC/websockify$ ./websockify.py --web=./ --target-config /home/xy/noVNC/websockify/vnc_tokens 6080 &

   执行完该命令后，可ps查看下websockify代理的状态：

   xy@tnode07:~/novncService$ ps axu|grep python
       nsr       7609  0.1  0.0  41804 13528 pts/0    S    15:12   0:00 python /home/xy/novncService/websockify-master/websockify.py --web=./ --target-config /home/xy/novncService/websockify-master/vnc_tokens 6080
       nsr       7613  0.0  0.0  10488  2172 pts/0    S+   15:12   0:00 grep --color=auto python

   附件：Websockify代理启动shell脚本

   
   #! /bin/bash
   
   count=`ps -ef |grep websockify.py |grep -v "grep" |wc -l`
   if [ $count -eq 0 ]
   then
   nohup python /home/xy/novncService/websockify-master/websockify.py --web=./ --target-config /home/xy/novncService/websockify-master/vnc_tokens 6080 &
   fi

4. 访问noVNC服务
   a) Windows中配置运行环境，安装python（2.3皆可），并设置其环境变量；或cmd执行：

   set PATH=PATH;c:\python27

   b)搭建本地SimpleHTTPserver 端口8000，打开cmd进入noVNC文件所在的目录，本文为D盘：d:，执行以下命令：

   i.  Python2: python -m SimpleHTTPServer 8000
   ii. Python3: python -m http.server 8000
   

   c) 进入novnc前段页面，浏览器输入localhost:8000,访问vnc.html页面，其配置如下图所示：
   

   Host：宿主即服务器IP地址
   Port：Novnc的服务端口：6080
   Path：Websockify代理配置信息：websockify/?token=vm1