zoukankan      html  css  js  c++  java
  • socket.io安装部署

    需要node.js环境

    创建package.json

      npm init

       

    下载相关依赖

    npm install --save express@4.10.2

    npm会在当前目录下载所需要的依赖到node_modules的文件夹中

    下载安装socket.io

      npm install -save socket.io

    事例

    服务端示例:

     1 var app = require('express')();
     2 var http = require('http').Server(app);
     3 var io = require('socket.io')(http);
     4 
     5 //app.get('/', function(req, res){
     6 //  res.send('<h1>Hello world</h1>');
     7 //});
     8 
     9 /*app.get('/', function(req, res){
    10   res.sendFile(__dirname + '/index.html');
    11 });
    12 */
    13 
    14 app.get('/', function(req, res){
    15   res.sendfile('index.html');
    16 });
    17 
    18 /*io.on('connection', function(socket){
    19   console.log('a user connected');
    20 });
    21 
    22 io.on('connection', function(socket){
    23   console.log('a user connected');
    24   socket.on('disconnect', function(){
    25     console.log('user disconnected');
    26   });
    27 });
    28 
    29 io.on('connection', function(socket){
    30   socket.on('chat message', function(msg){
    31     console.log('message: ' + msg);
    32   });
    33 });*/
    34 
    35 
    36 io.on('connection', function(socket){
    37    socket.on('chat message', function(msg){
    38     io.emit('chat message', msg);
    39   });
    40 })
    41 
    42 
    43 http.listen(3000, function(){
    44   console.log('listening on *:3000');
    45 });

     客户端示例:

     1 <!doctype html>
     2 <html>
     3   <head>
     4     <title>Socket.IO chat</title>
     5     <style>
     6       * { margin: 0; padding: 0; box-sizing: border-box; }
     7       body { font: 13px Helvetica, Arial; }
     8       form { background: #000; padding: 3px; position: fixed; bottom: 0; width: 100%; }
     9       form input { border: 0; padding: 10px; width: 90%; margin-right: .5%; }
    10       form button { width: 9%; background: rgb(130, 224, 255); border: none; padding: 10px; }
    11       #messages { list-style-type: none; margin: 0; padding: 0; }
    12       #messages li { padding: 5px 10px; }
    13       #messages li:nth-child(odd) { background: #eee; }
    14     </style>
    15   </head>
    16   <body>
    17     <ul id="messages"></ul>
    18     <form action="">
    19       <input id="m" autocomplete="off" /><button>Send</button>
    20     </form>
    21 <script src="http://code.jquery.com/jquery-1.11.1.js"></script>
    22 <script src="/socket.io/socket.io.js"></script>
    23 <script>
    24   var socket = io();
    25   $('form').submit(function(){
    26     socket.emit('chat message', $('#m').val());
    27     $('#m').val('');
    28     return false;
    29   });
    30   socket.on('chat message', function(msg){
    31     $('#messages').append($('<li>').text(msg));
    32   });
    33 </script>
    34 
    35 
    36   </body>
    37 </html>
  • 相关阅读:
    25个妙招儿,帮你每天挤出一小时
    怎样把outlook只最小化到托盘中而不再任务栏中显示
    背完这999句,你的英语口语绝对没有问题了!
    掌握自己的未来
    asp.net page liftcycle
    [转]浅析软件项目管理中十个误区
    明确一个古老的问题left join,right join,inner join,full join,cross join
    项目管理缩略语英中注释表
    30秒清除你电脑中的垃圾(使你的电脑急速如飞)
    看美片必备英语常识(转载)
  • 原文地址:https://www.cnblogs.com/dhl-2013/p/6203876.html
Copyright © 2011-2022 走看看