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

原生 nodejs 结合 Socket.io 实现服务器和 客户端的相互通信

时间:2020-07-11 00:27:59      阅读:105      评论:0      收藏:0      [点我收藏+]

标签:实现   read   ack   type   file   head   群发   sim   一个   

1、 安装 Socket.io

网址:http://socket.io/

npm install socket.io

2、写原生的 JS,搭建一个服务器,server 创建好之后, 创建一个 io 对象。

 

var http=require(‘http‘);

var fs=require(‘fs‘);  /*fs内置的模块*/

var app=http.createServer(function(req,res){
    //加载静态页面
    fs.readFile(‘app.html‘,function(err,data){

        res.writeHead(200,{"Content-Type":"text/html;charset=‘utf-8‘"});
        res.end(data);
    })
})

//引入socket.io
var io = require(‘socket.io‘)(app);

io.on(‘connection‘, function (socket) {

    console.log(‘服务器建立连接了‘);
});




app.listen(3000);


/*使用socket.io
1.安装

 npm install socket.io

 2、引入建立连接

 var io = require(‘socket.io‘)(app);


 io.on(‘connection‘, function (socket) {

    console.log(‘服务器建立连接了‘);
 });

3、在客户端 html里面引入js

 http://localhost:3000/socket.io/socket.io.js

* */

 

制作一个index页面,这个页面中,必须引用秘密js文件。调用io函数,取得socket 对象。

 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="http://localhost:3000/socket.io/socket.io.js"></script>

    <script>

        var socket = io(http://localhost:3000/);  /*和服务器建立连接*/

    </script>
</head>
<body>
客户端

<button id="button">给服务器发送数据</button>


</body>
</html>

 

3、服务器端通过 emit 广播,通过 on 接收广播

app.js

var http=require(‘http‘);

var fs=require(‘fs‘);  /*fs内置的模块*/

var app=http.createServer(function(req,res){
    //加载静态页面
    fs.readFile(‘app.html‘,function(err,data){

        res.writeHead(200,{"Content-Type":"text/html;charset=‘utf-8‘"});
        res.end(data);
    })
})

//引入socket.io
var io = require(‘socket.io‘)(app);

io.on(‘connection‘, function (socket) {

    console.log(‘服务器建立连接了‘);

    //服务器获取客户端广播的数据

    socket.on(‘addcart‘,function(data){

        console.log(data);

        //服务器给客户端发送数据

        //socket.emit();   /*谁给我发信息我把信息广播给谁*/

        //io.emit() ;   /*群发  给所有连接服务器的客户都广播数据*/


        //socket.emit(‘to-client‘,‘我是服务器的数据‘+data.client);

        io.emit(‘to-client‘,‘我是服务器的数据‘+data.client)

    })

});




app.listen(3000);


/*使用socket.io
1.安装

 npm install socket.io

 2、引入建立连接

 var io = require(‘socket.io‘)(app);


 io.on(‘connection‘, function (socket) {

    console.log(‘服务器建立连接了‘);
 });

3、在客户端 html里面引入js

 http://localhost:3000/socket.io/socket.io.js





* */

app.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <script src="http://localhost:3000/socket.io/socket.io.js"></script>

    <script>

        var socket = io(http://localhost:3000/);  /*和服务器建立连接*/


        window.onload=function(){

            var btn=document.getElementById(button);

            btn.onclick= function () {
                //客户端给服务器发送数据

                socket.emit(addcart,{
                    client:我是客户端的数据
                })

            }


            //监听服务器的广播
            socket.on(to-client,function(data){

                console.log(data)
            })

        }

    </script>
</head>
<body>
客户端

<button id="button">给服务器发送数据</button>


</body>
</html>

 

 

原生 nodejs 结合 Socket.io 实现服务器和 客户端的相互通信

标签:实现   read   ack   type   file   head   群发   sim   一个   

原文地址:https://www.cnblogs.com/loaderman/p/11581546.html

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