Question

我是socket.io的新手，我已经有了一个问题，我觉得很小。我已经正确安装了node.js，并使用npm安装了socket.io.然后只是为了测试我剪切并粘贴来自socket.io的代码示例，一切正常。现在，我想要修改我的代码和文件夹，并创建了一个文件夹“client”，用一个新的新js文件client.js和示例中的客户端代码。这是我的架构

/client
    client.js
index.html 
server.js

client.js：

var socket = io.connect('http://localhost:80');
  socket.on('news', function (data) {
    alert('sqd');
    console.log(data);
    socket.emit('my other event', { my: 'data' });
});

server.js

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

app.listen(80);

function handler (req, res) {
  fs.readFile(__dirname + '/index.html', 'utf-8',
  function (err, data) {
    if (err) {
      res.writeHead(500);
      return res.end('Error loading index.html ' + __dirname);
    }

    res.writeHead(200, {'Content-Type' : 'text/html'});
    res.end(data);
  });
}

io.sockets.on('connection', function (socket) {
  socket.emit('news', { hello: 'world' });
  socket.on('my other event', function (data) {
    console.log(data);
  });
});

的index.html

<!doctype html>
<html>
  <head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

    <title></title>

    <script type="text/javascript" src="/client/client.js"></script>
    <script type="text/javascript" src="/socket.io/socket.io.js"></script>

  </head>
  <body>
  </body>
</html>

当我在localhost刷新浏览器时：80我的client.js上有错误：

Uncaught SyntaxError: Unexpected token <
Resource interpreted as Script but transferred with MIME type text/html

似乎将我的js文件解释为js文件存在问题。我已经阅读了一些关于这个问题的线索，但没有任何作用。

你能帮帮我吗？

Thanx：）

好的，我找到了一个解决方案......你必须在静态网络服务器中为每个文件请求指定内容类型。可能它可以帮助某人。这是处理函数：

function handler (req, res) {

  var filePath = req.url;

  if (filePath == '/') {
      filePath = './client/index.html';
  } else {
      filePath = './client/lib' + req.url;
  }

  var extname = path.extname(filePath);
  var contentType = 'text/html';

  switch (extname) {
    case '.js':
        contentType = 'text/javascript';
        break;
    case '.css':
        contentType = 'text/css';
        break;
  }

  path.exists(filePath, function(exists) {

    if (exists) {
        fs.readFile(filePath, function(error, content) {
            if (error) {
                res.writeHead(500);
                res.end();
            }
            else {
                res.writeHead(200, { 'Content-Type': contentType });
                res.end(content, 'utf-8');
            }
        });
    }
    else {
        res.writeHead(404);
        res.end();
    }
  });
}

希望这可以帮助某人。我喜欢发布问题并在没有任何帮助的情况下自行回复。不知何故，我发现我的速度太快了。而且我喜欢在一篇文章中讲述我的生活:) 好吧，我要吃点东西喝更多的咖啡!!!

Answer 1

非常感谢你！这解决了我的问题!!然后我将开关更改为以下代码：

var extname = path.extname(filePath);
var contentTypesByExtention = {
  'html': 'text/html',
  'js':   'text/javascript',
  'css':  'text/css'
};
var contentType = contentTypesByExtention[extname] || 'text/plain';

维护起来可能更容易：）

Answer 2

只有这样才能解决：

function handler (request, response) {
    var file = __dirname + (request.url == '/' ? '/index.html' : request.url);
    fs.readFile(file, function(error, data) {
        if (error) {
            response.writeHead(500);
            return response.end('Error loading index.html');
        }
        response.writeHead(200);
        response.end(data, 'utf-8');
    });
}

Answer 3

这就是我需要的！谢谢！和我们将在

的顶部添加一个代码行

server.js

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

Answer 4

您也可以使用mime模块：

var mime = require('mime')
  , content_type = mime.lookup(filePath);

// handle the request here ...

response.setHeader('Content-Type', content_type);
response.writeHead(200);
response.end(data);

Answer 5

并且你必须将fs.readFile包装成一个闭包，否则一些文件（特别是最后一个文件）将被多次读取，而其他文件则根本不被读取。 contentType将不会按您的意愿设置。这是因为fs.readFile使用的回调策略。当html文件只加载一个外部文件时，问题不会出现，但是当外部文件（css，js，png）加载多个时，它将显示为我上面指出的。（我自己来到这里）

所以你的代码应该做如下改动：

;(function (filename, contentType) {

    fs.readFile(filename, function(err, file) {
        // do the left stuff here
    });

}(filename, contentType));

socket.io和differents文件夹---找到解决方案

5 个答案: