检测Chrome扩展程序何时安装,无需内联安装

问题描述:

如果通过 Chrome网上应用店而不是内联安装?

How can an open tab get notified that a Chrome extension has just been installed, when the installation was done through the Chrome Web Store instead of inline-installation?

自6月以来2018年及以后 Chrome已弃用内联安装因此如果安装了扩展程序,将通知以下机制从现在起无法正常工作

Since June 2018 and onwards Chrome has deprecated inline installation hence the following mechanism to get notified if extension was installed won't work from now on:

chrome.webstore.install(url, successCallback, failureCallback)

从现在起,扩展必须只能通过网上商店安装。

From now on extensions must be installed only via the Web Store.

我们已经建立了一个屏幕共享扩展程序,允许用户分享他的屏幕。

We've built a screen share extension that allows prompting the user to share his screen.

当我们的用户点击分享屏幕时,我们打算重定向他们o网上应用店中的Chrome扩展程序,并在安装扩展程序后立即重新触发共享屏幕功能。

When our users hit "Share Screen", we intend to redirect them to the Chrome extension within the Web Store and as soon as they install the extension to re-trigger the Share Screen functionality.

以下是我通过背景脚本(没有使用内容脚本):

Here's how I solved it from the background script (w/o using a content script):


  • 收听 onInstalled 事件。

  • 查询所有与您要通知的URL匹配的已打开选项卡。

  • 在每个选项卡中执行一个小脚本 postMessage 通知
    安装成功。

  • Listen for onInstalled event.
  • Query all opened tabs that match the URL's you want to notify.
  • Execute a small script in each tab that will postMessage notifying that installation was succesful.
chrome.runtime.onInstalled.addListener(function listener(details) {
  if (details.reason === chrome.runtime.OnInstalledReason.INSTALL) {
    chrome.tabs.query({
      url: [
        'https://localhost:3000/*',
        'https://staging.foo.com/*',
        'https://production.foo.com/*'
      ]
    }, tabs => {
      Array.from(tabs).forEach(tab => {
        chrome.tabs.executeScript(tab.id, {
          code: `window.postMessage('screenshare-ext-installed', window.origin);`
        });
      });
    });

    chrome.runtime.onInstalled.removeListener(listener);
  }
});



manifest.json



只需确保 external_connectable 权限为URL声明
您要通知的网站的模式。

manifest.json

Just make sure both externally_connectable and permissions declare the URL patterns of the sites you want to notify.

"externally_connectable": {
    "matches": [
    "https://localhost:3000/*",
    "https://staging.foo.com/*",
    "https://production.foo.com/*"
  ]
},
"permissions": [
  "desktopCapture",
  "https://localhost:3000/*",
  "https://staging.foo.com/*",
  "https://production.foo.com/*"
],



网页



只需在某处搜索 postMessage 消息通过
成功安装的扩展名。

Web page

Just listen somewhere for the postMessage message fired by the extension on succesful installation.

window.onmessage = e => {
  if (e.data === 'screenshare-ext-installed') {
    // extension successfully installed
    startScreenShare()
  }
}



积分