-
怎樣報(bào)名 ?查看全部
-
學(xué)習(xí)查看全部
-
nodejs-websocket
查看全部 -
//?websocket.js
const?ws?=?require('nodejs-websocket')
let?clientCount?=?0;
let?server?=?ws.createServer(connection?=>?{
??clientCount++;
??connection.nickname?=?'user'?+?clientCount;
??boardCast(connection.nickname?+?'進(jìn)入房間');
??connection.on('text',?function?(result)?{
????console.log('接收消息:',?result)
????boardCast(connection.nickname?+?':'?+?result?+?'!!!')
??})
??connection.on('connect',?function?(code)?{
????console.log('接收消息:',?code)
??})
??connection.on('close',?function?(code)?{
????boardCast(connection.nickname?+?'離開了房間');
????console.log('接收消息:',?code)
??})
??connection.on('error',?function?(code)?{
????console.log('接收消息:',?code)
??})
}).listen(8001)
function?boardCast(mess)?{
??server.connections.map((con)?=>?{
????con.sendText(mess)
??});
}
查看全部 -
Websock查看全部
-
yyu查看全部
-
websoset查看全部
-
socket,io.js文件:https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js
查看全部 -
socket.io優(yōu)勢(shì):
可以直接發(fā)送對(duì)象
自定義事件方式
查看全部 -
我的代碼記錄
查看全部 -
首先下載nodejs
然后下載sublinetext3或者nodepad++或者phpstorm都可以啊
然后安裝socket.io ->$ npm install socket.io
在https://socket.io/docs/網(wǎng)頁獲取到服務(wù)端和客戶端資料,改良之后如下所示
wsServer.js服務(wù)端
var app = require('http').createServer()
var io = require('socket.io')(app)
var PORT = 3000
var clientCount = 0
app.listen(PORT)
io.on('connection',function(socket){
clientCount++
socket.nickname = 'user' + clientCount
io.emit('enter',socket.nickname + 'comes in')
socket.on('message',function(str){
io.emit('message',socket.nickname + "says:" + str)
})
socket.on('disconnect',function(str){
io.emit('leave',socket.nickname + 'left')
})
})
console.log("sebsocket server listening on port" + PORT)
index.html客戶端
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>websocket</title>
<script type="text/javascript" src="socket.io.js"></script>
</head>
<body>
<h1>Chat Room</h1>
<input id="sendTxt" type="text" >
<button id="sendBtn">發(fā)送</button>
<script type="text/javascript">
var socket = new io("ws://localhost:3000/");
function showMessage(str,type){
var div = document.createElement('div');
div.innerHTML = str;
if(type == "enter"){
div.style.color = "blue";
}else if(type == "leave"){
div.style.color = "red";
}
document.body.appendChild(div);
}
document.getElementById("sendBtn").onclick = function(){
var txt = document.getElementById("sendTxt").value;
if(txt){
socket.emit('message',txt);
}
}
socket.on('enter',function(data){
showMessage(data,'enter');
})
socket.on('message',function(data){
showMessage(data,'message');
})
socket.on('leave',function(data){
showMessage(data,'leave');
})
</script>
</body>
</html>
查看全部 -
http://www.webscoket.org/
查看全部 -
遇到的錯(cuò)誤
The 'Access-Control-Allow-Origin' header has a value 'null' that is not equal to the supplied origin. Origin 'null' is therefore not allowed access
????解決方法:將所有環(huán)境搭載HTTP服務(wù)器上
安裝
npm?install?socket.io
index.html
<!DOCTYPE?html> <html?lang="en"> <head> <meta?charset="UTF-8"> <meta?name="viewport"?content="width=device-width,?initial-scale=1.0"> <meta?http-equiv="X-UA-Compatible"?content="ie=edge"> <script?src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.0.3/socket.io.js"></script> <title>Chat?Room?Demo</title> </head> <body> <h1>Chat?Room?Based?on?Socket.io</h1> SEND: <input?type="text"?id="sendText"?/> <button?id="sendBtn">Send</button> <br?/>?RECV: <span?id="recv"></span> <script> ????????var?socket?=?io("ws://localhost:8001/") ????????function?showMsg(str,?type)?{ ????????????var?div?=?document.createElement('div'); ????????????div.innerHTML?=?str ????????????if?(type?==?"enter")?{ ????????????????div.style.color?=?'blue'; ????????????}?else?if?(type?==?"disconnect")?{ ????????????????div.style.color?=?'red'; ????????????} ????????????document.body.appendChild(div); ????????} ????????document.getElementById("sendBtn").onclick?=?function?()?{ ????????????var?txt?=?document.getElementById("sendText").value; ????????????if?(txt)?{ ????????????????socket.emit('message',?txt); ????????????} ????????} ????????socket.on('enter',?function?(data)?{ ????????????showMsg(data,?'enter'); ????????}); ????????socket.on('message',?function?(data)?{ ????????????showMsg(data,?'message'); ????????}); ????????socket.on('disconnect',?function?(data)?{ ????????????showMsg(data,?'disconnect'); ????????}); ????</script> </body> </html>
app.js
const?POST?=?8001; var?app?=?require('http').createServer(); var?io?=?require('socket.io')(app); var?userCount?=?0; app.listen(POST); console.log("WebSocket?Server?Linstening?on?POST:"?+?POST); io.on('connection',?function?(socket)?{ userCount++; socket.nickname?=?"USER"?+?userCount; console.log("[ENTER]\t",?socket.nickname); io.emit("enter",?socket.nickname?+?'??ENTER'); socket.on("message",?function?(str)?{ io.emit("message",?socket.nickname?+?'?SAYS:?'?+?str); console.log("[MSG]\t",?socket.nickname,?"?\t?SAY:?",?str); }); socket.on("disconnect",?function?()?{ io.emit("disconnect",?socket.nickname?+?'?LEFT') console.log("[LEFT]\t",?socket.nickname); }); });
啟動(dòng):
node?app.js
查看全部 -
html5 中用 var socket = io('ws://localhost:3000/');查看全部
-
var ws = require("nodejs-websocket") var clientCount = 0 // Scream server example: "hi" -> "HI!!!" var server = ws.createServer(function (conn) { console.log("New connection") clientCount++ conn.nickname = 'user' + clientCount broadcast(conn.nickname + 'coms in') conn.on("text", function (str) { console.log("Received "+ str) broadcast(str) }) conn.on("close", function (code, reason) { console.log("Connection closed") broadcast(conn.nickname + 'go awary') }) conn.on("error", function(err) { console.log(err) }) }).listen(8001) console.log('go runed') function broadcast (str){ server.connections.forEach(function(connection){ connection.sendText(str) }) }查看全部
-
為了區(qū)分消息的類型,在服務(wù)端給消息定義類型和具體的值,然后用json轉(zhuǎn)成字符串發(fā)送(只能發(fā)送字符串)查看全部
-
使用socket.io實(shí)現(xiàn)websocket查看全部
-
websocket:服務(wù)器與瀏覽器端建立持久連接 nodejs-websocket:缺陷只能傳送字符串 socket.io-優(yōu)點(diǎn):1,可直接傳輸對(duì)象。2,可自定義消息查看全部
-
npm install nodejs-websocket -g 安裝全局變量查看全部
-
綠色發(fā)送,白色接受查看全部
-
web socket作用:將信號(hào)原封不動(dòng)的發(fā)送過去查看全部
-
12365489查看全部
-
websocket查看全部
-
index.html查看全部
舉報(bào)