[英]Listen to chrome extension installation in app
How can I listen/track when chrome extension is installed from the web store? 如何从网上商店安装Chrome扩展程序时收听/跟踪? I previously had an inline installation of the extension but by inline installations coming to an end soon, I want the user action to open the web store to install the extension and listen for when they add the extension for UI changes and act based on that. 我以前有一个内联安装的扩展,但内联安装很快就会结束,我希望用户操作打开网上商店来安装扩展,并在他们为UI更改添加扩展时监听,并根据它进行操作。
I tried the messaging approach found in here but it seems not working. 我尝试了在这里找到的消息传递方法,但它似乎无法正常工作。
manifest.json looks like: manifest.json看起来像:
"background": {
"scripts":["index.js"],
"persistent": false
},
"permissions": ["desktopCapture"],
"externally_connectable": {
"matches": [
"*://localhost:*/*",
"https://*.stageten.tv/*"
]
}
and index.js : 和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;
})
and inside my app: 在我的应用内:
chrome.runtime.sendMessage(screenShareExtensionId, { message: "version" },
function (reply) {
if (reply) {
if (reply.version) {
return true;
}
}
else {
return false;
}
})
and based on the value in my redux logic, the UI either changes or not/waits for the extension to get installed. 并且基于我的redux逻辑中的值,UI是否更改/等待扩展安装。
You can do it at the start of your background page . 您可以在后台页面的开头执行此操作。
You need to save a flag (for example, it can be a version of the extension) to the localStorage . 您需要将标志(例如,它可以是扩展的版本)保存到localStorage 。
After that, on each start of the background page, you need to check if this flag is in your storage. 之后,在后台页面的每次启动时,您需要检查此标志是否在您的存储中。 If there is no flag - then you need to track install, otherwise, it's just usual reload of the background page. 如果没有标志 - 那么你需要跟踪安装,否则,它只是通常重新加载后台页面。
The same way can be used to track updates of the extension from the store, just need to compare versions. 同样的方法可以用来跟踪商店扩展的更新,只需要比较版本。
Solved this this in this self-answered question , which I can't mark as a duplicate of this because of no accepted/up votes. 在这个自我回答的问题中解决了这个问题 ,由于没有接受/投票,我无法将其标记为副本。
Here's how I solved it from the background script (w/o using a content script ): 这是我如何从后台脚本解决它(没有使用内容脚本 ):
background.js
onInstalled
event. 听取onInstalled
事件。 postMessage
notifying that installation was succesful. 在每个选项卡中执行一个小脚本, 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
Just make sure both externally_connectable
and permissions
declare the URL patterns of the sites you want to notify. 只需确保externally_connectable
和permissions
声明要通知的站点的URL模式。
"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/*"
],
Just listen somewhere for the postMessage
message fired by the extension on succesful installation. 只需在某处查看扩展在成功安装时触发的postMessage
消息。
window.onmessage = e => {
if (e.data === 'screenshare-ext-installed') {
// extension successfully installed
startScreenShare()
}
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.