我正在學習 webdev,想嘗試使用 Express 和 socket.io 制作多人游戲
我可以在其中創建一個帶有 socket.io 的服務器來監聽。那部分作業正常。
但是,當我嘗試連接客戶端時,只有當我讓包含以下內容的 HTML 檔案由服務器提供時,這才有效,如下所示:
服務器代碼:
const express = require('express')
const app = express()
const http = require('http')
const server = http.createServer(app)
const { Server } = require('socket.io')
const io = new Server(server)
const port = 3000
io.on('connection', (sock) => {
console.log('client connected')
})
// This seems to be necessary, but I don't want it to be!!!
app.get('/', (req, res) => {
res.sendFile(__dirname '/index.html')
})
server.listen(port, () => {
console.log(`Server listening on port ${port}`)
})
這個 index.html 在底部有以下內容:
<script src="/socket.io/socket.io.js"></script>
<script>const socket = io()</script>
但是我想讓我所有的前端代碼與服務器分開。我為前端和后端創建了一個單獨的存盤庫。我希望前端包含所有 UI 邏輯并僅使用資料呼叫 (AJAX) 從服務器獲取 Json 資料。所以我只想把這個 index.html 檔案放在我的前端代碼中。
但是,如果我這樣做,則連接不起作用。
我可以正常啟動服務器。我從 WebStorm 打開 index.html,它還為此創建了一個服務器,我將其配置為也偵聽埠 3000
但是它找不到 /socket.io/socket.io.js 并且我在控制臺中收到以下錯誤。如果 WebStorm 在不同的埠上運行,它也不起作用。
The resource from “http://localhost:3000/socket.io/socket.io.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).
我如何才能將此 html 僅保留在我的客戶端存盤庫中,并且仍然可以使用 socket.io,或者這不可能?
uj5u.com熱心網友回復:
您不能讓多個服務器在同一個埠上偵聽。在不同的埠上運行服務器,或者:
- 有一個反向代理將請求轉發到您的 Socket.io 服務器(需要特殊處理)和您的前端服務器或
- 在腳本 src 中放置一個絕對 URL 并配置 CORS。
轉載請註明出處,本文鏈接:https://www.uj5u.com/net/424032.html
標籤:javascript 节点.js 表达 套接字.io 客户端服务器
