javascript 中的 Socket.io 给出 NOT_RESOLVED 错误答案

【问题标题】：Socket.io in javascript gives NOT_RESOLVED errorjavascript 中的 Socket.io 给出 NOT_RESOLVED 错误
【发布时间】：2019-03-30 11:44:42
【问题描述】：

我需要将 HTML 网站连接到节点服务器聊天应用程序。 HTML客户端有一些HTML文件和javascript文件。我需要使用javascript连接socket.io聊天服务器。所以需要在javascript里面初始化socket.io端口。

我已经使用 javascript 在 node.js 中创建了 socket.io 聊天服务器，它工作正常。我需要使用 javascript 客户端站点调用该节点服务器。它应该初始化并连接套接字服务器。它应该能够从服务器站点发出和接收消息。

我有一个运行良好的 socket.io 后端服务。因为我用 nodeJS 客户端应用程序测试它。但我需要它来使用不是 nodeJS 的现有 HTML 网站

我在谷歌上搜索过，找不到任何关于使用 javascript 文件连接 sockt.io 的网站。所有教程都使用nodeJS。

当我使用时

var io = require('socket.io').listen(server);

在 javascript 文件中并在浏览器中打开 HTML 页面，它会引发错误。

这是我的代码，我是从互联网上得到的，我试图连接这个实现我的真实代码。

<!DOCTYPE html>
<html>

<head>
    <link href="style.css" rel="stylesheet">
    <script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
    <script src="/socket.io/socket.io.js"></script>
    <script>
        // socket.io specific code
        var socket = io.connect('http://localhost:8000');

        socket.on('connect', function () {
            $('#chat').addClass('connected');
        });

        socket.on('announcement', function (msg) {
            $('#lines').append($('<p>').append($('<em>').text(msg)));
        });

        socket.on('nicknames', function (nicknames) {
            $('#nicknames').empty().append($('<span>Online: </span>'));
            for (var i in nicknames) {
                $('#nicknames').append($('<b>').text(nicknames[i]));
            }
        });

        socket.on('user message', message);
        socket.on('reconnect', function () {
            $('#lines').remove();
            message('System', 'Reconnected to the server');
        });

        socket.on('reconnecting', function () {
            message('System', 'Attempting to re-connect to the server');
        });

        socket.on('error', function (e) {
            message('System', e ? e : 'A unknown error occurred');
        });

        function message(from, msg) {
            $('#lines').append($('<p>').append($('<b>').text(from), msg));
        }

        // dom manipulation
        $(function () {
            $('#set-nickname').submit(function (ev) {
                socket.emit('nickname', $('#nick').val(), function (set) {
                    if (!set) {
                        clear();
                        return $('#chat').addClass('nickname-set');
                    }
                    $('#nickname-err').css('visibility', 'visible');
                });
                return false;
            });

            $('#send-message').submit(function () {
                message('me', $('#message').val());
                socket.emit('user message', $('#message').val());
                clear();
                $('#lines').get(0).scrollTop = 10000000;
                return false;
            });

            function clear() {
                $('#message').val('').focus();
            };
        });
    </script>
</head>

<body>
    <div id="chat">
        <div id="nickname">
            <form id="set-nickname" class="wrap">
                <p>Please type in your nickname and press enter.</p>
                <input id="nick">
                <p id="nickname-err">Nickname already in use</p>
            </form>
        </div>
        <div id="connecting">
            <div class="wrap">Connecting to socket.io server</div>
        </div>
        <div id="messages">
            <div id="nicknames"></div>
            <div id="lines"></div>
        </div>
        <form id="send-message">
            <input id="message">
            <button>Send</button>
        </form>
    </div>
</body>

</html>

前端出错：

未捕获的引用错误：io 未定义
在chat-footer.html:10

这是我的文件夹结构：

【问题讨论】：

能否请您告诉我们错误。
另外，您能否向我们展示您的完整代码。
我已经用我的代码更新了问题。
能否提供后台代码。
也许可以参考这个问题获取一些后端代码：stackoverflow.com/questions/9914816/…

标签： javascript socket.io

【解决方案1】：

var io = require('socket.io').listen(server); 应该在服务器端。 var socket=io(); 应该在客户端 javascript 中。如果您将var io 放在客户端，那么您会收到错误消息。另外，您需要在 HTML 的<head> 标记中链接套接字 io 库：<script src='/socket.io/socket.io.js'></script>。如果您没有链接库，io() 函数将不起作用。我希望这能解决您的问题。

更新

根据您的代码。您从未定义过 io(); 函数。你在前端继续说var socket = io.connect()。你从来没有说过io 是什么。应该是命名一个不同的变量var socket = io();，然后使用var connector = io.connect()。

第二次更新 如果没有从 nodejs 后端提供 html 页面，您将无法使用 socketio，因为它没有连接到服务器。您需要从后端提供 html 页面并在同一后端服务器上使用 socketio。

【讨论】：

我已经用我的代码更新了问题。我用过。在 html 页面中。但它不起作用。
var socket = io();我刚才放了它并测试它仍然无法正常工作。因为它只是一个目录中的 HTML 页面，而不是 nodeJS 项目。
如果你不初始化socketio服务器，那么你将无法在前端使用socketio。
是的，我有一个运行良好的 socket.io 后端服务。因为我用 nodeJS 客户端应用程序测试它。但是我需要它来使用现有的 HTML 网站，这不是 nodeJS
我已经把这个参考线放了。 <script src="http://localhost:3000/socket.io/socket.io.js"></script> 现在它;s givin GET http://file/socket.io/?EIO=3&transport=polling&t=MQiqHgz net::ERR_NAME_NOT_RESOLVED

【解决方案2】：

我已经解决了这个错误。原因是我不能直接添加 socket.io 引用，因为它是 nodeJS 脚本。所以我从 nodeJS 服务库中添加了 socket.io.js。通过添加，我的 HTML 页面将直接引用正在运行的 nodeJS 服务器 socket.io.js 文件。

这是我连接socket.io nodeJS服务器的完整代码。

<!DOCTYPE html>
<html>
<head>
    <script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
    <script src="http://localhost:8000/socket.io/socket.io.js"></script> // add this line
    <script>
        var socket = io.connect('http://localhost:8000'); 

        socket.on('connect', function () {
            $('#chat').addClass('connected');
        });

        socket.on('announcement', function (msg) {
            $('#lines').append($('<p>').append($('<em>').text(msg)));
        });

        socket.on('nicknames', function (nicknames) {
            $('#nicknames').empty().append($('<span>Online: </span>'));
            for (var i in nicknames) {
                $('#nicknames').append($('<b>').text(nicknames[i]));
            }
        });

        socket.on('user message', message);
        socket.on('reconnect', function () {
            $('#lines').remove();
            message('System', 'Reconnected to the server');
        });

        socket.on('reconnecting', function () {
            message('System', 'Attempting to re-connect to the server');
        });

        socket.on('error', function (e) {
            message('System', e ? e : 'A unknown error occurred');
        });

        function message(from, msg) {
            $('#lines').append($('<p>').append($('<b>').text(from), msg));
        }

        // dom manipulation
        $(function () {
            $('#set-nickname').submit(function (ev) {
                socket.emit('nickname', $('#nick').val(), function (set) {
                    if (!set) {
                        clear();
                        return $('#chat').addClass('nickname-set');
                    }
                    $('#nickname-err').css('visibility', 'visible');
                });
                return false;
            });

            $('#send-message').submit(function () {
                message('me', $('#message').val());
                socket.emit('user message', $('#message').val());
                clear();
                $('#lines').get(0).scrollTop = 10000000;
                return false;
            });

            function clear() {
                $('#message').val('').focus();
            };
        });
    </script>
</head>

<body>
    <div id="chat">
        <div id="nickname">
            <form id="set-nickname" class="wrap">
                <p>Please type in your nickname and press enter.</p>
                <input id="nick">
                <p id="nickname-err">Nickname already in use</p>
            </form>
        </div>
        <div id="connecting">
            <div class="wrap">Connecting to socket.io server</div>
        </div>
        <div id="messages">
            <div id="nicknames"></div>
            <div id="lines"></div>
        </div>
        <form id="send-message">
            <input id="message">
            <button>Send</button>
        </form>
    </div>
</body>

</html>

【讨论】：