javascript Chrome 显示“资源被解释为样式表，但使用 MIME 类型 text/html 传输”
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12641168/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Chrome says "Resource interpreted as Stylesheet but transferred with MIME type text/html"
提问by readyruncode
I'm trying to set up a simple chat using node.js (no express) and socket.io. Problem is that Chrome gets stuck on my external includes in the html file, resulting in those files never getting included. I'm including a ccs file, and three javascript files. As suggested in answers to other related questions here on Stackoverflow, I checked my document's MIME type by requiring the mime module and using the mime.lookup(url), which says 'text/html'. I specifically set the returning header to 'Content-Type' : 'text/html'and even played around with setting it as 'text/css' and 'text/javascript' to no avail. As of now I have no idea what to try next. Please help!
我正在尝试使用 node.js（无快递）和 socket.io 建立一个简单的聊天。问题是 Chrome 卡在我的 html 文件中的外部包含上，导致这些文件永远不会被包含在内。我包括一个 ccs 文件和三个 javascript 文件。正如 Stackoverflow 上其他相关问题的答案中所建议的那样，我通过要求 mime 模块并使用mime.lookup(url)'text/html' 来检查我的文档的 MIME 类型。我专门将返回的标题设置为'Content-Type' : 'text/html'，甚至将其设置为“text/css”和“text/javascript”都无济于事。到目前为止，我不知道接下来要尝试什么。请帮忙！
chat.html:
聊天.html：
<!DOCTYPE html>
<html>
<head>
<title>CHAT</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link type="text/css" rel="stylesheet" href="css/style.css" /> <!-- First line that Chrome complains about -->
<script type="text/javascript" src="/socket.io/socket.io.js"></script> <!-- Second line that Chrome complains about -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js"></script>
<script type="text/javascript" src="chatClient.js"></script>
</head>
<body>
<h1>this shall be a chat</h1>
</body>
</html>
chatClient.js:
聊天客户端.js：
var socket = io.connect('http://localhost');
var chatBox = document.createElement('div');
chatBox.id = 'chatBox';
socket.on('server', function (data) {
console.log('Server says: ', data.message);
socket.emit('client', { clientMessage : 'this is all I have to say, right now!' });
});
chatServer.js:
聊天服务器.js：
var app = require('http').createServer(handler),
io = require('socket.io').listen(app),
fs = require('fs'),
mime = require('mime');
var url = __dirname + '/chat.html';
var mimeType = mime.lookup(url);
console.log(mimeType);
app.listen(8080);
function handler (req, res) {
fs.readFile(url, function (err, data) {
if (err) {
res.writeHead(500);
return res.end('Error loading chat');
}
res.setHeader('Content-Type', mimeType); // Sets the header to 'text/html'
res.writeHead(200);
res.end(data);
});
}
io.sockets.on('connection', function (socket) {
console.log('CHAT ONLINE');
socket.emit('server', { message: 'hello world' });
socket.on('client', function (data) {
console.log('Client says: ', data.clientMessage);
});
});
This is my absolute first time posting here so please let me know if there's anything more I should have included to assist in your helping me with this problem.
这是我绝对第一次在这里发帖，所以请让我知道是否还有更多我应该包含的内容来帮助您帮助我解决这个问题。
回答by ebohlman
You're setting mimeTypeduring initialization based on onefile that you might be sending out, rather than setting it based on the file that you're actually sending out. That will cause any non-HTML files that you might send (e.g CSS or JS files) to go out with a misleading Content-Type header. You need to do the check insideyour request handler.
您mimeType在初始化期间根据您可能发送的一个文件进行设置，而不是根据您实际发送的文件进行设置。这将导致您可能发送的任何非 HTML 文件（例如 CSS 或 JS 文件）带有误导性的 Content-Type 标头。您需要在请求处理程序中进行检查。
回答by vinayr
This has been answered before socket.io and differents folders --- solution found
这已经在socket.io 和 differents 文件夹之前得到了回答--- 找到了解决方案
I recommend to use connect or express framework. Makes your job easier.
我建议使用 connect 或 express 框架。让您的工作更轻松。
