해결된 질문
22.02.03 00:20 작성
·
349
답변 2
1
2022. 02. 03. 11:57
위 설정을 azure storage의 CORS 설정에 추가했고, App service에서도 CORS_ORIGIN_WHITELIST에 요청 도메인을 추가했더니 정상 동작합니다.
링크 주신 공식문서를 좀더 읽어보겠습니다. 감사합니다. :)
1
2022. 02. 03. 09:48
안녕하세요.
CORS는 서로 다른 호스트 간의 자원 접근을 기본적으로 제한하는 브라우저의 보안 기능입니다. 아래의 MDN 문서에도 설명이 나와있는 데요. Ajax API 요청, 웹폰트 요청 등이 CORS의 제한을 받게 됩니다.
보여주신 오류는 웹폰트 로딩에 대한 CORS 오류이구요. 요청을 받는 측에서 CORS 설정을 해주어 이를 해결할 수 있습니다. 현재는 Azure Storage 에 세팅을 해줘야 할테구요. 리액트/장고 간의 리액트로부터 장고로의 API 요청에서는 장고 측에 CORS 설정이 필요합니다.
아래의 공식문서를 참고해보실 수 있구요. 본 공식문서를 꼭 차근차근 읽어보세요.
위 공식문서에서 언급된 Cors Rule 설정은 아래의 XML과 같습니다.
위 설정을 Storage account의 Resource sharing (CORS) 설정에 추가해주시면 되구요. Allowed origins 항목에는 현재 장고 웹페이지의 주소를 추가해주시면 됩니다.
화이팅입니다. :-)