收听应用程序中的Chrome扩展程序安装

时间:2018-08-28 22:01:09

标签: javascript reactjs google-chrome-extension react-redux

从网上商店安装chrome扩展程序后,如何收听/跟踪? 我以前曾进行过扩展的内联安装,但是由于内联安装即将结束,我希望用户采取行动打开网上商店来安装扩展,并在用户添加扩展进行UI更改时侦听并基于此采取行动。

我尝试了在here中找到的消息传递方法,但似乎不起作用。

manifest.json 如下:

   "background": {
     "scripts":["index.js"],
     "persistent": false
   },
   "permissions": ["desktopCapture"],
   "externally_connectable": {
        "matches": [
            "*://localhost:*/*",
         "https://*.stageten.tv/*"
        ]
    }

index.js

chrome.runtime.onMessageExternal.addListener(
  function(request, sender, sendResponse) {
      if (request === screenShareExtensionId) {
          if (request.message) {
              if (request.message == "version") {
                  sendResponse({version: 1.0})
                  alert('Hiiii')
              }
          }
      }
      return true;
  })

并在我的应用中:

chrome.runtime.sendMessage(screenShareExtensionId, { message: "version" },
    function (reply) {
        if (reply) {
            if (reply.version) {
              return true;
            }
        }
        else {
          return false;
        }
    })

,并根据我的redux逻辑中的值,UI更改或不更改/等待扩展安装。

2 个答案:

答案 0 :(得分:1)

您可以在background page的开头进行操作。

您需要将标志(例如,可以是扩展名的版本)保存到localStorage

此后,在后台页面的每个开始处,您需要检查此标志是否在存储中。如果没有标记,则需要跟踪安装,否则,通常只是重新加载后台页面。

可以使用相同的方法从商店中跟踪扩展的更新,只需要比较版本即可。

答案 1 :(得分:0)

this self-answered question中解决了这个问题,由于没有被接受/投票,我不能将其标记为重复。


这是我从background script(不使用content script)中解决问题的方法:

background.js

  • 收听onInstalled事件。
  • 查询所有与您要通知的URL匹配的打开的标签。
  • 在每个标签中执行一个小的脚本,postMessage会通知 安装成功。
 
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

只需确保同时声明externally_connectablepermissions 您要通知的网站的网址格式。

"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消息 成功安装的扩展名。

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

信用