[javascript] MIME 유형 불일치로 인해 리소스가 차단됨 (X-Content-Type-Options : nosniff)

Program / 글쓴이

JavaScript 및 HTML을 사용하여 웹 페이지를 개발 중입니다. HTML 페이지에서 다음 오류 목록을 받았을 때 모든 것이 잘 작동했습니다.

The resource from “https://raw.githubusercontent.com/dataarts/dat.gui/master/build/dat.gui.min.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/CanvasRenderer.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/master/examples/js/renderers/Projector.js”
  was blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).
The resource from “https://raw.githubusercontent.com/mrdoob/three.js/dev/build/three.js” was
  blocked due to MIME type mismatch (X-Content-Type-Options: nosniff).

이러한 오류는 자동 브라우저 업데이트 (Mozilla Firefox) 후에 나타 났으며 설정에서 변경된 것일 수 있습니다. 이 문제를 해결할 방법을 알고 있습니까?

답변

파일 경로가 정확하고 파일이 존재하는지 확인하십시오. 제 경우에는 문제가있었습니다. 제가 고쳤을 때 오류가 사라졌습니다.

답변

URL을 변경하면 문제를 해결할 수 있습니다. 예 :

https://raw.githubusercontent.com/svnpenn/bm/master/yt-dl/yt-dl.js
Content-Type: text/plain; charset=utf-8

좋은 예 :

https://cdn.rawgit.com/svnpenn/bm/master/yt-dl/yt-dl.js
content-type: application/javascript;charset=utf-8

rawgit.com 은 github 용 캐싱 프록시 서비스입니다. 거기에 가서 원래 raw.githubusercontent.com URL에 해당하는 URL을 대화식으로 파생시킬 수도 있습니다 . FAQ 보기

답변

devops 팀이 .NET Framework를 추가하여 웹 서버 구성을 변경 한 후 프로덕션에서이 오류가 발생하기 시작했습니다 X-Content-Type-Options: nosniff. 이로 인해 브라우저는 content-type응답 헤더의 매개 변수 에서 언급 한대로 리소스를 해석해야했습니다 .

이제 처음부터 애플리케이션 서버는 js 파일의 콘텐츠 유형을 text/plain. X-Content-Type-Options: nosniff는 웹 서버에 설정되지 않았기 때문에 콘텐츠 유형이 text / plain으로 언급되었지만 브라우저는 js 파일을 JavaScript 파일로 자동 해석했습니다. 이를 MIME 스니핑이라고합니다. 이제 X-Content-Type-Options : nosniff를 설정 한 후 브라우저는 MIME 스니핑을 수행하지 않고 응답 헤더에 언급 된대로 콘텐츠 유형을 취해야합니다. 이로 인해 js 파일을 일반 텍스트 파일로 해석하고 실행을 거부하거나 차단했습니다. 오류에도 동일하게 표시됩니다.

해결책 : 서버 content-type가 JS 파일을 다음과 같이 설정하도록하는 것 입니다.

application/javascript;charset=utf-8

이렇게하면 모든 JS 파일이 정상적으로로드되고 문제가 해결됩니다.

답변

경로를 확인하십시오.이 오류는 파일이 주어진 경로에 존재하지 않으면 발생합니다.

답변

Express를 사용하고 있습니까?

경로를 확인하십시오 ( // public / 뒤 의 ” “에 유의하십시오 ) :

app.use(express.static(__dirname + "/public/"));

// 참고 : 위에 이미 포함되어 있으므로 “css”앞에 “/”가 필요하지 않습니다.

rel="stylesheet" href="css/style.css

도움이 되었기를 바랍니다

답변

WordPress 용

제 경우에는 get_template_directory_uri () 뒤에 슬래시 “/”를 놓쳤으므로 결과 / 생성 된 경로가 잘못되었습니다.

My Wrong code :

wp_enqueue_script( 'retina-js', get_template_directory_uri().'js/retina.min.js' );

내 수정 된 코드 :

wp_enqueue_script( 'retina-js', get_template_directory_uri().'/js/retina.min.js' );

답변

브라우저가 파일에 액세스 할 수 없기 때문일 수 있습니다. node.js로 응용 프로그램을 만들 때 이러한 유형의 오류가 발생했습니다. 스크립트 파일 (URL 복사 및 붙여 넣기)을 직접 요청하고 검색 할 수 있는지 확인할 수 있습니다. 그러면 진짜 문제가 무엇인지 알 수 있습니다. 파일이있는 폴더의 권한 때문이거나 브라우저가 잘못된 경로로 인해 파일을 찾을 수 없기 때문일 수 있습니다. node.js에서 파일에 대한 경로를 지정한 후 모두 작동합니다.