브라우저 확장 프로그램 - 설치 후킹

경우에 따라 확장 프로그램의 설치 스크립트에 연결할 수 있습니다. 예를 들어 추가 정보로 사용자를 온보딩하려는 경우입니다.

다른 경우에는 사용자를 최신 변경 로그로 리디렉션할 수 있도록 업데이트를 포착할 수 있습니다.

그리고 이 설치 런타임을 사용하여 제거 URL을 설정할 수도 있습니다. 이 URL은 사용자가 확장 프로그램을 제거할 때마다 호출됩니다.

브라우저 확장 프로그램에서 onInstall 작업 잡기

이 기사와 함께 코딩하려면 다음GitHub branch을 시작점으로 삼으십시오.

이 프로젝트에는 이미 기본 설정이 있으며 필요한 백그라운드 작업자를 사용합니다.

Note: Read the following article for more information about the background worker.

이제 public/background.js 파일을 열고 다음 스크립트를 추가합니다.

chrome.runtime.onInstalled.addListener((details) => {
  // Do something
});

확장 프로그램이 설치되자마자 등록됩니다.
OnInstalledReason type 인 세부 정보를 활용할 수 있습니다.

이유는 다음과 같습니다.

설치

업데이트

크롬_업데이트

공유_모듈_업데이트

설치 및 업데이트 작업을 포착하기 위해 이를 어떻게 사용할 수 있는지 살펴보겠습니다.
이러한 경우에는 이미 액세스 권한이 있으므로 일부browser notifications를 추가합니다.

chrome.runtime.onInstalled.addListener((details) => {
  if (details.reason === 'install') {
    chrome.notifications.create({
      type: 'basic',
      iconUrl: 'icons/icon-48.png',
      title: 'Hi there 👋',
      message: 'Welcome to the best extensions you ever installed',
      buttons: [{ title: 'Thanks 😅️' }],
      priority: 0,
    });
  }

  if (details.reason === 'update') {
    chrome.notifications.create({
      type: 'basic',
      iconUrl: 'icons/icon-48.png',
      title: 'Thank you',
      message: 'For updating this extensions',
      buttons: [{ title: 'Cool' }],
      priority: 0,
    });
  }
});

우리가 할 수 있는 또 다른 멋진 일은 제거 URL을 설정하는 것입니다. 사용자가 확장 프로그램을 제거할 때 리디렉션되는 URL입니다.
예를 들어 그들이 떠나는 이유에 대해 질문하는 것이 도움이 될 수 있습니다.

chrome.runtime.onInstalled.addListener(details => {
    chrome.runtime.setUninstallURL('https://daily-dev-tips.com');
}

Note: You can also safely add that code inside your install reason, but this is safer if your extension was previously deployed without it.

이제 사용자가 확장 프로그램을 제거하면 이 링크로 리디렉션됩니다.

여기에서 전체 코드를 볼 수 있습니다GitHub branch.

읽어주셔서 감사합니다. 연결해 봅시다!

제 블로그를 읽어주셔서 감사합니다. 내 이메일 뉴스레터를 구독하고 Facebook에 연결하거나