WebSocket.之.基础入门-后端响应消息
WebSocket.之.基础入门-后端响应消息
在《WebSocket.之.基础入门-前端发送消息》的代码基础之上,进行添加代码。代码只改动了:TestSocket.java 和 index.jsp 两个文件。
项目结构如下:

TestSocket.java 代码
package com.charles.socket; import java.io.IOException; import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint; @ServerEndpoint(value = "/helloSocket")
public class TestSocket { /***
* 当建立链接时,调用的方法.
* @param session
*/
@OnOpen
public void open(Session session) { System.out.println("开始建立了链接...");
System.out.println("当前session的id是:" + session.getId());
} /***
* 处理消息的方法.
* @param session
*/
@OnMessage
public void message(Session session, String data) { System.out.println("开始处理消息...");
System.out.println("当前session的id是:" + session.getId());
System.out.println("从前端页面传过来的数据是:" + data); String message = "你好,我是后端程序...";
try {
session.getBasicRemote().sendText(message);
} catch (IOException e) {
e.printStackTrace();
} }
}
index.jsp 代码
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Charles-WebSocket</title> <script type="text/javascript"> var websocket = null;
var target = "ws://localhost:8080/websocket/helloSocket"; function buildConnection() { if('WebSocket' in window) {
websocket = new WebSocket(target);
} else if('MozWebSocket' in window) {
websocket = MozWebSocket(target);
} else {
window.alert("浏览器不支持WebSocket");
} // 添加监听消息的方法
websocket.onmessage = function(event) {
console.log(event)
console.log(event.data)
document.getElementById("serverMsg").innerHTML = "<p>后端消息 :"+ event.data +"</p>"
}
} // 往后台服务器发送消息.
function sendMessage() { var sendmsg = document.getElementById("sendMsg").value;
console.log("发送的消息:" + sendmsg); // 发送至后台服务器中.
websocket.send(sendmsg);
} </script>
</head>
<body> <button onclick="buildConnection();">开始建立链接</button>
<hr>
<input id="sendMsg" /> <button onclick="sendMessage();">消息发送</button>
<div id="serverMsg"></div> </body>
</html>
运行项目,由于改动了代码,建议:重新启动Tomcat服务器。


项目启动后,通过浏览器访问页面,地址:http://localhost:8080/websocket

注意:
一定要先点击,开始建立连接按钮,然后输入内容,在点击消息发送...你懂的.

现在看后端日志....

前端能发送消息,后端也能响应,一切OK...
如有问题,欢迎纠正!!!
如有转载,请标明源处:https://www.cnblogs.com/Charles-Yuan/p/9784555.html
WebSocket.之.基础入门-后端响应消息的更多相关文章
- WebSocket.之.基础入门-前端发送消息
WebSocket.之.基础入门-前端发送消息 在<WebSocket.之.基础入门-建立连接>的代码基础之上,进行添加代码.代码只改动了:TestSocket.java 和 index. ...
- WebSocket.之.基础入门-断开连接处理
ebSocket.之.基础入门-断开连接处理 在<WebSocket.之.基础入门-后端响应消息>的代码基础之上,继续更新代码.代码只改动了:TestSocket.java 和 index ...
- WebSocket.之.基础入门-建立连接
WebSocket.之.基础入门-建立连接 1. 使用开发工具(STS.Eclipse等)创建web项目.如下图所示,啥东西都没有.一个新的web项目. 2. 创建java类.index.jsp页面. ...
- C# 消息队列之 RabbitMQ 基础入门
Ø 简介 C# 实现消息队列的方式有很多种,比如:MSMQ.RabbitMQ.EQueue 等,本文主要介绍使用 RabbitMQ 实现消息队列的基础入门.包括如下内容: 1. 什么是消息队列? ...
- ASP.NET Core消息队列RabbitMQ基础入门实战演练
一.课程介绍 人生苦短,我用.NET Core!消息队列RabbitMQ大家相比都不陌生,本次分享课程阿笨将给大家分享一下在一般项目中99%都会用到的消息队列MQ的一个实战业务运用场景.本次分享课程不 ...
- [转]小D课堂 - 零基础入门SpringBoot2.X到实战_汇总
原文地址:https://www.cnblogs.com/wangjunwei/p/11392825.html 第1节零基础快速入门SpringBoot2.0 小D课堂 - 零基础入门SpringBo ...
- 小D课堂 - 零基础入门SpringBoot2.X到实战_汇总
第1节零基础快速入门SpringBoot2.0 小D课堂 - 零基础入门SpringBoot2.X到实战_第1节零基础快速入门SpringBoot2.0_1.SpringBoot2.x课程介绍和高手系 ...
- 【01】SpringBoot2核心技术-基础入门
SpringBoot 2 1. SpringBoot2核心技术-基础入门 01 Spring与SpringBoot 1.Spring 能做什么 1.1 Spring的能力 微服务:将一个应用的所有功能 ...
- Swift语法基础入门四(构造函数, 懒加载)
Swift语法基础入门四(构造函数, 懒加载) 存储属性 具备存储功能, 和OC中普通属性一样 // Swfit要求我们在创建对象时必须给所有的属性初始化 // 如果没办法保证在构造方法中初始化属性, ...
随机推荐
- Hive:解决Hive创建文件数过多的问题
今天将临时表里面的数据按照天分区插入到线上的表中去,出现了Hive创建的文件数大于100000个的情况,我的SQL如下: hive> insert overwrite table test pa ...
- OCR技术(光学字符识别)
什么是OCR? OCR英文全称是optical character recognition,中文叫光学字符识别.它是利用光学技术和计算机技术把印在或者写在纸上的 文字读取出来,并转换成一种计算机能够接 ...
- Java 输入/输出——处理流(RandomAccessFile)
RandomAccessFile是Java输入/输出流体系中功能最丰富的文件内容访问类,它提供了众多的方法来访问文件内容,它既可以读取文件内容,也可以向文件输出数据.与普通的输入/输出流不同的是,Ra ...
- AndroidStudio_Button
这里回顾一下Button的使用方法: 1.在page1.xml文件中定义一个按钮控件 <Button android:id="@+id/btn_textview" andro ...
- CS0433: 类型“Microsoft.Reporting.WebForms.ReportViewer”同时存在于“c:/WINDOWS/assembly/GAC_MSIL/Microsoft.ReportViewer.WebForms/8.0.0.0_ 标签: cassembly
CS0433: 类型“Microsoft.Reporting.WebForms.ReportViewer”同时存在于“c:/WINDOWS/assembly/GAC_MSIL/Microsoft.Re ...
- 用CSS来画空心三角形的方法
画这里三角形的方法: 用CSS来实现:整个弹框的ID是#favoriteOptionMenus,对于#favoriteOptionMenus这个元素设置:before和:after的样式,让:befo ...
- SVN安装部署
svn安装版本用的是1.8 SVN属于功能性软件,yum安装即是最佳实践. 安装svn yum install subversion 检查svn是否安装完毕 [root@mysql ~]# rpm - ...
- 记录关于vs2008 和vs2015 的报错问题
出现了 VS2008无法创建项目,无法打开项目的情况,提示这个注册表键值有问题 HKEY_LOCAL_MACHINE \ SOFTWARE \ Microsoft \ MSBuild \ ToolsV ...
- js将字符串转换成json的三种方式
1,js自带的eval函数,其中需要添加小括号eval('('+str+')'); function strToJson(str){ var json = eval('(' + str + ')'); ...
- centos mysql安装 完全版
在linux中安装数据库首选MySQL,Mysql数据库的第一个版本就是发行在Linux系统上,其他选择还可以有postgreSQL,oracle等 在Linux上安装mysql数据库,我们可以去其官 ...