1. 程式人生 > >Node.Js+Redis+Socket.IO 實現 聊天室或推送訊息

Node.Js+Redis+Socket.IO 實現 聊天室或推送訊息

基於Redis 推送,向Node.Js 推送訊息,Node.Js 把 訊息推送給 Socket.IO(可以是WebSocket,也可以是long-Polling,由Socket.IO 封裝)

需要 Redis服務端,Node.Js需要 redis模組和Socket.IO模組

Node.Js

var redisPusMsgServer = require('http').createServer().listen(1379);


var redis = require('redis'),
    RDS_PORT = 6379,        //埠號
    RDS_HOST = '172.20.20.46',    //伺服器IP
    RDS_OPTS = {};            //設定項
var redisclient = redis.createClient(RDS_PORT,RDS_HOST,RDS_OPTS);//redis客戶端
//建立redis 推送監聽
var sub = function(x){
var x = "RedisTestChannel";
redisclient.select('15', function(error){
       if(error) {
         console.log(error);
       } else {
         redisclient.subscribe(x,function(e){
    console.log('Subscribe Channel:' + x);
     });
       }
    });
}
//執行redis 推送監聽
sub();
//輸出日誌
console.log('redisPusMsgServer running at http://172.20.20.46:1379/');
//建立websocket服務
var io = require('socket.io')(redisPusMsgServer,{
   "serveClient": false ,
   "transports":['websocket', 'polling'] //這個配置可以 告訴socket.io 優先使用 哪個模式,預設是 polling,websocket
 });
//websocket連結後,redis執行監聽推送頻道 是有訊息
io.on('connection',function(socket){
//redis接收到推送訊息後,websocket推送給頁面
redisclient.on('message',function(error,msg){
console.log('connection');
        console.log(msg);
//觸發websocket 接收資訊
        socket.emit('msgReceived', msg);
});
//註冊接收Web前端訊息事件
    socket.on('SendMsg', function(data) {
        console.log('傳送訊息',data);
        //socket.broadcast用於向整個網路廣播(除自己之外)
        socket.broadcast.emit('GetMsg',data);
    });
//斷開websocket事件
    socket.on('disconnect', function(data) {
        console.log('斷開',data);
        socket.emit('c_leave','離開');
        //socket.broadcast用於向整個網路廣播(除自己之外)
        //socket.broadcast.emit('c_leave','某某人離開了')
    });
});


HTML頁面

<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>socket</title>
  <script type="text/javascript" src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
  <script type="text/javascript" src="jquery-2.1.1.min.js"></script>
 </head>
 <body>
  
   <div style="width:100px; height:200px; border:1px solid red" id="show"></div>
   <button id="sendBtn">傳送訊息</button>


   <button id="leaveBtn">離開</button>
 </body>
 
 <script type="text/javascript">
// 建立一個Socket例項
// var socket = new WebSocket('ws://localhost:9000');
// socket.onopen = function(event) {
//     // 傳送一個初始化訊息
//     socket.send('I am zqz_client!');
//     // 監聽訊息
//     socket.onmessage = function(event) {
//         console.log('收到服務端訊息: ', event);
//     };
//     // 監聽Socket的關閉
//     socket.onclose = function(event) {
//         console.log('socket關閉: ', event);
//     };
//     // 關閉Socket.... 
//     //socket.close() 
// };
</script>
<script type="text/javascript">
    var div = $("#show");

   //這個配置可以 告訴socket.io 優先使用 哪個模式,預設是 polling,websocket
    var socket=io.connect('ws://127.0.0.1:1379',  {"transports":['websocket', 'polling']}),//與伺服器進行連線
        send=document.getElementById('sendBtn'),
        leave=document.getElementById('leaveBtn');
    send.onclick=function(){
        socket.emit('hi', 'hello!');
    }
    leave.onclick=function(){
        window.opener=null;window.close() 
        socket.emit('leave', 'leave');
    }
    //接收來自服務端的資訊事件c_hi
    socket.on('c_hi',function(msg){
        alert(msg)
    });
socket.on('msgReceived', function(msg) {
console.log('msgReceived',msg);
div.append(msg + "<br/>"); 
    });
    // socket.on('c_leave',function(msg){
    //     alert(msg)
    // })
</script>
</html>