如何在浏览器中使用websocket npm库？

Question

我开始学习node.js. 我想使用websockets创建一个聊天应用程序.在控制台中,它工作正常.但是在浏览器中我得到了

未捕获的ReferenceError:未定义require

我用Google搜索并看到了这个答案.我想尝试浏览,但它不能正常工作.这是我的js文件

client.js:

var WebSocket = require('websocket');
var connector;
var WebSocketClient = WebSocket.client;
var client = new WebSocketClient();


client.on('connectFailed', function (error) {
    console.log('Connect Error: ' + error.toString());
    setTimeout(self.connect, 2000);
});

client.on('connect', function (connection) {
    connector = connection;
    console.log('WebSocket Client Connected');
    connection.on('error', function (error) {
        errorStr = error.toString();
        console.log("Connection Error: " + errorStr);
    });
    connection.on('close', function () {
        console.log('echo-protocol Connection Closed');
    });
    connection.on('message', function (message) {
        if (message.type === 'utf8') {
            console.log("Received: '" + message.utf8Data + "'");
        }
    });
    connection.sendUTF("Hello");
    sender("Working");

});

client.on('error', function (err) {
    console.log("It's an Err " + err.toString());
});

function connect() {
    client.connect('ws://localhost:8765/', 'echo-protocol');
}

function sender(str) {
    connector.sendUTF(str);
}
connect();

这是问题所在.当我运行bunddle.js.

$ browserify  client.js > bunddle.js
$ node bunddle.js
/home/user/udb/sgg/node/chat/bundle.js:5
var client = new WebSocketClient();
             ^
TypeError: undefined is not a function

Answer 1

websocket您正在使用的库涉及一些本机C++绑定.这些与browserify不兼容,因此您无法使用它.您应该仅在服务器实现中使用该库,并且在浏览器中运行的client.js中应该使用该WebSocket对象.

浏览器提供自己的WebSocket对象.websocket您正在使用的NPM包是浏览器标准WebSocket接口的Node.js实现(好吧,websocket.W3CWebSocket无论如何都是类).

基本上在浏览器中你不应该require('websocket')或者类似浏览器已经为你提供了WebSocket.有关在浏览器中使用WebSockets的示例,请参阅MDN示例.

当然,鉴于WebSockets提供了两个端点之间的通信方法,您将需要一个与您的浏览器进行通信的端点.这是您需要一个包的地方websocket:实现浏览器与之通信的服务器端端点.