javascript - 我在使用 socket.io 时遇到问题
问题描述
我对 node.js 和 socket.io 有点陌生,这就是我发布这个问题的原因。对我在 youtube 上找到的创建实时聊天网站的分步教程视频进行编码,但这是我不断收到的一个错误,上面写着 ReferenceError: io is not defined at /script.js:2:16
. 有人可以帮我解决这个问题吗?
索引.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Lime</title>
<script defer src="https://Lime.restivetoo.repl.co:8080/socket.io/socket.io.js"></script>
<script defer src="script.js"></script>
<style>
body {
padding: 0;
margin: 0;
display: flex;
justify-content: center;
}
#message-container {
width: 80%;
max-width: 1200px;
}
#message-container div {
background-color: #CCC;
padding: 5px;
}
#message-container div:nth-child(2n) {
background-color: #FFF;
}
#send-container {
position: fixed;
padding-bottom: 30px;
bottom: 0;
background-color: white;
max-width: 1200px;
width: 80%;
display: flex;
}
#message-input {
flex-grow: 1;
}
</style>
</head>
<body>
<div id="message-container"></div>
<form id="send-container">
<input type="text" id="message-input">
<button type="submit" id="send-button">Send</button>
</form>
</body>
</html>
服务器.js
const io = require('socket.io')(8080)
const users = {}
io.on('connection', socket => {
socket.on('new-user', name => {
users[socket.id] = name
socket.broadcast.emit('user-connected', name)
})
socket.on('send-chat-message', message => {
socket.broadcast.emit('chat-message', { message: message, name: users[socket.id] })
})
socket.on('disconnect', () => {
socket.broadcast.emit('user-disconnected', users[socket.id])
delete users[socket.id]
})
})
脚本.js
const socket = io('https://Lime.restivetoo.repl.co:8080')
const messageContainer = document.getElementById('message-container')
const messageForm = document.getElementById('send-container')
const messageInput = document.getElementById('message-input')
const name = prompt('What is your name?')
appendMessage('You joined')
socket.emit('new-user', name)
socket.on('chat-message', data => {
appendMessage(`${data.name}: ${data.message}`)
})
socket.on('user-connected', name => {
appendMessage(`${name} connected`)
})
解决方案
更改此行:
<script defer src="https://Lime.restivetoo.repl.co:8080/socket.io/socket.io.js"></script>
至:
<script src="/socket.io/socket.io.js"></script>
文档摘录:
默认情况下,Socket.IO 服务器在 /socket.io/socket.io.js 公开一个客户端包。
推荐阅读
- python - TypeError:__init__() 在 Python 中为 CatBoost 获得了一个意外的关键字参数“early_stopping_rounds”
- authentication - 如何在 Groovy/Grails 上实现社交网络登录?
- powershell - 用于将多行文本提取到单行的 Powershell 脚本
- c# - 使用 google vision OCR API 从特定图像位置提取数据
- tcl - 按预定义列表中的值对 TCL 列表进行排序
- pdf - PDF Stream 中的 Post Scripts 命令将如何绘制?
- javascript - 在javascript中理解Valid Anagram的解决方案
- python - 使用 pipe() 和 fdopen() 将数据从 Python 脚本传递到 Windows 中的 C++ 应用程序
- javascript - 无法使用 dstore/Memory 内存存储填充 dijit/form/select
- c++ - Qt webenginewidgets 疑难解答