Từ chối áp dụng kiểu từ 'http: // localhost: 3000 / style.css' vì kiểu MIME ('text / html') [đã đóng]
Tôi gặp lỗi này khi chạy ứng dụng JS máy chủ khách hàng của mình
LỖI CONSOLE TRONG 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.
MÃ KHÁCH HÀNG:
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});
MÃ MÁY CHỦ:
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)
}
TẬP TIN 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>
Bạn có thể vui lòng cung cấp một số liên kết, lời khuyên hoặc gợi ý có thể giúp hướng tôi đến một giải pháp không?
Điều kỳ lạ là tôi không có tệp css.
Xin lưu ý rằng tôi đã xem qua bài đăng này và nó không giúp ích được gì cho trường hợp của tôi: Lỗi bảng điều khiển của Chrome: Từ chối áp dụng kiểu vì kiểu MIME của nó ('text / html')
Trả lời
Bạn đã chỉ định:
<link rel="stylesheet" href="style.css">
Nhưng bạn không có tệp style.css . Yêu cầu cho http://localhost:3000/style.cssđã dẫn đến lỗi 404 và máy chủ của bạn đã gửi phản hồi HTML (mimetype là text/html). Lỗi nói lên tất cả:
Từ chối áp dụng kiểu từ '
http://localhost:3000/style.css' vì kiểu MIME của nó ('text / html') không phải là kiểu MIME biểu định kiểu được hỗ trợ và tính năng kiểm tra MIME nghiêm ngặt được bật.
Để khắc phục sự cố, hãy liên kết đến style.css thực với một URL đầy đủ hoặc xóa hoàn toàn liên kết biểu định kiểu nếu không có tài nguyên style.css nào như vậy tồn tại ở bất kỳ đâu.
Bạn cần phải nói rõ ràng với ứng dụng express của mình rằng hãy coi thư mục là thư mục tĩnh để giữ lại kiểu kịch câm của tệp.
Cái gì đó như:
app.use(express.static("./"));