文件結構
node.js代碼
// 需要HTTP 模塊來啟動服務器和Socket.IO
var http= require('http');
var fs = require('fs');
// 在8080端口啟動服務器
var server= http.createServer(function(req, res){
// 發送HTML的headers和message
fs.readFile('../index.html',function(error,data){
res.writeHead(200,{'Content-Type':'text/html'});
res.end(data,'utf-8');
});
});
server.listen(8080,function () {
console.log('監聽端口是 8080 ,服務已啟動');
});
// 創建一個Socket.IO實例，把它傳遞給服務器
var socket = require('socket.io').listen(server);
// 添加一個連接監聽器
socket.on('connection', function(client){
// 成功！現在開始監聽接收到的消息
console.log("connected");
client.on('message',function(data){
console.log('Received message from client!',data);
client.broadcast.emit('server message',{text:data.text});
});
client.on('disconnect',function(){
//clearInterval(interval);
console.log('Server has disconnected');
});
//模擬觸發數據
// var interval= setInterval(function() {
// //client.send('This is a message from the server! ' + new Date().getTime());
// //發送給單個用戶
// //client.emit('message',{text:'你上線了'});
// //發送給所有用戶
// client.broadcast.emit('message',{text:'你的好某XXX上線了'});
// },5000);
});
index.html頁面代碼：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Socket.IO Example</title>
</head>
<body>
<textarea id="msgbox"></textarea>
<input type="button" value="send" id="sendBtn">
<script src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect('ws://localhost:8080');
//前端監聽信息
socket.on('server message',function(data){
console.log(data.text);
})
//前端發送信息
document.getElementById("sendBtn").onclick = function () {
var info = document.getElementById("msgbox").value;
//console.log(info);
socket.emit("message",{text:info});
}
</script>
</body>
</html>