美文网首页
socket的运行步骤

socket的运行步骤

作者: 我就是心虚 | 来源:发表于2017-11-02 10:41 被阅读0次

在这之前用node.js的环境配置
1、在app.js中设置引入socket.io文件

var express = require('express');
var app = express();
var server = require('http').Server(app);(自己添加的)
var io = require('socket.io')(server);(自己添加的)

2、在index.html中写入输入框和要用的按钮

html代码片段
        <input type="" name="" id="info">
        <button type="" id="btn2">登录</button>
        <button id="btn">发送</button>
        <ul id="ul"></ul>
js代码片段
var socket = io.connect('http://localhost:9000');
var username = ""
      btn2.onclick = function(){
        username = info.value;
        socket.emit("login",username)
        info.value =""
      }
      btn.onclick = function(){
        socket.emit("info",info.value);
        info.value =""
      }
      socket.on('msg', function (name,data) {
        var node = document.createElement("li")
        if(name == username){
            node.style.textAlign = "right"
        }
        node.innerHTML = name+":"+data;
        ul.appendChild(node);
      });

3、在app.js中监听并广播html发送过来的数据

io.on('connection', function (socket) {
      socket.on("login",function(username){
        socket.name = username;
      });

       socket.on('info', function (data) {
        //console.log(data);
        io.emit("msg",socket.name,data)
      });
});

server.listen(9000);

4、在cmd命令行中执行nodemon app.js
在浏览器中打开localhost:9000

相关文章

网友评论

      本文标题:socket的运行步骤

      本文链接:https://www.haomeiwen.com/subject/otzdyxtx.html