0

我正在尝试使用 node.js 和 jQuery 创建一个简单的聊天应用程序,但我在控制台中收到错误消息,提示“$ 未定义”。我正在关注一个教程,其中 authr 使用 jquery 没有问题。

我的chat.js(服务器):

var http = require('http'),
sys = require('sys'),
fs = require('fs'),
ws = require('./ws.js');


var clients = [];
http.createServer(function(req,res){
    res.writeHead(200,{
        'Content-Type': 'text/html'
    });
    var rs = fs.createReadStream(__dirname + '/test.html');
    sys.pump(rs, res);
}).listen(4000);

    ws.createServer(function(websocket){

    websocket.on('connect', function(resource){
        clients.push(websockets);
        websocket.write('Welcome');
    });

    websocket.on('data', function(data){
        clients.forEach(function(client){
            client.write(data);
        });
    });

    websocket.on('close',function(){
        var pos = clients.indexOf(websocket);
        if(pos >= 0){
            clients.splice(pos, 1);
        }
    });
}).listen(8081);

test.html(客户端):

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Untitled Document</title>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
    $(document).ready(function(e) {
        ws = new WebSocket("ws://localhost:8080");
        ws.onmessage = function(event){
            var data = data.replace(/&/g, "&amp;").replace(/</g,"&lt;").replace(/>/g,"&gt;");

            $('#log ul').append('<li>' + data + '</li>');
            }
    });
</script>
</head>

<body>
<div id="log"><ul></ul></div>
  <div id="console">
  <input type="text" id="entry"/>
  </div>
  </div>

</body>
</html>

在删除所有 .css 和其他 .js src 之前,我遇到了错误,所以我很确定问题出在服务器中的“Content-Type”代码上。

4

3 回答 3

1

在服务器端,您使用的代码非常旧。sys.pump已被弃用至少一年多。

我建议您阅读socket.io中的示例。示例中也恰好有一个聊天服务器。

于 2012-08-08T16:56:49.057 回答
1

谁在为您的静态文件提供服务?从您拥有的代码来看,您提供的唯一静态文件似乎是 HTML 页面。

您需要添加一些代码来处理特定位置的所有静态文件。基本上,您需要处理您的所有静态文件

http.createServer(function() {...}) 

请参阅:http ://www.sitepoint.com/serving-static-files-with-node-js/

于 2012-08-08T16:58:43.967 回答
1

我怀疑问题是您没有从服务器提供 jquery-1.7.2.min.js,因此网页没有加载 jquery,因此没有 $。首先,尝试引用托管的 jquery 并查看是否可以解决您的问题。

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script>

虽然与您的问题不完全相关,但如果您正在构建一个公共网站,那么引用托管 jquery(和其他库)通常是一个好主意,因为您的用户可能已经有一个本地缓存的副本(感谢其他站点)一样的东西)。请参阅http://encosia.com/3-reasons-why-you-should-let-google-host-jquery-for-you/以获得对此的合理解释。

不过,一般来说,您会想要提供一些静态文件:您自己的 css 和 js、图像等。有 -很多-帖子-描述如何使用节点进行此操作,但您可能希望查看这样的专用模块:https ://github.com/cloudhead/node-static

于 2012-08-08T17:01:24.500 回答