javascript - 从远程托管页面访问 soket.io 服务器

问题描述

我正在尝试从远程客户端访问托管在 heroku 上的 socket.io 服务器。我在我的电脑上运行的 xampp 上使用客户端托管站点。

客户端 JavaScript 存在问题const io = require("socket.io-client");

这会引发控制台错误：Uncaught ReferenceError: require is not defined at (index):28

大多数搜索此错误都会返回有关引用 socket.io.js 文件的问题。我使用了几种方法来引用脚本，我相信它们都可以抛出相同的错误。我知道它们有效，因为如果我查看源代码，请单击它加载的脚本。

该应用程序只是 socket.io 网站上的基本聊天入门示例，并进行了一些小改动。

客户端代码如下：

`
    <!DOCTYPE html>
    <html>
      <head>
        <title>Socket.IO chat</title>
        <link rel="stylesheet" href="css/main.css">
      </head>
      <body>
        <ul id="messages"></ul>
        <form id="form" action="">
            <div>
                <span id="user-typing"></span>
            </div>
          <input id="input" autocomplete="off" /><button>Send</button>
        </form>
    
        <div id="name-container">
            <span>Username: </span>
            <input type="text" id="username">
    
        </div>
        <!-- <script src="https://app-chat.herokuapp.com/socket.io/socket.io.js"></script> -->
        <script src="socket.js"></script>
     
        <script>
    
    
    
              const io = require("socket.io-client");
              const socket = io("https://app-chat.herokuapp.com/", {
                withCredentials: true,
                extraHeaders: {
                  "my-custom-header": "abcd"
                }
      });
            
            var username = "user" + Math.floor((Math.random() * 100000) + 1);
    
            var messages = document.getElementById('messages');
            var notice = document.getElementById('user-typing');
            var form = document.getElementById('form');
            var input = document.getElementById('input');
          
            form.addEventListener('submit', function(e) {
              e.preventDefault();
              if (input.value) {
                socket.emit('chat message', input.value);
                input.value = '';
              }
            });
    
            input.addEventListener('input', function (evt) {
                socket.emit('user typing', username);
            });
          
            socket.on('chat message', function(msg) {
              var item = document.createElement('li');
              username = document.getElementById("username").value;
              item.innerHTML = "<b>" + username + "</b>" + ": " + msg;
              messages.appendChild(item);
              window.scrollTo(0, document.body.scrollHeight);
            });
    
            socket.on('user typing', function(msg) {
              notice.innerHTML = msg + " is typing a message";
            });
          </script>
    
      </body>
    </html>

标签： javascriptnode.jsexpresssocketssocket.io

javascript - 从远程托管页面访问 soket.io 服务器 - 需要未定义

问题描述

解决方案

推荐阅读