码迷,mamicode.com
首页 > Web开发 > 详细

node.js搭建简单的websocket

时间:2014-08-17 21:07:02      阅读:376      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   os   io   文件   ar   

1、首先在官网http://www.nodejs.org/下载NODE.JS

2、打开命令行CMD,进入NODEJS\node_modules\的目录,输入npm install socket.io  安装socket.io模块.别急着关掉此CMD窗口,后面有用

3、搭建服务端代码server.js

 1 var http = require(‘http‘);
 2 var io = require(‘socket.io‘);
 3 var cisserver = http.createServer(function (request, response) {
 4     response.writeHead(200, { ‘Content-Type‘: ‘text/html‘ });
 5     response.end(‘start!‘);
 6 
 7 }).listen(8000);
 8 
 9 var ccisSocket = io.listen(cisserver); //.set(‘log‘, 1);
10 ccisSocket.on(‘connection‘, function (client) {
11     client.on(‘message‘, function (data) {
12         console.log(‘client message‘, data);
13         client.emit(‘message‘, data);
14         client.on(‘disconnect‘, function () { console.log(‘disconnect‘) })
15     })
16 })

4、切换之前NODEJS的命令行窗口输入node server.js开启监听模式

5、客户端代码

    

 1   <!DOCTYPE html> 
 2     <html> 
 3     <head> 
 4         <script src=‘http://localhost:8000/socket.io/socket.io.js‘></script> 
 5     </head> 
 6     <body> 
 7         <script> 
 8             var HTML5WebSockets = {};
 9             HTML5WebSockets.socketio = {
10                 yoursocket: null,
11 
12                 initialize: function () {
13 
14                     HTML5WebSockets.socketio.yoursocket = io.connect(http://localhost:8000);
15 
16                     HTML5WebSockets.socketio.yoursocket.on(connect, function () {
17                         HTML5WebSockets.socketio.log(You are connected to Server<br />);
18                         HTML5WebSockets.socketio.yoursocket.send("目前有值");
19                     });
20 
21                     HTML5WebSockets.socketio.yoursocket.on(message, function (data) {
22                         //alert(data);
23                         HTML5WebSockets.socketio.log(Server Response:   + data + <br />);
24                     });
25 
26                     HTML5WebSockets.socketio.yoursocket.on(disconnect, function () {
27                         HTML5WebSockets.socketio.log(You are disconnected from Server<br />);
28                     });
29 
30                     document.querySelector(#sendMes).onclick = function () {
31                         HTML5WebSockets.socketio.sendMessageToServer(document.getElementById("mes").value);
32                         document.getElementById("mes").value = ‘‘;
33                     };
34 
35                 },
36                 sendMessageToServer: function (data) {
37                     HTML5WebSockets.socketio.yoursocket.send(data);
38                     HTML5WebSockets.socketio.log(Message to Server:  + data + <br />);
39                 },
40 
41                 log: function (message) {
42                     document.getElementById("log").innerHTML += message;
43                 }
44             }  
45         </script> 
46        
47         <div id=‘log‘></div> 
48         <input type=‘text‘ id=‘mes‘ /> 
49         <button type=‘button‘ id=‘sendMes‘>Send</button> 
50         <br />    
51         <script> 
52             HTML5WebSockets.socketio.initialize();  
53         </script> 
54     </body> 
55     </html> 

7、运行HTML文件,输入值,等待服务端返回的结果

 

node.js搭建简单的websocket,布布扣,bubuko.com

node.js搭建简单的websocket

标签:style   blog   http   color   os   io   文件   ar   

原文地址:http://www.cnblogs.com/wishbay/p/3918176.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!