`需要'socket.io-client.js'`不工作答案

【问题标题】：`require 'socket.io-client.js'` not working`需要'socket.io-client.js'`不工作
【发布时间】：2011-07-22 05:24:35
【问题描述】：

我能够在我自己的服务器上运行基本的 socket.io 服务器应用程序，并直接通过任何网络浏览器请求它（我尝试了 FF、chrome 和 IE7，它们都可以工作）。

现在，问题在于客户端示例代码对我不起作用，并且我在 chrome 的 javascript 控制台中收到以下错误：

"Uncaught ReferenceError: require is not defined" 参考socket.io.js中的这行代码： var client = require('socket.io-client');

这让我相信它无法识别 require 命令期间，这似乎很奇怪。其他一些事情 - 我有 apache 正在运行，因此将我的所有 socket.io 文件移动到我的 apache 目录 htdocs 中，以便通过 http 端口 80 访问，这些端口是使用 cygwin 和指南安装的：https://github.com/joyent/node/wiki/Building-node.js-on-Cygwin-(Windows)

socket.io 文件也安装在 Windows 中我的 c: 驱动器上的 cygwin 目录下，如果被 apache 访问，它们将无用。另一个花絮 - 我确实有一个 socket.io-client.js 文件，但是当我使用写字板打开它进行编辑时，它看起来已损坏，里面只有一行文本：<symlink>ÿþi

【问题讨论】：

标签： node.js socket.io

【解决方案1】：

require() 函数是 Node.js 的一个特性，仅适用于在服务器端运行的 Javascript。要在浏览器中包含文件，您必须使用常规方法：

<script src="/socket.io/socket.io.js"></script>

Node.js 通常以将 socket.io 服务器附加到 Web 服务器实例的方式设置，该实例也是 Node.js 服务器的一部分。直接取自socket.io "how to use" 页面的代码示例，这将在服务器端：

var app = require('http').createServer(handler)
  , io = require('socket.io').listen(app)
  , fs = require('fs')
app.listen(80);

如上使用，Node.js 是同时服务于网页静态部分的服务器，Node.js 服务器的地址是包含客户端脚本的参考。

另一个用例是静态 html 由您的主 Web 服务器提供服务，并且您尝试连接到可能位于另一个地址或另一个端口或两者中的 Node.js 实例。您的主 Web 服务器不提供 Socket.io.js。它由运行在 Node.js 服务器上的 socket.io 直接提供服务。您必须向客户端浏览器提供 Node.js 服务器地址才能获取 socket.io 客户端 Javascript 文件，如下所示：

<script src="http://nodejs.address:port/socket.io/socket.io.js"></script>

<script>
  var socket = io.connect('http://nodejs.address:port');
  socket.on('news', function (data) {
    console.log(data);
    socket.emit('my other event', { my: 'data' });
});
</script>

附带说明，有提供 require() 函数的客户端 javascript 库，请查看Javascript require on client side

【讨论】：

直到在这里看到您的帖子，我才意识到 socket.io.js 是由 Node.js 服务器提供的（而不是本地资源）。当我引用本地 socket.io.js 时，我想弄清楚为什么会出现语法错误，以及为什么目录结构与文档不匹配……无论如何，谢谢你在这里说清楚！跨度>

【解决方案2】：

您可以使用 Browserify (http://browserify.org) 或 WebPack (http://webpack.github.io) 在客户端使用类似节点的 CommonJS 要求。

【讨论】：

【解决方案3】：

我使用 browserify 来管理浏览器端代码的所有 require() 资源。

也就是说，我可以通过以下方式在我的浏览器端代码中使用 socket.io-client：

var io = require('socket.io-client');
var $ = require('jquery');

var socket = io();
$('form').submit(function(){
    socket.emit('chat message', $('#m').val());
    $('#m').val('');
    return false;
});
socket.on('chat message', function(msg){
    $('#messages').append($('&lt;li&gt;').text(msg));
});

与使用 socket.io 的 github 示例中的传统脚本标记格式的以下 sn-p 不同：https://github.com/rauchg/chat-example/blob/master/index.html

<script src="https://cdn.socket.io/socket.io-1.2.0.js"></script>
<script src="http://code.jquery.com/jquery-1.11.1.js"></script>
<script>
    var socket = io();
    $('form').submit(function(){
        socket.emit('chat message', $('#m').val());
        $('#m').val('');
        return false;
    });
    socket.on('chat message', function(msg){
        $('#messages').append($('<li>').text(msg));
    });
</script>

socket.io-client 可以通过以下方式在您的开发环境中作为节点模数下载：

npm install socket.io-client

【讨论】：