简单的浏览器扩展/插件
2020-05-20 本文已影响0人
XPorter
Chrome
创建
Chrome 插件中的核心文件是 manifest.json 。这是一个Chrome插件最重要也是必不可少的文件,用来配置所有和插件相关的配置,必须放在根目录。其中,manifest_version、name、version3个是必不可少的,description和icons是推荐的。
{
"manifest_version": 2,
"name": "demo",
"version": "0.1",
"description": "简单的Chrome扩展demo",
"icons": {
"16": "icon.png",
"48": "icon.png",
"128": "icon.png"
},
"content_scripts": [{
// "<all_urls>" 表示匹配所有地址
"matches": ["<all_urls>"],
"css": ["injection.css"],
"js": ["script.js"],
}]
}
文件目录
加载
从右上角菜单->更多工具->扩展程序可以进入 插件管理页面,也可以直接在地址栏输入 chrome://extensions 访问。
勾选开发者模式即可以文件夹的形式直接加载插件。
其它任何网站下载的插件都无法直接安装,但我们可以把crx文件解压,然后通过开发者模式直接加载。
Safari
创建
在 Safari 13 之后,开发菜单中的“Show Extension Builder”已被移除,改为使用 Xcode 创建 Safari 扩展。
新建扩展注入文件的配置在扩展文件夹下的 Info.plist 文件中。
Info.plist
主要的几个配置项:
Key | 说明 |
---|---|
SFSafariContentScript | JavaScript 脚本 |
SFSafariStyleSheet | CSS 样式表 |
SFSafariWebsiteAccess | 注入域名 |
加载
项目直接运行之后,Safari 会自动加载包含的插件,可在【偏好设置->扩展】中选择是否加载。
如果项目没有签名配置的话,Safari 要开启【开发->允许未签名扩展】
如果Safari没有菜单选项,勾选【偏好设置->高级->在菜单中显示“开发”菜单】