问题与服务静态文件与socket.io

我正在创build一个Web应用程序，用户可以login（密码/用户名）。 login后，他可以select2个可用的应用程序之一。 第一个应用程序使用客户端和服务器之间的http连接。 第二个使用web套接字。 所以当用户点击第二个应用时，应该build立一个websocket。 我的第一个应用程序工作正常，也是第二个，但是当我把所有的一起。 我有个问题。

这是我迄今为止所做的：

server.js

var app = express(); var server = http.createServer(app, function(req, res) { //serves static files //processes GET and POST requests of both the login page and the 1st app } server.listen(80, function() { console.log("Server listening on port 80."); }); app.configure(function () { app.use(express.cookieParser()); app.use(express.session({secret: 'secret', key: 'express.sid'})); }); app.get('/', function (req, res) { var filePath = '../client/index.html'; if (filePath){ var absPath = './' + filePath; serveStatic(res, cache, absPath); //function that serves static files } }); io = io.listen(server); io.set('authorization', function (handshakeData, accept) { //code }); io.sockets.on('connection', function(socket) { console.log('Client connected.'); }); 

的index.html

  <script src="../third-party/jquery-1.9.1.min.js"></script> <script src="/socket.io/socket.io.js"></script> <script> $(document).ready(function() { tick = io.connect(); tick.on('data', function (data) { console.log(data); }); tick.on('error', function (reason){ console.error('Unable to connect Socket.IO', reason); }); tick.on('connect', function (){ console.info('successfully established a working and authorized connection'); }); }); </script> 

在客户端，我使用jQuery。

当我连接到我的本地主机，我得到login页面，并在铬debugging工具的错误消息说：$是未定义的（在index.html）， GET http://localhost/third-party/jquery-1.9.1.min.js 404 (Not Found)

这是我的应用程序的体系结构：

 - server - server.js -client -index.html (login page) -firstApp -index.html -secondApp (uses websocket) -index.html - third-party -jquery-1.9.1.min.js 

我相信，我没有以正确的方式提供静态文件。 虽然，在将websocket添加到我的代码之前，我没有任何问题。 我不明白的是当我login下的东西

 var server = http.createServer(app, function(req, res) { console.log('TEST') }); 

控制台上没有显示任何内容。 这里是如何提供静态文件的function：

 function sendFile(res, filePath, fileContents) { res.writeHead(200, {"content-type": mime.lookup(path.basename(filePath))}); res.end(fileContents); } function serveStatic(res, cache, absPath) { //checks if file is cached in memory if (cache[absPath]) { sendFile(res, absPath, cache[absPath]); //serves file from memory }else { fs.exists(absPath, function(exists) { //checks if file exists if (exists) { fs.readFile(absPath, function(err, data) { //reads file from disk if (err) { }else { cache[absPath] = data; sendFile(res, absPath, data); //serves file from disk } }); }else { console.log('cannot find the file') send404(res); } }); } } 

Answer 1

只需添加

app.use( express.static(__dirname+'../client') );

到你的中间件链，并从你的index.html文件中请求相对于客户端目录的文件，如下所示：

secondApp / index.html的

 <script src="/third-party/jquery-1.9.1.min.js"></script> <script src="/socket.io/socket.io.js"></script> 

express.static是connect.static的一个参考

恕我直言，请至less清理你的server.js代码

 var app = express() , server = http.createServer(app) , io = io.listen(server) ; app.configure(function () { app.use( express.cookieParser() ); app.use( express.session({secret: 'secret', key: 'express.sid'}) ); app.use( app.router ) app.use( express.static(__dirname+'../client') ); }); app.get('/', function (req, res) { res.sendFile( __dirname+'../client/index.html' ) }); app.get('/whatever/url/path/you/want', function (req, res) { // this will match GET requests to /whatever/url/path/you/want }); app.get('*', function (req, res) { // this will match GET requests to any path // take care if you use middlewares after app.router as here }); app.post('/whatever/url/path/you/want', function (req, res) { // this will match POST requests to /whatever/url/path/you/want }); app.post('*', function (req, res) { // this will match POST requests to any path }); io.set('authorization', function (handshakeData, accept) { }); io.sockets.on('connection', function(socket) { console.log('Client connected.'); }); server.listen(80, function() { console.log("Server listening on port 80."); }); 

警告：以上是不是最好的代码写的最干净

看看http.createServer文档

它只接受1个侦听器来进行resquest。 你可以注册2个监听器，但是因为你使用了express，所以最好的方法是使用它的特性，参见上面的例子server.js中的例子代码

你不需要你提到的serveStatic函数

express.static将足够你。

边注

您不需要在客户端的$.ready下面打包io.connect