MIME 유형 ( 'text / html') [닫힘]으로 인해 'http : // localhost : 3000 / style.css'의 스타일 적용을 거부했습니다.

Dec 20 2020

클라이언트 서버 JS 애플리케이션을 실행할 때이 오류가 발생합니다.

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.

클라이언트 코드 :

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});

서버 코드 :

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)

 }

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>

해결책을 찾는 데 도움이 될 몇 가지 링크, 조언 또는 포인터를 제공해 주시겠습니까?

이상한 점은 CSS 파일이 없다는 것입니다.

이미이 게시물을 검토했으며 제 경우에 도움이되지 않았습니다. Chrome 오류 콘솔 : MIME 유형 ( 'text / html') 때문에 스타일 적용 거부

답변

1 Wyck Dec 20 2020 at 08:15

다음을 지정했습니다.

<link rel="stylesheet" href="style.css">

그러나 style.css 파일 이 없습니다 . 에 대한 요청으로 http://localhost:3000/style.css인해 404 오류가 발생했으며 서버에서 HTML 응답을 제공했습니다 (mimetype은 text/html). 오류는 모든 것을 말합니다.

http://localhost:3000/style.cssMIME 유형 ( 'text / html')이 지원되는 스타일 시트 MIME 유형이 아니고 엄격한 MIME 검사가 사용 가능하므로 ' '의 스타일 적용을 거부했습니다 .

문제를 해결하려면 전체 URL 을 사용하여 실제 style.css 에 링크하거나 해당 style.css 리소스가 어디에도 없는 경우 스타일 시트 링크를 완전히 제거하십시오 .