检查 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>

转载于:https://www.cnblogs.com/CyLee/p/11505940.html

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值