你必须了解 chrome 插件开发才能阅读以下内容。
传送门： https://qa.1r1g.com/sf/ask/440544891/
原理：页面 js 向 chrome 插件的 background.js 传送消息并且获取反馈。
这需要使用到 background.js，需要配置一下：
"background":
{
"scripts": ["background.js"]
},
"externally_connectable":
{
"matches": ["*://localhost/*", "*://your.domain.com/*"]
},
值得一提的是: externally_connectable 必须是二级域名，
说白了你必须用服务器来测试这个功能。
background.js
chrome.runtime.onMessageExternal.addListener(function(request, sender, sendResponse) {
if (request) {
if (request.message) {
if (request.message == "version") {
sendResponse({ version: 1.0 })
}
}
}
return true
})
http://localhst:80/index.html 测试消息传递：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>检查用户是否安装了Chrome扩展程序</title>
</head>
<body>
<div id="app"></div>
</body>
<script>
// chrome extensions id
const id = 'jckdhikejenepdegalgokjacoeamoibk1'
// 需要版本
const requiredVersion = 1.0
// 是否安装了扩展？
let hasExtension = false
// 扩展是否为最新版本？
let isLastVersion = false
try {
// 向 backgrond.js 发送消息
chrome.runtime.sendMessage(id, { message: "version" }, function(reply) {
if (reply && reply.version >= requiredVersion) {
console.log('ok')
} else {
console.warn('update')
}
})
} catch (err) {
if (err.message.includes('Invalid extension id')) {
console.warn('未检测到插件存在！')
}
}
</script>
</html>