chrome扩展入门(manifest配置)——常用属性

(ps:直接复制下面内容并粘贴进地址栏进入chrome浏览器的扩展工具)

                                __chrome://extensions__

推荐: 《Chrome扩展及应用开发(首发版)》


manifest 文件描述

  1. manifest.json文件是创建chrome扩展的必要条件,用来使chrome浏览器认识并接纳你。
  2. manifest.json文件包含了应用(扩展)的基本信息,例如最重要的文件列表,应用(扩展)所需要的权限等。

manifest.json 常用属性

{
  "manifest_version" : 2, 
  "version" : "1.0",
  "name" : "demo",
  "description" : "demodemo",
  "icons" : {
    "16" : "./icons/time16.png",
    "48" : "./icons/time48.png",
    "128" : "./icons/time128.png"
  },
  "browser_action" : {
    "default_title" : "test",
    "default_popup" : "demo.html",
    "default_icon" : {
      "48" : "./icons/time48.png"
    }
  },
  "content_scripts" : [
    {
      "matches" : ["*://www.baidu.com/"],
      "js" : ["./content_scripts.js"]
    }
  ],
  "options_page" : "options.html",
  "permissions" : [
    "*://*/*"
  ],
  "background" : {
    "scripts" : ["./js/background.js"],
    "popup" : "background.html"
  }
}

  • manifest_version
"manifest_version" : 2, 
 /** 必选项:用整数表示manifest文件自身格式的版本号。目前为止只接受 2 (版本目前为2) **/

  • version
"version" : "1.0",
/** 
  * 必选项: 字符串类型,当前创建扩展版本号 
  * 扩展的版本用一个到4个数字来表示,中间用点隔开。
  * 这些数字有些规则:必须在0到65535之间,非零数字不能0开头。
  * 比如,99999和032是不合法的。 
**/

  • name
"name" : "扩展名",
/** 必选项:字符串类型 **/

  • description
"description" : "扩展描述",
/** 可选项:字符串类型,扩展信息描述 **/

  • icons (如果只配置icons,则default_icon也使用该图片,如果不配置icons,则扩展工具界面使用默认图标)
"icons" : {
  "16" : "icon16.png"
}
/**
  * 一个或者多个图标来表示扩展 (16x16, 48x48, 128x128)
  * 建议使用以上几种大小,及png格式。
  * 可选,系统自带默认图标
**/

  • browser_action (在浏览器右上角显示)
"browser_action" : {
    "default_title" : "title",
    /** 鼠标移入,显示简短扩展文本描述 **/
    "default_popup" : "popup.html",
    /** 鼠标点击,弹出扩展模态窗口,展示内容 **/
    "default_icon" : {
      "48" : "./icons/time48.png"
    }
    /** 浏览器右上角,扩展图标 。如果不设置,跟随 icon ,两者皆无,则使用默认**/
  },

  • content_scripts (向页面注入脚本)

Content scripts是在Web页面内运行的javascript脚本。通过使用标准的DOM,它们可以获取浏览器所访问页面的详细信息,并可以修改这些信息。

"content_scripts" : [
    {
      "matches" : ["*://www.baidu.com/"],
      /**  匹配网址(支持正则),成功即注入(其余属性自行查询) **/
      "js" : ["./content_scripts.js"],
      /** 需要注入的脚本 **/
    }
  ],

  • options_page
"options_page" : "options.html",
/** 给扩展设置选项内容 并激活选项按钮**/

  • permissions

开启拓展权限,例如ajax的同源限制。开启后可进行跨域访问。
其余权限请自行查询。

"permissions" : [
    "*://*/*"
    /** 匹配需要跨域的请求地址,解除同源限制  **/
  ],

  • background
    后台常驻脚本
    扩展常常用一个单独的长时间运行的脚本来管理一些任务或者状态

 "background" : {
    "scripts" : ["./js/background.js"],
    /** 后台常驻脚本,自动运行,直到关闭浏览器。可根据需求自行设置 **/
    "popup" : "background.html"
    /** 调试页,background 不出现于用户视窗内的。 **/
    /** 在扩展工具页面,检查视图进行调试 (需要勾选__开发者模式__选项)**/
  }

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容