【问题标题】:Socket.io - socket.io.js not availableSocket.io - socket.io.js 不可用
【发布时间】:2021-02-27 15:12:39
【问题描述】:

我需要一个使用 python 运行的 socket.io 服务器。 我按照这个例子:

https://tutorialedge.net/python/python-socket-io-tutorial/

最终文件如下:

<!-- 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>Document</title>
</head>

<body>
    <button onClick="sendMsg()">Hit Me</button>
    <!--WORKS:-->
    <!--<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.2.0/socket.io.js"></script>-->
    <!-- DOESNT WORK:-->
    <script src="http://localhost:8080/socket.io/socket.io.js"></script>
    <script>
        const socket = io("http://localhost:8080");

        function sendMsg() {
            socket.emit("message", "HELLO WORLD");
        }

        socket.on("message", function(data) {
            console.log(data);
        });
    </script>
</body>
</html>

server.py

​​>
    from aiohttp import web
    import socketio
            
    sio = socketio.AsyncServer()
    app = web.Application()
    sio.attach(app)        

    async def index(request):
        with open('index.html') as f:
            return web.Response(text=f.read(), content_type='text/html')        
   
    @sio.on('message')
    async def print_message(sid, message):           
        print("Socket ID-: " , sid)
        print(message)            
        await sio.emit('message', message[::-1])        
    
    app.router.add_get('/', index)        
   
    if __name__ == '__main__':
        web.run_app(app)

这只是复制粘贴,因此工作正常,但我不想使用来自某些在线资源的脚本。因此,我尝试通过注释掉正在运行的版本并将其替换为使用本地 socket.io.js 的版本来修改脚本的 src。 由于我没有在我的机器上找到脚本,我发现了以下问题,这两个问题都没有帮助我解决我的问题:

node-js-socket-io-socket-io-js-not-found

socket-io-not-being-served-by-node-js-server

无论我做什么,我的浏览器都会出现以下错误:

GET http://localhost:8080/node_modules/socket.io/socket.io.js net::ERR_ABORTED 404(未找到)

(index):18 Uncaught ReferenceError: io is not defined 在(索引):18 (匿名)@(索引):18

根据我从 2 个链接线程的理解,我的服务器应该在服务器上调用 listen 时提供 socket.io/socket.io.js。 不幸的是,我的情况并没有发生这种情况。

我通过 pip 安装了 socket.io,我还按照建议尝试了 npm install socket.io --save,这给了我一个新文件夹“node_modules”,但是将脚本的 src 修改为:

<script src="http://localhost:8080/node_modules/socket.io/socket.io.js"></script>

也无济于事。

出于某种原因,使用 cdnjs 中的 fie 可以正常工作(请参阅我的 index.html)。

如果有人能帮我解决这个问题,我会很高兴。

干杯 克里斯

【问题讨论】:

    标签: javascript python socket.io


    【解决方案1】:

    我从未使用过 AIOHTTP(一直使用 flask-socketio),所以我使用文档进行了一些研究。事实证明,与许多 http 服务器一样,AIOHTTP 并不提供开箱即用的静态文件。
    因此,您需要使用 add_static 方法 (doc here) 来处理它。
    (请注意,如果您想将此应用程序部署到生产环境,最好使用像 Apache 或 Nginx 这样的 HTTP 服务器)。
    只需在您的路线声明下添加这一行。

    app.router.add_static('/static/', path='static/')
    

    现在您需要在项目的根目录中创建一个static 文件夹,并将您的socket.io.js 文件放入其中。 确保 socket.io.js 在 2.2 版本(与 CDN 版本相同)。您可以通过直接从您使用的 CDN URL 或使用 npm -i -s socket.io-client@2.2 下载此文件来获取此文件。然后您可以在node_modules/socket.io-client/dist 中找到socket.io.js 文件。

    您现在只需在 HTML 中使用 &lt;script src="/static/socket.io.js"&gt;&lt;/script&gt; 即可导入 socket.io。

    【讨论】:

    • 我还使用通过 xampp 提供的 apache 网络服务器进行了测试。不幸的是,这没有任何区别。我测试了你的建议,至少我现在得到了不同的错误: Uncaught DOMException: Failed to read the 'responseText' property from 'XMLHttpRequest': The value is only accessible if the object's 'responseType' is '' or 'text' (was '数组缓冲区')。在 Request.onLoad (localhost:8080/static/socket.io.js:3994:27) 在 XMLHttpRequest.xhr.onreadystatechange (localhost:8080/static/socket.io.js:3889:20)
    • 并且:DevTools 无法加载 SourceMap:无法为 localhost:8080/static/socket.io.js.map 加载内容:HTTP 错误:状态码 404,net::ERR_HTTP_RESPONSE_CODE_FAILURE
    • 我在尝试找到您问题的答案时遇到了同样的错误。你确定 socket.io.js 是 socket.io-client 的 2.2 版本吗?
    • 太棒了,乐于助人!源映射文件不是强制性的,有时只是对调试有用(更多 here)。如果您想消除此警告,您可以在静态文件夹中添加 socket.io.js.map(您可以使用相同的 CDN url 在末尾添加“.map”下载它)或编辑 socket.io.js 和删除最后一行# sourceMappingURL=socket.io.js.map
    • 很有趣,但是 socket.io.js 中的最后一行已经被注释掉了。我刚刚添加了 socket.io.js.map 并且警告按照您的建议消失了。我现在要研究你提供的链接,总是喜欢额外的信息。非常感谢。
    猜你喜欢
    • 2012-12-24
    • 2019-01-26
    • 2017-02-02
    • 2012-11-07
    • 2014-06-04
    • 2013-04-26
    • 2016-03-18
    • 2018-02-13
    • 2013-11-06
    相关资源
    最近更新 更多