diff options
author | Florian Merz <me@fiji-flo.de> | 2021-02-11 12:56:40 +0100 |
---|---|---|
committer | Florian Merz <me@fiji-flo.de> | 2021-02-11 12:56:40 +0100 |
commit | 310fd066e91f454b990372ffa30e803cc8120975 (patch) | |
tree | d5d900deb656a5da18e0b60d00f0db73f3a2e88e /files/zh-cn/mozilla/add-ons | |
parent | 8260a606c143e6b55a467edf017a56bdcd6cba7e (diff) | |
download | translated-content-310fd066e91f454b990372ffa30e803cc8120975.tar.gz translated-content-310fd066e91f454b990372ffa30e803cc8120975.tar.bz2 translated-content-310fd066e91f454b990372ffa30e803cc8120975.zip |
unslug zh-cn: move
Diffstat (limited to 'files/zh-cn/mozilla/add-ons')
14 files changed, 0 insertions, 366 deletions
diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/剪切板/index.html b/files/zh-cn/mozilla/add-ons/webextensions/api/clipboard/index.html index 5fecb4334f..5fecb4334f 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/api/剪切板/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/api/clipboard/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/剪切板/setimagedata/index.html b/files/zh-cn/mozilla/add-ons/webextensions/api/clipboard/setimagedata/index.html index 3cdaf45b08..3cdaf45b08 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/api/剪切板/setimagedata/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/api/clipboard/setimagedata/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/devtools.inspectedwindow/index.html b/files/zh-cn/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.html index d59f29ffde..d59f29ffde 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/api/devtools.inspectedwindow/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/api/devtools/inspectedwindow/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/contextmenus/index.html b/files/zh-cn/mozilla/add-ons/webextensions/api/menus/index.html index ffcb6ce7b7..ffcb6ce7b7 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/api/contextmenus/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/api/menus/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/api/tabs/查询/index.html b/files/zh-cn/mozilla/add-ons/webextensions/api/tabs/query/index.html index 9afe6e80a8..9afe6e80a8 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/api/tabs/查询/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/api/tabs/query/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/构建一个跨浏览器的扩展插件/index.html b/files/zh-cn/mozilla/add-ons/webextensions/build_a_cross_browser_extension/index.html index 6d1a21497c..6d1a21497c 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/构建一个跨浏览器的扩展插件/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/build_a_cross_browser_extension/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/实现一个设置页面/index.html b/files/zh-cn/mozilla/add-ons/webextensions/implement_a_settings_page/index.html index fe8ac2e0a7..fe8ac2e0a7 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/实现一个设置页面/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/implement_a_settings_page/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/manifest.json/主页地址/index.html b/files/zh-cn/mozilla/add-ons/webextensions/manifest.json/homepage_url/index.html index 01749d5ff3..01749d5ff3 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/manifest.json/主页地址/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/manifest.json/homepage_url/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/packaging_and_installation/index.html b/files/zh-cn/mozilla/add-ons/webextensions/packaging_and_installation/index.html deleted file mode 100644 index 654aaea253..0000000000 --- a/files/zh-cn/mozilla/add-ons/webextensions/packaging_and_installation/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: 打包和安装 -slug: Mozilla/Add-ons/WebExtensions/Packaging_and_installation -translation_of: Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox -translation_of_original: Mozilla/Add-ons/WebExtensions/Packaging_and_installation ---- -<h2 id="打包你的扩展">打包你的扩展</h2> - -<p>Firefox 扩展应打包为 XPI 文件。它只是一个 ZIP 文件,但采用 <code>.xpi</code> 作为扩展名。</p> - -<p>最重要的一点,ZIP 文件必须是扩展文件的 ZIP 打包,<strong>不能</strong>包含一层根目录。</p> - -<h3 id="Windows">Windows</h3> - -<ol> - <li>打开你的扩展文件所在的文件夹。</li> - <li>选择所有文件。</li> - <li>右击并选择 发送到 → 压缩(zipped)文件夹。</li> - <li>将得到的文件从 <code>文件名.zip</code> 重命名为 <code>文件名.xpi</code>。</li> -</ol> - -<p><img alt="Screenshot of the Windows Explorer context menu showing Send to compressed (zipped) folder" src="https://mdn.mozillademos.org/files/11717/pUF1vnr.png" style="height: 641px; width: 904px;"></p> - -<h3 id="Mac_OS_X">Mac OS X</h3> - -<ol> - <li>打开你的扩展文件所在的文件夹。</li> - <li>选择所有文件。</li> - <li>右击并选择 压缩 <em>n</em> 项。</li> - <li>将得到的文件从 <code>Archive.zip</code> 重命名为 <code>文件名.xpi</code>。</li> -</ol> - -<p><img alt="Screenshot of the Finder context menu showing the Compress 15 Items option" src="https://mdn.mozillademos.org/files/11715/Screen%20Shot%202015-10-08%20at%2016.19.02.png" style="height: 460px; width: 850px;"></p> - -<h3 id="Linux_Mac_OS_X_终端">Linux / Mac OS X 终端</h3> - -<ol> - <li><code>cd path/to/my-extension/</code></li> - <li><code>zip -r ../my-extension.xpi *</code></li> -</ol> - -<h2 id="安装你的扩展">安装你的扩展</h2> - -<ol> - <li>导航到 <code>about:addons</code></li> - <li>拖拽 XPI 到页面上,或者打开齿轮菜单,选择“从文件安装附加组件...”</li> - <li>点击弹出的对话框中的“安装”</li> -</ol> - -<h2 id="在_Firefox_OS_上安装你的扩展">在 Firefox OS 上安装你的扩展</h2> - -<p><code>你可以使用 WebIDE 提供的 USB 或者 Wifi 进行安装</code></p> - -<h2 id="故障排除">故障排除</h2> - -<p>下面是几种你可能会遇到的常见问题:</p> - -<h3 id="此附加组件无法安装,因为它未经验证。">"此附加组件无法安装,因为它未经验证。"</h3> - -<ul> - <li>确保你正在使用 <a href="https://nightly.mozilla.org/">Nightly</a> ,并且已在 <code>about:config </code>中将 <code>xpinstall.signatures.required</code> 切换为 <code>false</code>。</li> - <li>在 <a href="/en-US/docs/Mozilla/Add-ons/Distribution">附加组件签名与分发</a> 了解更多信息。</li> -</ul> - -<h3 id="该附加组件无法安装,因为它似乎已损坏。">"该附加组件无法安装,因为它似乎已损坏。"</h3> - -<ul> - <li>确保你是直接压缩你的附加组件文件,<strong>而不是</strong>压缩它们所在的文件夹。你的 manifest.json 文件必须在 zip 文件的根目录中。</li> - <li>确保你正在使用 <a href="https://nightly.mozilla.org/">Nightly</a> 版本的 Firefox。</li> -</ul> - -<h3 id="完全没反应">完全没反应</h3> - -<ul> - <li>确保你的文件名称以 <code>.xpi</code> 结尾,因为某些操作系统可能会隐藏真实的文件扩展名。 - - <ul> - <li>在 Windows 上,选中 查看 → 显示 / 隐藏:文件扩展名。</li> - <li>在 Mac OS X 上,选中 文件 → 获取信息 → 名称和扩展名。</li> - </ul> - </li> - <li>还有一种可能,你不小心点击并因此驳回了安装提示。在 Nightly 中的后退按钮旁边找到一个拼图图标。点击它将重获这个弹出提示。</li> -</ul> diff --git a/files/zh-cn/mozilla/add-ons/webextensions/porting_from_google_chrome/index.html b/files/zh-cn/mozilla/add-ons/webextensions/porting_from_google_chrome/index.html deleted file mode 100644 index 496abe0bd3..0000000000 --- a/files/zh-cn/mozilla/add-ons/webextensions/porting_from_google_chrome/index.html +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: 从 Google Chrome 移植 -slug: Mozilla/Add-ons/WebExtensions/Porting_from_Google_Chrome -tags: - - WebExtensions -translation_of: Mozilla/Add-ons/WebExtensions/Porting_a_Google_Chrome_extension ---- -<div>{{AddonSidebar}}</div> - -<p>使用 WebExtension API 开发的扩展是专为跨浏览器兼容而设计的:很大程度上,该技术与 Google Chrome 和 Opera 支持的<a class="external external-icon" href="https://developer.chrome.com/extensions">扩展 API</a> 代码直接兼容。为这些浏览器编写的扩展,在大多数情况下,只需少数修改就能在 Firefox 中运行。几乎所有的<a href="/zh-CN/docs/Mozilla/Add-ons/WebExtensions/API">扩展 API</a> 都支持使用 <code>chrome</code> 命名空间下的回调函数,跟 Chrome 一样。那些仅有的 <code>chrome</code> 命名空间不支持的 API 是故意不与 Chrome 兼容的。这些情况下,API 文档页将明确声明它仅在 <code>browser</code> 命名空间中受支持。从 Chrome 或者 Opera 移植一个扩展的过程大概这样:</p> - -<ol> - <li>检查你 manifest.json 使用的功能并了解 WebExtension API 对应的 <a href="/en-US/Add-ons/WebExtensions/Chrome_incompatibilities">Chrome 不兼容参考表</a>。如果你在使用的功能或者 API 还未被 Firefox 支持,那你可能还不能移植你的扩展。Mozilla 提供了一个服务可助您自动执行此步:<a href="https://www.extensiontest.com/">https://www.extensiontest.com/</a>。</li> - <li><a href="/zh-CN/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">安装你的扩展至 Firefox</a> 并对其进行测试。</li> - <li>如有任何问题,可通过 <a class="external external-icon" href="https://mail.mozilla.org/listinfo/dev-addons">dev-addons 邮件列表</a>或 <a class="external external-icon" href="https://wiki.mozilla.org/IRC">IRC</a> 上的 <a href="irc://irc.mozilla.org/webextensions">#webextensions</a> 联系我们。</li> - <li><a href="/zh-CN/Add-ons/WebExtensions/Publishing_your_WebExtension">提交您的附加组件至 AMO 以供签名及分发</a>。</li> -</ol> - -<p>如果您依赖 Chrome 命令行选项来加载解压的扩展,请参看 Firefox 中进行临时安装的 <a href="/en-US/Add-ons/WebExtensions/Getting_started_with_web-ext">web-ext</a> 工具以便开发。</p> - -<ul> -</ul> diff --git a/files/zh-cn/mozilla/add-ons/webextensions/publishing_your_webextension/index.html b/files/zh-cn/mozilla/add-ons/webextensions/publishing_your_webextension/index.html deleted file mode 100644 index e7792b75d4..0000000000 --- a/files/zh-cn/mozilla/add-ons/webextensions/publishing_your_webextension/index.html +++ /dev/null @@ -1,98 +0,0 @@ ---- -title: 发布你的附加组件 -slug: Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension -tags: - - WebExtensions -translation_of: Mozilla/Add-ons/WebExtensions/Package_your_extension_ ---- -<div>{{AddonSidebar}}</div> - -<p>一般当你完成了基于WebExtension技术的附加组件的代码编写和测试, 你可能会想与其他人分享这成果(不管出于什么目的...). Mozilla旗下有一个网站: <a class="external external-icon" href="https://addons.mozilla.org">addons.mozilla.org</a> (简称AMO), 开发者们可以在这里发布附加组件, 而其他用户可以在这里找到这些附加组件并安装使用, 通过在AMO上发布你的附加组件, 你可以加入到我们的社区里来, 这里有一群用户和创造者, 说不准会发现几个使用你的附加组件的人哦.</p> - -<p>你编写的附加组件并不一定需要发布在AMO上, 但是、即使你不打算在AMO上发布你的附加组件, 你也必须提交你的附加组件到AMO上来进行审核以获得签名。因为火狐浏览器会拒绝安装没有AMO签名的附加组件。</p> - -<p>所以发布一个附加组件的流程, 可概述为:</p> - -<ol> - <li>压缩你所创建的附加组件文件</li> - <li>在<a href="https://addons.mozilla.org/zh-CN/">AMO</a>上创建一个属于你的账户</li> - <li>上传你的压缩文件到AMO来进行签名和审核, 并选择是否在AMO上进行发布</li> - <li>修复在审核中发现的任何问题</li> - <li>如果你选择不在AMO上发布, 可以恢复已签名的附件组件, 并自行发布</li> -</ol> - -<p>当你准备发布附加组件的新版本时, 你可以访问 <a class="external external-icon" href="https://addons.mozilla.org">addons.mozilla.org </a>的附加组件页来更新它, 并上传新的版本.<br> - 需要注意的是: 你必须在这个附加组件页进行更新, 否则AMO没法知道你是要更新一个已经存在的附加组件呢, 还是要上传一个全新的附加组件呢.</p> - -<p>如果你选择在AMO上发布你的附加组件, 之后火狐浏览器会自动检查更新. 如果你选择自行发布, 你需要在你的manifest.json中手动设置一个<code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/applications">applications</a></code> 唯一标识, 并且需要手动设置<code>update_url属性指向你的</code><a href="/en-US/Add-ons/Updates">update manifest file</a>.</p> - -<div class="pull-aside"> -<div class="moreinfo"> -<p>火狐浏览器把附加组件包的后缀叫做或改为".xpi", 这只是".zip"的一个扩展.</p> - -<p>在上传附加组件到AMO的时候, 你不需要把压缩包的后缀改为".XPI".</p> -</div> -</div> - -<h2 id="1._使用zip压缩你的附加组件文件">1. 使用zip压缩你的附加组件文件</h2> - -<p>首先你的附加组件文件夹应该包含一个manifest.json和其他一些需要的文件 - javascript文件, icons文件, HTML文件等等. 你需要使用zip把它们压缩成一个文件以便上传到AMO.</p> - -<p>注意: 请将你的附加组件目录的的所有文件压缩为zip包,而 不要直接对附加组件根目录进行压缩(见下图所示).</p> - -<h3 id="Windows">Windows</h3> - -<ol> - <li>打开你的附加组件所在的文件夹.</li> - <li>选中所有文件.</li> - <li>右键并选择发送到 → 压缩到(zipped)文件夹.</li> -</ol> - -<p><img alt="" src="https://mdn.mozillademos.org/files/11949/install-windows.png" style="display: block; height: 576px; margin-left: auto; margin-right: auto; width: 800px;"></p> - -<h3 id="Mac_OS_X">Mac OS X</h3> - -<ol> - <li>打开你的附加组件所在的文件夹.</li> - <li>选中所有文件.</li> - <li>右键并选择压缩<em>n项</em>.</li> -</ol> - -<p><img alt="" src="https://mdn.mozillademos.org/files/11951/install-osx.png" style="display: block; height: 449px; margin-left: auto; margin-right: auto; width: 800px;"></p> - -<h3 id="Linux_Mac_OS_X_Terminal">Linux / Mac OS X Terminal</h3> - -<ol> - <li><code>cd path/to/my-addon/</code></li> - <li><code>zip -r ../my-addon.zip *</code></li> -</ol> - -<h2 id="2._在AMO上创建一个账户">2. 在AMO上创建一个账户</h2> - -<p>访问<a href="https://addons.mozilla.org/">https://addons.mozilla.org/</a>. 如果你已经有一个<a href="https://support.mozilla.org/zh-CN/kb/firefox-mozilla">火狐账户</a>, 你可以直接使用它来登录. 否则, 点击"注册"并按要求创建一个火狐账户.</p> - -<h2 id="3._上传你的zip压缩文件">3. 上传你的zip压缩文件</h2> - -<p>接下来, 上传压缩后的附加组件到AMO进行签名和审查, 并选择是否发布到AMO, 更多细节, 可查看<a href="/en-US/Add-ons/Distribution#Submitting_to_AMO">Submitting to AMO</a>.</p> - -<div class="note"> -<p>需要注意的是一旦你上传了你的附加组件(基于WebExtension技术)到AMO, 你不能使用Add-on SDK或过时的XUL/XPCOM技术来更新该附加组件. 如果你切换到了这些技术平台之一, 必须把它做为新的附加组件并重新提交.</p> - -<p>总而言之: 像Add-on SDK和XUL/XPCOM等过时的技术体系在不久的将来都将被淘汰, WebExtensions才是唯一.</p> - -<p>在上传你的附加组件之前,请再次检查你的zip包内没有包含其他不相关的文件.</p> -</div> - -<h2 id="4._修复审查中出现的问题">4. 修复审查中出现的问题</h2> - -<p>当你上传了附加组件, AMO服务器将运行一些基本的检查并立即通知你有关的一切问题. 这些问题分为2种类型: "错误"和"警告". 如果你有错误, 你必须修复它们并重新提交, 如果只是警告, 你最好也搞定它们(当可以也忽略警告): 然后可以继续提交.</p> - -<p>如果自动检查器没有报告任何错误, 该附件组件将进行更为详细的审核(复查). 你同样会收到审查结果并且需要修复所有问题, 然后重新提交.</p> - -<h2 id="5._发布你的附加组件">5. 发布你的附加组件</h2> - -<p>如果你选择了在AMO上托管你的附加组件, 这意味着发布过程的结束. AMO会对该附加组件进行签名和发布, 之后其他用户就能下载并安装使用了.</p> - -<p>如果你选择不在AMO上进行发布, 可以恢复已签名的附加组件, 并自行发布(比如把附件组件的压缩包直接发给别人).</p> - -<p> </p> diff --git a/files/zh-cn/mozilla/add-ons/webextensions/user_interface/侧边栏/index.html b/files/zh-cn/mozilla/add-ons/webextensions/user_interface/sidebars/index.html index 8d13bfaf2c..8d13bfaf2c 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/user_interface/侧边栏/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/user_interface/sidebars/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/walkthrough/index.html b/files/zh-cn/mozilla/add-ons/webextensions/your_second_webextension/index.html index 962e04d404..962e04d404 100644 --- a/files/zh-cn/mozilla/add-ons/webextensions/walkthrough/index.html +++ b/files/zh-cn/mozilla/add-ons/webextensions/your_second_webextension/index.html diff --git a/files/zh-cn/mozilla/add-ons/webextensions/用户界面元素/index.html b/files/zh-cn/mozilla/add-ons/webextensions/用户界面元素/index.html deleted file mode 100644 index 0aaec74b1f..0000000000 --- a/files/zh-cn/mozilla/add-ons/webextensions/用户界面元素/index.html +++ /dev/null @@ -1,163 +0,0 @@ ---- -title: 用户界面元素 -slug: Mozilla/Add-ons/WebExtensions/用户界面元素 -translation_of: Mozilla/Add-ons/WebExtensions/user_interface -translation_of_original: Mozilla/Add-ons/WebExtensions/User_interface_components ---- -<div>{{AddonSidebar}}</div> - -<p>该主题概括了所有你能用来创建你扩展的用户界面的组件。</p> - -<h2 id="浏览器行为">浏览器行为</h2> - -<p>浏览器行为是一个你能添加至浏览器工具栏的按钮,用户可以点击该按钮来与你的扩展交互。</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/12966/browser-action.png" style="display: block; height: 387px; margin-left: auto; margin-right: auto; width: 782px;"></p> - -<p>有两种方式定义一个浏览器行为: 有一个 <a href="#Popups">弹出菜单</a>, 或者没有弹出菜单。</p> - -<p>当你没有定义一个弹出菜单时,用户点击按钮会导致一个消息被分发至扩展,而你可以使用 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/BrowserAction/onClicked" title="Fired when a browser action icon is clicked. This event will not fire if the browser action has a popup."><code>browserAction.onClicked</code></a> 来监听它:</p> - -<pre class="brush: js line-numbers language-js"><code class="language-js">browser<span class="punctuation token">.</span>browserAction<span class="punctuation token">.</span>onClicked<span class="punctuation token">.</span><span class="function token">addListener</span><span class="punctuation token">(</span>handleClick<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> - -<p>如果你定义了弹出菜单,点击事件就不会被分发取而代之的是弹出菜单会显示出来。用户可以跟弹出菜单交互而当用户点击菜单外的区域时它会自动关闭。</p> - -<p>值得注意的是你的扩展只能拥有一个浏览器行为。</p> - -<h3 id="定义浏览器行为">定义浏览器行为</h3> - -<p>你通过使用在manifest.json 文件中使用 <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> 关键字定义浏览器行为的属性 - 图标, 标题, 弹出菜单 :</p> - -<pre class="brush: json line-numbers language-json"><code class="language-json"><span class="key token">"browser_action":</span> <span class="punctuation token">{</span> - <span class="key token">"default_icon":</span> <span class="punctuation token">{</span> - <span class="key token">"19":</span> <span class="string token">"button/geo-19.png"</span><span class="punctuation token">,</span> - <span class="key token">"38":</span> <span class="string token">"button/geo-38.png"</span> - <span class="punctuation token">}</span><span class="punctuation token">,</span> - <span class="key token">"default_title":</span> <span class="string token">"Whereami?"</span><span class="punctuation token">,</span> - <span class="key token">"default_popup":</span> <span class="string token">"popup/geo.html"</span> -<span class="punctuation token">}</span></code></pre> - -<p>唯一必要的关键字是 <code>default_icon</code>.你可以使用 <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">browserAction</a></code> API 修改任何属性.</p> - -<h3 id="例子">例子</h3> - -<p>在GITHUB上的 <a href="https://github.com/mdn/webextensions-examples">webextensions-examples</a> 资源包含了以下使用浏览行为的例子:</p> - -<ul> - <li><a href="https://github.com/mdn/webextensions-examples/blob/master/bookmark-it/">bookmark-it</a> 使用了没有弹出菜单的浏览器行为</li> - <li><a href="https://github.com/mdn/webextensions-examples/tree/master/beastify">beastify</a> 使用了由弹出菜单的浏览器行为</li> -</ul> - -<h2 id="页面行为">页面行为</h2> - -<p>页面行为在很多方面类似于 <a href="#Browser_actions">browser actions</a> , 除了:</p> - -<ul> - <li>浏览器行为按钮会一直显现,并且一直可用。</li> - <li>页面行为只会在几个页面并且该页面处于活动标签时显示。</li> -</ul> - -<p>为了强调页面行为只跟部分页面有联系,他们将其显示在地址栏内而不是工具栏:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/12960/page-action.png" style="display: block; height: 262px; margin-left: auto; margin-right: auto; width: 850px;"></p> - -<p>不像浏览器行为,页面行为默认是关闭的, 调用 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/PageAction/show" title="Shows the page action for a given tab. The page action is shown whenever the given tab is the active tab."><code>pageAction.show()</code></a> 和<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/PageAction/hide" title="Hides the page action for a given tab."><code>pageAction.hide()</code></a> 可以显示或隐藏页面行为。</p> - -<h3 id="定义页面行为">定义页面行为</h3> - -<p>通过在manifest.json中使用<code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/page_action">page_action</a></code> 关键字来定义页面行为的属性 —— 图标, 标题, 弹出菜单:</p> - -<pre class="brush: json line-numbers language-json"><code class="language-json"><span class="key token">"page_action":</span> <span class="punctuation token">{</span> - <span class="key token">"browser_style":</span> <span class="keyword token">true</span><span class="punctuation token">,</span> - <span class="key token">"default_icon":</span> <span class="punctuation token">{</span> - <span class="key token">"19":</span> <span class="string token">"button/geo-19.png"</span><span class="punctuation token">,</span> - <span class="key token">"38":</span> <span class="string token">"button/geo-38.png"</span> - <span class="punctuation token">}</span><span class="punctuation token">,</span> - <span class="key token">"default_title":</span> <span class="string token">"Whereami?"</span><span class="punctuation token">,</span> - <span class="key token">"default_popup":</span> <span class="string token">"popup/geo.html"</span> -<span class="punctuation token">}</span></code></pre> - -<p><code>default_icon 是唯一强制要求的关键字</code>. 你可以使用 <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/browserAction">pageAction</a></code> API 修改所有的属性或现实或隐藏页面行为。</p> - -<h3 id="例子_2">例子</h3> - -<p> <a href="https://github.com/mdn/webextensions-examples/tree/master/chill-out">chill-out</a> 例子使用了一个页面行为。</p> - -<h2 id="弹出菜单">弹出菜单</h2> - -<p>一个弹出菜单是一个绑定至 <a href="#Browser_actions">browser action</a> 或者 <a href="#Page_actions">page action</a> 的对话框。</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/14039/popup-shadow.png" style="display: block; height: 545px; margin-left: auto; margin-right: auto; width: 700px;"></p> - -<p>当用户点击按钮弹出菜单显示,当用户点击弹出菜单外的任何区域弹出菜单关闭。可以使用 <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/Window/close">window.close()</a></code> 来关闭弹出菜单。</p> - -<p>你可以使用专门的在manifest.json中使用"_execute_browser_action" 和 "_execute_page_action" 来定义一个快捷键打开浏览器行为或页面行为. 详情请看 <code><a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/commands">commands</a></code> manifest.json 关键字。不过你不能在你的扩展脚本中通过编程打开弹出菜单 : 他只能通过用户的行为的被打开。</p> - -<p>弹出菜单像普通网页一样通过HTML文件被定义,你当然也可以在里面包含CSS 和 javascript文件。 而且不像普通网页, 其包含的javascript可以使用所有的已经通过<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/permissions">permissions</a>获取了使用权限的 <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API">WebExtension APIs</a> 。</p> - -<p>你可以要求浏览器在你的弹出菜单中包含一个样式表以使其看起来与浏览器UI一致。为了达成这一目的,在你的 <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/browser_action">browser_action</a></code> 或 <a href="/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/page_action">page_action</a> 关键字中包含<code> "browser_style": true</code> 。</p> - -<p>弹出菜单存在一个限制其可以加载资源的源地址的安全机制, 同时不允许类似 <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval">eval()</a></code> 的做法的使用 查看 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_Security_Policy">Content Security Policy</a> 获取更多细节。</p> - -<p>你可以使用Add-on Debugger来调试弹出菜单标记和脚本,但是你需要一些技巧来设置让弹出菜单不在自动关闭。<a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/Debugging#Debugging_popups"> 阅读关于调试弹出菜单</a>。</p> - -<h3 id="弹出菜单尺寸重新计算">弹出菜单尺寸重新计算</h3> - -<p>弹出菜单自动根据其内容调整尺寸。其适应算法可能因浏览器而不同。</p> - -<p>在火狐, 尺寸只再弹出菜单显示前被计算,而且在内容变化后至多进行每秒十次的计算。严格来说, 尺寸受 <code><a href="/en-US/docs/Web/HTML/Element/body"><body></a></code> 元素放置尺寸决定。 一种怪异的说法是, 他由 <code><a href="/en-US/docs/Web/HTML/Element/html"><html></a></code> 决定, Firefox 计算该元素的推荐宽度, 重新调整弹出菜单至其宽度, 然后完成尺寸调整所以这里没有上下滚动。 如果适应用户的屏幕他可能会增长到800X600px的尺寸。 如果用户 <a href="https://support.mozilla.org/en-US/kb/customize-firefox-controls-buttons-and-toolbars#w_customize-the-menu-or-the-toolbar">移动弹出菜单对应按钮到菜单面板</a> ,而后弹出菜单会在菜单栏内显示并具有合适的尺寸。</p> - -<h2 id="设置页面">设置页面</h2> - -<p>设置页面允许你定义你的扩展可以被用户修改的选项。 用户从浏览器扩展管理器中访问设置页面:</p> - -<p>{{EmbedYouTube("02oXAcbUv-s")}}</p> - -<p>每个浏览器访问该页面的方法存在区别。</p> - -<ul> -</ul> - -<p>你可以通过调用 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/Runtime/openOptionsPage" title="If your add-on does not have an options page, or the browser failed to create one for some other reason, runtime.lastError will be set."><code>runtime.openOptionsPage()</code></a> 打开设置页面</p> - -<p>设置页面存在一个限制其可以加载资源的源地址的安全机制, 同时不允许类似 <code><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/eval">eval()</a></code> 的做法的使用 查看 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/Content_Security_Policy">Content Security Policy</a> 获取更多细节。</p> - -<h3 id="定义一个设置页面:">定义一个设置页面:</h3> - -<p>创建一个设置页面有以下流程:</p> - -<ul> - <li>写一个HTML文件定义页面。该文件像普通网页一样可以包含CSS和Javascript 文件而且可以使用所有 <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions/API">WebExtension APIs</a> ,特别的你可以使用 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/API/Storage" title="Enables WebExtensions to store and retrieve data, and listen for changes to stored items."><code>storage</code></a> API 来保存设置。</li> - <li>将这些文件打包至你的扩展。</li> - <li>在manifest.json 文件包含 <code><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Add-ons/WebExtensions/manifest.json/options_ui">options_ui</a></code> 关键字, 并给予设置页面的URL。</li> -</ul> - -<h3 id="例子_3">例子</h3> - -<p> <a href="https://github.com/mdn/webextensions-examples/tree/master/favourite-colour">favourite-colour</a> 使用了设置页面。</p> - -<h2 id="上下文菜单项">上下文菜单项</h2> - -<p>使用 {{WebExtAPIRef("contextMenus")}} API, 你可以按你指定的情况向浏览器上下文菜单添加项目, 比如,你可以只在用户点击图片时显示一项,或者在一个可编辑的元素上,或者被选择的页面的一部份。</p> - -<h3 id="指定一个上下文菜单项">指定一个上下文菜单项</h3> - -<p>您可以使用{{WebExtAPIRef("contextMenus")}} API来 程序化地管理上下文菜单项。</p> - -<h3 id="例子_4">例子</h3> - -<p> <a href="https://github.com/mdn/webextensions-examples/tree/master/context-menu-demo">context-menu-demo</a> 创建了几种不同的上下文菜单项。</p> - -<h2 id="通知">通知</h2> - -<p>使用 {{WebExtAPIRef("notifications")}} API,你通过使用操作系统的通知系统可以创建短时通知:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/14043/notify-shadowed.png" style="display: block; height: 334px; margin-left: auto; margin-right: auto; width: 700px;"></p> - -<h3 id="定义一个通知">定义一个通知</h3> - -<p>使用{{WebExtAPIRef("notifications")}} API 可以程序化地管理通知。</p> - -<h3 id="Examples">Examples</h3> - -<p><a href="https://github.com/mdn/webextensions-examples/tree/master/notify-link-clicks-i18n">notify-link-clicks-i18n</a> 创建了通知。</p> |