HTML <script> crossorigin 속성

HTML <script> 태그

정의와 사용법

crossorigin 속성은 요청 패턴을 HTTP CORS 요청으로 설정합니다.

웹 페이지는 종종 다른 서버에 있는 리소스를 로드하기 위해 요청을 발신합니다. 이곳에서 CORS가 작용합니다.

크로스도메인 요청은 다른 도메인에서 온 리소스(예: 스타일시트, iframe, 이미지, 글꼴, 스크립트)에 대한 요청입니다.

CORS는 크로스도메인 요청을 관리합니다.

CORS는 크로스도메인 리소스 공유(Cross-Origin Resource Sharing)라는 기계로, 자신의 도메인 이외의 다른 도메인에서 웹 페이지의 리소스를 요청할 수 있게 합니다. 이는 브라우저와 서버가 어떻게 상호작용할지 정의하며, 크로스원천 요청이 안전한지 결정하는 방식을 정의합니다. CORS는 서버가 자신의 리소스에 접근할 수 있는 사람을 지정하고 다른 많은 기능도 제공합니다.

안내:크로스도메인 요청과 반대로는 동원 요청입니다. 이는 웹 페이지가 동일한 서버에 있는 다른 문서와만 상호작용할 수 있다는 것을 의미합니다. 이 전략은 상호작용하는 문서가 동일한 원천(도메인)을 가지도록 강제합니다.

안내:참조로 integrity 속성。

예시

다른 서버에 있는 .js 파일 링크입니다. 여기서 integrity와 crossorigin 속성을 동시에 사용했습니다：

<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
crossorigin="anonymous">
</script>

문법

<script crossorigin="anonymous|use-credentials">

속성 값

값 설명
  • anonymous
  • use-credentials

CORS 요청 패턴을 정의합니다:

  • anonymous - 콕스(콜사스) 요청을 실행합니다. 증빙서류를 전송하지 않습니다.
  • use-credentials - 콕스(콜사스) 요청을 실행합니다. 증빙서류(예: 쿠키, 인증서, HTTP 기본 인증)를 전송합니다.

브라우저 지원

표의 숫자는 이 속성을 최초로 완전히 지원하는 브라우저 버전을 나타냅니다.

크롬 에지 파이어폭스 사파리 오페라
크롬 에지 파이어폭스 사파리 오페라
30.0 18.0 13.0 13.0 12.1

HTML <script> 태그