我在 socket.io 上遇到了问题



我对node.js和socket有点陌生。这就是为什么我张贴这个问题。我在youtube上找到了一个循序渐进的教程视频,它创建了一个实时聊天网站,但我一直得到的是一个错误,上面写着ReferenceError: io is not defined at /script.js:2:16。有人能帮我解决这个问题吗?

index . 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>

server.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]
})
})

script.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中公开客户端包。

点击这里阅读更多

最新更新