前端开发
北京前端外包 电话:186-2237-7561
服务客户有中国移动、方正国际、中百集团等
Search:开发
chrome插件会包含哪些文件及文件D:.│ manifest.json│├─html│ index.html│├─images│ icon-128.png│ icon-16.png│├─scripts│ background.chrome插件会包含哪些文件及文件D:.│ manifest.json│├─html│ index.html│├─images│ icon-128.png│ icon-16.png│├─scripts│ background.js│├─styles│ main.css│└─_locales ├─en │ messages.json │ └─zh_CN messages.json简单说明一下： html：存放html页面images：存放插件图标scripts：存放js文件styles: 存放样式_locales: 存放多语言文件manifest.json：一些关于插件的元数据，作为chrome入口文件看目录结构，像不像一个网站？Chrome插件就是一个网站类的应用，它是用html、javascript、css组成的一个webapp; 相比于通常的webapp, Chrome插件还可以调用更多浏览器层面的api,包括书签、历史记录、网络请求拦截、截获用户输入等等。（PS：插件不要随便乱装哦，很危险滴！）重点说一说这个文件：manifest.json如前所述，它包含了一些插件的元数据，作为chrome的入口文件，可以理解为插件的程序清单，那么它到底做了什么事情呢？ 结合示例，我们细细来看： { // 清单版本号，建议使用 版本 2，版本 1 是旧的，已弃用，不建议使用 "manifest_version": 2, "name": "chome-plugin", // 插件名称 "version": "1.8.6", // 插件版本 // 这里写些废话，举个栗子，‘应产品要求，杀个程序祭天’ "description": "This is an extension for your chrome", "icons": { "16": "images/custom/16x16.png", "48": "images/custom/48x48.png", "128": "images/custom/128x128.png" }, //browser_action和page_action只能添加一个 "browser_action": { //浏览器级别行为，所有页面均生效 "default_icon": "images/custom/16x16.png",//图标的图片 "default_title": "Hello ELSE", //鼠标移到图标显示的文字 "default_popup": "html/popup.html" //单击图标后弹窗页面 }, "page_action":{ //页面级别的行为，只在特定页面下生效 "default_icon":{ "24":"images/custom/24x24.png", "38":"images/custom/38x38.png" }, "default_popup": "html/popup.html", "default_title":"Hello ELSE" }, // 可选 "author": "ELSE TEAM", "automation": "...", "background": { "scripts": [ "scripts/background.js", "scripts/devtools-page.js" ] }, "devtools_page": "html/devtools-page.html", // 定义对页面内容进行操作的脚本 "content_scripts": [ { "js":["js/else-insert.js"], "css": ["css/else-insert.css"], "matches":["<all_urls>"] // 只在这些站点下 content_scripts会运行 } ], // 数组，声明插件所需要的权限，这里就是很危险的存在了，想干坏事的你是不是很激动！ "permissions": [ "cookies", "http://*/*", "management", "tabs", "contextMenus" ]}
