检查 chrome 插件是否存在


你必须了解 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>


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM