작성
·
125
·
수정됨
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
https://stackoverflow.com/questions/18336789/purpose-of-the-crossorigin-attribute
답변들을 보다보니 결국 보안 때문에 도입 되었고, 해당 프로퍼티를 사용하면 JS 에러 메세지를 획득하고 싶지만 자격증명을 보내고 싶지 않을때 쓴다는 것 같습니다. 그러면 Vue CDN에도 사용 되어야 하는거 아닌가 싶지만, 서버 설정을 따라가는 것 같습니다..