Refus d'appliquer le style de "http: // localhost: 3000 / style.css" car son type MIME ("text / html") [fermé]
J'ai cette erreur lorsque j'exécute mon application JS client-serveur
ERREUR DE CONSOLE DANS DevTools:
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.
CODE CLIENT:
const postData = async ( url = '', data = {})=>{
console.log(data);
const response = await fetch(url, {
method: 'POST',
credentials: 'same-origin',
headers: {
'Content-Type': 'application/json',
},
// Body data type must match "Content-Type" header
body: JSON.stringify(data),
});
try {
const newData = await response.json();
console.log(newData);
return newData;
}catch(error) {
console.log("error", error);
}
}
postData('/addMovie', {answer:42});
CODE SERVEUR:
const express = require('express')
const bodyParser = require('body-parser');
const app = express()
app.use(bodyParser.urlencoded({extended : false}));
app.use(bodyParser.json());
const cors = require('cors');
app.use(cors());
app.use(express.static('website'))
const port = 3000
app.listen(port, getServerPortInfo)
function getServerPortInfo() {
console.log("Server listening at port " + port)
}
const data = []
app.post('/addMovie', addMovie)
function addMovie (req, res){
console.log(req.body)
console.log("here")
data.push(req.body)
console.log(data)
res.send(data)
}
FICHIER HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Weather Journal</title>
<link href="https://fonts.googleapis.com/css?family=Oswald:400,600,700|Ranga:400,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<div>
<button id="generate" type = "submit"> Generate </button>
</div>
<script src="app.js" type="text/javascript"></script>
</body>
</html>
Pourriez-vous s'il vous plaît fournir des liens, des conseils ou des pointeurs qui pourraient m'aider à trouver une solution?
La chose étrange est que je n'ai pas de fichier css.
Veuillez noter que j'ai déjà parcouru ce post et que cela n'a pas aidé mon cas: Erreur de la console de Chrome: Refusé d'appliquer le style car son type MIME ('text / html')
Réponses
Vous avez spécifié:
<link rel="stylesheet" href="style.css">
Mais vous n'avez pas de fichier style.css . La demande de http://localhost:3000/style.css
a abouti à une erreur 404 et votre serveur a envoyé une réponse HTML (le type MIME est text/html
). L'erreur dit tout:
Refus d'appliquer le style à partir de «
http://localhost:3000/style.css
» car son type MIME («text / html») n'est pas un type MIME de feuille de style pris en charge et la vérification MIME stricte est activée.
Pour corriger le problème, créez un lien vers le fichier style.css réel avec une URL complète ou supprimez entièrement le lien de la feuille de style si aucune ressource style.css n'existe nulle part.
Vous devrez explicitement indiquer à votre application express de considérer le dossier comme statique pour conserver le type mime du fichier.
Quelque chose comme:
app.use(express.static("./"));