赞
踩
一、创建连接
var connect=new WebSocket("ws://localhost:8080/MyFirstJavaWebApp/websocket");
//其中MyFirstJavaWebApp是项目名字
//若要传递用户名在websocket后加?username="+username
二、回调函数
1.connect.onopen=function (){};
该函数的函数体在执行创建连接成功后触发。
2.connect.onmessage = function (evt){ var r_msg = evt.data; };
该函数用于接收到信息。
3.connect.onclose = function(){};
该函数的函数体在关闭连接时触发。
三、发送信息
connect.send(message);
message为要发送的内容。
四、代码示例
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=0.5, maximum-scale=2.0, user-scalable=yes" /> <title>聊天室示例</title> </head> <body> <textarea id="sendText"></textarea> <button onclick="sendMessage()">发送</button> <script> var connect; window.onload=function unit(){ if ("WebSocket" in window){ // 打开一个 web socket connect = new WebSocket("ws://localhost:8080/ChatApplication/websocket"); connect.onopen = function(){ // Web Socket 已连接上 alert("已连接"); }; connect.onmessage = function (evt){ var r_msg = evt.data; document.body.innerHTML+="<br/>接收的信息为:"+r_msg; };//接收时自己也会接收,可以自己设置过滤的if语句 connect.onclose = function(){ // 关闭 websocket alert("连接关闭"); }; } else{ // 浏览器不支持 WebSocket alert("您的浏览器不支持 WebSocket!"); } }; function sendMessage(){ connect.send(document.getElementById("sendText").value); document.getElementById("sendText").innerHTML=""; } </script> </body> </html>
注意:该代码示例仅作为教程示例无法完成信息发送,因为没有服务端代码,关于服务端代码请查看websocket详细教程(一)—— 服务端。
赞
踩
Copyright © 2003-2013 www.wpsshop.cn 版权所有,并保留所有权利。