웹에 액세스 가능한 리소스는 웹페이지 또는 다른 확장 프로그램에서 액세스할 수 있는 확장 프로그램 내의 파일입니다. 확장 프로그램은 일반적으로 이 기능을 사용하여 웹페이지에 로드해야 하는 이미지 또는 기타 애셋을 노출하지만 확장 프로그램의 번들에 포함된 모든 애셋은 웹에서 액세스할 수 있습니다.
기본적으로 웹에 액세스할 수 있는 리소스는 없습니다. 이렇게 하면 악성 웹사이트에서 사용자가 설치한 확장 프로그램을 지문화하거나 설치된 확장 프로그램의 취약점 (예: XSS 버그)을 악용할 수 있습니다. 확장 프로그램의 출처에서 로드된 페이지 또는 스크립트만 확장 프로그램의 리소스에 액세스할 수 있습니다.
매니페스트 선언
web_accessible_resources
매니페스트 속성을 사용하여 노출되는 리소스와 출처를 선언합니다. 이 속성은 리소스 액세스 규칙을 선언하는 객체의 배열입니다. 각 객체에는 여러 확장 프로그램 리소스가 나열되며, matches
또는 extension_ids
키 중 하나 이상의 값을 제공하여 이러한 리소스에 액세스할 수 있는 출처를 나타내야 합니다.
{
...
"web_accessible_resources": [
{
"resources": [ "test1.png", "test2.png" ],
"matches": [ "https://web-accessible-resources-1.glitch.me/*" ]
}, {
"resources": [ "test3.png", "test4.png" ],
"matches": [ "https://web-accessible-resources-2.glitch.me/*" ]
}
],
...
}
배열의 각 객체에는 다음 요소가 포함됩니다.
"resources"
- 문자열의 배열이며, 각 배열에는 확장 프로그램의 루트 디렉터리에서 지정된 리소스의 상대 경로가 포함됩니다. 리소스에는 와일드 카드 일치를 위해 별표 (
*
)가 포함될 수 있습니다. 예를 들어"/images/*"
는 확장 프로그램의images/
디렉터리에 있는 모든 항목을 재귀적으로 노출하지만"*.png"
는 모든 PNG 파일을 노출합니다. "matches"
- 문자열 배열로, 각각 이 리소스 집합에 액세스할 수 있는 사이트를 지정하는 일치 패턴을 포함합니다. 출처만 URL 일치에 사용됩니다. 출처에는 하위 도메인 일치 항목이 포함됩니다. 패턴에 '/*' 이외의 경로가 있으면 Chrome에서 '잘못된 일치 패턴' 오류를 표시합니다.
"extension_ids"
- 리소스에 액세스할 수 있는 확장 프로그램의 ID가 각각 포함된 문자열의 배열입니다.
각 요소는 "resources"
요소와 "matches"
또는 "extension_ids"
요소를 포함해야 합니다. 그러면 지정된 리소스를 패턴과 일치하는 웹페이지 또는 ID가 일치하는 확장 프로그램에 노출하는 매핑이 설정됩니다.
리소스 탐색 용이성
리소스는 URL chrome-extension://[PACKAGE ID]/[PATH]
를 사용하여 웹페이지에서 제공되며, 이 URL은 runtime.getURL()
메서드로 생성할 수 있습니다. 리소스는 적절한 CORS 헤더와 함께 제공되므로 fetch()
를 사용하여 리소스를 사용할 수 있습니다.
리소스가 웹 액세스 가능으로 나열되지 않는 한 웹 출처에서 확장 프로그램 리소스로 이동하는 것은 차단됩니다. 다음과 같은 특수한 사례를 참고하세요.
- 확장 프로그램이 webRequest API를 사용하여 공개 리소스 요청을 웹에서 액세스할 수 없는 리소스로 리디렉션하는 경우 이러한 요청도 차단됩니다.
- 웹에 액세스할 수 없는 리소스를 리디렉션 확장 프로그램에서 소유하고 있더라도 공개 리소스로부터의 리디렉션은 차단됩니다.
"incognito"
입력란의 값이"split"
로 설정되지 않은 경우 시크릿 모드에서는 탐색이 차단됩니다.
콘텐츠 스크립트 자체는 허용할 필요가 없습니다.
예
웹 액세스 가능한 리소스의 예는 작업 중인 확장 프로그램에서 이 요소를 사용하는 방법을 보여줍니다.