客户端找不到&qot;socket.io.js文件(&Q;) [英] Client doesn't find "socket.io.js" file

查看:21
本文介绍了客户端找不到&qot;socket.io.js文件(&Q;)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在使用Express、Handlebar和Socket.IO做一个个人项目。我设置了Express和Handlebar部分,但当我尝试将客户端连接到Socket.IO时(通过将脚本标记放在页面上),它找不到它。我曾尝试安装";Socket.IO-Client";,但同样不起作用,Socket.IO网站上显示的CDN安装也是如此。

这是我的服务器:

const express = require('express');
const app = express();
const port = 3000;
const exphbs = require('express-handlebars');
const engine = exphbs.engine;
const http = require('http');
const socketio = require('socket.io');
const server = http.createServer(app);
const io = socketio(server);

app.engine('handlebars', engine());
app.set('view engine', 'handlebars');
app.set('views', './views');

app.use(express.static('public')); //Expongo al lado cliente la carpeta "public"


io.on('connection', socket => {
    console.log(`Socket ${socket.id} connected`)
})

app.get('/', (req, res) => {
    res.render("home");
})

app.get('/Hola', (req, res) => {
    res.render("hola");
})


app.listen(port, ()=> console.log(`App listening to port ${port}`));

我把脚本标签放在主布局上:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Card Game</title>
    <link rel="stylesheet" href="/css/styles.css">
</head>
<body>
    
<h1 id="titulo">Card Game</h1>
{{{body}}}

<script src="/socket.io/socket.io.js"></script>
<script src="/js/main.js"></script>
</body>
</html>

程序在公用文件夹中找到main.js文件没有问题,但似乎就是找不到socket.io.js。

Screenshot of the console error that I get when I run the program

任何帮助都将被取消!

推荐答案

问题是您正在创建两个HTTP服务器,将Socket.IO和Express附加到其中一个服务器,但从未启动过那个服务器。另一个仅附加了Express。

您创建一个http服务器,并使用以下命令将Socket.IO附加到该服务器:

const server = http.createServer(app);
const io = socketio(server);

但是,该服务器从未启动过,因此它没有运行。因此,Socket.IO没有运行。

您使用以下命令创建另一个http服务器:

app.listen(port, ()=> console.log(`App listening to port ${port}`));

此服务器已启动,但没有附加Socket.IO,因此未安装任何服务/socket.io/socket.io.js,因此浏览器在请求它时会得到404。


要修复,请更改此行代码:

app.listen(port, ()=> console.log(`App listening to port ${port}`));

至此:

server.listen(port, ()=> console.log(`App listening to port ${port}`));

作为进一步说明,它在app.listen()内部执行以下操作:

app.listen = function listen() {
  var server = http.createServer(this);
  return server.listen.apply(server, arguments);
};

因此,您可以看到它正在创建另一个http服务器,该服务器不是您附加Socket.IO到的服务器。您显然不需要再创建一个-您只需要在您已经创建的http服务器上调用.listen()

这篇关于客户端找不到&qot;socket.io.js文件(&Q;)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆