Chrome说“资源解释为样式表,但是以MIME类型text / html传输” [英] Chrome says "Resource interpreted as Stylesheet but transferred with MIME type text/html"
问题描述
我正在尝试使用node.js(无快速)和socket.io建立简单聊天。问题在于Chrome在我的外部包含文件中停留在html文件中,导致这些文件永远不会包含在内。我包含一个ccs文件和三个JavaScript文件。正如在Stackoverflow上其他相关问题的答案中所建议的那样,我通过需要mime模块并使用 mime.lookup(url)
来检查我的文档的MIME类型, / HTML。我特别设置了返回的头文件到'Content-Type':'text / html'
,甚至可以将它设置为'text / css'和'text / javascript'无济于事。截至目前,我不知道接下来要做什么。请帮忙!
chat.html:
<!DOCTYPE HTML>
< html>
< head>
< title> CHAT< / title>
< meta http-equiv =content-typecontent =text / html; charset = UTF-8>
< link type =text / css =stylesheethref =css / style.css/> <! - Chrome抱怨的第一行 - >
< script type =text / javascriptsrc =http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js>< / script>
< script type =text / javascriptsrc =chatClient.js>< / script>
< / head>
< body>
< h1>这应该是聊天< / h1>
< / body>
< / html>
chatClient.js:
var socket = io.connect('http:// localhost');
var chatBox = document.createElement('div');
chatBox.id ='chatBox';
$ b socket.on('server',function(data){
console.log('Server says:',data.message);
socket。 emit('client',{clientMessage:'这就是我所要说的,现在!')};
});
chatServer.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);
函数处理程序(req,res){
fs.readFile(url,function(err,data){
if(err){
res.writeHead 500);
return res.end('Error loading chat');
}
res.setHeader('Content-Type',mimeType); //设置标题'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);
});
});
这是我绝对第一次在这里发帖,所以请让我知道,如果还有什么我应该包括帮助你解决这个问题。 $ c>在基于一个文件的初始化过程中发送,而不是根据您实际发送的文件进行设置。这将导致您可能发送的任何非HTML文件(例如CSS或JS文件)带有误导性的Content-Type标头。您需要在您的请求处理程序中检查 。
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!
chat.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:
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:
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.
You're setting mimeType
during initialization based on one file 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 inside your request handler.
这篇关于Chrome说“资源解释为样式表,但是以MIME类型text / html传输”的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!