10、chrome拓展程序的实现

一、拓展程序的实现

• 拓展程序项目的构成

        和前端项目一样，拓展程序也是有Html、CSS、JS文件实现的，现在看来它就是一个静态的前端页面。但是不同的是，拓展程序中还需要额外的一个清单文件，就是manifest.json，清单文件可以理解为一个拓展程序的配置文件，它可以配置你的拓展程序的权限，ICON路径、JS导入路径等。

• 清单示例

{
      
  "manifest_version": 2,
  "name": "Touch Fish",
  "description": "A basic Chrome extension",
  "version": "1.0",
  "icons": {
      
    "32": "icon/icon32.png",
    "128": "icon/icon128.png"
  },
  "browser_action": {
      
    "default_popup": "popup.html"
  },
  "background": {
      
    "scripts": ["js/background.js"]
  },
  "permissions": [
    "activeTab",
    "storage",
    "webRequest",
    "webRequestBlocking",
    "notifications",
    "<all_urls>",
    "proxy"
  ],
  "content_scripts": [
    {
      
      "matches": ["<all_urls>"],
      "js": ["js/content-script.js", "js/axios.js","js/encrypt.js","js/basic.js","js/common.js","js/login.js","js/modify_password.js","js/route.js",
        "js/utils.js","js/website.js","js/sina.js","js/file.js","js/email.js"