WebSocket-黑马好客租房

这篇具有很好参考价值的文章主要介绍了WebSocket-黑马好客租房。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

网站中的消息功能如何实现?

思考:像这样的消息功能怎么实现? 如果网页不刷新,服务端有新消息如何推送到浏览器?
解决方案,采用轮询的方式。即:通过js不断的请求服务器,查看是否有新数据,如果有,就获取到新数据。
这种解决方法是否存在问题呢?
当然是有的,如果服务端一直没有新的数据,那么js也是需要一直的轮询查询数据,这就是一种资源的浪费。
那么,有没有更好的解决方案? 有!那就是采用WebSocket技术来解决。

什么是WebSocket?

WebSocket 是HTML5一种新的协议。它实现了浏览器与服务器全双工通信(full-duplex)。一开始的握手需要借助HTTP请求完成。 WebSocket是真正实现了全双工通信的服务器向客户端推的互联网技术。 它是一种在单个TCP连接上进行全双工通讯协议。Websocket通信协议与2011年倍IETF定为标准RFC 6455,Websocket API被W3C定为标准。

全双工和单工的区别?

  • 全双工(Full Duplex)是通讯传输的一个术语。通信允许数据在两个方向上同时传输,它在能力上相当于两个单工通信方式的结合。全双工指可以同时(瞬时)进行信号的双向传输(A→B且B→A)。指A→B的同时B→A,是瞬时同步的。
  • 单工、半双工(Half Duplex),所谓半双工就是指一个时间段内只有一个动作发生,举个简单例子,一条窄窄的马路,同时只能有一辆车通过,当目前有两辆车对开,这种情况下就只能一辆先过,等到头儿后另一辆再开,这个例子就形象的说明了半双工的原理。早期的对讲机、以及早期集线器等设备都是基于半双工的产品。随着技术的不断进步,半双工会逐渐退出历史舞台。

http与websocket的区别

http

http协议是短连接,因为请求之后,都会关闭连接,下次重新请求数据,需要再次打开链接。
WebSocket-黑马好客租房,websocket,websocket,网络协议,网络

websocket

WebSocket协议是一种长链接,只需要通过一次请求来初始化链接,然后所有的请求和响应都是通过这个TCP链接进行通讯。

WebSocket-黑马好客租房,websocket,websocket,网络协议,网络

浏览器支持情况

WebSocket-黑马好客租房,websocket,websocket,网络协议,网络

快速入门

创建itcast-websocket工程

pom.xml

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0
http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<groupId>cn.itcast.websocket</groupId>
<artifactId>itcast-websocket</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>war</packaging>
<dependencies>
<dependency>
<groupId>javax</groupId>
<artifactId>javaee-api</artifactId>
<version>7.0</version>
<scope>provided</scope>
</dependency>
</dependencies>
<build>
<plugins>
<!-- java编译插件 -->
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.2</version>
<configuration>
<source>1.8</source>
<target>1.8</target>
<encoding>UTF-8</encoding>
</configuration>
</plugin>
<!-- 配置Tomcat插件 -->
<plugin>
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.2</version>
<configuration>
<port>8082</port>
<path>/</path>
</configuration>
</plugin>
</plugins>
</build>
</project>

websocket的相关注解说明

@ServerEndpoint(“/websocket/{uid}”)
申明这是一个websocket服务
需要指定访问该服务的地址,在地址中可以指定参数,需要通过{}进行占位

@OnOpen
用法:public void onOpen(Session session, @PathParam(“uid”) String uid) throws
IOException{}
该方法将在建立连接后执行,会传入session对象,就是客户端与服务端建立的长连接通道
通过@PathParam获取url申明中的参数

@OnClose
用法:public void onClose() {}
该方法是在连接关闭后执行

@OnMessage
用法:public void onMessage(String message, Session session) throws IOException {}
该方法用于接收客户端发来的消息
message:发来的消息数据
session:会话对象(也是通道)
发送消息到客户端
用法:session.getBasicRemote().sendText(“你好”);
通过session进行发送。

实现websocket服务

package cn.itcast.websocket;
import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
@ServerEndpoint("/websocket/{uid}")
public class MyWebSocket {
	@OnOpen
	public void onOpen(Session session, @PathParam("uid") String uid) throws IOException {
		// 连接成功
		session.getBasicRemote().sendText(uid + ",你好,欢迎连接WebSocket!");
	}
	@OnClose
	public void onClose() {
		System.out.println(this + "关闭连接");
	}
	@OnMessage
	public void onMessage(String message, Session session) throws IOException {
		System.out.println("接收到消息:" + message);
		session.getBasicRemote().sendText("消息已收到.");
	}
	@OnError
	public void onError(Session session, Throwable error) {
		System.out.println("发生错误");
		error.printStackTrace();
	}
}

编写完成后,无需进额外的配置,直接启动tomcat即可。

测试

可以通过安装chrome插件或者通过在线工具进行测试:
chrome插件,Simple WebSocket Client:

https://chrome.google.com/webstore/detail/simple-websocket-client/pfdhoblngboilpfeibdedpjgfnlcodoo

WebSocket-黑马好客租房,websocket,websocket,网络协议,网络

在线工具:https://wstool.js.org/
WebSocket-黑马好客租房,websocket,websocket,网络协议,网络

编写js客户端

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script>
	const socket = new WebSocket("ws://localhost:8082/websocket/1");
	socket.onopen = (ws) =>{
		console.log("建立连接!", ws);
	}
	socket.onmessage = (ws) =>{
		console.log("接收到消息 >> ",ws.data);
	}
	socket.onclose = (ws) =>{
		console.log("连接已断开!", ws);
	}
	socket.onerror = (ws) => {
		console.log("发送错误!", ws);
	}
	// 2秒后向服务端发送消息
	setTimeout(()=>{
		socket.send("发送一条消息试试");
	},2000);
	// 5秒后断开连接
	setTimeout(()=>{
		socket.close();
	},5000);
</script>
</body>
</html>

测试:
WebSocket-黑马好客租房,websocket,websocket,网络协议,网络

SpringBoot整合WebSocket

Spring对WebSocket做了支持,下面我们看下在springboot中如何使用。

导入依赖

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://maven.apache.org/POM/4.0.0
http://maven.apache.org/xsd/maven-4.0.0.xsd">
<modelVersion>4.0.0</modelVersion>
<!--spring boot的支持-->
<parent>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-parent</artifactId>
<version>2.1.0.RELEASE</version>
</parent>
<groupId>cn.itcast.websocket</groupId>
<artifactId>itcast-websocket</artifactId>
<version>1.0-SNAPSHOT</version>
<packaging>war</packaging>
<dependencies>
<!--<dependency>-->
<!--<groupId>javax</groupId>-->
<!--<artifactId>javaee-api</artifactId>-->
<!--<version>7.0</version>-->
<!--<scope>provided</scope>-->
<!--</dependency>-->
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-websocket</artifactId>
</dependency>
</dependencies>
<build>
<plugins>
<!-- java编译插件 -->
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-compiler-plugin</artifactId>
<version>3.2</version>
<configuration>
<source>1.8</source>
<target>1.8</target>
<encoding>UTF-8</encoding>
</configuration>
</plugin>
<!-- 配置Tomcat插件 -->
<plugin>
<groupId>org.apache.tomcat.maven</groupId>
<artifactId>tomcat7-maven-plugin</artifactId>
<version>2.2</version>
<configuration>
<port>8082</port>
<path>/</path>
</configuration>
</plugin>
</plugins>
</build>
</project>

编写WebSocketHandler

在Spring中,处理消息的具体业务逻辑需要实现WebSocketHandler接口。

package cn.itcast.websocket.spring;
import org.springframework.web.socket.CloseStatus;
import org.springframework.web.socket.TextMessage;
import org.springframework.web.socket.WebSocketSession;
import org.springframework.web.socket.handler.TextWebSocketHandler;

import java.io.IOException;
public class MyHandler extends TextWebSocketHandler {
	@Override
	public void handleTextMessage(WebSocketSession session, TextMessage message) throws IOException {
		System.out.println("获取到消息 >> " + message.getPayload());
		session.sendMessage(new TextMessage("消息已收到"));
		if(message.getPayload().equals("10")){
			for (int i = 0; i < 10; i++) {
				session.sendMessage(new TextMessage("消息 -> " + i));
				try {
					Thread.sleep(100);
				} catch (InterruptedException e) {
					e.printStackTrace();
				}
			}
		}
	}
	
	@Override
	public void afterConnectionEstablished(WebSocketSession session) throws Exception {
		session.sendMessage(new TextMessage("欢迎连接到ws服务"));
	}
	@Override
	public void afterConnectionClosed(WebSocketSession session, CloseStatus status) throws Exception {
		System.out.println("断开连接!");
	}
}

编写配置类

package cn.itcast.websocket.spring;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;
@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {
	@Override
	public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
		registry.addHandler(myHandler(), "/ws").setAllowedOrigins("*");
	}
	@Bean
	public WebSocketHandler myHandler() {
		return new MyHandler();
	}
}

编写启动类

package cn.itcast.websocket;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class MyApplication {
	public static void main(String[] args) {
		SpringApplication.run(MyApplication.class, args);
	}
}

测试

WebSocket-黑马好客租房,websocket,websocket,网络协议,网络

websocket拦截器

在Spring中提供了websocket拦截器,可以在建立连接之前写些业务逻辑,比如校验登录等

package cn.itcast.websocket.spring;
import org.springframework.http.server.ServerHttpRequest;
import org.springframework.http.server.ServerHttpResponse;
import org.springframework.stereotype.Component;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.server.HandshakeInterceptor;
import java.util.Map;
@Component
public class MyHandshakeInterceptor implements HandshakeInterceptor {
	/**
	* 握手之前,若返回false,则不建立链接
	*
	* @param request
	* @param response
	* @param wsHandler
	* @param attributes
	* @return
	* @throws Exception
	*/
	@Override
	public boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler, Map<String, Object> attributes) throws
	Exception {
		//将用户id放入socket处理器的会话(WebSocketSession)中
		attributes.put("uid", 1001);
		System.out.println("开始握手。。。。。。。");
		return true;
	}
	@Override
	public void afterHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler, Exception exception) {
		System.out.println("握手成功啦。。。。。。");
	}
}

将拦截器添加到websocket服务中:

package cn.itcast.websocket.spring;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.socket.WebSocketHandler;
import org.springframework.web.socket.config.annotation.EnableWebSocket;
import org.springframework.web.socket.config.annotation.WebSocketConfigurer;
import org.springframework.web.socket.config.annotation.WebSocketHandlerRegistry;
@Configuration
@EnableWebSocket
public class WebSocketConfig implements WebSocketConfigurer {
	@Autowired
	private MyHandshakeInterceptor myHandshakeInterceptor;
	@Override
	public void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {
		registry.addHandler(myHandler(), "/ws")
		.setAllowedOrigins("*").addInterceptors(this.myHandshakeInterceptor);
	}
	@Bean
	public WebSocketHandler myHandler() {
		return new MyHandler();
	}
}

获取uid:

WebSocket-黑马好客租房,websocket,websocket,网络协议,网络文章来源地址https://www.toymoban.com/news/detail-811294.html

到了这里,关于WebSocket-黑马好客租房的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包 赞助服务器费用

相关文章

  • 网络通信协议-HTTP、WebSocket、MQTT的比较与应用

    在今天的数字化世界中,各种通信协议起着关键的作用,以确保信息的传递和交换。HTTP、WebSocket 和 MQTT 是三种常用的网络通信协议,它们各自适用于不同的应用场景。本文将比较这三种协议,并探讨它们的主要应用领域。 HTTP (超文本传输协议) HTTP  是最常见的协议之一

    2024年02月05日
    浏览(61)
  • 前端面试:【网络协议与性能优化】HTTP/HTTPS、TCP/IP和WebSocket

    嗨,亲爱的Web开发者!在构建现代Web应用时,了解网络协议是优化性能和确保安全性的关键。本文将深入探讨HTTP/HTTPS、TCP/IP和WebSocket这三个网络协议,帮助你理解它们的作用以及如何优化Web应用的性能。 1. HTTP/HTTPS协议: HTTP(超文本传输协议): HTTP是用于在Web上传输数据的

    2024年02月11日
    浏览(51)
  • Go语言github.com/gorilla/websocket框架websocket协议通信实战

          websocket是实际开发中比较常用的应用层协议,本文利用github.com/gorilla/websocket框架进行websocket通信实战。 目录 1.下载github.com/gorilla/websocket 2.websocket服务端 3.websocket Go客户端 4.websocket 网页客户端 5.运行结果展示 go get github.com/gorilla/websocket 服务器:  Go语言客户端:  We

    2024年02月16日
    浏览(49)
  • WebSocket协议介绍

    WebSocket 协议是一种基于 TCP 的通讯协议,它允许双向通信,使客户端和服务器之间的数据交换变得更加高效。在本文中,我们会深入了解 WebSocket 协议以及它对现代 Web 应用程序的重要性和应用场景。   WebSocket 协议是一种全双工的通讯协议,它使用标准 HTTP/HTTPS 端口(80 和

    2024年02月14日
    浏览(43)
  • [前端基础]websocket协议

    (1)websocket websocket(简写为ws),是一种轻量化的协议,经过最开始的握手阶段以后,前后端之间允许自由地发送信息不受限制(建议发送json字符串).虽然理论上这个东西是属于协议内容,但是已经被疯狂封装得像框架一样了. websocket协议具有天然的优势处理前端多线程并发,并且只需要一

    2024年02月08日
    浏览(42)
  • WebSocket 协议及其使用案例

    WebSocket 协议是一种用于实时通信、全双工的网络协议。它运行在传输层之上,通常基于 TCP 连接。相较于传统的 HTTP 协议,WebSocket 协议能够在单个连接上进行 双向通信 ,实现 数据的实时交互 ,因此在实时性较高的应用中表现得尤为出色。 WebSocket 协议是一种允许服务器和客

    2024年02月10日
    浏览(42)
  • java实现websocket握手协议

    其中最重要的是最后几个换行不要丢,将字符串转成byte[]写给客户端即可 收到的掩码转换 下面是服务器向客户端发送消息

    2024年02月08日
    浏览(42)
  • netty对websocket协议的实现

    1. websocket协议 websocket协议是对http协议的扩充, 也是使用的TCP协议可以全双工通信的应用层协议。 websocket协议允许服务端向客户端推送消息。 浏览器和服务端只需要进行一次握手,不必像http协议一样,每次连接都要新建立连接,两者之间创建持久性的连接,并进行双向的数

    2024年01月20日
    浏览(45)
  • Websocket协议-http协议-tcp协议区别和相同点

    通讯形式 单工通讯-数据只能单向传送一方来发送数据,另一方来接收数据 半双工通讯-数据能双向传送但不能同时双向传送 全双工通讯-数据能够同时双向传送和接受 注:http的通讯方式是分版本 http1.0 :单工。因为是短连接,客户端发起请求之后,服务端处理完请求并收到

    2024年02月15日
    浏览(57)
  • WebSocket和HTTP协议有什么区别?&& 连环问:WebSocket和HTTP长轮询的区别?

    什么是WebSocket? 答:WebSocket是一种网络传输协议,可在单个TCP连接上进行全双工通信,位于OSI模型的应用层。 特点: 1. TCP连接,与HTTP协议兼容 2. 双向通信,主动推送(服务端向客户端) 3. 无同源限制,协议标识符是ws(加密wss) WebSocket: 1. 支持端对端通讯 2. 可以由client发起

    2024年02月11日
    浏览(44)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包