비공개 네트워크 액세스 권한 메시지 오리진 트라이얼: HTTPS를 사용하는 웹사이트를 마이그레이션하는 경로

Yifan Luo
Yifan Luo

배경

Chrome 94에서는 안전하지 않은 공개 웹사이트의 비공개 네트워크 액세스를 차단했습니다. 진행 중인 비보안 컨텍스트에서 비공개 네트워크 액세스 지원 중단 기능 트라이얼을 통해 영향을 받는 웹사이트를 HTTPS로 마이그레이션하는 데 어려움이 있었습니다. 가장 일반적인 문제는 비공개 기기를 HTTPS로 마이그레이션하기가 어려워 혼합 콘텐츠 검사 위반이 발생하는 것입니다.

앞서 언급한 문제를 해결하기 위해 Chrome 120의 오리진 트라이얼에서 새로운 권한 메시지를 사용할 수 있습니다.

새 옵션인 권한 메시지

targetAddressSpace 속성을 가져오기 옵션으로 추가하면 요청에서 혼합 콘텐츠 검사를 건너뛸 수 있습니다.

예:

fetch("http://router.local/ping", {
  targetAddressSpace: "private",
});
<ph type="x-smartling-placeholder">

비공개 네트워크 액세스: 프리플라이트 도입에 따라 모든 비공개 네트워크 요청은 프리플라이트 요청이 선행됩니다. 이 프리플라이트 요청에는 새 헤더 Access-Control-Request-Private-Network: true가 포함되며 상응하는 응답에는 Access-Control-Allow-Private-Network: true 헤더가 포함되어야 합니다.

Google에서는 새로운 권한 요청을 수용하기 위해 기기에 새로운 응답 헤더 두 개(Private-Network-Access-NamePrivate-Network-Access-ID)를 통합해야 했습니다.

Private-Network-Access-Name: <some human-readable device name>
Private-Network-Access-ID: <the MAC address of the device>

예:

Private-Network-Access-Name: "My Smart Toothbrush"
Private-Network-Access-ID: "01:23:45:67:89:0A"

Private-Network-Access-ID: 48비트 값이며 6개의 16진수 바이트로 콜론으로 구분됩니다. Private-Network-Access-Name: ECMAScript 정규 표현식 /^[a-z0-9_-.]+$/과 일치하는 문자열로 구성된 유효한 이름입니다. 이름의 최대 길이는 248 UTF-8 코드 단위입니다.

<ph type="x-smartling-placeholder">

데모

https://private-network-access-permission-test.glitch.me/에서 데모를 확인할 수 있습니다.

오리진 트라이얼 등록

개발자가 비공개 네트워크 액세스 권한 메시지를 통해 비공개 네트워크 액세스에 보안 컨텍스트 제한을 적용할 수 있도록 Chrome에서 버전 120~122를 오리진 트라이얼로 제공합니다.

웹사이트에서 권한 메시지를 사용하도록 하려면 오리진 트라이얼에 등록하세요.

  1. 원본에 대한 토큰을 요청합니다.
  2. 다음 중 한 가지 방법으로 토큰을 사용합니다. <ph type="x-smartling-placeholder">
      </ph>
    • HTML에서: html <meta http-equiv="Origin-Trial" content="TOKEN_GOES_HERE">
    • JavaScript에서: js const meta = document.createElement('meta'); meta.httpEquiv = 'Origin-Trial'; meta.content = 'TOKEN_GOES_HERE'; document.head.append(meta);
    • HTTP 헤더에서 다음을 수행합니다. text Origin-Trial: TOKEN_GOES_HERE

이 기능에 관한 의견이나 제안이 있으면 GitHub 저장소에 문제를 제출해 주세요.

리소스