首页 > 解决方案 > HTML 文件无法连接到 socketio

问题描述

我的文件系统中有一个新的 HTML 文件,如下所示:

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

<head>
    <meta charset="UTF-8">
    <title>Minimal working example</title>
</head>

<body>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script>
    <script>
        const socket = io("http://localhost:5000", {
            transports: ['websocket']
        });

        socket.on('connect', () => console.log("connect"));
    </script>
</body>

</html>

我还有一个在 localhost 上运行的 javascript socketio 服务器:

const express = require("express")
const SocketIO = require("socket.io")
const http = require("http")

const app = express()
const PORT = process.env.PORT || 5000

const server = http.createServer(app)
const io = SocketIO(server)

app.get("/", (_, res) => res.send("Home"))

io.on("connection", socket => {
    console.log("connection!")
})

server.listen(PORT, () => console.log(`Sever running on ${PORT}`))

为什么我的服务器从不记录任何东西???

标签: javascripthtmlnode.jswebsocketsocket.io

解决方案


从同一个后端服务前端

经过仔细检查,您没有从同一主机/端口提供 HTML 文件。您的 index.html 文件在尝试连接时可能会出现 CORS 错误,因为它是未经批准的跨源文件。

我替换了这一行:

app.get("/", (_, res) => res.send("Home"))

用这条线。从同一文件夹提供 index.html 文件(不推荐)

app.use(express.static('.'))

两者都在同一个域上运行,连接成功记录。


推荐阅读