futurejava前台_web前端页面与后端Java的数据交互

java代码：

package com.lpc.main;

import java.io.IOException;

import java.util.Set;

import java.util.concurrent.CopyOnWriteArraySet;

import java.util.concurrent.atomic.AtomicInteger;

import javax.websocket.OnClose;

import javax.websocket.OnError;

import javax.websocket.OnMessage;

import javax.websocket.OnOpen;

import javax.websocket.Session;

import javax.websocket.server.ServerEndpoint;

/**

* * 类名称:Server.java 类描述:简单的聊天室作者:wantao 时间:2018年03月08日 23:11:48

@ServerEndpoint(value = "/chat")

public class Test {

private static final String GUEST_PREFIX = "用户";

/**

* 一个提供原子操作的Integer的类。在Java语言中，++i和i++操作并不是线程安全的，

* 在使用的时候，不可避免的会用到synchronized关键字。而AtomicInteger则通过一种线程安全的加减操作接口。

private static final AtomicInteger connectionIds = new AtomicInteger(0);

// 存放用户的websocket

private static final Set connections = new CopyOnWriteArraySet<>();

private final String nickname;

private Session session;

public Test() {

nickname = GUEST_PREFIX + connectionIds.getAndIncrement();

}

/**

* 创建连接时间调用的方法

* @param session

@OnOpen

public void start(Session session) {

this.session = session;

connections.add(this);

String message = String.format("* %s %s", nickname, "加入聊天室");

// 上线通知

broadcast(message);

try {

// 系统问候语

SendHello(this.nickname);

// 返回在线用户

onlineList();

} catch (IOException e) {

e.printStackTrace();

}

/**

* 链接关闭时调用方法

@OnClose

public void end() {

connections.remove(this);

String message = String.format("* %s %s", nickname, "退出聊天室");

broadcast(message);

}

/**

* 传输信息过程中调用方法

* @param message

@OnMessage

public void incoming(String message) {

// Never trust the client

// TODO: 过滤输入的内容

String m = String.format("* %s %s", nickname, message);

if (m.contains("to")) {

// 点对点发送

broadcastOneToOne(m, nickname);

} else {

// 群发

broadcast(m);

}

/**

* 发生错误是调用方法

* @param t

* @throws Throwable

@OnError

public void onError(Throwable t) throws Throwable {

System.out.println("错误: " + t.toString());

}

/**

* 消息广播通过connections，对所有其他用户推送信息的方法

* @param msg

private static void broadcast(String msg) {

for (Test client : connections) {

try {

synchronized (client) {

client.session.getBasicRemote().sendText(msg);

}

} catch (IOException e) {

System.out.println("错误:向客户端发送消息失败");

connections.remove(client);

try {

client.session.close();

} catch (IOException e1) {

e1.printStackTrace();

}

String message = String.format("* %s %s", client.nickname,

"退出聊天室");

broadcast(message);

}

/**

* 点对点发送消息通过connections，对所有其他用户推送信息的方法

* @param msg

private static void broadcastOneToOne(String msg, String nickName) {

String[] arr = msg.split("to");

for (Test client : connections) {

try {

if (arr[1].equals(client.nickname)

|| nickName.equals(client.nickname)) {

synchronized (client) {

client.session.getBasicRemote().sendText(arr[0]);

}

} catch (IOException e) {

System.out.println("错误:向客户端发送消息失败");

connections.remove(client);

try {

client.session.close();

} catch (IOException e1) {

e1.printStackTrace();

}

String message = String.format("* %s %s", client.nickname,

"退出聊天室");

broadcast(message);

}

// 系统问候语

private static void SendHello(String nickName) throws IOException {

String m = String.format("* %s %s", nickName, "你好");

for (Test client : connections) {

if (client.nickname.equals(nickName)) {

client.session.getBasicRemote().sendText(m);

}

// 在线用户

private static void onlineList() throws IOException {

String online = "";

for (Test client : connections) {

if (online.equals("")) {

online = client.nickname;

} else {

online += "," + client.nickname;

}

String m = String.format("* %s %s", "当前在线用户", online);

for (Test client : connections) {

client.session.getBasicRemote().sendText(m);

}

jsp文件

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

websocket

input#chat {

width: 410px

}

#console-container {

width: 400px;

}

#console {

border: 1px solid #CCCCCC;

border-right-color: #999999;

border-bottom-color: #999999;

height: 170px;

overflow-y: scroll;

padding: 5px;

width: 100%;

}

#console p {

padding: 0;

margin: 0;

}

"use strict";

var Chat = {};

Chat.socket = null;

Chat.connect = (function(host) {

if ('WebSocket' in window) {

Chat.socket = new WebSocket(host);

} else if ('MozWebSocket' in window) {

Chat.socket = new MozWebSocket(host);

} else {

Console.log('Error: 浏览器不支持WebSocket');

return;

}

Chat.socket.onopen = function () {

Console.log('Info: WebSocket链接已打开');

document.getElementById('chat').onkeydown = function(event) {

if (event.keyCode == 13) {

Chat.sendMessage();

}

};

Chat.socket.onclose = function () {

document.getElementById('chat').onkeydown = null;

Console.log('Info: webcocket关闭.');

};

Chat.socket.onmessage = function (message) {

Console.log(message.data);

};

});

Chat.initialize = function() {

if (window.location.protocol == 'http:') {

Chat.connect('ws://' + window.location.host + '/WebSocket/chat');

} else {

Chat.connect('wss://' + window.location.host + '/WebSocket/chat');

}

};

Chat.sendMessage = (function() {

var message = document.getElementById('chat').value;

if (message != '') {

Chat.socket.send(message);

document.getElementById('chat').value = '';

}

});

var Console = {};

Console.log = (function(message) {

var console = document.getElementById('console');

var p = document.createElement('p');

p.style.wordWrap = 'break-word';

p.innerHTML = message;

console.appendChild(p);

while (console.childNodes.length > 25) {

console.removeChild(console.firstChild);

}

console.scrollTop = console.scrollHeight;

});

Chat.initialize();

document.addEventListener("DOMContentLoaded", function() {

// Remove elements with "noscript" class -

is not allowed in XHTML

var noscripts = document.getElementsByClassName("noscript");

for (var i = 0; i < noscripts.length; i++) {

noscripts[i].parentNode.removeChild(noscripts[i]);

}

}, false);

Seems your browser doesn't support Javascript! Websockets rely on Javascript being enabled. Please enable

Javascript and reload this page!

注意：输入消息to用户名发送给指定用户比如：你好to用户1

输入消息直接发送给全体用户

运行后提示

Info: webcocket关闭.

eclipse控制台输出信息：