How can I listen/track when chrome extension is installed from the web store? 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.
I tried the messaging approach found in here but it seems not working.
manifest.json looks like:
"background": {
"scripts":["index.js"],
"persistent": false
},
"permissions": ["desktopCapture"],
"externally_connectable": {
"matches": [
"*://localhost:*/*",
"https://*.stageten.tv/*"
]
}
and 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.
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 .
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. 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
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/*"
],
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()
}
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.