websocketj--随时随地在Web浏览器中操作你的服务端程序
0 – 有没有觉得Linux标准终端界面输入输出枯燥无味？
1 – 什么？vmstat命令的输出数据不直观？有没有想过能够可视化该命令的输出？
2 – 尝试过用浏览器操作Windows中的cmd吗？
websocketj可以解决以上所有问题，让你随时随地通过浏览器访问任何平台上的应用程序。
- websocketj是什么？
- 如何使用websocketj？
- websocketj是如何工作的？
- 在浏览器中远程操作Windows中的cmd
- 在浏览器中可视化Linux中vmstat命令的输出
- 待完善功能
- 站在巨人肩上
- 如何编译源码
看名字就知道它跟WebSocket有关，简言之，websocketj能够将服务端程序的标准输入输出（STDIN和STDOUT）重定向到远程支持WebSocket协议的浏览器中。
程序的标准输出会被当作message发送到远端的浏览器，来自远端浏览器中的任何数据都会被当作程序的标准输入。不管你的服务端程序使用什么语言编写，只要你的程序支持STDIN和STDOUT，那么websocketj就可以很好地工作。Java、python、C、C#、Ruby、Swift、Go反正whatever else！
websocketj除了是一个WebSocket服务器，可以接收websocket client连接之外，还是一个静态web服务器，可以处理一些常见的静态资源请求，比如html、js、css以及图片之类的。websocketj由Java编写实现，实现代码结构简单，不依赖其他组件，更不需要tomacat、nginx之类的东西，自己完全独立运行。Strong!
说了这么多，那么该如何使用websocketj呢？使用起来也相当简单，下面是使用websocketj的步骤：
- Step1：开发你的服务端程序，不受语言限制，但是必须支持标准输入输出（STDIN和STDOUT）；
- Step2：开发你的前端程序，也就是html/css/js之类的，编写WebSocket Client连接代码，接收服务端的数据，如果有必要，还需要将用户的输入发送给服务器；
- Step3：将你的前端程序文件（html等）放到服务器（比如Linux）的某个目录中，这里以‘usr/local/websocketj/html’为例，其他平台类似；
- Step4：启动websocketj，指定启动参数：‘websocketj –wsport=8081 –ssport=8082 –staticDir=/usr/local/websocketj/html/ yourprogram args…’；
- Step5：打开浏览器，在地址栏中输入http://ip:8082/，会出现一个默认首页，websocketj启动成功了！
下面是启动参数说明：
–wsport：WebSocket服务器的工作端口号；
–ssport：静态web服务器的工作端口号；
–staticDir：静态资源存放的目录，类似tomacat的webapps目录，存放一些静态文件，比如html、css以及js等，可以通过–ssport端口访问它；
Yourprogram args：你编写的支持STDIN和STDOUT服务端程序，后面可以携带参数。这跟正常启动命令行类似。
NOTE：正常启动websocketj之后，访问8082端口（比如http://192.168.3.73:8082/）可以看到websocketj自带的默认首页。
websocketj类似一个处于浏览器和应用程序之间的桥梁，它能够hook程序的inputstream和outputstream，使用WebSocket技术将这两个stream重新定向到远程的web浏览器。
整个结构非常简单，一看就懂。下面举一个简单的例子，服务端使用bash shell编写一个定时输出系统时间的脚本，前端创建一个html文件，编写js使用WebSocket实时接收shell脚本的输出，并将其显示在浏览器页面中。
bash shell（文件名show_time）：
#! /bin/bash
while [ true ] do echo "time from linux server:"$(date +%X) sleep 1 done exit 0
html（文件名show_time.html）：
<script>
// helper function: log message to screen function print_log(msg) { document.getElementById(\'msg\').textContent = msg; } function print_output(output) { document.getElementById(\'output\').textContent = output; } // setup websocket with callbacks var host = "ws://192.168.3.246:8081/"; var ws = new WebSocket(host); ws.onopen = function() { print_log("Connected To WebSocket Server: => " + host); }; ws.onclose = function() { print_log(\'Disconnected\'); }; ws.onmessage = function(event) { print_output(event.data); }; </script>
将show_time.html文件放在linux某个目录中，启动websocketj：websocketj –wsport=8081 –ssport=8082 –staticDir=/usr/local/websocketj/html ./show_time。然后在浏览器中访问http://192.168.3.246:8082/show_time.html，页面中实时显示Linux中的时间，该text来自于bash shell脚本的STDOUT。
这里以我电脑上Windows 10中安装的git cmd为例子，演示如何在浏览器中操作git cmd client。由于这里我们直接使用现有的git cmd程序，所以不需要再编写服务端程序，只需要编写前端html页面来接收输出和模拟输入。html（git_cmd.html）页面在此省略，将该git_cmd.html文件放在windows某个目录中E:\codes\git\websocketj\html，启动websocketj：websocketj –wsport=8081 –ssport=8082 –staticDir=E:\codes\git\websocketj\html C:\Program Files\Git\git-cmd.exe。然后在浏览器中访问http://192.168.3.74:8082/git_cmd.html，输入git命令，得到输出：
在Linux中有一个命令来监控系统资源使用情况，比如CPU、网络等。执行‘vmstat 1’命令，程序会在控制台终端中每隔1秒输出当前系统状态：
现在我们使用websocketj将以上输出重定向到浏览器中，并在浏览器中使用js控件将这些数据可视化显示。由于这里我们使用现成的Linux命令（vmstat 1），因此不需要我们编写服务端程序，只需要前端html显示文件即可。这里前端我使用了第三方js控件，专门用来可视化这种监控型的数据：http://smoothiecharts.org/。具体代码就不放这这里了，感兴趣可以点击官网。下面是最终效果图：
目前能想到以下功能可以完善：
（1）支持前端随机启动指定服务端程序。目前只能启动一个程序，并且是在websocketj启动的时候当作参数传进去的，所有连接的前端只能看到这一个程序的输入输出；完善后可以在前端指定要打开的程序，不同的前端关联不同的输入输出；
（2）前端在进行WebSocket连接时，需要认证。目前所有连接均可接入并关联到程序的输入输出，完善后，只有授权后的连接可以介入。
（3）waiting your passion and brightness.
欢迎各种PR和Issues，Fork websocketj on github
前面一直说这个东西非常简单，你以为真的吗？非也，WebSocket这块采用了第三方开源WebSocket库，详细源码参见这里：https://github.com/TooTallNate/Java-WebSocket。这个开源库可以非常简单地创建WebSocket服务器可以WebSocket客户端。
import java.net.InetSocketAddress; import org.java_websocket.WebSocket; import org.java_websocket.handshake.ClientHandshake; import org.java_websocket.server.WebSocketServer; public class SimpleServer extends WebSocketServer { public SimpleServer(InetSocketAddress address) { super(address); } @Override public void onOpen(WebSocket conn, ClientHandshake handshake) { conn.send("Welcome to the server!"); //This method sends a message to the new client broadcast( "new connection: " + handshake.getResourceDescriptor() ); //This method sends a message to all clients connected System.out.println("new connection to " + conn.getRemoteSocketAddress()); } @Override public void onClose(WebSocket conn, int code, String reason, boolean remote) { System.out.println("closed " + conn.getRemoteSocketAddress() + " with exit code " + code + " additional info: " + reason); } @Override public void onMessage(WebSocket conn, String message) { System.out.println("received message from " + conn.getRemoteSocketAddress() + ": " + message); } @Override public void onMessage( WebSocket conn, ByteBuffer message ) { System.out.println("received ByteBuffer from " + conn.getRemoteSocketAddress()); } @Override public void onError(WebSocket conn, Exception ex) { System.err.println("an error occured on connection " + conn.getRemoteSocketAddress() + ":" + ex); } @Override public void onStart() { System.out.println("server started successfully"); } public static void main(String[] args) { String host = "localhost"; int port = 8887; WebSocketServer server = new SimpleServer(new InetSocketAddress(host, port)); server.run(); } }
代码风格和JS一致，用起来非常方便。除了服务端之后，用它还可以快速创建WebSocket客户端，这样你就可以模拟浏览器进行WebSocket连接了。另外，细心的朋友可能会发现，websocketj是模仿另外一个Go语言版本的websocketd，参见这里：https://github.com/joewalnes/websocketd/。这个功能更多，我只是看了一下websocketd的功能，至于实现，并没有参考，对于WebSocket这块，它也是引用的第三方开源库Go语言版本。
使用git clone命令将源码clone到本地硬盘目录后，
Windows：
直接使用eclipse导入maven项目；
Linux：
Linux编译和运行比较麻烦，需要增加-Djava.ext.dirs=参数引用jar包，并且只需要编译根目录中sources.build这个文件，里面存放各种源文件列表。
Linux中编译：javac -Djava.ext.dirs=../libs/ @sources.build
Linux中运行：java -Djava.ext.dirs=../libs/ -classpath ./src/main/java/ com.zhzhi.websocketj.App –wsport=8081 –ssport=8082 –staticDir=../html/ vmstat 1