websocket入门教程(2)
导读：websocket入门教程，【步骤一】:创建项目引导类 在java目录下创建 com.zbbmeta 包，在其包下创建 WebSocketApplication 引导类 package com.zbbmeta;import org.springframework.boot.SpringApplication;i
websocket入门教程
【步骤一】:创建项目引导类
在java目录下创建com.zbbmeta包，在其包下创建WebSocketApplication引导类
package com.zbbmeta;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
import org.springframework.scheduling.annotation.EnableScheduling;
/**
* @author IT袋网
* @description: TODO
*/
@SpringBootApplication
@EnableScheduling
public class WebSocketApplication {
public static void main(String[] args) {
SpringApplication.run(WebSocketApplication.class,args);
}
}【步骤二】:配置文件
在resources目录下创建application.yml文件，内容如下
server:
port: 8078【步骤三】: 定义websocket.html页面
在resources目录下创建static，并创建websocket.html页面，内容如下:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="UTF-8">
<title>WebSocket Demo</title>
</head>
<body>
<input id="text" type="text" />
<button onclick="send()">发送消息</button>
<button onclick="closeWebSocket()">关闭连接</button>
<div id="message">
</div>
</body>
<script type="text/javascript">
var websocket = null;
var clientId = Math.random().toString(36).substr(2);
//判断当前浏览器是否支持WebSocket
if('WebSocket' in window){
//连接WebSocket节点
websocket = new WebSocket("ws://localhost:8078/ws/"+clientId);
}
else{
alert('Not support websocket')
}
//连接发生错误的回调方法
websocket.onerror = function(){
setMessageInnerHTML("error");
};
//连接成功建立的回调方法
websocket.onopen = function(){
setMessageInnerHTML("连接成功");
}
//接收到消息的回调方法
websocket.onmessage = function(event){
setMessageInnerHTML(event.data);
}
//连接关闭的回调方法
websocket.onclose = function(){
setMessageInnerHTML("close");
}
//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
window.onbeforeunload = function(){
websocket.close();
}
//将消息显示在网页上
function setMessageInnerHTML(innerHTML){
document.getElementById('message').innerHTML += innerHTML + '<br/>';
}
//发送消息
function send(){
websocket.onopen()
var message = document.getElementById('text').value;
websocket.send(message);
}
//关闭连接
function closeWebSocket() {
websocket.close();
}
</script>
</html>【步骤四】: 导入websocket依赖坐标
在pom.xml文件中添加websocket依赖
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
相关阅读
-
个人免费建网站怎么建 创建网站免费注册
关于这方面的知识你知道吗？个人免费建网站怎么建和创建网站免费注册的相关知识，具体介绍如下： 如今，人们仍然对互联网技术相当感兴趣，特别是许多人希望成为网络名人，或者通过互
-
kafka应用场景有哪些
全面的为大家介绍kafka应用场景有哪些的相关介绍，下面为详细的介绍。 Kafka 作为一款热门的消息队列中间件，具备高效可靠的消息异步传递机制，主要用于不同系统间的数据交流和传递。 下
-
zblogphp后台固定域名导致网站无法访问解决方法
zblog后台设置固定域名之后，有时候服务器证书到期了或者更换了域名就导致网站无法正常访问了，连后台也打不开，进不去 ，针对这个问题，下面IT袋小编就给各位网站长分享解决方法，希望
-
免费建立自己的网站 建立个人免费网站的方法
今日重点为您介绍免费建立自己的网站和建立个人免费网站的方法方面的介绍，接下来IT袋带大家一起了解。 现在个人成立工作室、工作团队，或者做个人自媒体的越来越多，这就需要有一个