WebSocket-黑马好客租房

2024-01-21 10:52
文章标签 黑马 websocket 租房 好客

本文主要是介绍WebSocket-黑马好客租房，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

文章目录

  • 网站中的消息功能如何实现？
  • 什么是WebSocket？
  • http与websocket的区别
    • http
    • websocket
  • 浏览器支持情况
  • 快速入门
    • 创建itcast-websocket工程
    • websocket的相关注解说明
    • 实现websocket服务
    • 测试
    • 编写js客户端
  • SpringBoot整合WebSocket
    • 导入依赖
    • 编写WebSocketHandler
    • 编写配置类
    • 编写启动类
    • 测试
    • 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协议是一种长链接，只需要通过一次请求来初始化链接，然后所有的请求和响应都是通过这个TCP链接进行通讯。

在这里插入图片描述

浏览器支持情况

在这里插入图片描述

快速入门

创建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 {@OnOpenpublic void onOpen(Session session, @PathParam("uid") String uid) throws IOException {// 连接成功session.getBasicRemote().sendText(uid + "，你好，欢迎连接WebSocket！");}@OnClosepublic void onClose() {System.out.println(this + "关闭连接");}@OnMessagepublic void onMessage(String message, Session session) throws IOException {System.out.println("接收到消息：" + message);session.getBasicRemote().sendText("消息已收到.");}@OnErrorpublic 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

在这里插入图片描述

在线工具：https://wstool.js.org/
在这里插入图片描述

编写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>

测试：
在这里插入图片描述

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 {@Overridepublic 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();}}}}@Overridepublic void afterConnectionEstablished(WebSocketSession session) throws Exception {session.sendMessage(new TextMessage("欢迎连接到ws服务"));}@Overridepublic 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 {@Overridepublic void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {registry.addHandler(myHandler(), "/ws").setAllowedOrigins("*");}@Beanpublic 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拦截器

在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*/@Overridepublic boolean beforeHandshake(ServerHttpRequest request, ServerHttpResponse response, WebSocketHandler wsHandler, Map<String, Object> attributes) throwsException {//将用户id放入socket处理器的会话(WebSocketSession)中attributes.put("uid", 1001);System.out.println("开始握手。。。。。。。");return true;}@Overridepublic 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 {@Autowiredprivate MyHandshakeInterceptor myHandshakeInterceptor;@Overridepublic void registerWebSocketHandlers(WebSocketHandlerRegistry registry) {registry.addHandler(myHandler(), "/ws").setAllowedOrigins("*").addInterceptors(this.myHandshakeInterceptor);}@Beanpublic WebSocketHandler myHandler() {return new MyHandler();}
}

获取uid：

在这里插入图片描述

这篇关于WebSocket-黑马好客租房的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！


http://www.chinasem.cn/article/629291。

相关文章

SpringBoot实现websocket服务端及客户端的详细过程

SpringBoot实现websocket服务端及客户端的详细过程

《SpringBoot实现websocket服务端及客户端的详细过程》文章介绍了WebSocket通信过程、服务端和客户端的实现,以及可能遇到的问题及解决方案,感兴趣的朋友一起看看吧... 目录一、WebSocket通信过程二、服务端实现1.pom文件添加依赖2.启用Springboot对WebSocket
阅读更多...
Java Websocket实例【服务端与客户端实现全双工通讯】

Java Websocket实例【服务端与客户端实现全双工通讯】

Java Websocket实例【服务端与客户端实现全双工通讯】 现很多网站为了实现即时通讯，所用的技术都是轮询(polling)。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发 出HTTP request，然后由服务器返回最新的数据给客服端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏 览器需要不断的向服务器发出请求，然而HTTP
阅读更多...
springboot websocket 服务端

springboot websocket 服务端

在Spring Boot中使用WebSocket实现服务端和Java客户端的实时通信，可以分为几个步骤来完成。这里将详细介绍服务端和Java客户端的具体实现。 服务端设置 添加依赖： 在pom.xml文件中添加Spring WebSocket的依赖。 <dependency><groupId>org.springframework.boot</groupId><artifactId>spr
阅读更多...
黑马程序员---银行业务调度系统

黑马程序员---银行业务调度系统

模拟实现银行业务调度系统逻辑 需求分析： 银行内有6个业务窗口，1 - 4号窗口为普通窗口，5号窗口为快速窗口，6号窗口为VIP窗口。 有三种对应类型的客户：VIP客户，普通客户，快速客户（办理如交水电费、电话费之类业务的客户）。 异步随机生成各种类型的客户，生成各类型用户的概率比例为：         VIP客户 ：普通客户 ：快速客户 =  1：6：3。 客户办理业务所
阅读更多...
黑马程序员---空中网面试题

黑马程序员---空中网面试题

空中网4k/5k月薪挑选大四实习生的线程题     两年前，我们一个大四的学员去应聘空中网的实习生职位，空中网只给他出了三道线程题，拿回家做两天后再去给经理讲解，如果前两题做好了给4k月薪，第三道题也做出来的话就给5k的月薪。这样的实习薪水和招聘要求，不需要有工作经验的限制，纯粹是技术功底的比拼和考核，而不像许多其他公司非要招两年工作经验的人，逼得那些刚毕业和未毕业的大学生不得不去撒谎，不得不去做
阅读更多...
黑马程序员---线程并发库

黑马程序员---线程并发库

软件包 java.util.concurrent 在并发编程中很常用的实用工具类。 请参见：            描述 接口摘要BlockingDeque<E>支持两个附加操作的 Queue，这两个操作是：获取元素时等待双端队列变为非空；存储元素时等待双端队列中的空间变得可用。BlockingQueue<E>支持两个附加操作的 Queue，这两个操作是：获取元素时等待队列变为非空，以及
阅读更多...
黑马程序员---多线程

黑马程序员---多线程

TraditionalTread 传统线程技术回顾 创建线程的两种方式： thread3中，同时创建了Thread的子类和Runnable，那么会优先执行Thread的子类，因为Runnable的代码被当做参数传到了Thread类里，Thread子类的run方法又覆盖了父类的方法，所以会执行Thread子类的代码。 package cn.itcast.heima;public class T
阅读更多...
黑马程序员---代理

黑马程序员---代理

分析代理类的作用与原理及AOP的概念 代理的概念与作用  1.已经写好一个类，现在要为这个类增加一些功能，例如，异常处理、日志、计算方法的运行时间、事务管理、等等，你准备如何做？ 现在我们写一个代理类： 保持了原来那个类的功能，又增加了你现在需要的功能。 主函数调用的时候，直接调用代理类就行了。 这就是代理类的功能。   2.编写一个与目标类具有相同接口的代理类，代理
阅读更多...
黑马程序员---类加载器

黑马程序员---类加载器

------- android培训、java培训、期待与您交流！ ----------   简要介绍什么是类加载器和类加载器的作用 Java虚拟机中可以安装多个类加载器，系统默认三个主要类加载器，每个类负责加载特定位置的类：BootStrap,ExtClassLoader,AppClassLoader   类加载器也是Java类，因为其他是java类的类加载器本身也要被
阅读更多...
部署黑马商城至云服务器

部署黑马商城至云服务器

1阿里云ECS 1.1获取云服务器 想要将项目部署到云服务器,首先我们需要有一个云服务器,本次我们用的是阿里云ECS云服务器  我们登录进入主页,点击左上角的产品 依次按照上图点击,我们可以利用学生认证,然后领取免费的服务器时长 拥有了服务器后,我们点击管理控制台 我们创建一个实例服务器,依次填写好相关信息,然后我们会获取到一个公网ip,这个公网ip就是以后别人访问的主机ip服务
阅读更多...

Copyright China编程 23002807@qq.com

沪ICP备2023033072号-2