Chrome的控制台错误：拒绝应用样式，因为其MIME类型（'text / html'）
[英]The console of Chrome error : Refused to apply style because its MIME type ('text/html')
问题描述
I have an error when i run it on node server.js. 
在节点server.js上运行时出现错误。 The error says 错误说
Refused to apply style from ' http://localhost:3000/style.css ' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled. 拒绝从' http：// localhost：3000 / style.css '应用样式，因为它的MIME类型（'text / html'）不是受支持的样式表MIME类型，并且启用了严格的MIME检查。
this is the server.js file , the css file : style.css and the html file : adddpatient.html 这是server.js文件，css文件：style.css和html文件：adddpatient.html
require('./models/medecinmodel') require('./models/infirmiermodel') require('./models/patientmodel') var medecin= require('./models/medecinmodel') var infirmier= require('./models/infirmiermodel') var patient= require('./models/patientmodel') var express = require("express"); var app = express(); var port = 3000; var bodyParser = require('body-parser'); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended: true })); var mongoose = require('mongoose') var mongoDb = 'mongodb://127.0.0.1:27017/mydb1' ; mongoose.connect(mongoDb) ; mongoose.Promise= global.Promise ; var db =mongoose.connection ; db.on('error',console.error.bind(console , 'mongoDb connection error:')); app.listen(3000,function () { console.log("okkkk") }) app.get('/',function (req,res) { res.sendFile(__dirname + "/addpatient.html"); })
.topnav { background-color: #333; overflow: hidden; } /* Style the links inside the navigation bar */ .topnav a { float: left; color: #f2f2f2; text-align: center; padding: 14px 16px; text-decoration: none; font-size: 17px; } /* Change the color of links on hover */ .topnav a:hover { background-color: #ddd; color: black; } /* Add a color to the active/current link */ .topnav a.active { background-color: #4CAF50; color: white; } body { padding: 20px; } body:before, body:after { content: ""; position: fixed; z-index: 999; background: inherit; left: 0; right: 0; height: 20px; } body:before { top: 0; } body:after { bottom: 0; }
<!DOCTYPE html> <html> <link rel="stylesheet" href="style.css" type="text/css" /> <head> <style> form { /* Uniquement centrer le formulaire sur la page */ margin-left: 40%; margin-top: 1%; width: 700px; /* Encadré pour voir les limites du formulaire */ padding: 2em; border: 2px solid rgb(5, 61, 28); border-radius: 1em; } body { color:black; background-color:white; background-image:url(l.jpg); background-repeat:no-repeat; background-size: 100% } form div + div { margin-top: 1em; } label { /* Pour être sûrs que toutes les étiquettes ont même taille et sont correctement alignées */ display: inline-block; width: 140px; text-align: right; } input, textarea { /* Pour s'assurer que tous les champs texte ont la même police. Par défaut, les textarea ont une police monospace */ font: 1em sans-serif; width: 300px; box-sizing: border-box; border: 1px solid #999; } input:focus, textarea:focus { border-color: #000; } textarea { vertical-align: top; height: 5em; } .button { padding-left: 90px; /* même taille que les étiquettes */ } button { margin-left: .5em; } </style> </head> <body> <div class="topnav"> <a href="adddoctor.html" >Add Doctor</a> <a href="addnurse.html" >Add nurse</a> <a href="addpatient.html" >Add patient</a> </div> <form action="/ajouterpatient" method="GET"> <div> <label for="nom">ID </label> <input type="text" name="IDpat" placeholder=" Nom..." required></br> </br> <div> <div> <label for="nom">Nom </label> <input type="text" name="nompat" placeholder=" Nom..." required></br> </br> <div> <div> <label for="prenom">Prénom </label> <input type="text" name="prenompat" placeholder="Prenom..." required></br> </br> </div> <div> <label for="sexe">Sexe</label> <form> <SELECT name="sexe" size="1" required> <OPTION>femme <OPTION>homme </SELECT> </form></br> </br> </div> <div> <label for="CIN">CIN</label> <input type="text" name="CIN" placeholder=" CIN..." required></br> </br> </div> <div> <label for="date_naiss">Date de naissance</label> <input type="date" id="start" name="date_naiss" placeholder=" Date de naissance..." min="1949-01-01" max="1994-01-1" required></br> </br> </div> <div> <label for="adresse">Adresse </label> <input type="text" name="adresse" placeholder=" Adresse..." required></br></br> </div> <div> <label for="ville">Ville</label> <SELECT name="ville" size="1" required> <OPTION>Tunis <OPTION>Monastir <OPTION>Sousse <OPTION>Sfax <OPTION>Gabes </SELECT> </br> </br> </div> <div> <label for="Code_postal">Code postal</label> <input type="text" name="Code_Postal" placeholder=" Code postal..." required></br> </br> </div> <div> <label for="tel">Telephone</label> <input type="text" name="tel" placeholder="telephone..." required></br> </br> </div> <div> <label for="email">Email</label> <input type="email" name="email" placeholder="Entrer Email..." required></br> </br> </div> <div> <label for="nom_ass">Nom de l'assurance</label> <input type="text" name="nom_assurance" placeholder="Nom de l'assurance..." required></br> </br> </div> <div> <input type="submit" value="Ajouter" > </div> </body> </form> </html>
1 个解决方案
解决方案1
1 已采纳 2019-03-03 13:15:06
create a public folder and in server.js make entry 创建一个公共文件夹并在server.js中进行输入
app.use(express.static(path.join(__dirname, 'public')));
put your css file inside that public folder. 将您的css文件放在该公用文件夹中。 serve all the style-sheets or static assets from that folder only. 仅提供该文件夹中的所有样式表或静态资源。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.
相关问题
拒绝应用{filename}中的样式，因为它的MIME类型（'text / html'）不是受支持的样式表MIME类型 - Refused to apply style from {filename} because its MIME type ('text/html') is not a supported stylesheet MIME type
Django：拒绝从...应用样式，因为它的 MIME 类型（'text/html'）不是受支持的样式表 MIME 类型 - Django: Refused to apply style from ... because its MIME type ('text/html') is not a supported stylesheet MIME type
拒绝应用样式，因为它的 MIME 类型 ('text/html') 不是受支持的样式表 MIME 类型 - Refused to apply style because its MIME type ('text/html') is not a supported stylesheet MIME type
拒绝应用样式，因为它的 MIME 类型（'text/html'）不是受支持的样式表类型 - Refused to apply style because its MIME type ('text/html') is not a supported stylesheet type
拒绝应用“ <URL> '，因为它的MIME类型（'text / html'）不是受支持的样式表MIME类型，并且启用了严格的MIME检查 - Refused to apply style from '<URL>' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled
拒绝应用来自“xxx/style.css”的样式，因为它的 MIME 类型（“text/html”）不是受支持的样式表 MIME 类型 - Refused to apply style from 'xxx/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type
应用 css 样式时出现角度错误：拒绝从“路径”应用样式，因为其 MIME 类型（“文本/html”）不是受支持的样式表 MIME 类型 - Angular error when applying css style: Refused to apply style from 'path' because its MIME type ('text/html') is not a supported stylesheet MIME type
拒绝应用来自 'http://localhost:2000/cssFile/style.css' 的样式，因为它的 MIME 类型（'text/html'） - Refused to apply style from 'http://localhost:2000/cssFile/style.css' because its MIME type ('text/html')
拒绝从...应用样式，因为它的 MIME 类型 ('text/html') 不是受支持的样式表 MIME 类型，并且启用了严格的 MIME 检查 - Refused to apply style from... because its MIME type ('text/html') is not a supported style-sheet MIME type, and strict MIME checking is enabled
拒绝应用来自 'http://localhost:3000/css/style.css' 的样式，因为它的 MIME 类型 ('text/html') 不是受支持的样式表 MIME 类型 - Refused to apply style from 'http://localhost:3000/css/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type
相关标签