【chrome扩展开发】如何在项目中判断插件是否已安装

由于安全限制,本文采取间接的方式实现

1、项目部分

比如通过cookie、localStorage等进行状态存储

1.1、初始化判断

javascript 复制代码
function getCookie(name){
	let arr = document.cookie.match(new RegExp("(^| )"+name+"=([^;]*)(;|$)"))
    if(arr != null){
      return unescape(arr[2])
    }else{
      return null
    }
}

let _isChromePluginInstall = getCookie('chrome-plugin');
if(_isChromePluginInstall && _isChromePluginInstall==='Y'){
	// 已安装插件
}else{
	// 未安装插件
}

1.2、卸载状态变更

javascript 复制代码
function getQueryString(name) {
	var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
	var r = window.location.search.substr(1).match(reg);
	if (r != null) {
		return unescape(r[2]);
	}
	return null;
}

let _on = getQueryString('on')
if(_on && _on === 'uninstalled'){
	// 修改插件安装状态
	// 其他业务处理
}

2、Chrome Extensions部分

background.js中进行安装、卸载事件监听

2.1、安装事件监听

javascript 复制代码
/**
 * 首次安装扩展程序、扩展程序更新到新版本以及 Chrome 更新到新版本时触发
 * @link https://developer.chrome.com/docs/extensions/reference/runtime/#event-onInstalled
 */
chrome.runtime.onInstalled.addListener(function () {
    setTimeout(function () {
    	// 对目标项目进行cookie写入
		const _cf = {
			name: 'chrome-plugin',
			value: 'Y',
			url: 'http://xxxx.xxx',
			domain: 'xxxx.xxx'
		}
		chrome.cookies.set(_cf, function (res) {
		  // ...
		});
    }, 1000)
  })

2.2、卸载事件监听

javascript 复制代码
/**
 * 转跳至目标项目地址进行状态变更、统计等事务处理
 * @link https://developer.chrome.com/docs/extensions/reference/runtime/#method-setUninstallURL
 */
chrome.runtime.setUninstallURL(`${SysConfig.APP_URL}/#?on=uninstalled`, ()=>{})

Ps:
management权限的监听事件,似乎无法对安装、卸载起到作用,具体原因不清楚,还有待研究。

有兴趣的小伙伴也可以研究研究,官方文档地址:https://developer.chrome.com/docs/extensions/reference/management/

相关推荐
柳杉8 分钟前
从调研到闭环,我用 GPT-Image-2.5 和 GPT-6 Astra 把智慧厂房 3D 大屏这条链路走完了
前端·ai编程·数据可视化
芳心粽伙饭8 分钟前
CSS第四章 布局
前端·css·html
CoderYanger13 分钟前
Java EE 进阶:2.3 JavaScript 综合案例
java·前端·javascript·css·职场和发展·java-ee·html
摸鱼仙人~26 分钟前
Vue 核心知识体系(大厂秋招方向)
前端·javascript·vue.js
ljt272496066143 分钟前
Vue笔记--状态管理
前端·vue.js·笔记
benbenAItalk9 小时前
数字人口播视频的批量生产实践:素材规范、任务编排与质量验收
java·前端·音视频
2601_962885729 小时前
如何用 Python 扫描 A 股跳空缺口并统计缺口回补概率?
java·前端·python
西瓜太郎123410 小时前
Claude Code、Codex CLI、Gemini CLI 能否共用一枚 Key?先看协议选择矩阵
前端·api 网关·claude code·gemini cli·codex cli
陈随易12 小时前
在Finch用了62亿词元,我认为这是新一代Agent工具之神
前端·人工智能·后端
水域安全老周12 小时前
水趣钓鱼救生衣专利拆解:两级锁紧如何解决落水人衣分离
java·前端·网络