基于websocket的页面聊天程序

注:主要的问题是当浏览器窗口直接关闭时,后台会报异常,因为后台还在继续向浏览器端写数据,但是浏览器已经关闭了,会报java.net.SocketException:peer:Socket write error异常。所以当我们把窗口关闭的时候要通知后台不要再向浏览器端写数据了,
但是window.onclose(),经本人验证已经不起作用了(验证过程太尼玛恶心了),所以我采用另一种方法,使用body标签的onbeforeunload事件,这个事件是在页面刷新或者窗口关闭时触发,所以我在其触发函数中写入了 webSocket.close();来通知后台不要再向前段写数据了,然后webSocket连接就会自动断开,就不会有异常了。

前台:

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

<script type="text/javascript">

var webSocket=new WebSocket(‘ws://localhost:8080/JavaWeb/websocket‘);

webSocket.onerror = function(event) {

onError(event)

};

webSocket.onopen = function(event) {

onOpen(event)

};

webSocket.onmessage = function(event) {

onMessage(event)

};

function onMessage(event) {

document.getElementById(‘messages‘).innerHTML

+= ‘\n‘ + event.data;

}

function onOpen(event) {

document.getElementById(‘messages‘).innerHTML

= ‘Connection established‘;

}

function onError(event) {

alert(event.data);

}

function start() {

var content= document.getElementById(‘UserMessage‘).value;

//webSocket.send(‘hello‘);

webSocket.send(content);

return false;

}

/*

window.onclose()方法不管用,采用曲线救国的方法,

使用body标签的onbeforeunload事件,当整个页面刷新或把浏览器页面关闭的时候,通知后台断开websocket连接

*/

function fnUnloadHandler(){

webSocket.close();

}

</script>

</head>

<body  onbeforeunload="fnUnloadHandler()">

<div>

<input id="UserMessage" type="text">

<input type="submit" onclick="start()" />

</div>

<textarea id="messages" rows="10" cols="20"></textarea>

</body>

</html>
后端:

package WebSocket;

import java.io.IOException;

import java.util.Iterator;

import java.util.Set;

import javax.websocket.OnClose;

import javax.websocket.OnMessage;

import javax.websocket.OnOpen;

import javax.websocket.Session;

import javax.websocket.server.ServerEndpoint;

@ServerEndpoint("/websocket")

public class demo1 {

@OnMessage

public void onMessage(String message,Session session) throws IOException, InterruptedException{

System.out.println("Receive: "+message);

//获取所有客户端的session,然后一旦接收到消息就为每一个客户端发送消息

Set sessions=session.getOpenSessions();

System.out.println(sessions.size());

Iterator it=sessions.iterator();

while(it.hasNext()){

Session s1=(Session) it.next();

s1.getBasicRemote().sendText(message);

}

}

@OnOpen

public void onOpen() {

System.out.println("Client connected");

}

@OnClose

public void onClose() {

System.out.println("Connection closed");

}

}

时间: 2024-10-07 04:31:13

基于websocket的页面聊天程序的相关文章

基于html5 localStorage , web SQL, websocket的简单聊天程序

new function() { var ws = null; var connected = false; var serverUrl; var connectionStatus; var sendMessage; var connectButton; var disconnectButton; var sendButton; var open = function() { var url = serverUrl.val(); ws = new WebSocket(url); ws.onope

分享基于 websocket 网页端聊天室

博客地址:https://ainyi.com/#/67 有一个月没有写博客了,也是因为年前需求多.回家过春节的原因,现在返回北京的第二天,想想,应该也要分享技术专题的博客了!! 主题 基于 websocket 网页端聊天室 WebSocket 协议是基于 TCP 的一种新的网络协议.它实现了浏览器与服务器全双工 (full-duplex) 通信--允许服务器主动发送信息给客户端. 使用 java 开发后台 需要导入一个jar包:javax.websocket-api-1.0-rc4.jar 后台

websocket实现简单聊天程序

程序的流程图: 主要代码: 服务端 app.js 先加载所需要的通信模块: var express = require('express'); var app = express(); var http = require('http').createServer(app); var io = require('socket.io').listen(http); var fs = require('fs'); 创建用户列表和消息列表: var person = []; var history =

.NET Core 基于Websocket的在线聊天室

什么是Websocket 我们在传统的客户端程序要实现实时双工通讯第一想到的技术就是socket通讯,但是在web体系是用不了socket通讯技术的,因为http被设计成无状态,每次跟服务器通讯完成后就会断开连接. 在没有websocket之前web系统如果要做双工通讯往往使用http long polling技术.http long polling 每次往服务器发送请求后,服务端不会立刻返回信息来结束请求,而是一直挂着直到有数据需要返回,或者等待超时了才会返回.客户端在结束上一次请求后立刻再发

第二十五、二十六天:基于UDP的网路聊天程序

连续四天学习套接字的编程,可见套接字的重要性了.基于TCP和UDP分别写了两个程序.一是利用TCP实现一个服务器对多个客户端,客户端你发送信息,服务器就从事先准备好的五个字符串中随机回复一条.另一个是利用UDP实现两个人的对话,对话时可以是多个信息同时输入. 先是第一个程序.要实现一对多,就要使用线程编程,服务器端在不断监听中,如果有连接请求的话,就用通过accept函数接受并创建一个线程来处理.线程的创建函数为int pthread_create(pthread_t * thread, pth

Flask基于websocket的简单聊天室

1.安装gevent-websocket pip install -i https://pypi.tuna.tsinghua.edu.cn/simple/ gevent-websocket 2.chat.py文件内容如下: from flask import Flask,request,render_template import json from geventwebsocket.handler import WebSocketHandler from gevent.pywsgi import

基于多进程的网络聊天程序

參考:linux高性能server编程.作者:游双 程序简单介绍:该程序用了共享内存来实现进程间的同步,因为仅仅是同一时候读取共享内存.所以没实用到锁.该程序的功能是server监听网络连接,当有一个client连接时,server创建一个子进程处理该连接. 每一个子进程仅仅负责自己的client以及和父进程通信.当子进程从client读取数据后,把数据放到共享内存上,每一个子进程在共享内存上有自己的一段空间.因此不会出现同一时候写. 放上去后通知父进程,说:共享内存上有新数据到达了,然后父进程

基于Tcp通信的聊天程序微风IM(c#开源) -技术分析(三) 客户端下线

在微风IM中,当某个客户端下线后,其他客户端能够感知到此用户已经下线,并把其头像图标变成灰色. 感知连接的掉线,是networkcomms框架内置的功能,服务器通过心跳检测得知某连接掉线,会从networkcomms内部维护的连接列表中删除此连接,并触发相应的委托. 我们要处理某连接掉线,只需要注册  NetworkComms.AppendGlobalConnectionCloseHandler 方法即可 服务器端代码如下: //如果某客户端离线,触发此方法 NetworkComms.Appen

基于Tcp通信的聊天程序微风IM(c#开源) -技术分析(一) 用户管理

在微风IM中,如果用户上线了,其他用户的用户列表中,此用户状态更新为上线状态,如果用户下线了,此用户的头像会变成灰色. 我们看一下相关的代码: 首先是客户端代码(1): UserInfo userInfo = new UserInfo(); userInfo.UserID = txtUserID.Text.Trim(); userInfo.Password = txtPassword.Text.Trim(); //发送契约类给服务器端,并获取返回的结果 UserLoginContract log