基於websocket實現簡單聊天室對話

Posted on by

本文實例為大傢分享瞭vue + element ui 實現錨點定位的具體代碼，供大傢參考，具體內容如下

首先搭建一個node的環境，在app.js中寫入以下代碼

npm install socket.io-client

socket是一個高性能的服務器框架，開發者隻要實現一兩個接口，便可以開發出自己的網絡應用，例如Rpc服務、聊天室服務器、手機遊戲服務器等。

npm install http-server

一般提供server服務,參數可以指定端口、地址等等，例如指定服務在8888端口啟動，命令為：http-server src -p 8888

npm install koa

Koa 通過 node.js 實現瞭一個十分具有表現力的 HTTP 中間件框架，力求讓 Web 應用開發和 API 使用更加地愉快。Koa的中間件之間按照編碼順序在棧內依次執行，允許您執行操作並向下傳遞請求（downstream），之後過濾並逆序返回響應（upstream）。

實現代碼

// 引入依賴
const koa = require("koa")
// 初始化koa
const app = new koa()
// 開啟 http 
var server = require("http").createServer(app.callback())
// 初始化 socket
const io = require("socket.io")(server, { cors: true })
// 監聽
io.on('connection', (socket) => {
  // 主動向客戶端發消息

  setTimeout(() => {
    // 通過io對象方法emit 觸發一個自定義事件  並且向客戶端發送消息
    io.emit('chat message', '想說點什麼？')
  }, 1000)

  socket.on('disconnect', () => {
    console.log('user disconnected')
  })

  // 在服務器收到客戶端的消息
  // 通過on方法監聽事件  當客戶端發送消息時會觸發該事件 並且可以接受客戶端發來的消息
  socket.on('chat message', (msg) => {
    console.log(msg)
    // msg為客戶端發來的消息
    // 發消息給客戶端是emit
    setTimeout(() => {
      msg = msg.replace("你", "我").replace("嗎", "").replace("？", "!")
      // 觸發事件 將處理之後的消息信息發送給客戶端
      io.emit('chat message', msg)
    }, 500)
  })
})
server.listen(5522,()=>{
  console.log('socket服務已開啟,端口號為5522')
});

調用這個服務

import { io } from 'socket.io-client'
cteated(){
    // 1.創建連接 可以自定義
    this.socket = io('ws://localhost:5522')
     // 2. 建立連接
    this.socket.on('connect', () => {
        console.log('建立連接成功瞭')
    })
    // 3.監聽消息返回
    this.socket.on('chat message', msg => {
        console.log('服務回來的消息', msg)
    })
}

這樣就能進行一個簡單的人工智能對話瞭

以上就是本文的全部內容，希望對大傢的學習有所幫助，也希望大傢多多支持WalkonNet。

推薦閱讀：