출처 트라이얼이 성공적으로 완료된 후 Chrome 133에서 스토리지 액세스 헤더 (SAH)가 제공됩니다.
스토리지 액세스 헤더란 무엇인가요?
저장소 액세스 헤더는 소셜 미디어 위젯, 캘린더, 양방향 도구, 이미지와 같은 삽입된 콘텐츠가 파티션되지 않은 쿠키 액세스를 확인할 수 있는 새로운 HTTP 헤더입니다. 이전에는 JavaScript를 사용해야만 이 작업을 할 수 있었습니다. 새 Sec-Fetch-Storage-Access 요청 헤더와 Activate-Storage-Access 응답 헤더는 삽입된 콘텐츠를 사용하는 웹사이트의 성능과 사용자 환경을 개선하고 iframe이 아닌 리소스의 로드를 지원합니다. 구현 세부정보는 문서를 참고하세요.
요청 헤더
Sec-Fetch-Storage-Access: <access-status>
사용자가 교차 사이트 콘텐츠를 삽입하는 페이지를 방문하면 브라우저는 사용자 인증 정보 (예: 쿠키)가 필요할 수 있는 교차 사이트 요청에 Sec-Fetch-Storage-Access 헤더를 자동으로 포함합니다. 이 헤더는 삽입의 쿠키 액세스 권한 상태를 나타내며 다음 값을 가질 수 있습니다.
none: 삽입에storage-access권한이 없으므로 파티션되지 않은 쿠키 액세스에 액세스할 수 없습니다.inactive: 삽입에storage-access권한이 있지만 현재 컨텍스트에서 사용하도록 선택하지 않았습니다. 삽입에 파티션되지 않은 쿠키 액세스 권한이 없습니다.active: 삽입에 파티션되지 않은 쿠키 액세스 권한이 있습니다. 이 값은 파티션되지 않은 쿠키에 액세스할 수 있는 교차 출처 요청에 포함됩니다.
응답 헤더
Activate-Storage-Access: <retry-or-load>
Activate-Storage-Access 헤더는 브라우저에 쿠키를 사용하여 요청을 다시 시도하거나 Storage Access API (SAA)가 활성화된 상태에서 리소스를 직접 로드하도록 지시합니다. 헤더는 다음 값을 가질 수 있습니다.
load: 브라우저에 삽입 도구에 요청된 리소스의 파티션되지 않은 쿠키에 대한 액세스 권한을 부여하도록 지시합니다. 이 헤더를 포함하는 것은storage-access권한이 부여된 경우document.requestStorageAccess()을 호출하는 것과 같습니다. 사용자에게 추가 메시지가 표시되지 않습니다.retry: 서버는 브라우저가 스토리지 액세스 권한을 활성화한 후 요청을 다시 시도해야 한다고 응답합니다.
Activate-Storage-Access: retry; allowed-origin="https://site.example"
Activate-Storage-Access: retry; allowed-origin=*
Activate-Storage-Access: load
주요 이점
Storage Access Headers는 Storage Access API (SAA)를 사용하는 더 나은 성능의 권장 방법입니다. 이번 변경사항에는 다음과 같은 몇 가지 개선사항이 있습니다.
- iframe 외 삽입 지원: 더 다양한 리소스에 SAA를 사용 설정합니다.
- 네트워크 사용량 감소: 요청 수가 줄고 페이로드 크기가 작아집니다.
- CPU 사용량 감소: JavaScript 처리가 줄어듭니다.
- 개선된 UX: 중단되는 중간 로드를 제거합니다.
솔루션 업데이트
저장소 액세스 헤더 기능을 사용하면 다음 두 가지 경우에 코드를 업데이트해야 할 수 있습니다.
- SAA를 사용하고 있으며 후속
storage-access요청에 헤더 로직을 사용하여 성능을 개선하려고 합니다. - 서버에 대한 요청에
Origin헤더가 포함되는지에 따라 달라지는 유효성 검사 또는 로직이 있습니다.
솔루션에서 스토리지 액세스 헤더를 사용하는 방법은 문서를 참고하세요.
참여 및 의견 공유
의견이 있거나 문제가 발생하면 문제를 신고할 수 있습니다. GitHub 설명에서 저장소 액세스 헤더에 관해 자세히 알아볼 수도 있습니다.