Node.js 並不能做所有事情,但它可通過 Socket.IO 庫輕松實現 WebSockets。使用 WebSockets 可輕松構建實時多用戶的應用程序或游戲,今天我們將講述如何使用 Node.js 和 Socket.IO 構建簡單的聊天程序。
注意: 在閱讀文章之前你應該先安裝好 Node.js,同時你需要一個自己喜歡的文本編輯器,本文提及的一些源碼有些改自 http://book.mixu.net/ch13.html
下面我們開始入門教程:
首先在你的電腦上創建一個新目錄,姑且命名為 chat,然後在該目錄創建兩個文件,分別是 app.js 和 index.html。
app.js 文件內容如下:
01
var fs = require('fs')
02
, http = require('http')
03
, socketio = require('socket.io');
04
05
var server = http.createServer(function(req, res) {
06
res.writeHead(200, { 'Content-type': 'text/html'});
07
res.end(fs.readFileSync(__dirname + '/index.html'));
08
}).listen(8080, function() {
09
console.log('Listening at: http://localhost:8080');
10
});
11
12
socketio.listen(server).on('connection', function (socket) {
13
socket.on('message', function (msg) {
14
console.log('Message Received: ', msg);
15
socket.broadcast.emit('message', msg);
16
});
17
});
上述代碼是一個超級簡單的聊天服務器的實現,該服務器發送 index.html 並偵聽所有 WebSockets 請求,如果你發送一個 hi 的聊天信息,格式如下:
1
{"name":"message","args":["hi"]}
index.html 頁面代碼如下:
01
<html>
02
<head>
03
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
04
<script src="/socket.io/socket.io.js"></script>
05
<script>
06
$(function(){
07
var iosocket = io.connect();
08
09
iosocket.on('connect', function () {
10
$('#incomingChatMessages').append($('<li>Connected</li>'));
11
12
iosocket.on('message', function(message) {
13
$('#incomingChatMessages').append($('<li></li>').text(message));
14
});
15
iosocket.on('disconnect', function() {
16
$('#incomingChatMessages').append('<li>Disconnected</li>');
17
});
18
});
19
20
$('#outgoingChatMessage').keypress(function(event) {
21
if(event.which == 13) {
22
event.preventDefault();
23
iosocket.send($('#outgoingChatMessage').val());
24
$('#incomingChatMessages').append($('<li></li>').text($('#outgoingChatMessage').val()));
25
$('#outgoingChatMessage').val('');
26
}
27
});
28
});
29
</script>
30
</head>
31
<body>
32
Incoming Chat: <ul id="incomingChatMessages"></ul>
33
<br />
34
<input type="text" id="outgoingChatMessage">
35
</body>
36
</html>
該頁面雖然不怎麼吸引人,但是可正常工作。接下來打開兩個浏覽器,必須得是支持 WebSockets 的浏覽器,例如 Chrome 或者 Safari。
下一步就是安裝 Socket.IO 了,可在命令行窗口中執行如下命令:
1
$ npm install socket.io
然後運行 app.js 文件:
1
$ node app.js
現在你可以打開兩個浏覽器,訪問 http://localhost:8080/ 地址開始互聊了。