동일한 출처 정책 및 가져오기 요청
컬렉션을 사용해 정리하기
내 환경설정을 기준으로 콘텐츠를 저장하고 분류하세요.
이 Codelab에서 리소스를 가져올 때 same-origin이 어떻게 작동하는지 확인하세요.
설정: 동일한 출처에서 페이지 가져오기
데모는 https://same-origin-policy-fetch.glitch.me
에서 호스팅됩니다.
이 간단한 웹페이지는 fetch
를 사용하여 https://same-origin-policy-fetch.glitch.me/fetch.html
에서 리소스를 로드합니다. index.html
와 fetch.html
가 동일한 출처를 공유하므로 실시간 미리보기에 200
가 표시됩니다.
1. 다른 출처에서 페이지 가져오기
가져오기 URL을 https://www.google.com
(으)로 변경해 보세요.
실시간 미리보기에 무엇이 표시되나요?
리소스를 요청했으므로 브라우저에서 가져오기 요청을 차단했을 것입니다.
데이터를 가져올 수 있습니다 즉, 공격자가 교차 출처 정보를 읽을 수 없으며
리소스에 대한 액세스를 허용할 수 있습니다.
2. 교차 출처 리소스 가져오기
가져오기 URL을 https://api.thecatapi.com/v1/images/search
(으)로 변경해 보세요.
실시간 미리보기에 무엇이 표시되나요?
가져오기 URL의 출처는 다르지만 상태 코드 200이 표시되어야 합니다. 왜냐하면
최신 웹 애플리케이션에서는 종종 로드를 위해 교차 출처 리소스를 요청합니다.
API 엔드포인트를 쿼리할 수 있습니다 이러한 사용 사례를 수용하기 위해
교차 출처 리소스 공유 (CORS)라는 메커니즘이
교차 출처 리소스 로드가 허용되는 브라우저 CORS에 대한 자세한 내용은 교차 출처 리소스를 안전하게 공유를 참고하세요.
달리 명시되지 않는 한 이 페이지의 콘텐츠에는 Creative Commons Attribution 4.0 라이선스에 따라 라이선스가 부여되며, 코드 샘플에는 Apache 2.0 라이선스에 따라 라이선스가 부여됩니다. 자세한 내용은 Google Developers 사이트 정책을 참조하세요. 자바는 Oracle 및/또는 Oracle 계열사의 등록 상표입니다.
최종 업데이트: 2018-11-05(UTC)
[{
"type": "thumb-down",
"id": "missingTheInformationINeed",
"label":"필요한 정보가 없음"
},{
"type": "thumb-down",
"id": "tooComplicatedTooManySteps",
"label":"너무 복잡함/단계 수가 너무 많음"
},{
"type": "thumb-down",
"id": "outOfDate",
"label":"오래됨"
},{
"type": "thumb-down",
"id": "translationIssue",
"label":"번역 문제"
},{
"type": "thumb-down",
"id": "samplesCodeIssue",
"label":"샘플/코드 문제"
},{
"type": "thumb-down",
"id": "otherDown",
"label":"기타"
}]
[{
"type": "thumb-up",
"id": "easyToUnderstand",
"label":"이해하기 쉬움"
},{
"type": "thumb-up",
"id": "solvedMyProblem",
"label":"문제가 해결됨"
},{
"type": "thumb-up",
"id": "otherUp",
"label":"기타"
}]
{"lastModified": "\ucd5c\uc885 \uc5c5\ub370\uc774\ud2b8: 2018-11-05(UTC)"}
[[["이해하기 쉬움","easyToUnderstand","thumb-up"],["문제가 해결됨","solvedMyProblem","thumb-up"],["기타","otherUp","thumb-up"]],[["필요한 정보가 없음","missingTheInformationINeed","thumb-down"],["너무 복잡함/단계 수가 너무 많음","tooComplicatedTooManySteps","thumb-down"],["오래됨","outOfDate","thumb-down"],["번역 문제","translationIssue","thumb-down"],["샘플/코드 문제","samplesCodeIssue","thumb-down"],["기타","otherDown","thumb-down"]],["최종 업데이트: 2018-11-05(UTC)"]]