게시일: 2024년 11월 19일
Google I/O 2024에서는 확장 프로그램이 액세스할 수 있는 사이트를 사용자가 더 세부적으로 관리할 수 있도록 확장 프로그램 메뉴에 적용될 예정인 변경사항에 대한 초기 디자인을 공유했습니다. YouTube는 곧 카나리아의 소수 사용자를 대상으로 이 변경사항을 테스트하기 시작할 예정이며 향후 더 많은 사용자에게 확대 적용할 계획입니다.
이전에 개발자와 이 변경사항에 관해 이야기할 때 확장 프로그램이 설치 시 호스트 권한을 요청하는 방식을 변경하는 것이 미치는 영향에 대한 우려가 자주 제기되었습니다. 새 메뉴는 기본 동작에 영향을 미치지 않습니다. 확장 프로그램은 설치 시점에 요청된 모든 호스트에 대한 액세스 권한을 계속 부여받습니다. 이번 변경의 목표는 사용자가 이미 사용 가능한 컨트롤을 더 쉽게 찾을 수 있도록 하는 것입니다.
이 게시물에서는 예상되는 사항과 새로운 API를 사용하여 페이지 액세스가 사용자에 의해 차단된 사례를 처리하는 방법을 간략히 설명합니다.
변경되는 사항
사용자에게 더 많은 제어 기능을 제공하기 위해 새로운 확장 프로그램 메뉴가 도입됩니다. 확장 프로그램은 설치 시 요청된 모든 호스트에 대한 액세스 권한을 계속 부여받지만, 이제 사용자는 확장 프로그램별로 액세스를 더 쉽게 제어할 수 있습니다.
![새 확장 프로그램 메뉴의 진행 중인 디자인](https://developer.chrome.google.cn/static/blog/new-extensions-menu-testing/image/menu.png?authuser=3&hl=ko)
새 메뉴 (변경될 수 있는 현재 디자인으로 표시됨)는 페이지에서 실행할 수 있는 확장 프로그램을 더 명확하게 표시하고, 사용자가 원하는 경우 액세스 권한을 변경할 수 있는 기능을 제공합니다. 사용자는 특정 사이트에서 모든 확장 프로그램이 실행되지 않도록 할 수도 있습니다. 앞서 말씀드린 대로 사용 가능한 설정이나 기본값은 변경되지 않습니다. Google은 사용자가 이미 있는 기능을 더 쉽게 찾을 수 있도록 하는 데 중점을 두고 있습니다.
사이트 액세스 요청 추가
Google은 WebExtensions 커뮤니티 그룹의 다른 브라우저 및 개발자의 중요한 의견을 바탕으로 이러한 변경사항을 보완하는 새로운 API를 설계했습니다.
사용자가 페이지 액세스를 거부한 경우 이제 확장 프로그램에서 새 permissions.addHostAccessRequest
API를 사용하여 액세스를 요청할 수 있습니다. 확장 프로그램에서 이렇게 하면 사용자에게 툴바의 확장 프로그램 퍼즐 조각 옆에 '허용' 메시지가 표시됩니다. 현재 고려 중인 디자인은 다음과 같습니다.
![example.com의 사이트 액세스 요청](https://developer.chrome.google.cn/static/blog/new-extensions-menu-testing/image/request.png?authuser=3&hl=ko)
사용자가 확장 프로그램 메뉴에서 '허용'을 클릭하면 확장 프로그램에 호스트에 대한 지속적인 액세스 권한이 부여됩니다. 사용자는 향후 확장 프로그램 메뉴 또는 chrome://extensions 페이지에 액세스하여 다시 보류할 수 있습니다. 툴바에서 '1명 허용'을 클릭하면 더 빠르게 즉시 액세스 권한을 부여할 수 있습니다.
확장 프로그램은 tabId
를 사용하여 permissions.addHostAccessRequest
를 호출하여 해당 탭의 권한 요청을 표시할 수 있습니다. 기능 감지를 사용하여 지금 바로 확장 프로그램에서 안전하게 사용할 수 있습니다. 새 메뉴가 없는 경우 API는 사용자에게 아무런 작업도 하지 않지만, 이를 채택하면 새 메뉴가 점진적으로 출시될 때 사용자에게 도움이 됩니다.
chrome.tabs.onUpdated.addListener(async (tabId, changes) => {
if (typeof changes.url !== 'string') return;
const url = new URL(changes.url);
// If we are on the /checkout page of example.com.
if (url.origin === 'https://example.com' && url.pathname === '/checkout') {
const hasPermission = await chrome.permissions.contains({
origins: ['https://example.com/*']
});
// We already have host permissions.
if (hasPermission) {
return;
}
// Add a site access request if the API is available.
if (chrome.permissions.addHostAccessRequest) {
chrome.permissions.addHostAccessRequest({ tabId });
}
}
});
이 예에서는 사용자가 /checkout
페이지에 있는 경우에만 요청을 추가합니다. chrome-extensions-samples 저장소에서 전체 코드를 확인할 수 있습니다.
확장 프로그램은 사용자에게 액세스 권한을 요청할 때를 주의해야 합니다. 사용자는 노이즈가 많은 요청을 무시할 가능성이 높으며 Chrome에서 과도한 요청을 제한할 수 있습니다. 사용자는 확장 프로그램이 요청을 표시하는 기능을 사용 중지하도록 선택할 수도 있습니다. 따라서 사용자가 확장 프로그램에 참여할 가능성이 높다고 확신할 수 있는 특정 상황에서만 액세스를 요청해야 합니다.
요청은 특정 탭에 바인딩되며 사용자가 다른 출처로 이동하면 자동으로 삭제됩니다. 요청이 특정 경로에 바인딩된 경우와 같이 요청을 명시적으로 삭제하려면 상응하는 removeHostAccessRequest
메서드를 사용하면 됩니다.
이 API는 새 확장 프로그램 메뉴와 연결되어 있으므로 새 메뉴가 사용 설정되지 않은 경우 호출이 무시됩니다. 하지만 지금 바로 API를 사용해 보고 확장 프로그램에 도입해 보시기 바랍니다. 점점 더 많은 사용자에게 새 메뉴 변경사항이 표시되면서 우수한 사용자 환경을 제공할 수 있습니다.
선택적 권한 작업에 관한 자세한 내용은 권한 문서를 참고하세요.
사용해 보기
이 API는 Chrome 133.0.6860.0 이상 (현재 Chrome Canary)에서 기본적으로 사용 설정됩니다. 새 메뉴를 사용 설정하려면 chrome://flags에서 'Extensions Menu Access Control'(확장 프로그램 메뉴 액세스 제어) 플래그를 사용 설정하세요.
이 기능은 아직 개발 중이며 계속해서 발전하고 변경될 수 있습니다. 최신 환경을 확인하려면 Chrome Canary에서 테스트하는 것이 좋습니다.
chromium-extensions 메일링 리스트에 새 디자인에 관한 의견을 남겨주시면 새 메뉴를 계속 개발하는 데 반영하겠습니다.