html + node 的使用webSocket

最新推荐文章于 2024-05-07 17:44:21 发布

Billow_lamb

最新推荐文章于 2024-05-07 17:44:21 发布

阅读量201

点赞数

文章标签： js node html

本文链接：https://blog.csdn.net/Billow_lamb/article/details/118028825

版权

<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <input type="text" placeholder="请输入内容">
  <button>发送</button>
  <div></div>
  <script>
    let input = document.querySelector('input')
    let button = document.querySelector('button')
    let div = document.querySelector('div')
    let websocket = new WebSocket('ws://localhost:5000')
    // open:当前websocket服务器链接成功时候触发
    websocket.addEventListener('open', function () {
      div.innerHTML = '链接服务成功了'
    })
    button.addEventListener('click', () => {
      let val = input.value
      websocket.send(val)
      input.value = ""
    })
    websocket.addEventListener('message', (e) => {
      let dv = document.createElement('div')
      dv.innerHTML= JSON.prase(e.data)
      div.appendChild(dv)
    })
    websocket.addEventListener('close', (e) => {
      console.log(e)
    })
  </script>
</body>
</html>

node

const nodejsWebsocket = require('nodejs-websocket')

let count = 0
const server = nodejsWebsocket.createServer(content=>{
  count++
  content.user = `用户${count}进入聊天室`
  broadcast({
    message: content.user,
    time:formatDate(new Date())
  })
  content.on('text',data=>{
    broadcast({
      message: data,
      time:formatDate(new Date())
    })
  }),
  content.on('close',(data)=>{
    let s = `用户${count}离开聊天室`
    broadcast({
      message: s,
      time:formatDate(new Date())
    })
    count--
  })
})
function broadcast(msg){
  server.connections.forEach(function (con) {
    con.send(JSON.stringify(msg))
  })
}
function formatTen(num) {
  return num > 9 ? (num + "") : ("0" + num);
}
function formatDate(date) {
  var date = new Date(date)
  var year = date.getFullYear();
  var month = date.getMonth() + 1;
  var day = date.getDate();
  var hour = date.getHours();
  var minute = date.getMinutes();
  var second = date.getSeconds();
  return formatTen(hour)+ ":" +formatTen(minute)
}
server.listen(5000,_=>{
  console.log("端口启动")
})

Billow_lamb

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
1
评论
html + node 的使用webSocket

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document&l
复制链接

扫一扫