🤍 전 강의 25% 할인 중 🤍

2024년 상반기를 돌아보고 하반기에도 함께 성장해요!
인프런이 준비한 25% 할인 받으러 가기 >>

  • 카테고리

    질문 & 답변
  • 세부 분야

    풀스택

  • 해결 여부

    미해결

crossorigin 프로퍼티에 대해서 질문드립니다.

24.05.22 16:54 작성 24.05.22 17:22 수정 조회수 64

0

안녕하세요 잔재미코딩님.

섹션 6 가장 빠른 Vue와 Flask, 그리고 REST API 2 강의를 듣는 도중 2:00 부터 설명하시는 부분에

  • 해당 웹페이지 안에서 태그로 www.kkk.co.kr/google.jpg 파일을 가져와서 이미지로 보여줄 수 있음

  • 해당 웹페이지 안에서 태그로 www.kkk.co.kr/style.css 파일을 가져와서 CSS 스타일을 적용할 수 있음

의 내용과 코드를 보고 궁금한 점이 있습니다.

 

  • 부트스트랩 스타일, 스크립트 호춣

 <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/css/bootstrap.min.css" integrity="sha384-9aIt2nRpC12Uk9gS9baDl411NQApFmC26EwAOH8WgZl5MYYxFfc+NcPb1dKGj7Sk" crossorigin="anonymous">

<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.5.0/js/bootstrap.min.js" integrity="sha384-OgVRvuATP1z7JjHLkuOU7Xw704+h835Lr+6QL9UvYjZE3Ipu6Tp75j7Bh/kR0JKI" crossorigin="anonymous"></script>
  • Vue, axios 스크립트 호출

 <!-- Vue Start -->
    <script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

다음 코드와 같이 crossorigin 프로퍼티를 붙여주는 경우는 어떤 경우인지 궁금합니다.

  • 부트스트랩 관련 link, script 태그는 crossorigin 프로퍼티가 없으면 정상적으로 데이터를 불러오지 못합니다. 반면에 vue CDN 스크립트는 crossorigin 프로퍼티를 필요로 하지 않습니다. 이 차이가 뭔지 궁금합니다.

     

  • MDN 을 확인하면 crossorigin 프로퍼티 값을 "anonymous" 설정을 하게 되면 credential flag를 same-origin으로 설정해 쿠키 같은 user-credential 교환이 필요없다고 하는데, 해당 서버들이 credential flag 설정 값을 체크하는지 안하는지 차이일 뿐인가요? 이런 설정들이 부트스트랩이나 fontAwesome에서 왜 필요한지 잘 모르겠네요..

     

     

답변 1

답변을 작성해보세요.

0

mins님의 프로필

mins

질문자

2024.05.22

https://stackoverflow.com/questions/18336789/purpose-of-the-crossorigin-attribute

답변들을 보다보니 결국 보안 때문에 도입 되었고, 해당 프로퍼티를 사용하면 JS 에러 메세지를 획득하고 싶지만 자격증명을 보내고 싶지 않을때 쓴다는 것 같습니다. 그러면 Vue CDN에도 사용 되어야 하는거 아닌가 싶지만, 서버 설정을 따라가는 것 같습니다..

채널톡 아이콘