使用Jetty搭建Java Websocket Server,实现图像传输
https://my.oschina.net/yushulx/blog/298140
How to Implement a Java WebSocket Server for Image Transmission with Jetty
创建一个从WebSocketHandler继承的类WSHandler:
import org.eclipse.jetty.websocket.api.Session;
import org.eclipse.jetty.websocket.api.annotations.OnWebSocketClose;
import org.eclipse.jetty.websocket.api.annotations.OnWebSocketConnect;
import org.eclipse.jetty.websocket.api.annotations.OnWebSocketError;
import org.eclipse.jetty.websocket.api.annotations.OnWebSocketMessage;
import org.eclipse.jetty.websocket.api.annotations.WebSocket;
import org.eclipse.jetty.websocket.server.WebSocketHandler;
import org.eclipse.jetty.websocket.servlet.WebSocketServletFactory;
@WebSocket
public class WSHandler extends WebSocketHandler {
@OnWebSocketClose
public void onClose(int statusCode, String reason) {
}
@OnWebSocketError
public void onError(Throwable t) {
}
@OnWebSocketConnect
public void onConnect(Session session) {
}
@OnWebSocketMessage
public void onMessage(String message) {
}
@Override
public void configure(WebSocketServletFactory factory) {
// TODO Auto-generated method stub
factory.register(WSHandler.class);
}
}
设置一个端口和Handler,启动Server:
public static void main(String[] args) throws Exception {
Server server = new Server(2014);
server.setHandler(new WSHandler());
server.setStopTimeout(0);
server.start();
server.join();
}
JavaScript客户端
写一个简单的测试。
Index.htm:
<!DOCTYPE html>
<html>
<body>
<script src="websocket.js"></script>
</body>
</html>
Websocket.js:
var ws = new WebSocket("ws://127.0.0.1:2014/");
ws.onopen = function() {
alert("Opened");
ws.send("I'm client");
};
ws.onmessage = function (evt) {
};
ws.onclose = function() {
alert("Closed");
};
ws.onerror = function(err) {
alert("Error: " + err);
};
图像传输
功能:
从网页中主动获取图像

服务端推送图像到网页中

代码修改
从网页中获取服务端数据。
在index.htm中添加一个按钮元素和一个图片元素:
<!DOCTYPE html>
<html>
<body>
<h1>WebSocket Image Display</h1>
<input type="button" id="button" value="image" ><br>
<img id="image"></<img>
<script src="websocket.js"></script>
</body>
</html>
在Websocket.js中添加下面的代码:
ws.binaryType = "arraybuffer";
var button = document.getElementById("button");
button.onclick = function() {
ws.send("image"); // send the fetch request
};
ws.onmessage = function (evt) { // display the image
var bytes = new Uint8Array(evt.data);
var data = "";
var len = bytes.byteLength;
for (var i = 0; i < len; ++i) {
data += String.fromCharCode(bytes[i]);
}
var img = document.getElementById("image");
img.src = "data:image/png;base64,"+window.btoa(data);
};
服务端收到消息之后,发送图片:
public void onMessage(String message) {
System.out.println("Message: " + message);
if (message.equals("image")) {
System.out.println("session: " + mSession);
if (mSession != null) {
try {
File f = new File("image\\github.jpg");
BufferedImage bi = ImageIO.read(f);
ByteArrayOutputStream out = new ByteArrayOutputStream();
ImageIO.write(bi, "png", out);
ByteBuffer byteBuffer = ByteBuffer.wrap(out.toByteArray());
mSession.getRemote().sendBytes(byteBuffer);
out.close();
byteBuffer.clear();
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
从服务端发送数据到客户端。
在服务端的UI上添加两个按钮,一个用来加载本地图片,一个用来发送图片:
package com.ui;
import java.awt.BorderLayout;
import java.awt.Toolkit;
import java.awt.event.ActionEvent;
import java.awt.event.ActionListener;
import java.awt.image.BufferedImage;
import java.io.ByteArrayOutputStream;
import java.io.File;
import java.io.IOException;
import java.util.ArrayList;
import javax.imageio.ImageIO;
import javax.swing.ImageIcon;
import javax.swing.JButton;
import javax.swing.JFileChooser;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.SwingUtilities;
import javax.swing.UIManager;
import javax.swing.filechooser.FileNameExtensionFilter;
import com.server.WSHandler;
import com.server.WebSocketServer;
public class UIMain extends JPanel
implements ActionListener {
private JButton mLoad, mSend;
private JFileChooser mFileChooser;
private JLabel mImage;
private byte[] mData;
private WebSocketServer mWebSocketServer;
public UIMain() {
super(new BorderLayout());
//Create a file chooser
mFileChooser = new JFileChooser();
FileNameExtensionFilter filter = new FileNameExtensionFilter(
".png.jpg", "png","jpg");
mFileChooser.setFileFilter(filter);
mLoad = new JButton("Load");
mLoad.addActionListener(this);
mSend = new JButton("Send");
mSend.addActionListener(this);
mSend.setEnabled(false);
// button panel
JPanel buttonPanel = new JPanel();
buttonPanel.add(mLoad);
buttonPanel.add(mSend);
add(buttonPanel, BorderLayout.PAGE_START);
// image panel
JPanel imageViewer = new JPanel();
mImage = new JLabel();
mImage.setSize(480, 640);
imageViewer.add(mImage);
add(imageViewer, BorderLayout.CENTER);
// WebSocketServer
mWebSocketServer = new WebSocketServer();
mWebSocketServer.start();
}
@Override
public void actionPerformed(ActionEvent e) {
}
private static void createAndShowGUI() {
//Create and set up the window.
JFrame frame = new JFrame("WebSocket Demo");
frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
//Add content to the window.
frame.add(new UIMain());
//Display the window.
frame.pack();
frame.setVisible(true);
frame.setResizable(false);
frame.setSize(480, 700);
double width = Toolkit.getDefaultToolkit().getScreenSize().getWidth();
double height = Toolkit.getDefaultToolkit().getScreenSize().getHeight();
int frameWidth = frame.getWidth();
int frameHeight = frame.getHeight();
frame.setLocation((int)(width - frameWidth) / 2, (int)(height - frameHeight) / 2);
}
public static void main(String[] args) {
SwingUtilities.invokeLater(new Runnable() {
@Override
public void run() {
UIManager.put("swing.boldMetal", Boolean.FALSE);
createAndShowGUI();
}
});
}
}
为了防止UI阻塞,Websocket server需要在线程中创建:
package com.server;
import org.eclipse.jetty.server.Server;
public class WebSocketServer extends Thread{
@Override
public void run() {
// TODO Auto-generated method stub
super.run();
try {
Server server = new Server(2014);
server.setHandler(new WSHandler());
server.setStopTimeout(0);
server.start();
server.join();
} catch (Exception e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}
在按钮事件中添加图片添加和发送功能:
public void sendImage(byte[] data) {
if (mSession == null)
return;
try {
ByteBuffer byteBuffer = ByteBuffer.wrap(data);
mSession.getRemote().sendBytes(byteBuffer);
byteBuffer.clear();
} catch (IOException e) {
e.printStackTrace();
}
}
@Override
public void actionPerformed(ActionEvent e) {
if (e.getSource() == mLoad) {
int returnVal = mFileChooser.showOpenDialog(UIMain.this);
if (returnVal == JFileChooser.APPROVE_OPTION) {
File file = mFileChooser.getSelectedFile();
// load image data to byte array
try {
BufferedImage bi = ImageIO.read(file);
ByteArrayOutputStream out = new ByteArrayOutputStream();
ImageIO.write(bi, "png", out);
mData = out.toByteArray();
out.close();
} catch (IOException exception) {
exception.printStackTrace();
}
mImage.setIcon(new ImageIcon(mData));
mSend.setEnabled(true);
}
}
else if (e.getSource() == mSend) {
ArrayList<WSHandler> sessions = WSHandler.getAllSessions();
for (WSHandler session : sessions) {
session.sendImage(mData);
}
mSend.setEnabled(false);
}
}
使用Jetty搭建Java Websocket Server,实现图像传输的更多相关文章
- Caused by: java.lang.IllegalStateException: javax.websocket.server.ServerContainer not available
java.lang.IllegalStateException: Failed to load ApplicationContext at org.springframework.test.co ...
- java websocket学习
引言: websocket,webservice傻傻分不清楚,都觉得是很高深的东西,理解中的webservice是一种协议,通信协议,类似http协议的那种,比如使用webservice协议调后台接口 ...
- GIN+GORILLA=A GOLANG WEBSOCKET SERVER
鉴于聊天已然成为大部分app的基础功能,而大部分app用户基数有没有辣么大,常用的聊天server架构如xmpp或者消息队列实现之类的用起来还挺麻烦的,有比较难跟网页端做交互,加之H5标准落地,所以w ...
- 【IntelliJ IDEA新手入门】IDEA如何快速搭建Java开发环境
作为IntelliJ IDEA mac新手,IDEA如何快速搭建Java开发环境呢? 今天小编就给大家带来了IntelliJ IDEA mac使用教程,想知道IDEA如何快速搭建Java开发环境?那就 ...
- IDEA如何快速搭建Java开发环境
作为IntelliJ IDEA mac新手,IDEA如何快速搭建Java开发环境呢?今天小编就给大家带来了IntelliJ IDEA mac使用教程,想知道IDEA如何快速搭建Java开发环境? 全局 ...
- java WebSocket Demo
1.IDEA创建Module,结构如图(Tomcat8.0) 2.引入jar包:javax.websocket-api.jar 3.新建WebSocketTest类 import javax.webs ...
- 在 Ubuntu 13.10 中搭建Java开发环境 - 懒人版
本文记录我在Ubuntu 13.10中搭建Java开发环境. 本文环境: Ubuntu 13.10 x64运行在Win7下的VMware Workstation 10中. 1. 安装JDK与JRE s ...
- SSD Cloud Hosting - Linode的配置和部署,搭建Java环境
0.发牢骚 前一个月在淘宝购买了个Jsp空间,挺便宜的,才38元/年.部署了程序,然后ALIMAMA验证网站,一直提示验证失败.最后找卖家,他说可能是因为空间太慢,照他的推荐换了最好的空间,138元/ ...
- RedHat7/Windows7搭建JAVA开发环境(Eclipse)
RedHat7搭建JAVA开发环境 安装JAVA # yum install java 安装Tomcat # yum install tomcat 确认Tomcat版本 # tomcat versio ...
随机推荐
- csu1010: Water Drinking
/* 本题的题意: 沙漠中有很多骆驼和一个池塘,0表示池塘,1-N表示骆驼,输入的两个数表示两只骆驼,其中前面的那一头靠近池塘,所有的骆驼队列不交叉不相连,求站在队尾但是离水井最近的骆驼编号 经过分析 ...
- EF中用Newtonsoft.Json引发的循环引用问题
描述: 1.双向关系表a->b b->aList 2.在查询a引用b以后 3.用Newtonsoft.Json 去tojsonstring 4.一个只有6条数据的json串 出现了一屏幕字 ...
- SB淘宝api的奇葩问题! 一则服务器无法访问淘宝api
<?xml version="1.0" encoding="utf-8" ?><error_response><code>3 ...
- Qt中利用QTime类来控制时间,这里简单介绍一下QTime的成员函数的用法:
Qt中利用QTime类来控制时间,这里简单介绍一下QTime的成员函数的用法: ------------------------------------------------------------ ...
- 使用composer安装laravel
跟具官方文档说:Laravel utilizes Composer to manage its dependencies. So, before using Laravel, you will nee ...
- Inno Setup入门(十九)——Inno Setup类参考(5)
: Install Setup 2013-02-02 11:29 377人阅读 评论(0) 收藏 举报 单选按钮 单选按钮在安装中也很常见,例如同一个程序可以选择安装不同的性质的功能,例如选择32位或 ...
- VVDocumenter安装过程的一些问题
vvdocument是瞄神写的一个插件 作用的话大家都知道 这里就不多说了 插件下载地址:https://github.com/onevcat/VVDocumenter-Xcode 1.下载后解压 编 ...
- 关于iOS socket都在这里了
socket(套接字)是通信的基石,是支持TCP/IP协议的网络通信的基本操作单元,包含进行网络通信必须的五种信息:连接使用的协议,本地主机的IP地址,本地进程的协议端口,远地主机的IP地址,远地进程 ...
- 自定义switch开关
自定义一个switch开关 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> ...
- runtime关联属性示例
前言 在开发中经常需要给已有的类添加方法和属性,但是Objective-C是不允许给已有类通过分类添加属性的,因为类分类是不会自动生成成员变量的.但是,我们可以通过运行时机制就可以做到了. 本篇文章适 ...