我正试图从远程客户端访问heroku上托管的socket.io服务器。我正在使用在我的电脑上运行的xampp上的客户端托管网站
客户端JavaScriptconst 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>
`
Require在浏览器中不存在。
要导入模块，你必须使用类似浏览的东西
或使用<script src='pathToFileOrCdn></script>使用socket.io 之前的任何位置