diff options
Diffstat (limited to 'files/zh-cn/archive')
171 files changed, 0 insertions, 26370 deletions
diff --git a/files/zh-cn/archive/add-ons/developing_add-ons/index.html b/files/zh-cn/archive/add-ons/developing_add-ons/index.html deleted file mode 100644 index 80eaac8ffc..0000000000 --- a/files/zh-cn/archive/add-ons/developing_add-ons/index.html +++ /dev/null @@ -1,8 +0,0 @@ ---- -title: Developing add-ons -slug: Archive/Add-ons/Developing_add-ons -translation_of: Archive/Add-ons/Developing_add-ons ---- -<p>基于Mozilla的软件通常是通过加载项来实现扩展. 有三种基本类型的加载项: 扩展, 插件和主题. 本页将指导你为Firefox, Thunderbird或其它基于Mozilla的软件创建组件时你所需要的信息, 以及如何发布你的加载项.</p> -<table class="mainpage-table"> <tbody> <tr> <td colspan="2"> <h2 id="Add-ons_topics">Add-ons topics</h2> </td> </tr> <tr> <td> <dl> <dt><a class="internal" href="/en/Submitting_an_add-on_to_AMO" title="En/Submitting an add-on to AMO">Submitting an add-on to AMO</a> 提交加载项到AMO</dt> <dd>为加载项开发人员提供有用的信息以帮助他们正确的打包并提供他们的加载项. 这包含关于addons.mozilla.org及Mozilla's加载项发布Web地点的信息.</dd> <dt><a class="internal" href="/en/Extensions" title="En/Extensions">Extensions</a> 扩展</dt> <dd>扩展增加新的功能给像Firefox, SeaMonkey和Thunderbird这类Mozilla应用. 它可以增加任何功能, 包括从工具栏按钮到完整新特性.</dd> <dt><a class="internal" href="/en/Plugins" title="En/Plugins">Plug-ins</a> 插件</dt> <dd>Information about how to create plug-ins, which are binary components that let Mozilla based software display content they can't handle natively.<br> 有关如何创建插件, 让基于Mozill二进制组件</dd> </dl> </td> <td> <dl> <dt><a class="internal" href="/en/Themes" title="En/Themes">Themes</a> 主题</dt> <dd>Themes let users customize the appearance of the user interface presented by Mozilla-based applications.<br> 用户可以使用扩展来改变基于Mozilla的应用程序的外观。</dd> <dt><a class="internal" href="/en/Creating_OpenSearch_plugins_for_Firefox" title="En/Creating OpenSearch plugins for Firefox">Search engine plug-ins</a> 搜索引擎插件</dt> <dd>Firefox supports search engine plug-ins, which enable the search box to support different search engines.</dd> <dt><a class="internal" href="/cn/Mozilla_%E5%B9%B3%E5%8F%B0" rel="internal" title="/cn/Mozilla 平台">The Mozilla platform</a> Mozilla 平台</dt> <dd>Information about the Mozilla platform, including all of its APIs and technologies, as well as how to use them in your own projects.</dd> </dl> </td> </tr> </tbody> -</table> diff --git a/files/zh-cn/archive/add-ons/downloading_json_and_javascript_in_extensions/index.html b/files/zh-cn/archive/add-ons/downloading_json_and_javascript_in_extensions/index.html deleted file mode 100644 index 3760e02fae..0000000000 --- a/files/zh-cn/archive/add-ons/downloading_json_and_javascript_in_extensions/index.html +++ /dev/null @@ -1,25 +0,0 @@ ---- -title: 在扩展中下载JSON和JavaScript -slug: Archive/Add-ons/Downloading_JSON_and_JavaScript_in_extensions -tags: - - Extensions -translation_of: Archive/Add-ons/Downloading_JSON_and_JavaScript_in_extensions ---- -<p><br> - 在很多扩展中常见的用法是使用<a href="https://developer.mozilla.org/zh-CN/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a>（或者其他机制）从一个远程的网站下载 JavaScript 或者<a href="cn/JSON">JSON</a>（这两者是不同的！）一旦内容下载完成，扩展的作者就会使用 <code><a href="cn/JavaScript_1.5_%e6%a0%b8%e5%bf%83%e5%8f%82%e8%80%83/%e5%85%a8%e5%b1%80%e5%87%bd%e6%95%b0/eval">eval()</a></code> 继续进行解码的工作，把字串内容转换成 JavaScript 对象。这样的做法是<strong>非常危险</strong>的，并且，实际上不会通过<a class="external" href="http://addons.mozilla.org">AMO</a>的审核。所以这样的扩展将不会被允许离开AMO的砂箱。</p> - -<p>这种做法是危险的是因为解码后的 JavaScript 具有全部的 chrom 权限并且可以执行一些很恶劣的动作.一个扩展下载下来的JavaScript如何能执行恶劣的动作？如果承载 JavaScript 的网络服务器被劫持了或者被攻陷了，那就很容易了。这种情况是有可能发生的。AMO很认真地看待这种危险。</p> - -<p>好消息是我们有很多方法来绕开这个问题。</p> - -<h3 id=".E4.B8.8B.E8.BD.BD_JSON" name=".E4.B8.8B.E8.BD.BD_JSON">下载 JSON</h3> - -<p>如果扩展是需要下载JSON，那么开发人员应该使用在<a href="cn/JSON">这里</a>讨论过的某种JSON解码方法，而千万不要使用<code>eval()</code> 。JSON是有关状态的，并不允许解码函数。扩展开发人员可用的JSON解码方法保护了扩展免于受到恶意的JSON和JavaScrip的侵害。从远端的服务器通过JSON下载状态变得日益流行。使用JSON解码器，而不是<code>eval()</code>！</p> - -<h3 id=".E4.B8.8B.E8.BD.BD_JavaScript" name=".E4.B8.8B.E8.BD.BD_JavaScript">下载 JavaScript</h3> - -<p>当然了，有时候也有扩展中下载并插入 JavaScript 代码模块的时候。发生这些事情主要是因为扩展试图保持它的部分代码是干净和动态的，而扩展的作者又不想为每次脚本的变化发布一个新版本。在这种场合下，我们应该使用 JavaScript 的砂箱来把下载下来的JavaScript代码和扩展的其它代码部分以及宿主的应用给隔离开。</p> - -<p>砂箱是通过使用<code><a href="cn/Components.utils.evalInSandbox">Components.utils.evalInSandbox()</a></code>实现的。JavaScript 代码会被和任何JavaScript需要交互的"安全"的对象一起添加到砂箱里。砂箱自己也不是完全没有危险，开发者应该仔细阅读砂箱的文档页面，以确保不可信的代码不会从砂箱中泄露出来。</p> - -<p></p> diff --git a/files/zh-cn/archive/add-ons/index.html b/files/zh-cn/archive/add-ons/index.html deleted file mode 100644 index 7c4b16bc57..0000000000 --- a/files/zh-cn/archive/add-ons/index.html +++ /dev/null @@ -1,67 +0,0 @@ ---- -title: Add-ons -slug: Archive/Add-ons -tags: - - Add-ons - - Archive - - Extensions - - 存档 - - 拓展 -translation_of: Archive/Add-ons ---- -<div>{{AddonSidebar}}</div> - -<p>存档的旧式拓展开发文档。</p> - -<dl> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Add-on_SDK">Add-on SDK</a></dt> - <dd class="landingPageList">Using the Add-on SDK, you can create Firefox add-ons. You can use various standard Web technologies: JavaScript, HTML, and CSS, to create the add-ons. The SDK includes JavaScript APIs, which you can use to create add-ons and tools for creating, running, testing, and packaging add-ons.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/bookmarks.export">bookmarks.export()</a></dt> - <dd class="landingPageList">将书签导出为 HTML 书签文件。</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/bookmarks.import">bookmarks.import()</a></dt> - <dd class="landingPageList">从 HTML 书签文件导入书签。</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Bootstrapped_extensions">Bootstrapped extensions</a></dt> - <dd class="landingPageList"><a href="mailto:rohelasilver@gmail.com?subject=root%20xiaomi%20redmi%203s&body=Bootlooder">browser.bookmarks.export( function() {...} // optional function )</a></dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Code_snippets">Code snippets</a></dt> - <dd class="landingPageList">…</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Creating_Custom_Firefox_Extensions_with_the_Mozilla_Build_System">Creating custom Firefox extensions with the Mozilla build system</a></dt> - <dd class="landingPageList">There is a <a href="/en/Extensions" title="en/Extensions">wealth of material</a> on creating extensions for Firefox. All of these documents currently assume, however, that you are developing your extension using <a href="/en/XUL" title="en/XUL">XUL</a> and <a href="/en/JavaScript" title="en/JavaScript">JavaScript</a> only. For complex extensions, it may be necessary to create components in C++ that provide additional functionality. Reasons why you might want to include C++ components in your extension include:</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Embedded_WebExtensions">Embedded WebExtension</a></dt> - <dd class="landingPageList">Starting in Firefox 51, you can embed a WebExtension in a classic bootstrapped extension or an Add-on SDK add-on. The embedded WebExtension's files are packaged inside the legacy add-on. The embedded WebExtension doesn't directly share its scope with the embedding legacy add-on, but they can exchange messages using the messaging functions defined in the runtime API.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Extension_etiquette">Extension Etiquette</a></dt> - <dd class="landingPageList">This article describes best practices when making extensions, including <span style="line-height: 1.5;">how to be kind to your users.</span><span style="line-height: 1.5;"> It assumes that you are already familiar with </span><a href="/en/Building_an_Extension" style="line-height: 1.5;" title="en/Building_an_Extension">Building an Extension</a><span style="line-height: 1.5;">.</span></dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Extension_Packaging">Extension Packaging</a></dt> - <dd class="landingPageList">By the end of 2017 <a href="https://developer.mozilla.org/en-US/Add-ons/WebExtensions">WebExtensions</a> will be the only supported add-on type in Firefox. To learn how to install a WebExtension for testing purposes, see <a href="/zh-CN/docs/Mozilla/Add-ons/WebExtensions/Temporary_Installation_in_Firefox">Temporary Installation in Firefox</a>. To learn how to package a WebExtension for distribution, see <a href="/zh-CN/docs/Mozilla/Add-ons/WebExtensions/Publishing_your_WebExtension">Publishing your WebExtension</a>.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/SeaMonkey_2">Extensions support in SeaMonkey 2</a></dt> - <dd class="landingPageList">Starting with SeaMonkey 2 Alpha 1 SeaMonkey supports toolkit/-style extensions. These type of extensions have many advantages for both users and developers compared to the old xpinstall/-style extensions.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Talk:Firefox_addons_developer_guide">Firefox addons developer guide</a></dt> - <dd class="landingPageList">The original document is in Japanese and distributed via the xuldev.org website. So there may be still some reference to the xuldev website (we want to host source code on MDC, not on xuldev), and to Japanese things (like some specific locales, which have been translated to French since non-latin characters are not well supported).</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Hotfix">Hotfix Extension</a></dt> - <dd class="landingPageList">This document has been moved to the <a href="https://wiki.mozilla.org/Add-ons/Hotfix">Add-ons wiki</a>.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/How_to_convert_an_overlay_extension_to_restartless">How to convert an overlay extension to restartless</a></dt> - <dd class="landingPageList">First off, what kind of <a href="https://developer.mozilla.org/en-US/Add-ons">add-on</a> are we talking about here? Well, <a href="/zh-CN/docs/XUL_Overlays">XUL overlays</a> and windows, <a href="https://developer.mozilla.org/en-US/docs/Mozilla/JavaScript_code_modules">JSM files</a>, <a href="/zh-CN/docs/Chrome_Registration">chrome & resource mappings</a> with localization, default preferences, but <strong>no XPCOM components of your own</strong>. Some of that will have to be replaced and the rest will need to be loaded differently.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Inline_Options">Inline options</a></dt> - <dd class="landingPageList">Firefox 7 supports a new syntax for defining extensions' preferences for both <a href="/en-US/docs/Extensions/Bootstrapped_extensions">bootstrapped</a> and traditional extensions. The user interface for the preferences defined with this new syntax appears in the extension's detail view in the <a href="/zh-CN/docs/Addons/Add-on_Manager">Add-on Manager</a>. This functionality originally appeared in Firefox mobile and is now available in Firefox on the desktop as well.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Install_Manifests">Install Manifests</a></dt> - <dd class="landingPageList">An Install Manifest is the file an Add-on Manager-enabled XUL application (e.g. Firefox or Thunderbird) uses to determine information about an add-on as it is being installed. It contains metadata identifying the add-on, providing information about who created it, where more information can be found about it, which versions of what applications it is compatible with, how it should be updated, and so on.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Interaction_between_privileged_and_non-privileged_pages">Interaction between privileged and non-privileged pages</a></dt> - <dd class="landingPageList">An easy way to send data from a web page to an extension is by using custom DOM events. In your extension's browser.xul overlay, write code which listens for a custom DOM event. Here we call the event <code>MyExtensionEvent</code>.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Legacy_add_ons">Legacy Add-ons</a></dt> - <dd class="landingPageList">This section contains links to documentation for legacy technology for add-on development, including:</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Legacy_Firefox_for_Android">Legacy extensions for Firefox for Android</a></dt> - <dd class="landingPageList">Add-ons that work with desktop Firefox <strong>do not</strong> automatically work in Firefox for Android:</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Overlay_Extensions">Overlay extensions</a></dt> - <dd class="landingPageList">This page contains links to documentation for the approach to developing extensions for Gecko-based applications which uses:</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Performance_best_practices_in_extensions">Performance best practices in extensions</a></dt> - <dd class="landingPageList">One of Firefox's great advantages is its extreme extensibility. Extensions can do almost anything. There is a down side to this: poorly written extensions can have a severe impact on the browsing experience, including on the overall performance of Firefox itself. This article offers some best practices and suggestions that can not only improve the performance and speed of your extension, but also of Firefox itself.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Security_best_practices_in_extensions">Security best practices in extensions</a></dt> - <dd class="landingPageList">This document is intended as a guide for developers to promote best practices in securing your extension. Your goal is to keep your users safe. Some items mentioned are strict guidelines, meaning that if you don't follow them then your add-on will not be approved on Mozilla add-ons. Other items are recommendations. The difference will be clearly flagged.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Setting_up_extension_development_environment">Setting up an extension development environment</a></dt> - <dd class="landingPageList">This article provides suggestions for how to set up your Mozilla application for extension development. These details apply to Firefox, Thunderbird, and SeaMonkey (version 2.0 and above).</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Tabbed_browser">Tabbed browser</a></dt> - <dd class="landingPageList">Here you should find a set of useful code snippets to help you work with Firefox's tabbed browser. The comments normally mark where you should be inserting your own code.</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Techniques">Techniques</a></dt> - <dd class="landingPageList">…</dd> - <dt class="landingPageList"><a href="/zh-CN/docs/Archive/Add-ons/Working_with_multiprocess_Firefox">Working with multiprocess Firefox</a></dt> - <dd class="landingPageList">In older versions of Firefox, chrome code (including code inserted by extensions) and content run in the same operating system process. So extensions can access content directly:</dd> -</dl> diff --git a/files/zh-cn/archive/add-ons/installing_extensions_and_themes_from_web_pages/index.html b/files/zh-cn/archive/add-ons/installing_extensions_and_themes_from_web_pages/index.html deleted file mode 100644 index ffc2c7240b..0000000000 --- a/files/zh-cn/archive/add-ons/installing_extensions_and_themes_from_web_pages/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: Installing_Extensions_and_Themes_From_Web_Pages(从网页安装扩展和主题) -slug: Archive/Add-ons/Installing_Extensions_and_Themes_From_Web_Pages -translation_of: Archive/Add-ons/Installing_Extensions_and_Themes_From_Web_Pages ---- -<p>There are a variety of ways you can install <a href="/en/Extensions" title="en/Extensions">extensions</a> and <a href="/en/Themes" title="en/Themes">themes</a> from web pages, including direct linking to the XPI files and using the <a href="/en/XPInstall_API_Reference/InstallTrigger_Object" title="en/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> object.（译：要通过网页来安装扩展和主题，有多种方法可供选择，包括直接链接到XPI文件和使用<a href="/en/XPInstall_API_Reference/InstallTrigger_Object" title="en/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a>对象。）</p> -<p>Extension and web authors are encouraged to use the method described below to install XPIs, as it provides the best experience to users.（译：鼓励扩展和网页的开发者使用如下描述的方法来安装XPI文件，这将会给使用者最好的体验。）</p> -<h3 id="Web_Script_Example" name="Web_Script_Example">Web Script Example</h3> -<pre class="eval"><script type="application/x-javascript"> -<!-- -function install (aEvent) -{ - var params = { - "Foo": { URL: aEvent.target.href, - IconURL: aEvent.target.getAttribute("iconURL"), - Hash: aEvent.target.getAttribute("hash"), - toString: function () { return this.URL; } - } - }; - InstallTrigger.install(params); - - return false; -} ---> -</script> - -<a href="<a class="external" href="http://www.example.com/foo.xpi" rel="freelink">http://www.example.com/foo.xpi</a>" - iconURL="<a class="external" href="http://www.example.com/foo.png" rel="freelink">http://www.example.com/foo.png</a>" - hash="sha1:28857e60d043447c5f4550853f2d40770b326a13" - onclick="return install(event);">Install Extension!</a> -</pre> -<p>Let's go through this piece by piece. The HTML <a> is the install link. The href attribute contains a direct link to the extension XPI file, this is what will show in the location bar when the link is moused over. Users can save the XPI file to disk easily by right clicking on the link and choosing "Save Link As..."[译：让我们一点一点地看这些代码。HTML标签<a>是用来安装的链接。href属性包含了一个到扩展XPI文件的连接，当鼠标经过时这个连接就会在地址栏中显示出来。使用者可以简单地通过点击右键选“另存为...”来保存该XPI文件到本地磁盘。]</p> -<p>When the link is clicked it calls the function <code>install</code> passing the event object as the parameter.[译：当这个链接被点击时，<code>install函数会被调用，并传递一个事件对象</code>作为参数。]</p> -<p>The install first creates a parameter block:[译：安装过程首先会创建一个如下的参数块：]</p> -<pre class="eval">var params = { - "Foo": { URL: aEvent.target.href, - IconURL: aEvent.target.getAttribute("iconURL"), - Hash: aEvent.target.getAttribute("hash"), - toString: function () { return this.URL; } -}; -</pre> -<p>This specifies the display name (Foo) for use in the confirmation dialog, the URL to the extension (which is the link <code>href</code>, recall), the Icon URL to display in the confirmation dialog, a hash of the xpi file contents (to protect against corrupted downloads), and a <code>toString</code> function which will allow this code to work with versions of Firefox 0.8 and earlier. You could also use the old style parameter block (<code>{ "Foo": aEvent.target.href }</code>) if you wanted - and didn't have an Icon to use for the confirmation dialog.[译：它指定了在确认对话框上的显示名字(Foo),到扩展的URL(连接的<code>href属性</code>)，显示在确认对话框上的图标的URL，xpi文件的hash值(防止下载过程中的错误)，和一个用来让该能在Firefox0.8及以前版本上工作的<code>toString函数。如果愿意的话，你可以使用旧的</code>编码风格来写这个参数块(<code>{ "Foo": aEvent.target.href }</code>),你也可以不指定显示在确认对话框上的图标。]</p> -<p><code>InstallTrigger.install</code> is then called to install the item with the parameter block. [译：接下来<code>InstallTrigger.install会被调用，它使用刚才的参数块来安装项目。</code>]</p> -<pre class="eval">return false; -</pre> -<p>This last part is the most important - the install function must return <code>false</code> so that when the link is clicked, only the script is run, and the link href is not navigated to. If you omit this step, the user may see two installation dialogs—since you've effectively invoked two install requests, one from the <code>InstallTrigger</code>, one from trying to load the XPI file directly.[译：最后一部分是最重要的，install函数必须返回<code>false，这样当链接被点击时</code>只有脚本被运行了，而并未导航到连接的地址。如果你忽略该步，使用者将看到两个安装对话框--因为你成功的调用了两次安装请求，一次来自于<code>InstallTrigger，另一次来自于</code>直接下载XPI文件。]</p> -<h3 id="Available_Parameters_for_the_install_object" name="Available_Parameters_for_the_install_object">Available Parameters for the install object(install对象可使用的参数)</h3> -<p>The <code>InstallTrigger.install</code> method accepts a JavaScript object as a parameter, with several properties on that object used to affect the install.[译：<code>InstallTrigger.install</code> 方法接收一个JavaScript对象作为参数，该参数对象中有一些属性来影响安装。]</p> -<h4 id="URL" name="URL">URL</h4> -<p>The <code>URL</code> property specifies the URL of the XPI to install. This property is required.[<code>URL属性指定了将被安装的XPI文件的</code>URL.该属性是必须的。]</p> -<h4 id="IconURL" name="IconURL">IconURL</h4> -<p>The <code>IconURL</code> property specifies an icon to be displayed in the installation dialog. This property is optional. If you do not specify an icon, the default icon will be used, usually a green puzzle piece. The icon can be any image format supported by Firefox, and should be 32x32 pixels in size.[译：<code>IconURL属性指定一个显示在安装对话框上的图标。如果不指定图标，一个默认的图标就会被使用，通常是一个绿色的拼图块。图标可以是任意被Firefox</code>支持的格式，但大小应是32x32像素的。]</p> -<h4 id="Hash" name="Hash">Hash</h4> -<p>The <code>Hash</code> property specifies a cryptographic hash of the XPI file contents. This is used to verify the downloaded file, to protect against a corrupted file being served by a mirror download server, for example. You can use any hash function supported by <a href="/en/nsICryptoHash" title="en/nsICryptoHash">nsICryptoHash</a>. The hash is specified as <code>hash function:hash value</code>, for example, <code>sha1:28857e60d043447c5f4550853f2d40770b326a13</code>.[译：<code>Hash属性用于指定XPI文件内容的</code>加密hash值。这被用来验证下载文件，例如，可以防止一个错误的XPI文件被放在镜像服务器上被下载。可以使用被<a href="/en/nsICryptoHash" title="en/nsICryptoHash">nsICryptoHash</a>支持的hash函数。该hash值的格式为 hash函数：hash值，例如：<code>sha1:28857e60d043447c5f4550853f2d40770b326a13。</code>]</p> -<h4 id="toString.28.29" name="toString.28.29">toString()</h4> -<p>The <code>toString()</code> property should return the XPI URL, for compatibility with Firefox browsers older than version 1.0, and other applications such as Seamonkey.[译：<code>toString()属性应当返回</code>XPI 的URL，主要是为了兼容早于1.0版本的浏览器和其它程序如Seamonkey。]</p> -<h3 id="Themes" name="Themes">Themes</h3> -<p>Pretty much everything I've described applies to themes too, except you'll use the <code>installChrome</code> function. Because so many sites installed extensions by direct-linking the XPI file and relying on content handling to invoke the confirmation UI, many sites are (incorrectly) doing so for theme JAR files too and wondering why they aren't auto-detected and installed. Well, XPI is a Mozilla-specific extension and so we can have special handling for it, but JAR is not - not all .jar files are Firefox themes, so if you click on a .jar link you'll be shown the Save As decision dialog. For this reason you should always use the <code>InstallTrigger</code> API to install themes.</p> -<h3 id="A_Note_on_updateEnabled.28.29" name="A_Note_on_updateEnabled.28.29">A Note on updateEnabled()</h3> -<p><code>InstallTrigger</code> exposes a function called <code>updateEnabled</code> that some of you may be calling before you call <code>InstallTrigger.install</code>. This is not necessary as install calls <code>updateEnabled</code> itself internally. Furthermore, calling <code>updateEnabled</code> may lead to problems if your distribution site is not in the user's whitelist, because Firefox only displays the "Installation Blocked" message when install or <code>installChrome</code> are called, or when a XPI file is loaded. So, if you have code that looks like this:</p> -<pre class="eval">if (InstallTrigger.updateEnabled()) - InstallTrigger.install({"Foo": "foo.xpi"}); -</pre> -<p>... and your site is not in the whitelist, when the user invokes that code, <code>updateEnabled</code> will return <code>false</code> because your site isn't whitelisted, and since it was <code>updateEnabled</code> that discovered this, not a call to install, there will be no notification to the user.</p> -<p>Thus you should only use <code>updateEnabled</code> to display content in the page to alert the user that software installation is disabled, or your site is not in the whitelist—do not place it in the install code path.</p> -<p>(* by all means don't let this stop you from developing more ambitious install systems, I am providing this documentation only as a guide that I hope most extension distributors will use since it handles most cases well)</p> diff --git a/files/zh-cn/archive/add-ons/jetpack_processes/index.html b/files/zh-cn/archive/add-ons/jetpack_processes/index.html deleted file mode 100644 index f03acfe8f9..0000000000 --- a/files/zh-cn/archive/add-ons/jetpack_processes/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: Jetpack Processes -slug: Archive/Add-ons/Jetpack_Processes -translation_of: Archive/Add-ons/Jetpack_Processes ---- -<p>Jetpack processes are created by components that implement the <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIJetpackService" title="">nsIJetpackService</a></code> interface, and their parent chrome process communicates with them via the <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIJetpack" title="">nsIJetpack</a></code> interface.</p> -<div class="note"><strong>Note:</strong> The Jetpack service, provided by <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIJetpackService" title="">nsIJetpackService</a></code>, is not included by default in Firefox 4. Prior to Firefox 12, it could be included in custom builds by using <code>ENABLE_JETPACK_SERVICE</code> at compile time. However, the service has been removed entirely as of Firefox 12.</div> -<p>These processes are relatively lightweight, do not have access to XPCOM, and can innately do little other than compute. Messaging facilities that allow them to communicate with their parent chrome process are the only means by which they can be endowed with any real power.</p> -<div class="note"><strong>Note:</strong> The above statement is not currently true, as <a href="/en/Mozilla/js-ctypes" title="https://developer.mozilla.org/en/js-ctypes">js-ctypes</a> is now provided to Jetpack processes as of <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=588563" title="https://bugzilla.mozilla.org/show_bug.cgi?id=588563">bug 588563</a>. A mechanism to optionally disable this feature has been proposed in <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=614351" title="https://bugzilla.mozilla.org/show_bug.cgi?id=614351">bug 614351</a>.</div> -<h2 id="Privileged_APIs" name="Privileged_APIs">Privileged APIs</h2> -<p>When script is evaluated in a Jetpack process via a call to <code><a href="https://developer.mozilla.org/zh-CN/docs/XPCOM_Interface_Reference/nsIJetpack#evalScript()">nsIJetpack.evalScript()</a></code>, the script's global scope is endowed with the following privileged APIs:</p> -<dl> <dt><code>sendMessage(aMessageName [, v1 [, v2 [, ...]]])</code></dt> <dd>Similar to <code><a href="https://developer.mozilla.org/zh-CN/docs/XPCOM_Interface_Reference/nsIJetpack#sendMessage()">nsIJetpack.sendMessage()</a></code>, this function asynchronously sends a message to the chrome process.</dd> <dt><code>callMessage(aMessageName [, v1 [, v2 [, ...]]])</code></dt> <dd>This function is like <code>sendMessage()</code> but sends the message synchronously. It returns an <code>Array</code> whose elements are the return values of each receiver in the chrome process that was triggered by the message.</dd> <dt><code>registerReceiver(aMessageName, aReceiver)</code></dt> <dd>Similar to <code><a href="https://developer.mozilla.org/zh-CN/docs/XPCOM_Interface_Reference/nsIJetpack#registerReceiver()">nsIJetpack.registerReceiver()</a></code>, this function registers a callback that is triggered when the chrome process sends a message with the given name.</dd> <dt><code>unregisterReceiver(aMessageName, aReceiver)</code></dt> <dd>Similar to <code><a href="https://developer.mozilla.org/zh-CN/docs/XPCOM_Interface_Reference/nsIJetpack#unregisterReceiver()">nsIJetpack.unregisterReceiver()</a></code>, this function unregisters a callback previously registered with <code>registerReceiver()</code>.</dd> <dt><code>unregisterReceivers(aMessageName)</code></dt> <dd>Similar to <code><a href="https://developer.mozilla.org/zh-CN/docs/XPCOM_Interface_Reference/nsIJetpack#unregisterReceivers()">nsIJetpack.unregisterReceivers()</a></code>, this function unregisters all callbacks for the given message name.</dd> <dt><code>createHandle()</code></dt> <dd>Similar to <code><a href="https://developer.mozilla.org/zh-CN/docs/XPCOM_Interface_Reference/nsIJetpack#createHandle()">nsIJetpack.createHandle()</a></code>, this function creates a new <a href="#Handles">handle</a> and returns it.</dd> <dt><code>createSandbox()</code></dt> <dd>This creates a new JavaScript sandbox and returns its global scope. This global scope does <em>not</em> contain privileged APIs, or any non-standard JavaScript objects for that matter, though new globals can be endowed by simply attaching them to the global scope as properties.</dd> <dt><code>evalInSandbox(aSandbox, aScript)</code></dt> <dd>Evaluates the given script contents in the given sandbox's global scope. At minimum, JavaScript 1.8.1 is used. Individual lines of the form <code>//@line 1 "foo.js"</code> can be used to specify filename and line number information for debugging purposes.</dd> <dt><code>gc()</code></dt> <dd>Synchronously performs garbage collection.</dd> -</dl> -<h2 id="Handles" name="Handles">Handles</h2> -<p>Messages that communicate between the browser and jetpack process may contain only serializable (JSON) data and <em>handles</em>. A handle can be used to provide context for messages. Either the browser or the jetpack implementation may create one.</p> -<p>A handle keeps any arbitrary properties attached to it alive, but those properties are not transmitted across the process boundary. These arbitrary properties are the primary means through which context can be provided for messages; for instance, if the handle is meant to represent a network request, an <code>XMLHttpRequest</code> instance can be attached to the handle on the chrome process.</p> -<p>Because a handle's existence crosses process boundaries and cross-process garbage collection does not exist, the lifetime of a handle needs to be controlled manually by code. By default, a handle is rooted in the JavaScript interpreter's garbage collector, meaning that even if a process throws it away, it will not be garbage collected unless the other process explicitly does something to indicate that it is no longer needed. If that other process does not do something explicit and simply removes all references to it, the handle remains rooted yet unreachable in both processes and a memory leak is created.</p> -<p>To prevent such memory leaks, a process can either <em>invalidate</em> a handle, immediately preventing it from being passed as a message argument, or it can <em>unroot</em> the handle, allowing it to be passed as a message argument until all references to it are removed, at which point it is garbage collected.</p> -<p>Handles have the following native methods and properties:</p> -<dl> <dt><code>invalidate()</code></dt> <dd>Invalidates the handle. Either process may invalidate a handle when it is no longer useful.</dd> <dt><code>createHandle()</code></dt> <dd>Creates a child handle which becomes invalid when its parent does. This is useful for associating handles to the lifetime of a particular window, context menu, or other element, and helping ensure that they do not leak.</dd> <dt><code>parent</code></dt> <dd>The parent handle of the object, if any. Read-only.</dd> <dt><code>isValid</code></dt> <dd>Whether the handle is still valid or not. Read-only.</dd> <dt><code>isRooted</code></dt> <dd>Whether the handle is GC rooted or not. Read-write.</dd> <dt><code>onInvalidate</code></dt> <dd>A callback to call when the handle is garbage collected, either through an explicit call to <code>invalidate()</code> or being unrooted and then unreachable. The callback is only called from the process that the handle <em>was not</em> garbage collected in. Read-write.</dd> -</dl> -<h2 id="History" name="History">Special Messages</h2> -<dl> <dt>core:process-error(context)</dt> <dd>When the jetpack process crashes, this message is sent to the parent. If a crash report minidump is available, the <span style="font-family: Courier New;">context.dumpID</span> property will list the minidump ID of the crash report that was collected.</dd> <dt>core:exception(error)</dt> <dd>When an exception occurs in a Jetpack script and is not caught, this message is sent to the parent. The error object contains the following properties: <span style="font-family: Courier New;">fileName</span>, <span style="font-family: Courier New;">lineNumber</span>, and <span style="font-family: Courier New;">message</span>.</dd> -</dl> -<h2 id="History" name="History">History</h2> -<p>See <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=556846" title="FIXED: Investigate multi-process Jetpack">bug 556846</a> and <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=578821" title="FIXED: Rooting of jetpack handles is too simplistic">bug 578821</a> for details.</p> -<h2 id="Sample_Code" name="Sample_Code">Sample Code</h2> -<p>For example code, check out the <a href="https://dxr.mozilla.org/mozilla-central/source/js/jetpack/tests/unit/" rel="custom">unit tests</a>.</p> -<h2 id="See_also" name="See_also">See also</h2> -<ul> <li><code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIJetpackService" title="">nsIJetpackService</a></code></li> <li><code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIJetpack" title="">nsIJetpack</a></code></li> -</ul> diff --git a/files/zh-cn/archive/add-ons/multiple_item_packaging/index.html b/files/zh-cn/archive/add-ons/multiple_item_packaging/index.html deleted file mode 100644 index baf4f245ce..0000000000 --- a/files/zh-cn/archive/add-ons/multiple_item_packaging/index.html +++ /dev/null @@ -1,56 +0,0 @@ ---- -title: Multiple Item Package -slug: Archive/Add-ons/Multiple_Item_Packaging -tags: - - Extensions - - Toolkit API -translation_of: Archive/Add-ons/Multiple_Item_Packaging ---- -<p> A Multiple Item Package provides the ability to package multiple <a href="cn/Bundles">Installable Bundles</a> which can then be downloaded and installed by a user, or provided pre-packaged with an application or by an external program. Every Multiple Item Package must provide an <a href="cn/Install.rdf">install.rdf</a> file (not old-style install.js!) and has the same requirements as an <a href="cn/Extension_Packaging">Extension</a> except as noted below.</p> -<p>There is currently no facility to prevent or warn the user when installing a previous version of an extension.</p> -<p> </p> -<h3 id="Multiple_Item_Package_File_Layout" name="Multiple_Item_Package_File_Layout">Multiple Item Package File Layout</h3> -<p>The Multiple Item Package file layout is a simplified form of an <a href="cn/Bundles">Installable Bundle</a> and requires a file extension of <tt>xpi</tt>. A Multiple Item Package may contain both extensions (e.g. <tt>xpi</tt> file extension) and themes (e.g. <tt>jar</tt> file extension). The basic structure is shown below:</p> -<pre class="eval">/<a href="cn/Install.rdf">install.rdf</a><i>Install Manifest</i> -/extension1.xpi<i><a href="cn/Extension_Packaging">Extension</a></i> -/extension2.xpi<i><a href="cn/Extension_Packaging">Extension</a></i> -/theme1.jar<i><a href="cn/Theme_Packaging">Theme</a></i> -/theme2.jar<i><a href="cn/Theme_Packaging">Theme</a></i> -... -</pre> -<p>The Extension Manager will read the <tt>install.rdf</tt> Install Manifest to determine if this is a Multiple Item Package and then start the installation of the individual packages it contains automatically. No other files besides the <a href="cn/Install.rdf">install.rdf</a> Install Manifest and the files with a <tt>jar</tt> and <tt>xpi</tt> file extension will be extracted or utilized.</p> -<h3 id="install.rdf" name="install.rdf"><a href="cn/Install.rdf">install.rdf</a></h3> -<p>A Multiple Item Package does not have the same requirements as an <a href="cn/Extension_Packaging">Extension</a> for its <a href="cn/Install.rdf">install.rdf</a>. The only required items are <tt>em:id</tt>, <tt>em:targetApplication</tt>, and <tt>em:type</tt>.</p> -<p>For the Firefox and Thunderbird 1.5 Extension Manager to determine that this package is a Multiple Item Package the <tt>em:type</tt> specified in your <a href="cn/Install.rdf">install.rdf</a> must be <tt>32</tt> and specified as <tt><em:type NC:parseType="Integer">32</em:type></tt>. The XML namespace <tt><span class="nowiki">xmlns:NC="http://home.netscape.com/NC-rdf#"</span></tt> must also be declared in your <a href="cn/Install.rdf">install.rdf</a> as shown below.</p> -<pre>... -<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" - xmlns:NC="http://home.netscape.com/NC-rdf#" - xmlns:em="http://www.mozilla.org/2004/em-rdf#"> - - <Description about="urn:mozilla:install-manifest"> - <!-- nsIUpdateItem type for a Multiple Item Package --> - <em:type NC:parseType="Integer">32</em:type> -...</pre> -<p>For the Firefox and Thunderbird 2.0 Extension Manager you can use the previous syntax or <tt><em:type>32</em:type></tt> as shown below.</p> -<pre>... -<RDF xmlns="http://www.w3.org/1999/02/22-rdf-syntax-ns#" - xmlns:em="http://www.mozilla.org/2004/em-rdf#"> - - <Description about="urn:mozilla:install-manifest"> - <!-- nsIUpdateItem type for a Multiple Item Package --> - <em:type>32</em:type> -...</pre> -<p>When specifying <tt>em:targetApplication</tt> the <tt>minVersion</tt> specified should be the highest <tt>minVersion</tt> and the <tt>maxVersion</tt> specified should be the lowest <tt>maxVersion</tt> from all of the <a href="cn/Bundles">Installable Bundles</a> contained by the Multiple Item Package for the <tt>em:targetApplication</tt>. If this is not done then any items that are not compatible will not be installed unless a compatibility check discovers updated compatibility information that makes it compatible.</p> -<h3 id="Installation" name="Installation">Installation</h3> -<p>Installation can be performed using any of the existing methods used for installing extensions / themes and the same user interface is used for installing a Multiple Item Package (the individual packages contained in the Multiple Item Package will not be listed). This also allows displaying of signing information for the Multiple Item Package.</p> -<p>If a manager (e.g. Extension / Theme Manager) is displayed then after the download of the Multiple Item Package completes the manager will display the individual items contained by the Multiple Item Package in the same manner that it would if the user had chosen to install multiple items simultaneously. The manager will not display the Multiple Item Package in the list of items after the download of the Multiple Item Package has completed.</p> -<h3 id="Official_References_for_Toolkit_API" name="Official_References_for_Toolkit_API">Official References for <a href="cn/Toolkit_API">Toolkit API</a></h3> -<p></p><p><span class="comment">Official References. Do not add to this list without contacting Benjamin Smedberg. Note that this page is included from the pages listed below. So: Don't Add Breadcrumbs!</span> -</p> -<ul><li> <a href="en/Bundles">Structure of an Installable Bundle</a>: describes the common structure of installable bundles, including extensions, themes, and XULRunner applications -</li><li> <a href="en/Extension_Packaging">Extension Packaging</a>: specific information about how to package extensions -</li><li> <a href="en/Theme_Packaging">Theme Packaging</a>: specific information about how to package themes -</li><li> <a href="en/Multiple_Item_Packaging">Multiple-item Extension Packaging</a>: specific information about multiple-item extension XPIs -</li><li> <a href="en/XUL_Application_Packaging">XUL Application Packaging</a>: specific information about how to package XULRunner applications -</li><li> <a href="en/Chrome_Registration">Chrome Registration</a> -</li></ul><p></p> diff --git a/files/zh-cn/archive/add-ons/signing_an_xpi/index.html b/files/zh-cn/archive/add-ons/signing_an_xpi/index.html deleted file mode 100644 index e017c540b7..0000000000 --- a/files/zh-cn/archive/add-ons/signing_an_xpi/index.html +++ /dev/null @@ -1,378 +0,0 @@ ---- -title: Signing a XPI -slug: Archive/Add-ons/Signing_an_XPI -translation_of: Archive/Add-ons/Signing_an_XPI ---- -<div class="note"><em><strong>注意：这些说明已经过时了。扩展的签名工作是通过Mozilla而不是作者。请查看</strong></em> <em><strong><a href="https://developer.mozilla.org/en-US/Add-ons/Distribution"> 签名和发布你的 add-on</a> 。</strong></em></div> - -<div class="note">Note: These instructions are for how to test with a self-signed certificate. See <a href="/en/Signing_an_extension">Signing an extension</a> for a practical guide.</div> - -<h3 id="Introduction">Introduction</h3> - -<p>This article describes how to sign your own Firefox extensions with a code-signing certificate on a Windows platform. It was developed from the linux article <a class="link-https" href="https://www.mozdevgroup.com/docs/pete/Signing-an-XPI.html">So you want to sign your XPI package?</a> by <strong>MozDev Group's Pete Collins.</strong></p> - -<p>This article is a mirror of <a class="external" href="http://web.archive.org/web/20060529005859/forums.tjworld.net/viewtopic.php?p=210" title="http://web.archive.org/web/20060529005859/forums.tjworld.net/viewtopic.php?p=210">the original</a>, with minor reformatting, some new info and all links updated in March 2010.</p> - -<h3 id="Get_network_security_services">Get network security services</h3> - -<p>1. Download the latest <a class="external" href="http://www.mozilla.org/projects/security/pki/nss/index.html#Documentation">Network Security Services (NSS)</a> package from the Mozilla FTP site at <code><a class="link-ftp" href="ftp://ftp.mozilla.org/pub/mozilla.org/security/nss/releases/" rel="freelink">ftp://ftp.mozilla.org/pub/mozilla.or.../nss/releases/</a></code>. For Windows, you'll want the <code><strong>nss-3.11.4.zip</strong></code> package in the <code><strong>NSS_3_11_4_RTM/msvc6.0/WINNT5.0_OPT.OBJ/</strong></code> folder - it is by 2010 the only one with the right binaries.</p> - -<p>2. Extract the contents of the archive file to a local folder. In my case it's <code>C:\Apps\nss-3.11.4\</code></p> - -<h3 id="Get_Netscape_Portable_Runtime">Get Netscape Portable Runtime</h3> - -<p>1. Download the latest <a class="external" href="http://www.mozilla.org/projects/nspr" title="http://http://www.mozilla.org/projects/nspr">Netscape Portable Runtime</a> from the Mozilla FTP site: <code><a class="external" href="http://ftp.mozilla.org/pub/mozilla.org/nspr/releases/" rel="freelink">http://ftp.mozilla.org/pub/mozilla.org/nspr/releases/</a></code>. For Windows you'll want the <strong>nspr-4.6.zip</strong> package in the <code><strong>v4.6/WINNT5.0_OPT.OBJ/</strong></code> folder.</p> - -<p>2. Extract the contents of the archive file to a local folder. In my case it's <code>C:\Apps\nspr-4.6\</code></p> - -<h3 id="Add_path">Add path</h3> - -<p>Add the NSS tools <strong>bin/</strong> and <strong>lib/</strong>, and the NSPR <strong>lib/</strong> directories to the system path. You can either set this permanently via Control Panel->System Properties->Advanced->Environment Variables->System Variables or do it each time you run the tools from the command-line (preferably using a batch file). Windows contains its own version of some of these files (e.g. certutil.exe) in the system directory (<code>\Windows\system32\</code>) so ensure the new paths are <strong>first</strong> in the PATH search list.</p> - -<pre>C:\> set PATH=C:\Apps\nss-3.11.4\bin\;C:\Apps\nss-3.11.4\lib\;C:\Apps\nspr-4.6\lib\;%PATH% -</pre> - -<p>An easier way is to copy everything from your new directories C:\Apps\nss-3.11.4\ and C:\Apps\nspr-4.6\ including sub directories to the same directory - fx C:\Apps\CodeSigning\ - and then run every command from that.</p> - -<h3 id="Initialize_the_certificate_database">Initialize the certificate database</h3> - -<p>Decide which folder to create the certificate database in. Use this command to create it (<strong>note</strong> the trailing dot is required).</p> - -<pre>C:\Projects\CodeSigning\> certutil -N -d . -</pre> - -<p>The <strong>dot</strong> will cause the database to be created in the <strong>current directory.</strong></p> - -<p>You will be prompted for the <em>NSS Certificate database password</em> - <strong>don't forget it!</strong></p> - -<pre>C:\Projects\CodeSigning\> certutil -N -d . -Enter a password which will be used to encrypt your keys. -The password should be at least 8 characters long, -and should contain at least one non-alphabetic character. - -Enter new password: -Re-enter password: -</pre> - -<h3 id="Create_a_test_certificate">Create a test certificate</h3> - -<p>Create a test certificate, using the -p option to set a password for the new certificate</p> - -<pre>C:\Projects\CodeSigning\> signtool -G myTestCert -d . -p"password" -using certificate directory: . - -WARNING: Performing this operation while the browser is running could cause -corruption of your security databases. If the browser is currently running, -you should exit the browser before continuing this operation. Enter -"y" to continue, or anything else to abort: y - - -Enter certificate information. All fields are optional. Acceptable -characters are numbers, letters, spaces, and apostrophes. -certificate common name: XPI Test -organization: TJworld -organization unit: Software -state or province: Nottingham -country (must be exactly 2 characters): GB -username: tj -email address: certificates@lan.tjworld.net -generated public/private key pair -certificate request generated -certificate has been signed -certificate "myTestCert" added to database -Exported certificate to x509.raw and x509.cacert. -</pre> - -<p><strong>x509.cacert</strong> will be used to sign your XPI package. Check that it exists on the file system and in the certificate database:</p> - -<pre>C:\Projects\CodeSigning\> dir x509* - -14/12/2005 15:13 1,031 x509.cacert -14/12/2005 15:13 798 x509.raw - -C:\Projects\CodeSigning\> certutil -d . -L -myTestCert u,u,Cu -</pre> - -<h3 id="Prepare_XPI_file_for_signing">Prepare XPI file for signing</h3> - -<p>Create a new folder just for signing, copy your existing XPI into it, unzip<sup>*</sup> it (maintaining paths), delete the XPI and return to the certificate-database folder.</p> - -<p><sup>*</sup>Assumes you have a zip utility available on your system path. This example is using the <strong>CygWin bin/zip.exe</strong> tool. You can use a graphical Zip tool provided it manages the internal sub-directory structure properly. An alternative is to use WinRar.</p> - -<div class="note">The <strong>7-Zip tool doesn't work</strong> when creating Mozilla XPI signed archives because it sorts the directory entries alphabetically, and <strong><em>Mozilla requires the first entry to be META-INF/zigbert.rsa</em></strong>.</div> - -<pre>C:\Projects\CodeSigning\> md signed - -C:\Projects\CodeSigning\> copy C:\Projects\fsb\fsb.xpi signed - 1 file(s) copied. - -C:\Projects\CodeSigning\> cd signed - -C:\Projects\CodeSigning\signed> unzip fsb.xpi -Archive: fsb.xpi - creating: chrome/ - inflating: chrome.manifest - inflating: chrome/fsb.jar - inflating: install.rdf - -C:\Projects\CodeSigning\signed> del fsb.xpi - -C:\Projects\CodeSigning\signed> cd .. -</pre> - -<h3 id="Sign_XPI">Sign XPI</h3> - -<pre>C:\Projects\CodeSigning\> signtool -d . -k myTestCert -p "password" signed/ -using certificate directory: . -Generating signed//META-INF/manifest.mf file.. ---> chrome/fsb.jar ---> chrome.manifest ---> install.rdf -Generating zigbert.sf file.. -tree "signed/" signed successfully -</pre> - -<h3 id="Re-package_XPI">Re-package XPI</h3> - -<p>Change to the <strong>signed/</strong> folder, create a new zip with the <strong>META-INF/zigbert.rsa</strong> file listed first, then add the remaining files.</p> - -<pre>C:\Projects\Certs\> cd signed - -C:\Projects\CodeSigning\signed\> zip fsb.xpi META-INF/zigbert.rsa - adding: META-INF/zigbert.rsa (deflated 35%) - -C:\Projects\CodeSigning\signed> zip -r -D fsb.xpi * -x META-INF/zigbert.rsa - adding: META-INF/manifest.mf (deflated 37%) - adding: META-INF/zigbert.sf (deflated 40%) - adding: chrome/fsb.jar (deflated 74%) - adding: chrome.manifest (deflated 69%) - adding: install.rdf (deflated 62%) -</pre> - -<h3 id="Test_your_certificate">Test your certificate</h3> - -<p>To test your certificate, install it into your browser, and attempt to load the signed extension by following these steps:</p> - -<p>1. Temporarily install the Test Certificate Authority into your Mozilla browser</p> - -<p>Rename the <strong>x509.cacert</strong> file generated earlier to <strong>x509.cert</strong></p> - -<p>Import it into Mozilla Firefox as a Software Developer Certificate Authority.</p> - -<div class="note">Don't forget to delete the certificate from Mozilla Firefox once you've finished testing</div> - -<p>Firefox 1.5: From the Tools menu choose Options->Advanced->Security->View Certificates->Authorities</p> - -<p>Firefox 1.0: From the Tools menu choose Options->Advanced->Certificates->Manage Certificates->Authorities</p> - -<p>Press the <strong>Import</strong> button.</p> - -<p>Navigate to the folder containing <strong>x509.cert</strong> and choose it.</p> - -<p>In the <strong>Downloading Certificate</strong> dialog, tick <strong>Trust this CA to identify software developers.</strong> and press the <strong>View</strong> button if you wish to examine the certificate more closely.</p> - -<p>Press the <strong>OK</strong> button and you'll see your new certificate in the list of Authorities.</p> - -<p>2. Attempt to install the signed extension</p> - -<p>Either drag and drop or browse to and download the signed XPI. When the Mozilla Firefox <strong>Software Installation</strong> dialog appears the <strong>organisation name</strong> of the certificate will appear where Firefox usually displays <strong><em>unsigned</em></strong>.</p> - -<p><a class="external" href="http://forums.tjworld.net/files/topic-130-install-signed-xpi.png">image</a></p> - -<h3 id="Obtaining_a_valid_software_developer_code-signing_certificate">Obtaining a valid software developer code-signing certificate</h3> - -<p> </p> - -<div class="warning"><strong>Warning:</strong> Currently Firefox expects XPI files to be signed with certificates that conform to the older Object Signing convention, rather than the newer Code Signing convention. This means that Firefox will refuse to install code signed via an intermediate certificate authority such as <strong>Certum Level I</strong> unless the user installs that intermediate CA certificate into Firefox first. Installing the intermediate CA certificate causes Firefox to mark the intermediate Code Signing CA certificate as a valid Object Signing CA certificate, which makes it all work. <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=321156" title="Firefox does not honor some issuers' code signing certs for XPI signatures">bug 321156</a> has been filed to request a way to obviate the installation of intermediate Code Signing CA certs into Firefox.</div> - -<p>Now you know it all works, you need to add a real software developer's certificate to the NSS certificate database, and use that to sign the XPI. There are several issuers of software developer certificates, with the three key differentials: availability, cost and identity verification.</p> - -<p>Many issuers will not provide a software developer certificate to individuals (how ridiculous) so you may have to search hard to find one that will, and who also has a CA root Authority installed in Mozilla Firefox. Without the certificate-issuers CA root certificate Mozilla Firefox will not confirm the validity of your certificate to users who want to install your extension. Ideally you want a certificate that has a root CA installed in all major platforms (Microsoft Windows, Sun Java, Mozilla/Netscape Firefox/Navigator, Opera) so you only use one certificate for signing all your software, no matter which platform it is for.</p> - -<p>The cheapest universally supported (Mozilla, Java, Microsoft) certificate seems to be the Comodo Instant-SSL offering. You can get a <strong>free certificate for open-source developers</strong> from <a class="external" href="https://en.sklep.unizeto.pl/test_certificates" title="http://www.certum.eu/certum/cert,offer_software_publisher.xml">Unizeto Certum</a>, in 2010 it is a Certum Level III CA.</p> - -<p>Here are some current issuers:</p> - -<ul> - <li>Comodo Instant-SSL Code Signing</li> - <li>Digi-Sign Digi-Code</li> - <li>GeoTrust Code Signing</li> - <li>Thawte Code Signing (owned by Verisign)</li> - <li>Unizeto Certum Code-signing (<strong>free certificates for open-source authors</strong>)</li> - <li>Verisign Code Signing</li> -</ul> - -<p>You will need to apply for a <strong>Code Signing Certificate</strong> and satisfy the Issuer's identity verification procedures. They will then issue a signed certificate. When you receive the signed certificate it must be imported into the certificate database.</p> - -<div class="note">Your browser will generate a new private key and <strong>Code Signing Request (CSR)</strong> in the background without you necessarily realising it. The CSR will be uploaded to the Issuer. Later, you <strong>must</strong> use the same browser when installing the new certificate because the key and certificate pair must be together.</div> - -<p><strong>Hint</strong>: When applying for a certificate ensure that the <strong>Organisation (O)</strong> contains your name and not the Issuer's default text, because this is what is displayed to users.</p> - -<p>For this guide I applied for a free certificate from Unizeto Certum. After completing the application process where I entered my details into the online application, I received an automated email requesting documentary evidence of my ID in the form of a photo-ID or similar. I have hi-resolution scanned images of my passport and drivers license for these situations so I placed them on my web-server temporarily in a hidden location and emailed Unizeto Certum with the details and location of the files. Within a few hours I received a confirmation email from a human accepting the ID images and giving me a hyperlink to the certifcate download area.</p> - -<p><strong>Install the certificate into Mozilla Firefox</strong> (which goes with the private key created earlier), and copy/paste the displayed <strong>certificate text</strong> into a new file called <strong><code>C:\Projects\CodeSigning\Certum Code Signing.cer</code></strong>.</p> - -<h3 id="Installing_real_certificate">Installing real certificate</h3> - -<p>There are two steps required to install the new certificate in the Code Signing NSS certificate database.</p> - -<pre class="eval"> 1. Install the Issuer's Certificate Authority Root - 2. Install your key and certificate -</pre> - -<p>The root CA establishes the trust of your certificate. Many issuer's have multiple root CAs for different levels of trust. find out which one was used for your certificate and download it. You can view the details of your certificate in Mozilla Firefox and get this information from the <strong>Issued By Common Name</strong> (Unizeto Certum's free certificate CA is Certum Level III CA).</p> - -<p>Download the Root CA and any intermediate certificates used to sign your certificate from the Issuer; their web site will have a link somewhere to their root CAs and public certificates. (<a class="link-https" href="https://www.certum.eu/certum/cert,expertise_root_certificates.xml">Certum public key page</a>). I downloaded the <strong>Certum Root CA</strong> and <strong>Certum Level III CA Digital ID for web and SSL/TLS Servers</strong>, copied the text and saved them to the files <code><strong>C:\Projects\CodeSigning\Certum Root CA.cer</strong></code> and <code><strong>C:\Projects\CodeSigning\Certum Level III CA.cer</strong></code>.</p> - -<p>Open a command prompt (ensure the paths to the NSS tools are set as described above) in the CodeSigning folder, install the Issuer CA certificates, and check they have been added correctly.</p> - -<pre>C:\Projects\CodeSigning> certutil -A -n "Certum Root CA" -t "TC,TC,TC" -d . -i "Certum Root CA.cer" - -C:\Projects\CodeSigning> certutil -A -n "Certum Level III CA" -t "c,c,C" -d . -i "Certum Level III CA.cer" - -C:\Projects\CodeSigning> certutil -L -d . -myTestCert u,u,Cu -Certum Root CA CT,C,C -Certum Level III CA CT,C,C -</pre> - -<p>The name given to the newly issued certificate in the Mozilla Firefox keystore is not the easiest key alias in the world to remember, so I've added an additional step here that lets you rename it (its not just a simple rename operation, unfortunately).</p> - -<p>To find the name, in Mozilla Firefox navigate to the Certificate Manager (described in Step 11), choose <strong>Your Certificates</strong>, select the new certificate, press <strong>View</strong>, choose <strong>Details</strong> and look at the first entry in the <strong>Certificate Fields</strong> tree-view.</p> - -<p>My Unizeto Certum certificate is named "TJ's Unizeto Sp. z o.o. ID" but I want it to be called "Code Signing (Certum)".</p> - -<p>The trick is to install the certificate (without the key) first and give your chosen nickname at that point. When the key/certificate pair is imported from Mozilla Firefox afterwards, the private key will be added but the certificate name will remain the same.</p> - -<pre>C:\Projects\CodeSigning> certutil -A -n "Code Signing (Certum)" -t "u,u,u" -d . -i "Certum Code Signing.cer" - -C:\Projects\CodeSigning> certutil -L -d . -myTestCert u,u,Cu -Certum Root CA CT,C,C -Certum Level III CA CT,C,C -Code Signing (Certum) ,, - -C:\Projects\CodeSigning> signtool -l -d . -using certificate directory: . - -Object signing certificates ---------------------------------------- -myTestCert - Issued by: myTestCert (XPI Test) - Expires: Tue Mar 14, 2006 -Code Signing (Certum) - Issued by: Certum Level III CA (Certum Level III CA) - Expires: Tue Mar 14, 2006 ---------------------------------------- -For a list including CA's, use "signtool -L" -</pre> - -<p>Now you must export the new key/certificate pair from the Mozilla Firefox certificate database and into the NSS certificate database.</p> - -<p>The hardest part is locating Mozilla's key database. It consists of two files named <strong>key3.db</strong> and <strong>cert8.db</strong>. They usually live in the Mozilla Firefox <strong>user profile folder</strong>. I found mine in <code><strong>C:\Documents and Settings\TJ\Application Data\Mozilla\Firefox\Profiles\xxxxxxxx.default\</strong></code> where xxxxxxxx is a random string of characters.</p> - -<div class="warning"><strong>This procedure assumes you installed the new certificate into Mozilla Firefox</strong></div> - -<p>Here's the commands required to export it to a file, import it to the Code Signing database, and verify the signing attributes (u,u,u). Ensure you use the nickname of your certificate in place of mine, and the directory where your Mozilla Firefox key database files are:</p> - -<pre>C:\Projects\CodeSigning> pk12util -o "Certum Code Signing.pkcs12" -n "TJ's Unizeto Sp. z o.o. ID" -d "C:\Documents and Settings\TJ\Application Data\Mozilla\Firefox\Profiles\xxxxxxxx.default" -Enter password for PKCS12 file: -Re-enter password: -pk12util: PKCS12 EXPORT SUCCESSFUL - -C:\Projects\CodeSigning> pk12util -i "Certum Code Signing.pkcs12" -d . -Enter Password or Pin for "NSS Certificate DB": -Enter password for PKCS12 file: -pk12util: PKCS12 IMPORT SUCCESSFUL - -C:\Projects\CodeSigning> certutil -L -d . -myTestCert u,u,Cu -Certum Root CA CT,C,C -Certum Level III CA c,c,C -Code Signing (Certum) u,u,u -</pre> - -<p>You should notice that the existing certificate has been updated.</p> - -<h3 id="Sign_extension_with_real_certificate">Sign extension with real certificate</h3> - -<p>This is a repeat of the earlier steps using the real certificate's details. Here's the output on a test directory:</p> - -<pre>C:\Projects\CodeSigning>signtool -d . -k "Code Signing (Certum)" -p ******* test -using certificate directory: . -Generating test/META-INF/manifest.mf file.. ---> test.txt -Generating zigbert.sf file.. -tree "test" signed successfully</pre> - -<h3 id="Incorporating_signing_into_your_build_process">Incorporating signing into your build process</h3> - -<p>You may want to incorporate these steps into your existing build process. I have a <strong>build.bat</strong> file that automates the creation of the jar and xpi files. This example is using the CygWin bin/zip.exe tool.</p> - -<p><strong>build.bat</strong> is placed in the extension's root folder. E.g.</p> - -<p>/dev/fsb/<strong>build.bat</strong> /dev/fsb/install.rdf /dev/fsb/chrome.manifest /dev/fsb/chrome/ /dev/fsb/chrome/content/ /dev/fsb/chrome/locale/ /dev/fsb/chrome/skin/</p> - -<p>Here it is with the code-signing steps included:</p> - -<p> </p> - -<pre class="eval">@echo off -set x=%cd% - -echo Building %x%.xpi ... -echo Started at %DATE% %TIME% > %x%\build.log - -md build\chrome - -cd chrome - -zip -r -0 "%x%.jar" * >> %x%\build.log - -move "%x%.jar" ..\build\chrome >> %x%\build.log - -cd .. - -copy install.rdf build >> %x%\build.log - -copy chrome.manifest build >>%x%\build.log - -signtool.exe -d C:\Projects\CodeSigning -k "Code Signing (Certum)" -p "password" build/ >> %x%\build.log - -cd build - -zip "%x%.xpi" META-INF/zigbert.rsa >> %x%\build.log - -zip -r -D "%x%.xpi" * -x META-INF/zigbert.rsa >> %x%\build.log - -rem copy "%x%.xpi" ..\..\..\http\fsb.xpi >> %x%\build.log - -move "%x%.xpi" ..\ >> %x%\build.log - -cd .. - -rd build /s/q - -echo Done.</pre> - -<p>Make sure to replace <strong>password</strong> with your NSS Certificate database password.</p> - -<h3 id="Alternatives_to_NSSsigntool">Alternatives to NSS/signtool</h3> - -<p>There are several alternatives to using signtool that might suit your needs better, however please note that these alternatives are unofficial third party products.</p> - -<ul> - <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/key-manager/" title="https://addons.mozilla.org/en-US/firefox/addon/key-manager/">Key Manager XUL Extension</a></li> - <li><a class="link-https" href="https://adblockplus.org/blog/signing-firefox-extensions-with-python-and-m2crypto" title="https://adblockplus.org/blog/signing-firefox-extensions-with-python-and-m2crypto">Wladimir Palant's Python Script</a> (blog post)</li> - <li><a class="link-https" href="https://github.com/nmaier/xpisign.py/" title="https://github.com/nmaier/xpisign.py/">xpisign.py Python Script</a></li> - <li><a class="external" href="http://o-regan.org/xpisigner-secure-your-firefox-extensions/download-xpisigner/" title="http://o-regan.org/xpisigner-secure-your-firefox-extensions/download-xpisigner/">XPISigner Java Tool</a></li> -</ul> - -<h3 id="References">References</h3> - -<ul> - <li>The <a class="external" href="http://www.mozilla.org/projects/security/pki/nss/tools/">NSS Tools documentation</a></li> -</ul> - -<p></p> diff --git a/files/zh-cn/archive/apps/advanced_topics/index.html b/files/zh-cn/archive/apps/advanced_topics/index.html deleted file mode 100644 index 33d3c00fa5..0000000000 --- a/files/zh-cn/archive/apps/advanced_topics/index.html +++ /dev/null @@ -1,77 +0,0 @@ ---- -title: Advanced topics -slug: Archive/Apps/Advanced_topics -tags: - - 应用 - - 火狐OS - - 移动 -translation_of: Archive/Apps/Advanced_topics ---- -<p>这篇文章提供了关于高级开放网络应用话题的额外信息。</p> - -<div class="row topicpage-table"> -<div class="section"> -<h2 class="Documentation" id="Architecture" name="Architecture">应用构建文档</h2> - -<dl> - <dt><a href="/en-US/docs/Web/Apps/Architecture">网络应用构建</a></dt> - <dd>网络应用设计与实践背后的构建过程概览。</dd> - <dt><a href="/en-US/docs/Web/Apps/Platform-specific_details">特定平台的应用安装细节</a></dt> - <dd>在不同的支持开放网络应用的平台上，应用的安装存在细节上的不同， 这篇文章将帮助你理解它们。</dd> - <dt><a href="/en-US/docs/Web/Apps/Apps_for_Android">针对安卓的开放网络应用</a></dt> - <dd>关于在安卓设备上安装并测试开放网络应用的信息。</dd> - <dt><a href="/en-US/docs/Web/Apps/Release_notes">应用运行时的发行说明</a></dt> - <dd>针对不同平台的应用运行时发行说明。</dd> -</dl> - -<h2 class="Documentation" id="Other" name="Other">其它文档</h2> - -<dl> - <dt><a href="/en-US/docs/Web/Apps/Creating_a_store">创建你自己的市场</a></dt> - <dd>如果你希望自己构建一个用于销售和分发开放网络应用的市场，这篇文章里面的信息可能对你有帮助。</dd> -</dl> - -<p><span class="alllinks"><a href="/en-US/docs/tag/Marketplace">查看所有...</a></span></p> -</div> - -<div class="section"> -<p></p><h5 class="Tools" id="Tools" name="Tools">面向应用开发者的工具</h5> -<ul> - <li><a href="https://marketplace.firefox.com/developers/">访问 Firefox 应以市场开发者中心</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Using_Firefox_OS_Simulator">Firefox OS 模拟器</a></li> - <li><a href="/zh-CN/docs/Apps/App_developer_tools">应用开发者工具</a></li> -</ul> -<h5 class="Documentation" id="Documentation" name="Documentation">技术参考文档</h5> -<div class="twocolumns"> - <ul> - <li><a href="/zh-CN/docs/Web/CSS">CSS</a></li> - <li><a href="/zh-CN/docs/DOM">DOM</a></li> - <li><a href="/zh-CN/docs/Web/HTML">HTML</a></li> - <li><a href="/zh-CN/docs/JavaScript">JavaScript</a></li> - <li><a href="/zh-CN/docs/WebAPI">WebAPI</a></li> - <li><a href="/zh-CN/docs/Web/WebGL">WebGL</a></li> - <li><a href="/zh-CN/docs/SVG">SVG</a></li> - <li><a href="https://www.mozilla.org/zh-CN/apps/">开放网络应用 概览网站</a></li> - <li><a href="https://wiki.mozilla.org/Apps">应用项目 wiki 页面</a></li> - </ul> -</div> -<h5 class="Community" id="Community" name="Community">从社区获取帮助</h5> -<p>如果您还不确定该做的事，欢迎随时加入讨论。</p> -<ul> - <li>咨询 webapps 论坛：<ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-webapps"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.webapps"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.webapps/feeds"> Web feed</a></li> -</ul> - <ul> - <li>在 Open Web Apps IRC 频道上提问和讨论：<a class="link-irc" href="irc://irc.mozilla.org/openwebapps">#openwebapps</a></li> - </ul> - </li> -</ul> -<p><span class="alllinks"><a href="http://www.catb.org/~esr/faqs/smart-questions.html" rel="external">别忘记<em>网络礼仪</em>...</a></span></p><p></p> -</div> -</div> - -<p> </p> diff --git a/files/zh-cn/archive/apps/icon_implementation_for_apps/index.html b/files/zh-cn/archive/apps/icon_implementation_for_apps/index.html deleted file mode 100644 index 2d15366474..0000000000 --- a/files/zh-cn/archive/apps/icon_implementation_for_apps/index.html +++ /dev/null @@ -1,178 +0,0 @@ ---- -title: 应用程序图标的实现 -slug: Archive/Apps/Icon_implementation_for_apps -translation_of: Archive/Apps/Icon_implementation_for_apps ---- -<div class="summary"> -<div class="output-mod ordinary-wrap"> -<div class="output-bd" dir="ltr" style="padding-bottom: 24px;"> -<p class="ordinary-output target-output"><span>在不同的平台上实现应用程序的图标是一种痛苦，这甚至是没有考虑设计的图标和图形。</span><span class="high-light-bg">不同的平台有不同的应用方式和大小，所以你需要有很多要考虑，如果你想让你的应用支持多个平台。</span>本文提供了有用的提示，用来实现应用程序的图标，包括不同的大小和不同的平台（如：浏览器的操作系统），以及实施细节。我们不会提供图标图形设计信息，但我们将为每个平台链接到合适的资源。</p> -</div> -</div> -</div> - -<h2 id="Web应用程序的通用图标">Web应用程序的通用图标</h2> - -<p>TBD</p> - -<h2 id="Firefox_OS">Firefox OS</h2> - -<p>谋智的Firefox OS 平台是一个最简单的从图标的支持。这部分从细节上解释了为什么这些大小是需要的，并提供了一个表来表明具体图标大小与相关发布的手机出货量。</p> - -<div class="note"> -<p><strong>Note</strong>: For more information on the actual design of Firefox OS icons, read the <a href="https://www.mozilla.org/en-US/styleguide/products/firefox-os/icons/">Firefox OS app icon design guidelines</a>. They can be square or round, as stated in the guidelines.</p> -</div> - -<h3 id="Icon_format">Icon format</h3> - -<p>Firefox OS icons need to be in PNG format.</p> - -<h3 id="Icon_sizes">Icon sizes</h3> - -<h4 id="Required_icon_sizes">Required icon sizes</h4> - -<dl> - <dt>128 x 128</dt> - <dd>For display on the Firefox Marketplace and device.</dd> -</dl> - -<h4 id="Recommended_icon_sizes">Recommended icon sizes</h4> - -<dl> - <dt>128 x 128</dt> - <dd>For display on the Firefox Marketplace and pre-Firefox OS 2.0 devices.</dd> - <dt>512 x 512</dt> - <dd>From Firefox 2.0 onwards, larger icons are needed for crisp display on all the different possible combinations of Phone and tablet screen sizes, screen resolutions, and 3 and 4-column layouts. We accept a 512 x 512 icon, which is then scaled for all the different uses across devices. This size is also useful for display on other platforms apps can be installed across, such as Android.</dd> -</dl> - -<h4 id="Other_icon_sizes_that_might_be_useful">Other icon sizes that might be useful</h4> - -<dl> - <dt>60 x 60</dt> - <dd>For the exact on-device icon size on older Firefox OS versions.</dd> - <dt>16 x 16, 32 x 32, 48 x 48, 64 x 64, 90 x 90, 128 x 128 and 256 x 256</dt> - <dd>These icon sizes are used on various other platforms your app can be installed on, such as Windows, Mac OS X and Android.</dd> -</dl> - -<h3 id="Icon_size_explanations">Icon size explanations</h3> - -<h4 id="512_icon_for_device_display">512 icon for device display</h4> - -<p>For older Firefox OS device (pre-2.0), the recommendation was a 60 x 60 icon, to use on the homescreen of your device. It was simple back then, as the devices generally had a similar screen size and resolution, and the layout didn't vary much. However, more recently, a number of factors have proven this to be less than ideal:</p> - -<ul> - <li>Devices are now appearing with a wider range of screen sizes, including not only phones but tablets, and in the near future, TVs.</li> - <li>Higher resolution devices are starting to appear.</li> - <li>Firefox OS 2.0+ have multiple homescreen layout configurations available, including 3 and 4 column layouts.</li> -</ul> - -<p>These factors resulted in icons started to look pixelated on some devices. The Firefox OS UX team considered many different options to resolve this, including SVG icons, multiple device icon requirements, and a number of different single icon sizes, but in the end the best solution was a single 512 x 512 icon that can be resized as needed for different uses across devices. This is the best solution:</p> - -<ul> - <li>Requiring a different image file for every icon usage instance would be really inconvenient for developers. 512 x 512 is a fairly standard size in other app store submission processes.</li> - <li>SVG, despite its superior file size, took significantly more processing to render than a simple image file, which was too much of a performance hit to bear, especially for lower end devices like the Tarako.</li> - <li>512 x 512 proved to be big enough for all conceivable uses, while still being a reasonable file size.</li> -</ul> - -<p>With the 2.0 homescreen design, we wanted to move to larger app icons as one of the tenets of the 2.0 visual refresh is to make things feel more spacious and comfortable to use. As such, we decided to ship a 3 column, large icon version of the homescreen, but still provide users with an option to switch back to the 4 column, small icon layout from Settings.</p> - -<p>The icon sizes starting with the 2.0 release across different devices are as follows:</p> - -<table class="standard-table"> - <caption>Icon sizes across Firefox OS devices from 2.0 onwards</caption> - <thead> - <tr> - <th scope="row">Device name</th> - <th scope="col">Physical screen specifications</th> - <th scope="col">Screen resolution</th> - <th scope="col">Scale factor</th> - <th scope="col">Large (3 column homescreen) icon size</th> - <th scope="col">Small (4 column homescreen) icon size</th> - </tr> - </thead> - <tbody> - <tr> - <th scope="row">Most in-market devices</th> - <td>320x480 HVGA 3.5”</td> - <td>165ppi</td> - <td>1x</td> - <td>84px</td> - <td>64px</td> - </tr> - <tr> - <th scope="row">Helix (Huawei) or ZTE Open C</th> - <td>480x800 WVGA 4.0”</td> - <td>233ppi</td> - <td>1.5x</td> - <td>126px</td> - <td>96px</td> - </tr> - <tr> - <th scope="row">Flame reference device</th> - <td>480x854 FWVGA 4.5”</td> - <td>218ppi</td> - <td>1.5x</td> - <td>126px</td> - <td>96px</td> - </tr> - <tr> - <th scope="row">4.5" @ qHD</th> - <td>540x960 qHD 4.5”</td> - <td>245ppi</td> - <td>2x</td> - <td>142px</td> - <td>108px</td> - </tr> - <tr> - <th scope="row">4.7" @ 720p</th> - <td>720x1280 720p 4.7”</td> - <td>312ppi</td> - <td>2.25x</td> - <td>189px</td> - <td>144px</td> - </tr> - <tr> - <th scope="row">5.0" @ 1080p</th> - <td>1080x1920 1080p 5”</td> - <td>440ppi</td> - <td>3.375x</td> - <td>284px</td> - <td>216px</td> - </tr> - </tbody> -</table> - -<p>For the 320 x 480 screen, the base sizes of 84 x 84 for 3 column mode, and 64 x 64 for 4 column mode were chosen to maximize icon size while balancing the icon density and wallpaper visibility needs. Icon sizes for all other screens are calculated by multiplying by the relevant scale factor. For example, on Flame it is 1.5 (scale factor) x 84 = 126 (large icons) and 1.5 (scale factor) x 64 = 96 (small icons).</p> - -<h4 id="128_icon_for_marketplace">128 icon for marketplace</h4> - -<p>The Firefox Marketplace still requires a 128 x 128 icon, for display on app marketplace listing pages.</p> - -<h3 id="Including_the_icon_in_your_app">Including the icon in your app</h3> - -<p>You specify the path to the icons in the icon field of the app manifest, and multiple icons can be pointed to like this:</p> - -<pre class="brush: json">"icons": { - "512": "/img/icon-512.png", - "128": "/img/icon-128.png" -}</pre> - -<p>You can also use a 64 bit encoded Data URI directly in the manifest file to provide the icon and cut down on HTTP requests:</p> - -<pre class="brush: json">"icons": { - "512": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAIAAAAlC ... " -}</pre> - -<p>We have cut the above example down for the sake of brevity.</p> - -<h4 id="Adding_more_specific_icon_sizes">Adding more specific icon sizes</h4> - -<p>Note that you don't need to just include 512 x 512 and 128 x 128 with your app: you can happily include further specific icon sizes if you want to provide a tailored look for each different required size — you can simply include more icon lines in the manifest icon field shown above.</p> - -<h2 id="Icons_in_other_app_ecosystems">Icons in other app ecosystems</h2> - -<p>Android, iOS, Windows, Tizen, etc.</p> - -<p>It would be good to cover icon requirements for different ecosystems.</p> - -<p> </p> diff --git a/files/zh-cn/archive/apps/index.html b/files/zh-cn/archive/apps/index.html deleted file mode 100644 index c1517d6372..0000000000 --- a/files/zh-cn/archive/apps/index.html +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: Apps -slug: Archive/Apps -tags: - - Apps - - Firefox OS - - NeedsTranslation - - TopicStub - - Web -translation_of: Archive/Apps ---- -<p class="summary">This page includes archived content for Apps, including obsolete web app content, Firefox OS app-related content, etc.</p> - -<p></p><dl><dt class="landingPageList"><a href="/zh-CN/docs/Archive/Apps/Tools_and_frameworks">Tools and frameworks</a></dt><dd class="landingPageList"></dd></dl><p></p> diff --git a/files/zh-cn/archive/apps/tools_and_frameworks/app_templates/index.html b/files/zh-cn/archive/apps/tools_and_frameworks/app_templates/index.html deleted file mode 100644 index 742f6c19ae..0000000000 --- a/files/zh-cn/archive/apps/tools_and_frameworks/app_templates/index.html +++ /dev/null @@ -1,82 +0,0 @@ ---- -title: 使用应用程式模板 -slug: Archive/Apps/Tools_and_frameworks/App_templates -tags: - - 使用应用程式模板 -translation_of: Archive/Apps/Tools_and_frameworks/App_templates ---- -<div class="summary"> -<p>为了帮助您快速开始编写Web应用程序，我们提供了一些已经设置好的模板。 每个模板都是一个静态Web项目，其中包含有助于构建和部署的工具。</p> -</div> - -<p>What you get:</p> - -<ul> - <li>A minimal and well-formed HTML structure</li> - <li>Prebuilt <code>manifest.webapp</code></li> - <li>JavaScript libraries for interacting with the Marketplace</li> - <li>require.js for structuring your JavaScript code</li> - <li>volo for automating local development and deployment</li> - <li>pre-built layouts (from some of the templates)</li> -</ul> - -<p>You can view all of the available templates in the <a href="https://github.com/mozilla/mortar">mortar</a> repo. The following are available:</p> - -<ul> - <li><a href="https://github.com/mozilla/mortar-app-stub">mortar-app-stub</a>: a blank template that comes only with the basic things required to get started</li> - <li><a href="https://github.com/mozilla/mortar-list-detail">mortar-list-detail</a>: comes with a layouts library and sets up a list-detail layout for you</li> - <li><a href="https://github.com/mozilla/mortar-game-stub">mortar-game-stub</a>: a minimal web game template that handles input and a render loop</li> -</ul> - -<h2 id="Starting_with_the_App_Stub_Template">Starting with the App Stub Template</h2> - -<p>You could simply use git to get the template from <a href="https://github.com/mozilla/mortar-app-stub">this repo</a>:</p> - -<pre>git clone https://github.com/mozilla/mortar-app-stub.git myapp</pre> - -<p>Using volo is recommended, however. volo is a tool for automating projects, and you'll be able to use it with good effect with this template, so go ahead and install it. You first need node.js, which you can download from <a href="http://nodejs.org/">here</a>. Once you have node, install volo (you might need to prefix the command with <code>sudo</code> if it fails due to insufficient permissions):</p> - -<pre>npm install -g volo -</pre> - -<p>Now you can just use the volo <code>create</code> command, followed a name for the folder you want your app created in, then <code>mozilla/</code> followed by the name of the mortar template you want to use:</p> - -<pre>volo create myapp mozilla/mortar-app-stub</pre> - -<p>When future templates are available, you can use the same <code>create</code> command with different template URLs.</p> - -<h2 id="What_Now">What Now?</h2> - -<p>All your HTML, CSS, and JavaScript are under the <code>www</code> directory, so start coding! You'll see a bunch of stuff in there, but feel free to remove anything you don't need.</p> - -<p>The template uses <a href="http://requirejs.org/">require.js</a> to manage JavaScript. If you look in <code>www/js/app.js</code> you'll see that it defines the main module and loads a few libraries like <a href="http://zeptojs.com/">zepto</a>. The Marketplace JavaScript library is also included, which enables <a href="/en-US/docs/Web/Apps/Publishing/In-app_payments">in-app payments</a> and <a href="/en-US/docs/Web/Apps/Publishing/Validating_a_receipt">receipt verification</a>. You don't need this if you're a free app without in-app payments.</p> - -<p>Below that, you'll see the line:</p> - -<pre>define(function(require) {</pre> - -<p>That defines the main module for your app, and you should start coding within the function. You can use <code>require</code> to load in other modules, the same way zepto is loaded. Check out the <a href="http://requirejs.org/docs/api.html">require.js API</a> to learn more about modules.</p> - -<div class="note"> -<p><strong>Note</strong>: By default, modules are loaded from <code>www/js/lib</code>. If you want to load something from <code>www/js</code>, which is your working directory, use the syntax <code>require('./mylib')</code> instead of just <code>require('mylib')</code></p> -</div> - -<p>You can edit CSS in <code>www/css/app.css</code>. Typically you should <code>@import</code> additional CSS files at the top of this file instead of using the <code><link></code> tag to include them. This allows the volo optimizer to inline all the CSS when building for deploying.</p> - -<p>Finally, volo provides several helpful commands that you can use:</p> - -<pre>$ volo serve # Fire up a local development server -$ volo add <library> # Add the JavaScript library -$ volo build # Build an optimized version of the app into www-built -$ volo ghdeploy # Deploy the built version to github (need to build first) -</pre> - -<p>All of these must be run at the root of your project. There are a few other commands and you can view the full list by simply typing <code>volo</code>.</p> - -<div class="note"> -<p><strong>Note:</strong> volo itself only has a few built-in commands. The app template provides the <code>serve</code>, <code>build</code>, <code>ghdeploy</code>, and other commands.</p> -</div> - -<h2 id="Tutorial">Tutorial</h2> - -<p>For more information about this template, see the <a href="/en-US/docs/Web/Apps/Tutorials/Weather_app_tutorial">Weather App Tutorial</a> which shows you step-by-step how to build a weather app with this template. It dives into the volo commands more specifically and explains the template in more detail.</p> diff --git a/files/zh-cn/archive/apps/tools_and_frameworks/index.html b/files/zh-cn/archive/apps/tools_and_frameworks/index.html deleted file mode 100644 index 49231f75ef..0000000000 --- a/files/zh-cn/archive/apps/tools_and_frameworks/index.html +++ /dev/null @@ -1,47 +0,0 @@ ---- -title: Tools and frameworks -slug: Archive/Apps/Tools_and_frameworks -tags: - - Apps - - Firefox OS - - Frameworks - - Libraries - - NeedsTranslation - - Tools - - TopicStub - - Workflows -translation_of: Archive/Apps/Tools_and_frameworks ---- -<div> -<p>This part of the App Center provides guides to using tools, frameworks and libraries to speed up Open Web App development — Brick, app templates, X-Tag, and Firefox OS Cordova support.</p> -</div> - -<div class="row topicpage-table"> -<div class="section"> -<h2 id="Components_and_templates">Components and templates</h2> - -<dl dir="ltr"> - <dt><a href="/en-US/Apps/Tools_and_frameworks/Web_components">Web components and Mozilla Brick </a></dt> - <dd>Mozilla Brick is a Web component library, based on the X-Tag library, which allows easy usage of custom elements.</dd> - <dt><a href="/en-US/Apps/Tools_and_frameworks/App_templates">Using app templates</a></dt> - <dd>To help you get going with app development as quickly as possible, there are some template apps you can use as a basis for your own apps. This guide provides information on those templates, how to get them, and how to work with them.</dd> - <dt><a href="/en-US/Apps/Tools_and_frameworks/x-tags">X-Tag</a></dt> - <dd>X-Tag and the Web components specification family provide a means for us to define custom elements that will dealt with as first class citizens by the browser, rather than as an inefficient afterthought. This guide explains how they work.</dd> - <dt><a href="/en-US/Apps/Tools_and_frameworks/Custom_elements">Custom elements</a></dt> - <dd>This article describes some of the most useful custom elements available inside Mozilla's X-Tag library.</dd> -</dl> -</div> - -<div class="section"> -<h2 id="Cross-platform_apps_and_build_tools">Cross-platform apps and build tools</h2> - -<dl> - <dt><a href="/en-US/Apps/Tools_and_frameworks/Cordova_support_for_Firefox_OS">Cordova support for Firefox OS</a></dt> - <dd>This article provides a basic introduction to Apache Cordova and explains how to use it to generate an Open Web App for installation on Firefox OS.</dd> - <dt><a href="/en-US/Apps/Tools_and_frameworks/Cordova_Firefox_OS_plugin_reference">Cordova Firefox OS plugin reference</a></dt> - <dd>Reference showing sample code and examples for the Cordova plugins that currently support Firefox OS.</dd> -</dl> -</div> -</div> - -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/api/alarm_api/index.html b/files/zh-cn/archive/b2g_os/api/alarm_api/index.html deleted file mode 100644 index bc686238e2..0000000000 --- a/files/zh-cn/archive/b2g_os/api/alarm_api/index.html +++ /dev/null @@ -1,218 +0,0 @@ ---- -title: Alarm API -slug: Archive/B2G_OS/API/Alarm_API -tags: - - API - - Firefox OS - - 警报 -translation_of: Archive/B2G_OS/API/Alarm_API ---- -<p>{{DefaultAPISidebar("Alarm API")}}{{Non-standard_Header}}</p> - -<p class="summary"><strong>Alarm API</strong>允许应用程序<strong>设定</strong>将来运行的操作。例如，一些应用程序(如闹钟、日历或自动更新)可能需要使用<strong>Alarm API</strong>在指定的时间点触发特定的设备行为。</p> - -<p class="summary"><strong>Alarm API</strong>本身只允许调度警报。<strong>Alarm </strong>通过系统消息API发送到应用程序，因此希望对警报作出响应的应用程序必须将自己注册到<strong>Alarm </strong>消息中。</p> - -<p><strong>Alarm </strong>使用 {{DOMxRef("Navigator.mozAlarms")}}对象设置，该对象是{{DOMxRef("MozAlarmsManager")}}接口的一个实例。</p> - -<div class="blockIndicator note"> -<p><em><strong>注:</strong></em> 这里的‘“闹钟 ”（<strong>Alarm API</strong>）并不同于闹铃App。<strong>Alarm API </strong>唤醒应用程序, 闹钟叫醒人. 闹钟 <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/clock/js/alarm.js">使用 Alarm API</a> 设置通知，用来在正确的时间叫醒人。（译者注：疑问脸）</p> -</div> - -<h2 id="example" name="example">设置闹铃</h2> - -<p>使用闹铃时要做的第一件事是设置闹铃。根据时区的不同，有两种警报。在这两种情况下，它都是使用{{DOMxRef("MozAlarmsManager.add()")}}方法完成的。</p> - -<div class="blockIndicator note"> -<p><strong>Note:</strong> 如果警报不是针对特定应用程序的，系统会将所有警报发送给所有监听警报的应用程序。</p> -</div> - -<div class="blockIndicator note"> -<p><strong>Note</strong>: 您需要使用相同的<strong>URL</strong>来设置和接收警报。例如，如果在foo.html或index.html?foo=bar上调用<code>navigator.mozAlarms.add()</code>，但在<a href="/en-US/Apps/Build/Manifest#messages">清单消息字段</a>中有<code style="white-space: nowrap;">{ "alarm": "/index.html" }</code>，您将永远不会收到警报。</p> -</div> - -<h3 id="Alarms_忽略时区">Alarms 忽略时区</h3> - -<p>这类警报是根据设备的本地时间发出的。如果设备用户更改了时区，将根据新的时区发出警报。例如，如果用户在巴黎，设置了一个应该在CET(中欧时间)下午12点发出的警报，而该用户前往旧金山，那么该警报将在PDT(太平洋夏令时)下午12点发出。</p> - -<pre class="brush: js;">// 设定闹钟的日期 -var myDate = new Date("May 15, 2012 16:20:00"); - -// 传递给警报的任意数据 -var data = { - foo: "bar" -} - -// 使警报忽略"ignoreTimezone" -var request = navigator.mozAlarms.add(myDate, "ignoreTimezone", data); - -request.onsuccess = function () { - console.log("The alarm has been scheduled"); -}; - -request.onerror = function () { - console.log("An error occurred: " + this.error.name); -};</pre> - -<h3 id="时区警报">时区警报</h3> - -<p>这些类型的警报是根据定义警报计划时间的时区中的时间发出的。如果由于某种原因，设备的用户更改了时区，将根据原始时区发出警报。例如，如果用户在巴黎，并设置一个闹钟，该闹钟应该在CET(中欧时间)下午12点发出，如果该用户前往旧金山，该闹钟将在太平洋夏令时凌晨3点发出。</p> - -<pre class="brush: js;">// This the date to schedule the alarm -var myDate = new Date("May 15, 2012 16:20:00"); - -// This is arbitrary data pass to the alarm -var data = { - foo: "bar" -} - -// The "honorTimezone" string is what make the alarm honoring it -var request = navigator.mozAlarms.add(myDate, "honorTimezone", data); - -request.onsuccess = function () { - console.log("The alarm has been scheduled"); -}; - -request.onerror = function () { - console.log("An error occurred: " + this.error.name); -};</pre> - -<h2 id="管理警报">管理警报</h2> - -<p> </p> - -<p>设定警报后，仍然可以管理它。</p> - -<p>方法将返回应用程序当前调度的警报的完整列表。这个列表是一个{{anch("mozAlarm")}}对象数组。</p> - -<p> </p> - -<p> </p> - -<h3 id="mozAlarm">mozAlarm</h3> - -<p> </p> - -<p>匿名JavaScript对象，具有以下属性:</p> - -<p> </p> - -<p><code>id</code></p> - -<p>表示警报id</p> - -<p><code>date</code></p> - -<p>表示警报的预定时间的日期对象</p> - -<p><code>respectTimezone</code></p> - -<p>一个字符串，指示警报是否必须尊重或忽略date对象的时区信息。它的值可以是<code>ignoreTimezone</code>或<code>honorTimezone</code></p> - -<p><code>data</code></p> - -<p>一个JavaScript对象，包含警报存储的所有数据</p> - -<p> </p> - -<pre class="brush: js;">var request = navigator.mozAlarms.getAll(); - -request.onsuccess = function () { - this.result.forEach(function (alarm) { - console.log('Id: ' + alarm.id); - console.log('date: ' + alarm.date); - console.log('respectTimezone: ' + alarm.respectTimezone); - console.log('data: ' + JSON.stringify(alarm.data)); - }); -}; - -request.onerror = function () { - console.log("An error occurred: " + this.error.name); -};</pre> - -<p>{{DOMxRef("MozAlarmsManager.remove")}} 用于取消现有警报的调度。</p> - -<pre class="brush: js;">var alarmId; - -// Set an alarm and store it's id -var request = navigator.mozAlarms.add(new Date("May 15, 2012 16:20:00"), "honorTimezone"); - -request.onsuccess = function () { - alarmId = this.result; -} - -// ... - -// Later on, removing the alarm if it exists -if (alarmId) { - navigator.mozAlarms.remove(alarmId); -}</pre> - -<h2 id="处理警报">处理警报</h2> - -<p> </p> - -<p>当系统发出警报时，任何应用程序都可以作出反应。为了能够处理任何警报，应用程序必须将自己注册为警报处理程序。这是通过系统消息API分两个步骤完成的:</p> - -<p>首先，应用程序必须将alarm包含到其应用程序清单的<a href="/en-US/docs/Apps/Manifest#messages">messages</a>属性中，并提供到文档的URL，文档注册在发出警报时使用的回调函数。</p> - -<pre class="brush: js;">"messages": [ - { "alarm": "/index.html" } -]</pre> - -<p>其次，应用程序必须将回调函数与警报消息绑定。这是使用{{DOMxRef("Navigator.mozSetMessageHandler()")}}方法完成的。这个回调函数将接收一个{{Anch("mozAlarm")}}对象，其中包含附加到警报的数据。</p> - -<pre class="brush: js;">navigator.mozSetMessageHandler("alarm", function (mozAlarm) { - alert("alarm fired: " + JSON.stringify(mozAlarm.data)); -});</pre> - -<p>如果应用程序想知道系统级别上是否存在挂起的警报，可以使用下面的方法。</p> - -<pre class="brush: js;">navigator.mozHasPendingMessage("alarm"); </pre> - -<h2 id="权限_Alarm_API">权限 Alarm API</h2> - -<p>请注意，虽然警报API没有特权或认证，但您仍然应该在清单中包含<code>权限</code>和<code>消息</code>条目。当包含在可安装的打开的Web应用程序中的<code>manifest.webapp</code>文件。</p> - -<pre class="brush: json;">{ - "permissions": { - "alarms": { - "description": "Required to schedule alarms" - } - }, - "messages": [ - { "alarm": "/index.html" } - ] -}</pre> - -<h2 id="规范">规范</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName("Alarm API")}}</td> - <td>{{Spec2("Alarm API")}}</td> - <td>Initial specification.</td> - </tr> - </tbody> -</table> - -<h2 id="浏览器兼容性">浏览器兼容性</h2> - -<p>Supported in Firefox OS 1.0.1.</p> - -<h2 id="另请参阅">另请参阅</h2> - -<ul> - <li><a href="/en-US/Apps/Build/User_notifications/Using_Alarms_to_notify_users">使用警报通知用户</a></li> - <li>{{DOMxRef("Navigator.mozAlarms")}}</li> - <li>{{DOMxRef("MozAlarmsManager")}}</li> - <li>{{DOMxRef("Navigator.mozSetMessageHandler")}}</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/bluetoothstatuschangedevent/index.html b/files/zh-cn/archive/b2g_os/api/bluetoothstatuschangedevent/index.html deleted file mode 100644 index 8003a4414b..0000000000 --- a/files/zh-cn/archive/b2g_os/api/bluetoothstatuschangedevent/index.html +++ /dev/null @@ -1,54 +0,0 @@ ---- -title: 蓝牙状态更改事件 -slug: Archive/B2G_OS/API/BluetoothStatusChangedEvent -translation_of: Archive/B2G_OS/API/BluetoothStatusChangedEvent ---- -<h2 id="概要">概要</h2> - -<p>BluetoothStatusChangedEvent API可以访问有关蓝牙设备状态的任何更改的信息。</p> - -<p>当触发以下某个事件时，会发生状态更改:</p> - -<ul> - <li>{{Event("a2dpstatuschange")}} : 当A2DP连接状态发生变化时。看到{{domxref("BluetoothAdapter.ona2dpstatuschanged")}} 了解更多信息。</li> - <li>{{Event("hfpstatuschange")}} : 发生在HFP连接状态发生变化时。看到{{domxref("BluetoothAdapter.onhfpstatuschanged")}} 了解更多信息.</li> - <li>{{Event("pairedstatuschange")}} : 当设备的配对状态发生变化时。看到{{domxref("BluetoothAdapter.onpairedstatuschanged")}} for more information.了解更多信息</li> - <li>{{Event("scostatuschange")}} : 它发生在SCO连接状态改变时。看到{{domxref("BluetoothAdapter.onscostatuschanged")}} for more information.</li> -</ul> - -<h2 id="接口概述">接口概述</h2> - -<pre>interface BluetoothStatusChangedEvent: Event -{ - readonly attribute DOMString address; - readonly attribute boolean status; -};</pre> - -<h2 id="属性">属性</h2> - -<dl> - <dt>{{domxref("BluetoothStatusChangedEvent.address")}} {{readonlyinline}}</dt> - <dd>表示蓝牙微网中状态发生变化的设备地址的字符串。.</dd> - <dt>{{domxref("BluetoothStatusChangedEvent.status")}} {{readonlyinline}}</dt> - <dd>表示连接当前状态的布尔值。它可以被启用（true）或禁用（false）。</dd> - <dt></dt> -</dl> - -<h2 id="方法">方法</h2> - -<p>目前没有。</p> - -<h2 id="规范">规范</h2> - -<p>还不是任何规范的一部分。它应该作为<a href="http://www.w3.org/2012/sysapps/">W3C's System Applications Working Group</a>的一部分进行讨论。</p> - -<h2 id="也可以看看">也可以看看</h2> - -<ul> - <li>{{domxref("BluetoothAdapter")}}</li> - <li>{{domxref("BluetoothAdapter.ona2dpstatuschanged")}}</li> - <li>{{domxref("BluetoothAdapter.onhfpstatuschanged")}}</li> - <li>{{domxref("BluetoothAdapter.onpairedstatuschanged")}}</li> - <li>{{domxref("BluetoothAdapter.onscostatuschanged")}}</li> - <li><a href="/en-US/docs/WebAPI/WebBluetooth">Web Bluetooth</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/domrequest/index.html b/files/zh-cn/archive/b2g_os/api/domrequest/index.html deleted file mode 100644 index 0f4502fac7..0000000000 --- a/files/zh-cn/archive/b2g_os/api/domrequest/index.html +++ /dev/null @@ -1,139 +0,0 @@ ---- -title: DOMRequest -slug: Archive/B2G_OS/API/DOMRequest -tags: - - API - - DOM - - 回调 -translation_of: Archive/B2G_OS/API/DOMRequest ---- -<div><section class="Quick_links" id="Quick_Links"><ol><li><strong><a href="/zh-CN/docs/Mozilla/Firefox_OS/API/Archive"><code>Archive</code></a></strong></li><li class="toggle"><details open><summary>Related pages for DOM (Non-standard)</summary><ol><li><a href="/zh-CN/docs/Mozilla/Firefox_OS/API/DOMCursor"><code>DOMCursor</code></a></li></ol></details></li></ol></section></div> - -<p>DOMRequest对象表示正在进行的操作。 它提供在操作完成时调用的回调，以及对操作结果的引用。 启动一个进行中的操作，DOM方法会返回一个DOMRequest对象，您可以使用该对象来监视该操作的进度。</p> - -<p></p><div class="note"><strong>Note:</strong> 此特性在 <a href="/zh-CN/docs/Web/API/Web_Workers_API">Web Worker</a> 中可用。</div><p></p> - -<h2 id="属性">属性</h2> - -<dl> - <dt><a href="/zh-CN/docs/Web/API/DOMRequest/onsuccess" title="此页面仍未被本地化, 期待您的翻译!"><code>DOMRequest.onsuccess</code></a></dt> - <dd>当由DOMRequest表示的操作完成时调用的回调处理程序。</dd> - <dt><a href="/zh-CN/docs/Web/API/DOMRequest/onerror" title="此页面仍未被本地化, 期待您的翻译!"><code>DOMRequest.onerror</code></a></dt> - <dd>当处理操作发生错误时调用的回调处理程序。</dd> - <dt><a href="/zh-CN/docs/Web/API/DOMRequest/readyState" title="此页面仍未被本地化, 期待您的翻译!"><code>DOMRequest.readyState</code></a></dt> - <dd>表示操作是否已完成运行的字符串。 其值为“done”或“pending”。</dd> - <dt><a href="/zh-CN/docs/Web/API/DOMRequest/result" title="此页面仍未被本地化, 期待您的翻译!"><code>DOMRequest.result</code></a></dt> - <dd>操作的结果。</dd> - <dt><a href="/zh-CN/docs/Web/API/DOMRequest/error" title="此页面仍未被本地化, 期待您的翻译!"><code>DOMRequest.error</code></a></dt> - <dd>错误信息（如果有）。</dd> -</dl> - -<h2 id="方法">方法</h2> - -<p>无.</p> - -<h2 id="例子">例子</h2> - -<p>使用DOMRequest对象的onsuccess，onerror，result和error属性的一个示例。</p> - -<pre class="brush:js">var pending = navigator.mozApps.install(manifestUrl); - -pending.onsuccess = function () { - // Save the App object that is returned - var appRecord = this.result; - alert('Installation successful!'); -}; -pending.onerror = function () { - // Display the name of the error - alert('Install failed, error: ' + this.error.name); -};</pre> - -<h2 id="规范">规范</h2> - -<p>目前不是任何规范的一部分。</p> - -<h2 id="浏览器支持">浏览器支持</h2> - -<div><p class="warning"><strong><a href="https://github.com/mdn/browser-compat-data">We're converting our compatibility data into a machine-readable JSON format</a></strong>. - This compatibility table still uses the old format, - because we haven't yet converted the data it contains. - <strong><a href="/zh-CN/docs/MDN/Contribute/Structures/Compatibility_tables">Find out how you can help!</a></strong></p> - -<div class="htab"> - <a id="AutoCompatibilityTable" name="AutoCompatibilityTable"></a> - <ul> - <li class="selected"><a>Desktop</a></li> - <li><a>Mobile</a></li> - </ul> -</div></div> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><a href="/en-US/Firefox/Releases/13" title="Released on 2012-06-05.">13.0</a> (13.0)</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - </tr> - <tr> - <td>Available in workers</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><a href="/en-US/Firefox/Releases/41" title="Released on 2015-09-22.">41.0</a> (41.0)</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td>13.0 (13.0)</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - </tr> - <tr> - <td>Available in workers</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td>41.0 (41.0)</td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - <td><span style="color: rgb(255, 153, 0);" title="Compatibility unknown; please update this.">?</span></td> - </tr> - </tbody> -</table> -</div> - -<h2 id="另见">另见</h2> - -<ul> - <li><a href="/zh-CN/docs/Web/API/DOMCursor" title="此页面仍未被本地化, 期待您的翻译!"><code>DOMCursor</code></a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/index.html b/files/zh-cn/archive/b2g_os/api/index.html deleted file mode 100644 index 6748c09ac8..0000000000 --- a/files/zh-cn/archive/b2g_os/api/index.html +++ /dev/null @@ -1,833 +0,0 @@ ---- -title: B2G OS APIs -slug: Archive/B2G_OS/API -tags: - - API - - B2G API - - NeedsTranslation - - TopicStub - - b2g os api's -translation_of: Archive/B2G_OS/API ---- -<h2 id="B2G_OS_uses_standard_Web_API's">B2G OS uses standard Web API's</h2> - -<p></p><div class="index"> -<span>A</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ANGLE_instanced_arrays" title="The ANGLE_instanced_arrays extension is part of the WebGL API and allows to draw the same object, or groups of similar objects multiple times, if they share the same vertex data, primitive count and type."><code>ANGLE_instanced_arrays</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AbortController" title="The AbortController interface represents a controller object that allows you to abort one or more DOM requests as and when desired."><code>AbortController</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AbortSignal" title="The AbortSignal interface represents a signal object that allows you to communicate with a DOM request (such as a Fetch) and abort it if required via an AbortController object."><code>AbortSignal</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AbstractWorker" title="The AbstractWorker interface of the Web Workers API abstracts properties and methods common to all kind of workers, being Worker or SharedWorker."><code>AbstractWorker</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AmbientLightSensor" title="The AmbientLightSensor interface of the the Ambient Light Sensor API returns an interface for accessing AmbientLightSensorReading."><code>AmbientLightSensor</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AmbientLightSensorReading" title="The AmbientLightSensorReading interface of the the Ambient Light Sensor API returns an interface for reading the current light level."><code>AmbientLightSensorReading</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnalyserNode" title="The AnalyserNode interface represents a node able to provide real-time frequency and time-domain analysis information. It is an AudioNode that passes the audio stream unchanged from the input to the output, but allows you to take the generated data, process it, and create audio visualizations."><code>AnalyserNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Animation" title="The Animation interface of the Web Animations API represents a single animation player and provides playback controls and a timeline for an animation node or source."><code>Animation</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnimationEffectReadOnly" title="The AnimationEffectReadOnly interface of the Web Animations API defines current and future animation effects like KeyframeEffect, which can be passed to Animation objects for playing, and KeyframeEffectReadOnly (which is used by CSS Animations and Transitions)."><code>AnimationEffectReadOnly</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnimationEffectTiming" title="The AnimationEffectTiming interface of the Web Animations API is comprised of timing properties. It is returned by the timing attribute of a KeyframeEffect."><code>AnimationEffectTiming</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnimationEffectTimingProperties" title="The AnimationEffectTimingProperties dictionary, part of the Web Animations API, is used by Element.animate(), KeyframeEffectReadOnly(), and KeyframeEffect() to describe timing properties for animation effects. These properties are all optional, although without setting a duration the animation will not play."><code>AnimationEffectTimingProperties</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnimationEffectTimingReadOnly" title="The AnimationEffectTimingReadOnly interface of the Web Animations API is comprised of timing properties."><code>AnimationEffectTimingReadOnly</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnimationEvent" title="The AnimationEvent interface represents events providing information related to animations."><code>AnimationEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnimationPlaybackEvent" title="The AnimationPlaybackEvent interface of the Web Animations API represents animation events."><code>AnimationPlaybackEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AnimationTimeline" title="The AnimationTimeline interface of the Web Animations API represents the timeline of an animation. This interface exists to define timeline features (inherited by DocumentTimeline and future timeline types) and is not itself directly used by developers. Anywhere you see AnimationTimeline, you should use DocumentTimeline or any other timeline type instead."><code>AnimationTimeline</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ArrayBufferView" title="ArrayBufferView is a helper type representing any of the following JavaScript TypedArray types:"><code>ArrayBufferView</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Attr" title="This type represents a DOM element's attribute as an object. In most DOM methods, you will probably directly retrieve the attribute as a string (e.g., Element.getAttribute(), but certain functions (e.g., Element.getAttributeNode()) or means of iterating give Attr types."><code>Attr</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioBuffer" title="Objects of these types are designed to hold small audio snippets, typically less than 45 s. For longer sounds, objects implementing the MediaElementAudioSourceNode are more suitable. The buffer contains data in the following format: non-interleaved IEEE754 32-bit linear PCM with a nominal range between -1 and +1, that is, 32bits floating point buffer, with each samples between -1.0 and 1.0. If the AudioBuffer has multiple channels, they are stored in separate buffer."><code>AudioBuffer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioBufferSourceNode" title="The AudioBufferSourceNode interface is an AudioScheduledSourceNode which represents an audio source consisting of in-memory audio data, stored in an AudioBuffer. It's especially useful for playing back audio which has particularly stringent timing accuracy requirements, such as for sounds that must match a specific rhythm and can be kept in memory rather than being played from disk or the network."><code>AudioBufferSourceNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioContext" title="Also inherits properties from its parent interface, BaseAudioContext."><code>AudioContext</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioDestinationNode" title="AudioDestinationNode has no output (as it is the output, no more AudioNode can be linked after it in the audio graph) and one input. The number of channels in the input must be between 0 and the maxChannelCount value or an exception is raised."><code>AudioDestinationNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioListener" title="It is important to note that there is only one listener per context and that it isn't an AudioNode."><code>AudioListener</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioNode" title="The AudioNode interface is a generic interface for representing an audio processing module like an audio source (e.g. an HTML <audio> or <video> element, an OscillatorNode, etc.), the audio destination, intermediate processing module (e.g. a filter like BiquadFilterNode or ConvolverNode), or volume control (like GainNode)."><code>AudioNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioNodeOptions" title="The AudioNodeOptions dictionary of the Web Audio API specifies options that can be used when creating new AudioNode objects."><code>AudioNodeOptions</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioParam" title="There are two kinds of AudioParam, a-rate and k-rate parameters:"><code>AudioParam</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioProcessingEvent" title="The Web Audio API AudioProcessingEvent represents events that occur when a ScriptProcessorNode input buffer is ready to be processed."><code>AudioProcessingEvent</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/AudioScheduledSourceNode" title="The AudioScheduledSourceNode interface—part of the Web Audio API—is a parent interface for several types of audio source node interfaces which share the ability to be started and stopped, optionally at specified times. Specifically, this interface defines the start() and stop() methods, as well as the onended event handler."><code>AudioScheduledSourceNode</code></a></span></span></li> -</ul> -<span>B</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BaseAudioContext" title="A BaseAudioContext can be a target of events, therefore it implements the EventTarget interface."><code>BaseAudioContext</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BasicCardRequest" title="The BasicCardRequest dictionary is a JavaScript object-structure that can be used in the Payment Request API. The properties of BasicCardRequest are defined in the Basic Card Payment spec)."><code>BasicCardRequest</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BasicCardResponse" title="The BasicCardResponse dictionary (related to the Payment Request API, although defined in the Basic Card Payment spec) defines an object structure for payment response details such as the number/expiry date of the card used to make the payment, and the billing address."><code>BasicCardResponse</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BatteryManager" title="The BatteryManager interface provides ways to get information about the system's battery charge level."><code>BatteryManager</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BeforeInstallPromptEvent" title='The BeforeInstallPromptEvent is fired at the Window.onbeforeinstallprompt handler before a user is prompted to "install" a web site to a home screen on mobile.'><code>BeforeInstallPromptEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BeforeUnloadEvent" title="The beforeunload event is fired when the window, the document and its resources are about to be unloaded."><code>BeforeUnloadEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BiquadFilterNode" title="The BiquadFilterNode interface represents a simple low-order filter, and is created using the AudioContext.createBiquadFilter() method. It is an AudioNode that can represent different kinds of filters, tone control devices, and graphic equalizers."><code>BiquadFilterNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Blob" title="A Blob object represents a file-like object of immutable, raw data. Blobs represent data that isn't necessarily in a JavaScript-native format. The File interface is based on Blob, inheriting blob functionality and expanding it to support files on the user's system."><code>Blob</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BlobBuilder" title="The BlobBuilder interface provides an easy way to construct Blob objects. Just create a BlobBuilder and append chunks of data to it by calling the append() method. When you're done building your blob, call getBlob() to retrieve a Blob containing the data you sent into the blob builder."><code>BlobBuilder</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BlobEvent" title="The BlobEvent interface represents events associated with a Blob. These blobs are typically, but not necessarily, associated with media content."><code>BlobEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Bluetooth" title="The Bluetooth interface of the Web Bluetooth API returns a Promise to a BluetoothDevice object with the specified options."><code>Bluetooth</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BluetoothAdvertisingData" title="The BluetoothDevice interface of the Web Bluetooth API provides advertising data about a particular Bluetooth device."><code>BluetoothAdvertisingData</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BluetoothCharacteristicProperties" title="The BluetoothCharacteristicProperties interface of the the Web Bluetooth API provides an object provides propertieds of a particular BluetoothRemoteGATTCharacteristic."><code>BluetoothCharacteristicProperties</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BluetoothRemoteGATTCharacteristic" title="The BluetoothRemoteGattCharacteristic interface of the Web Bluetooth API represents a GATT Characteristic, which is a basic data element that provides further information about a peripheral’s service."><code>BluetoothRemoteGATTCharacteristic</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BluetoothRemoteGATTDescriptor" title="The BluetoothRemoteGATTDescriptor interface of the Web Bluetooth API provides a GATT Descriptor, which provides further information about a characteristic’s value."><code>BluetoothRemoteGATTDescriptor</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BluetoothRemoteGATTServer" title="The BluetoothRemoteGATTServer interface of the Web Bluetooth API represents a GATT Server on a remote device."><code>BluetoothRemoteGATTServer</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BluetoothStatusChangedEvent" title="The BluetoothStatusChangedEvent API provides access to information regarding any change to the status of a Bluetooth device."><code>BluetoothStatusChangedEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Body" title="The Body mixin of the Fetch API represents the body of the response/request, allowing you to declare what its content type is and how it should be handled."><code>Body</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BroadcastChannel" title="The BroadcastChannel interface represents a named channel that any browsing context of a given origin can subscribe to. It allows communication between different documents (in different windows, tabs, frames or iframes) of the same origin. Messages are broadcasted via a message event fired at all BroadcastChannel objects listening to the channel."><code>BroadcastChannel</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BudgetService" title="The BudgetService interface of the Web Budget API provides a programmatic interface to the user agent’s budget service. It is available in both document and worker environments."><code>BudgetService</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BudgetState" title="The BudgetState interface of the the Web Budget API provides the amount of the user agent's processing budget at a specific point in time."><code>BudgetState</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/BufferSource" title="BufferSource is a typedef used to represent objects that are either themselves an ArrayBuffer, or which are a TypedArray providing an ArrayBufferView."><code>BufferSource</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ByteLengthQueueingStrategy" title="The ByteLengthQueuingStrategy interface of the the Streams API provides a built-in byte length queuing strategy that can be used when constructing streams."><code>ByteLengthQueuingStrategy</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ByteString" title="ByteString is a UTF-8 String that corresponds to the set of all possible sequences of bytes. ByteString maps to a String when returned in JavaScript; generally, it's only used when interfacing with protocols that use bytes and strings interchangably, such as HTTP."><code>ByteString</code></a></span></span></li> -</ul> -<span>C</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CDATASection" title="The CDATASection interface represents a CDATA section that can be used within XML to include extended portions of unescaped text, such that the symbols < and & do not need escaping as they normally do within XML when used as text."><code>CDATASection</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSS" title="The CSS interface holds useful CSS-related methods. No object with this interface are implemented: it contains only static methods and therefore is a utilitarian interface."><code>CSS</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSConditionRule" title="An object implementing the CSSConditionRule interface represents a single condition CSS at-rule, which consists of a condition and a statement block. It is a child of CSSGroupingRule."><code>CSSConditionRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSCounterStyleRule" title="The CSSCounterStyleRule interface represents an @counter-style at-rule."><code>CSSCounterStyleRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSGroupingRule" title="An object implementing the CSSGroupingRule interface represents any CSS at-rule that contains other rules nested within it."><code>CSSGroupingRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSKeyframeRule" title="The CSSKeyframeRule interface describes an object representing a set of style for a given keyframe. It corresponds to the contains of a single keyframe of a @keyframes at-rule. It implements the CSSRule interface with a type value of 8 (CSSRule.KEYFRAME_RULE)."><code>CSSKeyframeRule</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSKeyframesRule" title="The CSSKeyframesRule interface describes an object representing a complete set of keyframes for a CSS animation. It corresponds to the contains of a whole @keyframes at-rule. It implements the CSSRule interface with a type value of 7 (CSSRule.KEYFRAMES_RULE)."><code>CSSKeyframesRule</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSMatrix" title="A CSSMatrix represents a homogeneous 4x4 matrix to which 2D or 3D transforms can be applied. This class was allegedly part of CSS Transitions Module Level 3 at some point, but is not present in the current Working Draft. Use DOMMatrix instead."><code>CSSMatrix</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSMediaRule" title="The CSSMediaRule is an interface representing a single CSS @media rule. It implements the CSSConditionRule interface, and therefore the CSSGroupingRule and the CSSRule interface with a type value of 4 (CSSRule.MEDIA_RULE)."><code>CSSMediaRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSNamespaceRule" title="The CSSNamespaceRule interface describes an object representing a single CSS @namespace at-rule. It implements the CSSRule interface, with a type value of 10 (CSSRule.NAMESPACE_RULE)."><code>CSSNamespaceRule</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSOMString" title="CSSOMString is used to denote string data in CSSOM specifications and can refer to either DOMString or USVString. When a specification says CSSOMString, it is left for the browser vendors to choose whether to use DOMString or USVString. While browser implementations that use UTF-8 internally to represent strings in memory can use USVString when the specification says CSSOMString, implementations that already represent strings as 16-bit sequences might choose to use DOMString instead."><code>CSSOMString</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSPageRule" title="CSSPageRule is an interface representing a single CSS @page rule. It implements the CSSRule interface with a type value of 6 (CSSRule.PAGE_RULE)."><code>CSSPageRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSPrimitiveValue" title="The CSSPrimitiveValue interface derives from the CSSValue interface and represents the current computed value of a CSS property."><code>CSSPrimitiveValue</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSRule" title="The CSSRule interface represents a single CSS rule. There are several types of rules, listed in the Type constants section below."><code>CSSRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSRuleList" title="A CSSRuleList is an (indirect-modify only) array-like object containing an ordered collection of CSSRule objects."><code>CSSRuleList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSStyleDeclaration" title="CSSStyleDeclaration represents a collection of CSS property-value pairs. It is used in a few APIs:"><code>CSSStyleDeclaration</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSStyleRule" title="CSSStyleRule represents a single CSS style rule. It implements the CSSRule interface with a type value of 1 (CSSRule.STYLE_RULE)."><code>CSSStyleRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSStyleSheet" title="The CSSStyleSheet interface represents a single CSS style sheet. It inherits properties and methods from its parent, StyleSheet."><code>CSSStyleSheet</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSSupportsRule" title="The CSSSupportsRule interface describes an object representing a single CSS @supports at-rule. It implements the CSSConditionRule interface, and therefore the CSSRule and CSSGroupingRule interfaces with a type value of 12 (CSSRule.SUPPORTS_RULE)."><code>CSSSupportsRule</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSValue" title="The CSSValue interface represents the current computed value of a CSS property."><code>CSSValue</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CSSValueList" title="The CSSValueList interface derives from the CSSValue interface and provides the abstraction of an ordered collection of CSS values."><code>CSSValueList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Cache" title="The Cache interface provides a storage mechanism for Request / Response object pairs that are cached, for example as part of the ServiceWorker life cycle. Note that the Cache interface is exposed to windowed scopes as well as workers. You don't have to use it in conjunction with service workers, even though it is defined in the service worker spec."><code>Cache</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CacheStorage" title="The CacheStorage interface represents the storage for Cache objects. It provides a master directory of all the named caches that a ServiceWorker, other type of worker or window scope can access (you don't have to use it with service workers, even though that is the spec that defines it) and maintains a mapping of string names to corresponding Cache objects."><code>CacheStorage</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CanvasCaptureMediaStream" title="The CanvasCaptureMediaStream interface represents a MediaStream capturing in real-time the surface of an HTMLCanvasElement."><code>CanvasCaptureMediaStream</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CanvasGradient" title="The CanvasGradient interface represents an opaque object describing a gradient. It is returned by the methods CanvasRenderingContext2D.createLinearGradient() or CanvasRenderingContext2D.createRadialGradient()."><code>CanvasGradient</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CanvasImageSource" title="CanvasImageSource is a helper type representing any objects of one of the following types:"><code>CanvasImageSource</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CanvasPattern" title="The CanvasPattern interface represents an opaque object describing a pattern, based on an image, a canvas or a video, created by the CanvasRenderingContext2D.createPattern() method."><code>CanvasPattern</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CanvasRenderingContext2D" title='To get an object of this interface, call getContext() on a &amp;lt;canvas> element, supplying "2d" as the argument:'><code>CanvasRenderingContext2D</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CaretPosition" title="The CaretPosition interface represents the caret postion, an indicator for the text insertion point. You can get a CaretPosition using the document.caretPositionFromPoint method."><code>CaretPosition</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ChannelMergerNode" title=""><code>ChannelMergerNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ChannelSplitterNode" title=""><code>ChannelSplitterNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CharacterData" title="The CharacterData abstract interface represents a Node object that contains characters. This is an abstract interface, meaning there aren't any object of type CharacterData: it is implemented by other interfaces, like Text, Comment, or ProcessingInstruction which aren't abstract."><code>CharacterData</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ChildNode" title="The ChildNode interface contains methods that are particular to Node objects that can have a parent."><code>ChildNode</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ChromeWorker" title="If you're developing privileged code, and would like to create a worker that can use js-ctypes to perform calls to native code, you can do so by using ChromeWorker instead of the standard Worker object. It works exactly like a standard Worker, except that it has access to js-ctypes via a global ctypes object available in the global scope of the worker. Examples of ChromeWorker's using js-ctypes are availabe on Github and are linked to from the See Also section below. To use a postMessage with callback version of ChromeWorker that features promises, see PromiseWorker."><code>ChromeWorker</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Client" title="The Client interface represents an executable context such as a Worker, or a SharedWorker. Window clients are represented by the more-specific WindowClient. You can get Client/WindowClient objects from methods such as Clients.matchAll() and Clients.get()."><code>Client</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Clients" title="The Clients interface provides access to Client objects. Access it via self.clients within a service worker."><code>Clients</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ClipboardEvent" title="The ClipboardEvent interface represents events providing information related to modification of the clipboard, that is cut, copy, and paste events."><code>ClipboardEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CloseEvent" title="A CloseEvent is sent to clients using WebSockets when the connection is closed. This is delivered to the listener indicated by the WebSocket object's onclose attribute."><code>CloseEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Comment" title="The Comment interface represents textual notations within markup; although it is generally not visually shown, such comments are available to be read in the source view. Comments are represented in HTML and XML as content between '<!--' and '-->'. In XML, the character sequence '--' cannot be used within a comment."><code>Comment</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CompositionEvent" title="The DOM CompositionEvent represents events that occur due to the user indirectly entering text."><code>CompositionEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Console" title="The Console object provides access to the browser's debugging console (e.g., the Web Console in Firefox). The specifics of how it works vary from browser to browser, but there is a de facto set of features that are typically provided."><code>Console</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ConstantSourceNode" title="The ConstantSourceNode interface—part of the Web Audio API—represents an audio source (based upon AudioScheduledSourceNode) whose output is single unchanging value. This makes it useful for cases in which you need a constant value coming in from an audio source. in addition, it can be used like a constructible AudioParam by automating the value of its offset or by connecting another node to it; see Controlling multiple parameters with ConstantSourceNode."><code>ConstantSourceNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ConstrainBoolean" title="The ConstrainBoolean dictionary is used to specify a constraint for a property whose value is a Boolean value. You can specify an exact value which must be matched, an ideal value that should be matched if at all possible, and a fallback value to attempt to match once all more specific constraints have been applied."><code>ConstrainBoolean</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ConstrainDOMString" title="The ConstrainDOMString dictionary is used to specify a constraint for a property whose value is a string. It allows you to specify one or more exact string values from which one must be the parameter's value, or a set of ideal values which should be used if possible. You can also specify a single string (or an array of strings) which the user agent will do its best to match once all more stringent constraints have been applied."><code>ConstrainDOMString</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ConstrainDouble" title="The ConstrainDouble type is used to specify a constraint for a property whose value is a double-precision floating-point number. It extends the DoubleRange dictionary (which provides the ability to specify a permitted range of property values) to also support an exact value and/or an ideal value the property should take on. Additionally, you can specify the property's value as a simple floating-point value, in which case the user agent does its best to match the value once all other more stringent constraints are met."><code>ConstrainDouble</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ConstrainLong" title="The ConstrainLong type is used to specify a constraint for a property whose value is an integral number. It extends the LongRange dictionary (which provides the ability to specify a permitted range of property values) to also support an exact value and/or an ideal value the property should take on. In addition, you can specify the value as a simple long integer value, in which case the user agent does its best to match the value once all other more stringent constraints are met."><code>ConstrainLong</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ConvolverNode" title="The ConvolverNode interface is an AudioNode that performs a Linear Convolution on a given AudioBuffer, often used to achieve a reverb effect. A ConvolverNode always has exactly one input and one output."><code>ConvolverNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Coordinates" title="The Coordinates interface represents the position and altitude of the device on Earth, as well as the accuracy with which these properties are calculated."><code>Coordinates</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CountQueueingStrategy" title="The CountQueuingStrategy interface of the the Streams API provides a built-in byte length queuing strategy that can be used when constructing streams."><code>CountQueueingStrategy</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Credential" title="The Credential interface of the the Credential Management API provides information about an entity as a prerequisite to a trust decision."><code>Credential</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CredentialsContainer" title="The CredentialsContainer interface of the the Credential Management API exposes methods to request credentials and notify the user agent when events such as successful sign in or sign out happen. This interface is accessible from Navigator.credentials."><code>CredentialsContainer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Crypto" title="The Crypto interface represents basic cryptography features available in the current context. It allows access to a cryptographically strong random number generator and to cryptographic primitives."><code>Crypto</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CryptoKey" title="The CryptoKey interface represents a cryptographic key derived from a specific key algorithm."><code>CryptoKey</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CustomElementRegistry" title="The CustomElementRegistry interface provides methods for registering custom elements and querying registered elements. It can be accessed with window.customElements."><code>CustomElementRegistry</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/CustomEvent" title="This interface inherits properties from its parent, Event:"><code>CustomEvent</code></a></span></span></li> -</ul> -<span>D</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMConfiguration" title='Pre-defined parameters: "canonical-form", "cdata-sections", "check-character-normalization", "comments", "datatype-normalization", "element-content-whitespace", "entities", "error-handler", "infoset", "namespaces", "namespace-declarations", "normalize-characters","schema-location", "schema-type", "split-cdata-sections", "validate", "validate-if-schema", "well-formed"'><code>DOMConfiguration</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMError" title="The DOMError interface describes an error object that contains an error name."><code>DOMError</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMErrorHandler" title='Set as "error-handler" parameter in DOMConfiguration.setParameter . Implementation may provide a default handler. DOMError.relatedData will contain closest node to where error occurred or contain the Document node if it is unable to be determined. Document mutations from within the error handler result in implementation-dependent behavior. If there are to be multiple errors, the sequence and numbers of the errors passed to the error handler are also implementation dependent. The application using the DOM implementation implements this interface:'><code>DOMErrorHandler</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMException" title="The DOMException interface represents an abnormal event (called an exception) which occurs as a result of calling a method or accessing a property of a web API."><code>DOMException</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMHighResTimeStamp" title="The DOMHighResTimeStamp type is a double and is used to store a time value. The value could be a discrete point in time or the difference in time between two discrete points in time. The unit is milliseconds and should be accurate to 5 µs (microseconds). However, if the browser is unable to provide a time value accurate to 5 microseconds (due, for example, to hardware or software constraints), the browser can represent the value as a time in milliseconds accurate to a millisecond."><code>DOMHighResTimeStamp</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMImplementation" title="The DOMImplementation interface represent an object providing methods which are not dependent on any particular document. Such an object is returned by the Document.implementation property."><code>DOMImplementation</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMImplementationList" title="Returned by DOMImplementationSource.getDOMImplementationList() and DOMImplementationRegistry.getDOMImplementationList() . Can be iterated with 0-based index."><code>DOMImplementationList</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMImplementationRegistry" title="This is a global variable used to get a single DOMImplementation or DOMImplementationList depending on the registered objects with the specified features."><code>DOMImplementationRegistry</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMImplementationSource" title="Can request a particular implementation based on needed features and versions (which can then be used to create a document, etc.). Called during DOMImplementationRegistry.getDOMImplementation() and DOMImplementationRegistry.getDOMImplementationList()."><code>DOMImplementationSource</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMLocator" title="Indicates a location such as where an error occurred. Returned by DOMError.location."><code>DOMLocator</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMMatrix" title="The DOMMatrix interface represents 4x4 matrices, suitable for 2D and 3D operations."><code>DOMMatrix</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMMatrixReadOnly" title="The DOMMatrixReadOnly interface represents 4x4 matrices, suitable for 2D and 3D operations. If this interface defines only read-only matrices, the DOMMatrix interface which inherits from it, add all the properties and the methods to allow to have modifiable matrices."><code>DOMMatrixReadOnly</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMObject" title=""><code>DOMObject</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMParser" title="DOMParser can parse XML or HTML source stored in a string into a DOM Document. DOMParser is specified in DOM Parsing and Serialization."><code>DOMParser</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMPoint" title="A DOMPoint represents a 2D or 3D point in a coordinate system."><code>DOMPoint</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMPointReadOnly" title="Editorial review completed."><code>DOMPointReadOnly</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMRect" title="A DOMRect represents a rectangle."><code>DOMRect</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMRectReadOnly" title="The DOMRectReadOnly interface specifies the standard properties used by DOMRect to define a rectangle."><code>DOMRectReadOnly</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMString" title="DOMString is a UTF-16 String. As JavaScript already uses such strings, DOMString is mapped directly to a String."><code>DOMString</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMStringList" title="A type returned by some APIs which contains a list of DOMString (strings)."><code>DOMStringList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMStringMap" title="Editorial review completed."><code>DOMStringMap</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMTimeStamp" title="The DOMTimeStamp type represents an absolute or relative number of milliseconds, depending on the specification in which it appears."><code>DOMTimeStamp</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMTokenList" title="The DOMTokenList interface represents a set of space-separated tokens. Such a set is returned by Element.classList, HTMLLinkElement.relList, HTMLAnchorElement.relList or HTMLAreaElement.relList. It is indexed beginning with 0 as with JavaScript Array objects. DOMTokenList is always case-sensitive."><code>DOMTokenList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DOMUserData" title="DOMUserData refers to application data. In JavaScript, it maps directly to Object. It is returned or used as an argument by Node.setUserData(), Node.getUserData(), used as the third argument to handle() on UserDataHandler, and is used or returned by various DOMConfiguration methods."><code>DOMUserData</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DataTransfer" title="The DataTransfer object is used to hold the data that is being dragged during a drag and drop operation. It may hold one or more data items, each of one or more data types. For more information about drag and drop, see HTML Drag and Drop API."><code>DataTransfer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DataTransferItem" title="The DataTransferItem object represents one drag data item. During a drag operation, each drag event has a dataTransfer property which contains a list of drag data items. Each item in the list is a DataTransferItem object."><code>DataTransferItem</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DataTransferItemList" title="The DataTransferItemList object is a list of DataTransferItem objects representing items being dragged. During a drag operation, each DragEvent has a dataTransfer property and that property is a DataTransferItemList."><code>DataTransferItemList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DedicatedWorkerGlobalScope" title="The DedicatedWorkerGlobalScope object (the Worker global scope) is accessible through the self keyword. Some additional global functions, namespaces objects, and constructors, not typically associated with the worker global scope, but available on it, are listed in the JavaScript Reference. See also: Functions available to workers."><code>DedicatedWorkerGlobalScope</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DelayNode" title=""><code>DelayNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DeviceAcceleration" title="A DeviceAcceleration object provides information about the amount of acceleration the device is experiencing along all three axes."><code>DeviceAcceleration</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DeviceLightEvent" title="The DeviceLightEvent provides web developers with information from photo sensors or similiar detectors about ambient light levels near the device. For example this may be useful to adjust the screen's brightness based on the current ambient light level in order to save energy or provide better readability."><code>DeviceLightEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DeviceMotionEvent" title="The DeviceMotionEvent provides web developers with information about the speed of changes for the device's position and orientation."><code>DeviceMotionEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DeviceOrientationEvent" title="The DeviceOrientationEvent provides web developers with information from the physical orientation of the device running the web page."><code>DeviceOrientationEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DeviceProximityEvent" title="The DeviceProximityEvent interface provides information about the distance of a nearby physical object using the proximity sensor of a device."><code>DeviceProximityEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DeviceRotationRate" title="A DeviceRotationRate object provides information about the rate at which the device is rotating around all three axes."><code>DeviceRotationRate</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DirectoryEntrySync" title="The DirectoryEntrySync interface of the File System API represents a directory in a file system. It includes methods for creating, reading, looking up, and recursively removing files in a directory."><code>DirectoryEntrySync</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DirectoryReaderSync" title="The DirectoryReaderSync interface of the File System API lets you read the entries in a directory."><code>DirectoryReaderSync</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Document" title="The Document interface represents any web page loaded in the browser and serves as an entry point into the web page's content, which is the DOM tree."><code>Document</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DocumentFragment" title="The DocumentFragment interface represents a minimal document object that has no parent. It is used as a lightweight version of Document that stores a segment of a document structure comprised of nodes just like a standard document. The key difference is that because the document fragment isn't part of the active document tree structure, changes made to the fragment don't affect the document, cause reflow, or incur any performance impact that can occur when changes are made."><code>DocumentFragment</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DocumentOrShadowRoot" title="The DocumentOrShadowRoot interface of the Shadow DOM API provides APIs that are shared between documents and shadow roots."><code>DocumentOrShadowRoot</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DocumentTimeline" title="The DocumentTimeline interface of the the Web Animations API represents animation timelines, including the default document timeline (accessed via Document.timeline)."><code>DocumentTimeline</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DocumentTouch" title="The DocumentTouch interface used to provide convenience methods for creating Touch and TouchList objects, but DocumentTouch been removed from the standards. These two methods now live on the Document interface now."><code>DocumentTouch</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DocumentType" title="The DocumentType interface represents a Node containing a doctype."><code>DocumentType</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DoubleRange" title="The DoubleRange dictionary is used to define a range of permitted double-precision floating-point values for a property, with either or both a maximum and minimum value specified. The ConstrainDouble dictionary is based on this, augmenting it to support exact and ideal values as well."><code>DoubleRange</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DragEvent" title="The DragEvent interface is a DOM event that represents a drag and drop interaction. The user initiates a drag by placing a pointer device (such as a mouse) on the touch surface and then dragging the pointer to a new location (such as another DOM element). Applications are free to interpret a drag and drop interaction in an application-specific way."><code>DragEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/DynamicsCompressorNode" title="Inherits properties from its parent, AudioNode."><code>DynamicsCompressorNode</code></a></span></span></li> -</ul> -<span>E</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_blend_minmax" title="The EXT_blend_minmax extension is part of the WebGL API and extends blending capabilities by adding two new blend equations: the minimum or maximum color components of the source and destination colors."><code>EXT_blend_minmax</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_color_buffer_float" title="The EXT_color_buffer_float extension is part of WebGL and adds the ability to render a variety of floating point formats."><code>EXT_color_buffer_float</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_color_buffer_half_float" title="The EXT_color_buffer_half_float extension is part of the WebGL API and adds the ability to render to 16-bit floating-point color buffers."><code>EXT_color_buffer_half_float</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_disjoint_timer_query" title="The EXT_disjoint_timer_query extension is part of the WebGL API and provides a way to measure the duration of a set of GL commands, without stalling the rendering pipeline."><code>EXT_disjoint_timer_query</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_frag_depth" title="The EXT_frag_depth extension is part of the WebGL API and enables to set a depth value of a fragment from within the fragment shader."><code>EXT_frag_depth</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_sRGB" title="The EXT_sRGB extension is part of the WebGL API and adds sRGB support to textures and framebuffer objects."><code>EXT_sRGB</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_shader_texture_lod" title="The EXT_shader_texture_lod extension is part of the WebGL API and adds additional texture functions to the OpenGL ES Shading Language which provide the shader writer with explicit control of LOD (Level of detail)."><code>EXT_shader_texture_lod</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EXT_texture_filter_anisotropic" title="The EXT_texture_filter_anisotropic extension is part of the WebGL API and exposes two constants for anisotropic filtering (AF)."><code>EXT_texture_filter_anisotropic</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Element" title="Element is the most general base class from which all objects in a Document inherit. It only has methods and properties common to all kinds of element. More specific classes inherit from Element."><code>Element</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ElementTraversal" title="The ElementTraversal interface was defining methods allowing to access from one Node to another one in the document tree."><code>ElementTraversal</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Entity" title="Read-only reference to a DTD entity. Also inherits the methods and properties of Node."><code>Entity</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EntityReference" title="Read-only reference to an entity reference in the DOM tree. Has no properties or methods of its own but inherits from Node."><code>EntityReference</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EntrySync" title="The EntrySync interface of the FileSystem API represents an entry in a file system. The entry can be a FileEntrySync or a DirectoryEntry. It includes methods for working with files—including copying, moving, removing, and reading files—as well as information about the file it points to—including the file name and its path from the root to the entry."><code>EntrySync</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ErrorEvent" title="The ErrorEvent interface represents events providing information related to errors in scripts or in files."><code>ErrorEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Event" title="The Event interface represents any event which takes place in the DOM; some are user-generated (such as mouse or keyboard events), while others are generated by APIs (such as events that indicate an animation has finished running, a video has been paused, and so forth). There are many types of events, some of which use other interfaces based on the main Event interface. Event itself contains the properties and methods which are common to all events."><code>Event</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EventListener" title="This method is called whenever an event occurs of the type for which the EventListener interface was registered."><code>EventListener</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EventSource" title="The EventSource interface is used to receive server-sent events. It connects to a server over HTTP and receives events in text/event-stream format without closing the connection."><code>EventSource</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/EventTarget" title="EventTarget is an interface implemented by objects that can receive events and may have listeners for them."><code>EventTarget</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ExtendableEvent" title="The ExtendableEvent interface extends the lifetime of the install and activate events dispatched on the global scope as part of the service worker lifecycle. This ensures that any functional events (like FetchEvent) are not dispatched until it upgrades database schemas and deletes the outdated cache entries."><code>ExtendableEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ExtendableMessageEvent" title="The ExtendableMessageEvent interface of the ServiceWorker API represents the event object of a message event fired on a service worker (when a channel message is received on the ServiceWorkerGlobalScope from another context) — extends the lifetime of such events."><code>ExtendableMessageEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> -<span>F</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FederatedCredential" title="The FederatedCredential interface of the the Credential Management API provides information about credentials from a federated identity provider. A federated identity provider is an entity that a website trusts to correctly authenticate a user, and that provides an API for that purpose. OpenID Connect is an example of a federated identity provider framework."><code>FederatedCredential</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FetchEvent" title="This is the event type for fetch events despatched on the service worker global scope. It contains information about the fetch, including the request and how the receiver will treat the response. It provides the event.respondWith() method, which allows us to provide a response to this fetch."><code>FetchEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/File" title="The File interface provides information about files and allows JavaScript in a web page to access their content."><code>File</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileEntrySync" title="The FileEntrySync interface of the File System API represents a file in a file system. It lets you write content to a file."><code>FileEntrySync</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileError" title="Represents an error that occurs while using the FileReader interface."><code>FileError</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileException" title="In the File System API, a FileException object represents error conditions that you might encounter while accessing the file system using the synchronous API. It extends the FileException interface described in File Writer and adds several new error codes."><code>FileException</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileList" title="An object of this type is returned by the files property of the HTML <input> element; this lets you access the list of files selected with the <input type="file"> element. It's also used for a list of files dropped into web content when using the drag and drop API; see the DataTransfer object for details on this usage."><code>FileList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileReader" title="The FileReader object lets web applications asynchronously read the contents of files (or raw data buffers) stored on the user's computer, using File or Blob objects to specify the file or data to read."><code>FileReader</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileReaderSync" title="The FileReaderSync interface allows to read File or Blob objects in a synchronous way."><code>FileReaderSync</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileRequest" title="The FileRequest interface extends the DOMRequest interface to provide some extra properties necessary for the LockedFile objects."><code>FileRequest</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileSystem" title="The File and Directory Entries API interface FileSystem is used to represent a file system. These objects can be obtained from the filesystem property on any file system entry. Some browsers offer additional APIs to create and manage file systems, such as Chrome's requestFileSystem() method."><code>FileSystem</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileSystemDirectoryEntry" title="The FileSystemDirectoryEntry interface of the File and Directory Entries API represents a directory in a file system. It provides methods which make it possible to access and manipulate the files in a directory, as well as to access the entries within the directory."><code>FileSystemDirectoryEntry</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileSystemDirectoryReader" title="The FileSystemDirectoryReader interface of the File and Directory Entries API lets you access the FileEntry-based objects (generally FileSystemFileEntry or FileSystemDirectoryEntry) representing each entry in a directory."><code>FileSystemDirectoryReader</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileSystemEntry" title="The FileSystemEntry interface of the File and Directory Entries API represents a single in a file system. The entry can be a file or a directory (directories are represented by the DirectoryEntry interface). It includes methods for working with files—including copying, moving, removing, and reading files—as well as information about a file it points to—including the file name and its path from the root to the entry."><code>FileSystemEntry</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileSystemFileEntry" title="The FileSystemFileEntry interface of the File System API represents a file in a file system. It offers properties describing the file's attributes, as well as the file() method, which creates a File object that can be used to read the file."><code>FileSystemFileEntry</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileSystemFlags" title="The FileSystemFlags dictionary defines a set of values which are used when specifying option flags when calling certain methods in the File and Directory Entries API. Methods which accept an options parameter of this type may specify zero or more of these flags as fields in an object, like this:"><code>FileSystemFlags</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FileSystemSync" title="In the File System API, a FileSystemSync object represents a file system. It has two properties."><code>FileSystemSync</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FocusEvent" title="The FocusEvent interface represents focus-related events like focus, blur, focusin, or focusout."><code>FocusEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FontFace" title="The FontFace interface represents a single usable font face. It allows control of the source of the font face, being a URL to an external resource, or a buffer; it also allows control of when the font face is loaded and its current status."><code>FontFace</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FontFaceSet" title="The FontFaceSet interface of the CSS Font Loading API manages the loading of font-faces and querying of their download status."><code>FontFaceSet</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FontFaceSetLoadEvent" title="The FontFaceSetLoadEvent interface of the the Css Font Loading API is fired whenever a FontFaceSet loads."><code>FontFaceSetLoadEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FormData" title='The FormData interface provides a way to easily construct a set of key/value pairs representing form fields and their values, which can then be easily sent using the XMLHttpRequest.send() method. It uses the same format a form would use if the encoding type were set to "multipart/form-data".'><code>FormData</code></a></span></span></li> -</ul> -<span>G</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GainNode" title="The gain is a unitless value, changing with time, that is multiplied to each corresponding sample of all input channels. If modified, the new gain is applied using a de-zippering algorithm in order to prevent unaesthetic 'clicks' from appearing in the resulting audio."><code>GainNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Gamepad" title="The Gamepad interface of the Gamepad API defines an individual gamepad or other controller, allowing access to information such as button presses, axis positions, and id."><code>Gamepad</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GamepadButton" title="The GamepadButton interface defines an individual button of a gamepad or other controller, allowing access to the current state of different types of buttons available on the control device."><code>GamepadButton</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GamepadEvent" title=""><code>GamepadEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GamepadHapticActuator" title="The GamepadHapticActuator interface of the Gamepad API represents hardware in the controller designed to provide haptic feedback to the user (if available), most commonly vibration hardware."><code>GamepadHapticActuator</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GamepadPose" title="The GamepadPose interface of the Gamepad API represents the pose of a WebVR controller at a given timestamp (which includes orientation, position, velocity, and acceleration information.)"><code>GamepadPose</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Geolocation" title="The Geolocation interface represents an object able to programmatically obtain the position of the device. It gives Web content access to the location of the device. This allows a Web site or app to offer customized results based on the user's location."><code>Geolocation</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GestureEvent" title="The GestureEvent is a proprietary interface specific to WebKit which gives information regarding multi-touch gestures. Events using this interface include gesturestart, gesturechange, and gestureend."><code>GestureEvent</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GlobalEventHandlers" title="The GlobalEventHandlers mixin describes the event handlers common to several interfaces like HTMLElement, Document, or Window. Each of these interfaces can, of course, add more event handlers in addition to the ones listed below."><code>GlobalEventHandlers</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/GlobalFetch" title="The GlobalFetch mixin of the Fetch API contains the GlobalFetch.fetch() method used to start the process of fetching a resource."><code>GlobalFetch</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> -<span>H</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HMDVRDevice" title="The HMDVRDevice interface of the WebVR API represents a head mounted display, providing access to information about each eye, and allowing us to modify the current field of view."><code>HMDVRDevice</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLAnchorElement" title="The HTMLAnchorElement interface represents hyperlink elements and provides special properties and methods (beyond those of the regular HTMLElement object interface that they inherit from) for manipulating the layout and presentation of such elements."><code>HTMLAnchorElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLAreaElement" title="The HTMLAreaElement interface provides special properties and methods (beyond those of the regular object HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of area elements."><code>HTMLAreaElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLAudioElement" title="The HTMLAudioElement interface provides access to the properties of <audio> elements, as well as methods to manipulate them. It derives from the HTMLMediaElement interface."><code>HTMLAudioElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLBRElement" title="The HTMLBRElement interface represents a HTML line break element (<br>). It inherits from HTMLElement."><code>HTMLBRElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLBaseElement" title="The HTMLBaseElement interface contains the base URI for a document. This object inherits all of the properties and methods as described in the HTMLElement interface."><code>HTMLBaseElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLBaseFontElement" title="The HTMLBaseFontElement interface provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <basefont> elements."><code>HTMLBaseFontElement</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLBodyElement" title="The HTMLBodyElement interface provides special properties (beyond those of the regular HTMLElement interface they also inherit) for manipulating body elements."><code>HTMLBodyElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLButtonElement" title="The HTMLButtonElement interface provides properties and methods (beyond the <button> object interface it also has available to them by inheritance) for manipulating the layout and presentation of button elements."><code>HTMLButtonElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLCanvasElement" title="The HTMLCanvasElement interface provides properties and methods for manipulating the layout and presentation of canvas elements. The HTMLCanvasElement interface also inherits the properties and methods of the HTMLElement interface."><code>HTMLCanvasElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLCollection" title="The HTMLCollection interface represents a generic collection (array-like object similar to arguments) of elements (in document order) and offers methods and properties for selecting from the list."><code>HTMLCollection</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLContentElement" title="The HTMLContentElement interface represents a <content> HTML Element, which is used in Shadow DOM."><code>HTMLContentElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLDListElement" title="The HTMLDListElement interface provides special properties (beyond those of the regular HTMLElement interface it also has available to it by inheritance) for manipulating definition list elements."><code>HTMLDListElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLDataElement" title="The HTMLDataElement interface provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <data> elements."><code>HTMLDataElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLDataListElement" title="The HTMLDataListElement interface provides special properties (beyond the HTMLElement object interface it also has available to it by inheritance) to manipulate <datalist> elements and their content."><code>HTMLDataListElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLDialogElement" title="The HTMLDialogElement interface provides methods to manipulate <dialog> elements. It inherits properties and methods from the HTMLElement interface."><code>HTMLDialogElement</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLDivElement" title="The HTMLDivElement interface provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating div elements."><code>HTMLDivElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLDocument" title="HTMLDocument is an abstract interface of the DOM which provides access to special properties and methods not present by default on a regular (XML) document."><code>HTMLDocument</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLElement" title="The HTMLElement interface represents any HTML element. Some elements directly implement this interface, others implement it via an interface that inherits it."><code>HTMLElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLEmbedElement" title="The HTMLEmbedElement interface, which provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <embed> elements."><code>HTMLEmbedElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLFieldSetElement" title="The HTMLFieldSetElement interface has special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of field-set elements."><code>HTMLFieldSetElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLFontElement" title="Implements the document object model (DOM) representation of the font element. The HTML Font Element <font> defines the font size, font face and color of text."><code>HTMLFontElement</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLFormControlsCollection" title="The HTMLFormControlsCollection interface represents a collection of HTML form control elements. It replaces one method of HTMLCollection."><code>HTMLFormControlsCollection</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLFormElement" title="The HTMLFormElement interface provides methods to create and modify <form> elements."><code>HTMLFormElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLFrameSetElement" title="The HTMLFrameSetElement interface provides special properties (beyond those of the regular HTMLElement interface they also inherit) for manipulating <frameset> elements."><code>HTMLFrameSetElement</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLHRElement" title="The HTMLHRElement interface provides special properties (beyond those of the HTMLElement interface it also has available to it by inheritance) for manipulating <hr> elements."><code>HTMLHRElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLHeadElement" title="The HTMLHeadElement interface contains the descriptive information, or metadata, for a document. This object inherits all of the properties and methods described in the HTMLElement interface."><code>HTMLHeadElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLHeadingElement" title="The HTMLHeadingElement interface represents the different heading elements. It inherits methods and properties from the HTMLElement interface."><code>HTMLHeadingElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLHtmlElement" title="The HTMLHtmlElement interface serves as the root node for a given HTML document. This object inherits the properties and methods described in the HTMLElement interface."><code>HTMLHtmlElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLHyperlinkElementUtils" title="The HTMLHyperlinkElementUtils mixin defines utility methods and properties to work with HTMLAnchorElement and HTMLAreaElement. These utilities allow to deal with common features like URLs."><code>HTMLHyperlinkElementUtils</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLIFrameElement" title="The HTMLIFrameElement interface provides special properties and methods (beyond those of the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of inline frame elements."><code>HTMLIFrameElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLImageElement" title="The HTMLImageElement interface provides special properties and methods for manipulating the layout and presentation of <img> elements."><code>HTMLImageElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLInputElement" title="The HTMLInputElement interface provides special properties and methods for manipulating the layout and presentation of input elements."><code>HTMLInputElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLIsIndexElement" title="The HTMLIsIndexElement interface provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <isindex> elements."><code>HTMLIsIndexElement</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLKeygenElement" title="Technical review completed."><code>HTMLKeygenElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLLIElement" title="The HTMLLIElement interface exposes specific properties and methods (beyond those defined by regular HTMLElement interface it also has available to it by inheritance) for manipulating list elements."><code>HTMLLIElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLLabelElement" title="The HTMLLabelElement interface gives access to properties specific to <label> elements. It inherits methods and properties from the base HTMLElement interface."><code>HTMLLabelElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLLegendElement" title="The HTMLLegendElement is an interface allowing to access properties of the <legend> elements. It inherits properties and methods from the HTMLElement interface."><code>HTMLLegendElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLLinkElement" title="The HTMLLinkElement interface represents reference information for external resources and the relationship of those resources to a document and vice-versa. This object inherits all of the properties and methods of the HTMLElement interface."><code>HTMLLinkElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLMapElement" title="The HTMLMapElement interface provides special properties and methods (beyond those of the regular object HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of map elements."><code>HTMLMapElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLMediaElement" title="The HTMLMediaElement interface adds to HTMLElement the properties and methods needed to support basic media-related capabilities that are common to audio and video."><code>HTMLMediaElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLMetaElement" title="The HTMLMetaElement interface contains descriptive metadata about a document. It inherits all of the properties and methods described in the HTMLElement interface."><code>HTMLMetaElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLMeterElement" title="The HTML <meter> elements expose the HTMLMeterElement interface, which provides special properties and methods (beyond the HTMLElement object interface they also have available to them by inheritance) for manipulating the layout and presentation of <meter> elements."><code>HTMLMeterElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLModElement" title="The HTMLModElement interface provides special properties (beyond the regular methods and properties available through the HTMLElement interface they also have available to them by inheritance) for manipulating modification elements, that is <del> and <ins>."><code>HTMLModElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLOListElement" title="The HTMLOListElement interface provides special properties (beyond those defined on the regular HTMLElement interface it also has available to it by inheritance) for manipulating ordered list elements."><code>HTMLOListElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLObjectElement" title="The HTMLObjectElement interface provides special properties and methods (beyond those on the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of <object> element, representing external resources."><code>HTMLObjectElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLOptGroupElement" title="The HTMLOptGroupElement interface provides special properties and methods (beyond the regular HTMLElement object interface they also have available to them by inheritance) for manipulating the layout and presentation of <optgroup> elements."><code>HTMLOptGroupElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLOptionElement" title="The HTMLOptionElement interface represents <option> elements and inherits all classes and methods of the HTMLElement interface."><code>HTMLOptionElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLOptionsCollection" title='HTMLOptionsCollection is an interface representing a collection of HTML option elements (in document order) and offers methods and properties for traversing the list as well as optionally altering its items. This type is returned solely by the "options" property of select.'><code>HTMLOptionsCollection</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLOutputElement" title="The HTMLOutputElement interface provides properties and methods (beyond those inherited from HTMLElement) for manipulating the layout and presentation of <output> elements."><code>HTMLOutputElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLParagraphElement" title="The HTMLParagraphElement interface provides special properties (beyond those of the regular HTMLElement object interface it inherits) for manipulating <p> elements."><code>HTMLParagraphElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLParamElement" title="The HTMLParamElement interface provides special properties (beyond those of the regular HTMLElement object interface it inherits) for manipulating <param> elements, representing a pair of a key and a value that acts as a parameter for an <object> element."><code>HTMLParamElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLPictureElement" title="The HTMLPictureElement interface represents a <picture> HTML element. It doesn't implement specific properties or methods."><code>HTMLPictureElement</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLPreElement" title="The HTMLPreElement interface expose specific properties and methods (beyond those defined by regular HTMLElement interface it also has available to it by inheritance) for manipulating block of preformatted text."><code>HTMLPreElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLProgressElement" title="The HTMLProgressElement interface provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of <progress> elements."><code>HTMLProgressElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLQuoteElement" title="The HTMLQuoteElement interface provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating quoting elements, like <blockquote> and <q>, but not the <cite> element."><code>HTMLQuoteElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLScriptElement" title="HTML script elements expose the HTMLScriptElement interface, which provides special properties and methods (beyond the regular HTMLElement object interface they also have available to them by inheritance) for manipulating the layout and presentation of <script> elements."><code>HTMLScriptElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLSelectElement" title="The HTMLSelectElement interface represents a <select> HTML Element. These elements also share all of the properties and methods of other HTML elements via the HTMLElement interface."><code>HTMLSelectElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLShadowElement" title="The HTMLShadowElement interface represents a <shadow> HTML Element, which is used in Shadow DOM."><code>HTMLShadowElement</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLSlotElement" title="The HTMLSlotElement interface of the Shadow DOM API enables access to the name and assigned nodes of an HTML <slot> element."><code>HTMLSlotElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLSourceElement" title="The HTMLSourceElement interface provides special properties (beyond the regular HTMLElement object interface it also has available to it by inheritance) for manipulating <source> elements."><code>HTMLSourceElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLSpanElement" title="The HTMLSpanElement interface represents a <span> element and derives from the HTMLElement interface, but without implementing any additional properties or methods."><code>HTMLSpanElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLStyleElement" title="The HTMLStyleElement interface represents a <style> element. It inherits properties and methods from its parent, HTMLElement, and from LinkStyle."><code>HTMLStyleElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableCaptionElement" title="The HTMLTableCaptionElement interface special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating table caption elements."><code>HTMLTableCaptionElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableCellElement" title="The HTMLTableCellElement interface provides special properties and methods (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of table cells, either header or data cells, in an HTML document."><code>HTMLTableCellElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableColElement" title="The HTMLTableColElement interface provides special properties (beyond the HTMLElement interface it also has available to it inheritance) for manipulating single or grouped table column elements."><code>HTMLTableColElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableDataCellElement" title="The HTMLTableDataCellElement interface provides special properties and methods (beyond the regular HTMLTableCellElement and HTMLElement interfaces it also has available to it by inheritance) for manipulating the layout and presentation of table data cells in an HTML document."><code>HTMLTableDataCellElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableElement" title="The HTMLTableElement interface provides special properties and methods (beyond the regular HTMLElement object interface it also has available to it by inheritance) for manipulating the layout and presentation of tables in an HTML document."><code>HTMLTableElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableHeaderCellElement" title="The HTMLTableHeaderCellElement interface provides special properties and methods (beyond the regular HTMLTableCellElement and HTMLElement interfaces it also has available to it by inheritance) for manipulating the layout and presentation of table header cells in an HTML document."><code>HTMLTableHeaderCellElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableRowElement" title="The HTMLTableRowElement interface provides special properties and methods (beyond the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of rows in an HTML table."><code>HTMLTableRowElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTableSectionElement" title="The HTMLTableSectionElement interface provides special properties and methods (beyond the HTMLElement interface it also has available to it by inheritance) for manipulating the layout and presentation of sections, that is headers, footers and bodies, in an HTML table."><code>HTMLTableSectionElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTemplateElement" title="The HTMLTemplateElement interface enables access to the contents of an HTML <template> element."><code>HTMLTemplateElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTextAreaElement" title="The HTMLTextAreaElement interface provides special properties and methods for manipulating the layout and presentation of <textarea> elements."><code>HTMLTextAreaElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTimeElement" title="The HTMLTimeElement interface provides special properties (beyond the regular HTMLElement interface it also has available to it by inheritance) for manipulating <time> elements."><code>HTMLTimeElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTitleElement" title="The HTMLTitleElement interface contains the title for a document. This element inherits all of the properties and methods of the HTMLElement interface."><code>HTMLTitleElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLTrackElement" title="The HTMLTrackElement"><code>HTMLTrackElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLUListElement" title="The HTMLUListElement interface provides special properties (beyond those defined on the regular HTMLElement interface it also has available to it by inheritance) for manipulating unordered list elements."><code>HTMLUListElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLUnknownElement" title="The HTMLUnknownElement interface represents an invalid HTML element and derives from the HTMLElement interface, but without implementing any additional properties or methods."><code>HTMLUnknownElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HTMLVideoElement" title="The HTMLVideoElement interface provides special properties and methods for manipulating video objects. It also inherits properties and methods of HTMLMediaElement and HTMLElement."><code>HTMLVideoElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/HashChangeEvent" title="The hashchange event is fired when the fragment identifier of the URL has changed (the part of the URL that follows the # symbol, including the # symbol)."><code>HashChangeEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Headers" title="The Headers interface of the Fetch API allows you to perform various actions on HTTP request and response headers. These actions include retrieving, setting, adding to, and removing. A Headers object has an associated header list, which is initially empty and consists of zero or more name and value pairs. You can add to this using methods like append() (see Examples.) In all methods of this interface, header names are matched by case-insensitive byte sequence."><code>Headers</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/History" title="Editorial review completed."><code>History</code></a></span></span></li> -</ul> -<span>I</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBCursor" title="The IDBCursor interface of the IndexedDB API represents a cursor for traversing or iterating over multiple records in a database."><code>IDBCursor</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBCursorSync" title="The IDBCursorSync interface of the IndexedDB API represents a cursor for iterating over multiple records in a database. You can have only one instance of IDBCursorSync representing a cursor, but you can have an unlimited number of cursors at the same time. Operations are performed on the underlying index or object store. It enables an application to synchronously process all the records in the cursor's range."><code>IDBCursorSync</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBCursorWithValue" title=""><code>IDBCursorWithValue</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBDatabase" title="The IDBDatabase interface of the IndexedDB API provides a connection to a database; you can use an IDBDatabase object to open a transaction on your database then create, manipulate, and delete objects (data) in that database. The interface provides the only way to get and manage versions of the database."><code>IDBDatabase</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBDatabaseException" title="In the IndexedDB API, an IDBDatabaseException object represents exception conditions that can be encountered while performing database operations."><code>IDBDatabaseException</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBDatabaseSync" title="The DatabaseSync interface in the IndexedDB API represents a synchronous connection to a database."><code>IDBDatabaseSync</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBEnvironment" title="The IDBEnvironment helper of the IndexedDB API contains the indexedDB property, which provides access to IndexedDB functionality. It is the top level IndexedDB interface implemented by the window and Worker objects."><code>IDBEnvironment</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBEnvironmentSync" title="The Unimplemented IDBEnvironmentSync interface of the IndexedDB API will be implemented by worker objects."><code>IDBEnvironmentSync</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBFactory" title="In the following code snippet, we make a request to open a database, and include handlers for the success and error cases. For a full working example, see our To-do Notifications app (view example live.)"><code>IDBFactory</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBFactorySync" title="The IDBFactorySync interface of the IndexedDB API provide a synchronous means of accessing the capabilities of indexed databases."><code>IDBFactorySync</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBIndex" title="IDBIndex interface of the IndexedDB API provides asynchronous access to an index in a database. An index is a kind of object store for looking up records in another object store, called the referenced object store. You use this interface to retrieve data."><code>IDBIndex</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBIndexSync" title="The IDBIndexSync interface of the IndexedDB API provides synchronous access to an index in a database."><code>IDBIndexSync</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBKeyRange" title="A key range can be a single value or a range with upper and lower bounds or endpoints. If the key range has both upper and lower bounds, then it is bounded; if it has no bounds, it is unbounded. A bounded key range can either be open (the endpoints are excluded) or closed (the endpoints are included). To retrieve all keys within a certain range, you can use the following code constructs:"><code>IDBKeyRange</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBLocaleAwareKeyRange" title="The IDBLocaleAwareKeyRange interface of the IndexedDB API is a Firefox-specific version of IDBKeyRange — it functions in exactly the same fashion, and has the same properties and methods, but it is intended for use with IDBIndex objects when the original index had a locale value specified upon its creation (see createIndex()'s optionalParameters) — that is, it has locale aware sorting enabled."><code>IDBLocaleAwareKeyRange</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBMutableFile" title="The IDBMutableFile interface provides access in read or write mode to a file, dealing with all the necessary locks."><code>IDBMutableFile</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBObjectStore" title="This example shows a variety of different uses of object stores, from updating the data structure with IDBObjectStore.createIndex inside an onupgradeneeded function, to adding a new item to our object store with IDBObjectStore.add. For a full working example, see our To-do Notifications app (view example live.)"><code>IDBObjectStore</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBObjectStoreSync" title="The IDBObjectStoreSync interface of the IndexedDB API provides synchronous access to an object store of a database."><code>IDBObjectStoreSync</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBOpenDBRequest" title="Also inherits methods from its parents IDBRequest and EventTarget."><code>IDBOpenDBRequest</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBRequest" title="The request object does not initially contain any information about the result of the operation, but once information becomes available, an event is fired on the request, and the information becomes available through the properties of the IDBRequest instance."><code>IDBRequest</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBTransaction" title="Note that as of Firefox 40, IndexedDB transactions have relaxed durability guarantees to increase performance (see bug 1112702.) Previously in a readwrite transaction IDBTransaction.oncomplete was fired only when all data was guaranteed to have been flushed to disk. In Firefox 40+ the complete event is fired after the OS has been told to write the data but potentially before that data has actually been flushed to disk. The complete event may thus be delivered quicker than before, however, there exists a small chance that the entire transaction will be lost if the OS crashes or there is a loss of system power before the data is flushed to disk. Since such catastrophic events are rare most consumers should not need to concern themselves further."><code>IDBTransaction</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBTransactionSync" title="The IDBTransactionSync interface of the IndexedDB API provides a synchronous transaction on a database. When an application creates an IDBTransactionSync object, it blocks until the browser is able to reserve the require database objects."><code>IDBTransactionSync</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBVersionChangeEvent" title="The IDBVersionChangeEvent interface of the IndexedDB API indicates that the version of the database has changed, as the result of an IDBOpenDBRequest.onupgradeneeded event handler function."><code>IDBVersionChangeEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IDBVersionChangeRequest" title="The IDBVersionChangeRequest interface the IndexedDB API represents a request to change the version of a database. It is used only by the setVersion() method of IDBDatabase."><code>IDBVersionChangeRequest</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IIRFilterNode" title="The IIRFilterNode interface of the Web Audio API is a AudioNode processor which implements a general infinite impulse response (IIR) filter; this type of filter can be used to implement tone control devices and graphic equalizers as well. It lets the parameters of the filter response be specified, so that it can be tuned as needed."><code>IIRFilterNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IdentityManager" title="The IdentityManager of the BrowserID protocol exposes the BrowserID API, via navigator.id. This API has gone through several significant revisions. Each generation is listed separately below."><code>IdentityManager</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IdleDeadline" title="See our complete example in the article Cooperative Scheduling of Background Tasks API."><code>IdleDeadline</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ImageBitmap" title="The ImageBitmap interface represents a bitmap image which can be drawn to a <canvas> without undue latency. It can be created from a variety of source objects using the createImageBitmap() factory method. ImageBitmap provides an asynchronous and resource efficient pathway to prepare textures for rendering in WebGL."><code>ImageBitmap</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ImageBitmapFactories" title="The ImageBitmapFactories mixin interface contains utility methods to create an ImageBitmap. There is no object of this type, but the two interfaces Window, available within the regular browsing scope, and the WorkerGlobalScope interface for workers, implement this interface."><code>ImageBitmapFactories</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ImageBitmapRenderingContext" title="The ImageBitmapRenderingContext interface is a canvas rendering context which only provides the functionality to replace the canvas's contents with the given ImageBitmap. Its context id (the first argument to HTMLCanvasElement.getContext() or OffscreenCanvas.getContext() is "bitmaprenderer"."><code>ImageBitmapRenderingContext</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ImageCapture" title="The ImageCapture interface of the the MediaStream Image Capture API provides is an interface for capturing images from a photographic device referenced through a valid MediaStreamTrack."><code>ImageCapture</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ImageData" title="The ImageData interface represents the underlying pixel data of an area of a <canvas> element. It is created using the ImageData() constructor or creator methods on the CanvasRenderingContext2D object associated with a canvas: createImageData() and getImageData(). It can also be used to set a part of the canvas by using putImageData()."><code>ImageData</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Index" title="Found 3782 pages:"><code>Index</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/InputDeviceCapabilities" title="The InputDeviceCapabilities interface of the Input Device Capabilities API provides information about the physical device or a group of related devices responsible for generating input events. Events caused by the same physical input device get the same instance of this object, but the converse isn't true. For example, two mice with the same capabilities in a system may appear as a single InputDeviceCapabilities instance."><code>InputDeviceCapabilities</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/InputEvent" title="The InputEvent interface represents an event notifying of editable content change."><code>InputEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/FetchEvent_clone" title="The InstallEvent interface represents an install action that is dispatched on the ServiceWorkerGlobalScope of a ServiceWorker. As a child of ExtendableEvent it ensures that functional events (like FetchEvent) are not dispatched during installation."><code>InstallEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/InstallEvent" title="The parameter passed into the oninstall handler, the InstallEvent interface represents an install action that is dispatched on the ServiceWorkerGlobalScope of a ServiceWorker. As a child of ExtendableEvent, it ensures that functional events such as FetchEvent are not dispatched during installation. "><code>InstallEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/InstallTrigger" title="The InstallTrigger interface is an interesting outlier in the Apps API; it's included in this API but are inherited from the old Mozilla XPInstall technology for installing add-ons. It is used for triggering the download and installation of an add-on (or anything packaged in an .xpi file) from a Web page, using JavaScript code to kick off the install process."><code>InstallTrigger</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IntersectionObserver" title="The IntersectionObserver interface of the Intersection Observer API provides a way to asynchronously observe changes in the intersection of a target element with an ancestor element or with a top-level document's viewport."><code>IntersectionObserver</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/IntersectionObserverEntry" title="The IntersectionObserverEntry interface of the Intersection Observer API describes the intersection between the target element and its root container at a specific moment of transition."><code>IntersectionObserverEntry</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> - - -<span>K</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/KeyboardEvent" title="KeyboardEvent objects describe a user interaction with the keyboard. Each event describes a key; the event type (keydown, keypress, or keyup) identifies what kind of activity was performed."><code>KeyboardEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/KeyframeEffect" title="The KeyframeEffect interface of the Web Animations API lets us create sets of animatable properties and values, called keyframes. These can then be played using the Animation() constructor."><code>KeyframeEffect</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/KeyframeEffectReadOnly" title="The KeyframeEffectReadOnly interface of the Web Animations API describes sets of animatable properties and values that can be played using the Animation.Animation() constructor, and which are inherited by KeyframeEffect."><code>KeyframeEffectReadOnly</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> -<span>L</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.formatValue" title="formatValue is used to retrieve translations from the localization resources, optionally interpolating them with additional variable data. If the translation is not found in the first supported locale, the L10n context will try the next locale in the fallback chain (asynchronously) until it finds an available translation. "><code>L10n.formatValue</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.get" title="The get method is used to retrieve translations from the localization resources, optionally interpolating them with additional variable data. If the translation is not found in the first supported locale, the L10n context will try the next locale in the fallback chain (synchronously!) until it finds an available translation."><code>L10n.get</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.language.code" title="The language.code property returns the code of the currently active language and allows to change the language by setting the value to a new code."><code>L10n.language.code</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.language.direction" title="The language.direction property returns the direction (ltr or rtl) of the currently active language."><code>L10n.language.direction</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.once" title="The once method is used to register a callback that will execute exactly once. If the L10n context is ready when L10n.once() is called, the callback will be invoked immediately on the next tick of the event loop. If the L10n context is not ready when L10n.once() is called (because the localization resources are still downloading), the callback will be invoked when the ready event of the L10n context fires."><code>L10n.once</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.ready" title="The ready method is used to register a callback that will execute at least once. The callback is registered as a listener to the ready event of the L10n context. Additionally, if the L10n context is ready when L10n.ready() is called, the callback will be invoked immediately on the next tick of the event loop."><code>L10n.ready</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.readyState" title="The readyState property returns either loading or complete — depending on the current state of the L10n context."><code>L10n.readyState</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/L10n.setAttributes" title="The setAttributes method may be used to set the data-l10n-id and data-l10n-args attributes on DOM elements."><code>L10n.setAttributes</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/LinkStyle" title="The LinkStyle interface allows to access the associated CSS style sheet of a node."><code>LinkStyle</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/LocalFileSystem" title="The LocalFileSystem interface of the File System API gives you access to a sandboxed file system. The methods are implemented by window and worker objects."><code>LocalFileSystem</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/LocalFileSystemSync" title="The LocalFileSystemSync interface of the File System API gives you access to a sandboxed file system. It is intended to be used with WebWorkers. The methods are implemented by worker objects."><code>LocalFileSystemSync</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/LocalMediaStream" title="The LocalMediaStream interface was part of the Media Capture and Streams API, representing a stream of data being generated locally (such as by getUserMedia(). However, getUserMedia() now returns a MediaStream instead, and this interface has been removed from the specification."><code>LocalMediaStream</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Location" title="The Location interface represents the location (URL) of the object it is linked to. Changes done on it are reflected on the object it relates to. Both the Document and Window interface have such a linked Location, accessible via Document.location and Window.location respectively."><code>Location</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/LockedFile" title="The LockedFile interface provides tools to deal with a given file with all the necessary locks."><code>LockedFile</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/LongRange" title="The LongRange dictionary is used to define a range of permitted integer values for a property, with either or both a maximum and minimum value specified. The ConstrainLongRange dictionary is based on this, augmenting it to support exact and ideal values as well."><code>LongRange</code></a></span></span></li> -</ul> -<span>M</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MIDIAccess" title="The MIDIAccess interface of the Web MIDI API provides methods for listing MIDI input and output devices, and obtaining access to those devices."><code>MIDIAccess</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MIDIConnectionEvent" title="The MIDIConnectionEvent interface of the Web MIDI API is the event passed to the onstatechange event of the MIDIAccess interface and the onstatechange event of the MIDIPorts interface. This occurs any time a new port becomes available, or when a previously available port becomes unavailable. For example, this event is fired whenever a MIDI device is either plugged in to or unplugged from a computer."><code>MIDIConnectionEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MIDIInput" title="Use the MIDIInput interface of the Web MIDI API to access and pass messages to a MIDI input port."><code>MIDIInput</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MIDIInputMap" title="The MIDIInputMap read-only interface of the Web MIDI API provides a Map-like interface to the currently available MIDI input ports. Though it works generally like a map, because it is read-only it does not contain clear(), delete(), or set() functions."><code>MIDIInputMap</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MIDIOutputMap" title="The MIDIOutputMap read-only interface of the Web MIDI API provides a Map-like interface to the currently available MIDI output ports. Although it works like a map, because it is read-only, it does not contain clear(), delete(), or set() functions."><code>MIDIOutputMap</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MSGestureEvent" title="The MSGestureEvent is a proprietary interface specific to Internet Explorer and Microsoft Edge which represents events that occur due to touch gestures. Events using this interface include MSGestureStart, MSGestureEnd, MSGestureTap, MSGestureHold, MSGestureChange, and MSInertiaStart."><code>MSGestureEvent</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaDeviceInfo" title="The MediaDevicesInfo interface contains information on the available media input and output devices."><code>MediaDeviceInfo</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaDevices" title="The MediaDevices interface provides access to connected media input devices like cameras and microphones, as well as screen sharing. In essence, it lets you obtain access to any hardware source of media data."><code>MediaDevices</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaElementAudioSourceNode" title="A MediaElementSourceNode has no inputs and exactly one output, and is created using the AudioContext.createMediaElementSource method. The amount of channels in the output equals the number of channels of the audio referenced by the HTMLMediaElement used in the creation of the node, or is 1 if the HTMLMediaElement has no audio."><code>MediaElementAudioSourceNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaError" title="The MediaError interface represents an error which occurred while handling media in an HTML media element based on HTMLMediaElement, such as <audio> or <video>."><code>MediaError</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaKeyMessageEvent" title="The MediaKeyMessageEvent interface of the EncryptedMediaExtensions API contains the content and related data when the content decryption module generates a message for the session."><code>MediaKeyMessageEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaKeySession" title="The MediaKeySession interface of the EncryptedMediaExtensions API represents a context for message exchange with a content decryption module (CDM)."><code>MediaKeySession</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaKeyStatusMap" title="The MediaKeyStatusMap interface of the EncryptedMediaExtensions API is a read-only map of media key statuses by key IDs."><code>MediaKeyStatusMap</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaKeySystemAccess" title="The MediaKeySystemAccess interface of the EncryptedMediaExtensions API provides access to a Key System for decryption and/or a content protection provider. You can request an instance of this object using the Navigator.requestMediaKeySystemAccess method."><code>MediaKeySystemAccess</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaKeySystemConfiguration" title="The MediaKeySystemConfiguration interface Encrypted Media Extensions API provides configuration information about the media key system."><code>MediaKeySystemConfiguration</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaKeys" title="The MediaKeys interface of EncryptedMediaExtensions API the represents a set of keys that an associated HTMLMediaElement can use for decryption of media data during playback."><code>MediaKeys</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaMetadata" title="The MediaMetadata interface of the the Media Session API provides allows a web page to provide rich media metadata for display in a platform UI."><code>MediaMetadata</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaQueryList" title="A MediaQueryList object stores information on a media query applied to a document, and handles sending notifications to listeners when the media query state change (i.e. when the media query test starts or stops evaluating to true)."><code>MediaQueryList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaQueryListEvent" title="The MediaQueryListEvent object stores information on the changes that have happened to a MediaQueryList object — instances are available as the event object on a function referenced by a MediaQueryList.onchange property or MediaQueryList.addEvent() call."><code>MediaQueryListEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaQueryListListener" title="A MediaQueryList object maintains a list of media queries on a document, and handles sending notifications to listeners when the media queries on the document change."><code>MediaQueryListListener</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaRecorder" title="The MediaRecorder interface of the MediaStream Recording API provides functionality to easily record media. It is created by the invocation of the MediaRecorder() constructor."><code>MediaRecorder</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaRecorderErrorEvent" title="The MediaRecorderErrorEvent interface represents errors returned by the MediaStream Recording API. It is an Event object that encapsulates a reference to a DOMException describing the error that occurred."><code>MediaRecorderErrorEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaSession" title="The MediaSession interface of the the Media Session API allows a web page to provide custom behaviors for standard media playback interactions."><code>MediaSession</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaSettingsRange" title="The MediaSettingsRange interface of the the MediaStream Image Capture API provides the possible range and value size of PhotoCapabilities.imageHeight and PhotoCapabilities.imageWidth. A PhotoCapabilities object can be retrieved by calling ImageCapture.PhotoCapabilities()."><code>MediaSettingsRange</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaSource" title="The MediaSource interface of the Media Source Extensions API represents a source of media data for an HTMLMediaElement object. A MediaSource object can be attached to a HTMLMediaElement to be played in the user agent."><code>MediaSource</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaStream" title="The MediaStream interface represents a stream of media content. A stream consists of several tracks such as video or audio tracks. Each track is specified as an instance of MediaStreamTrack."><code>MediaStream</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaStreamAudioDestinationNode" title="Inherits properties from its parent, AudioNode."><code>MediaStreamAudioDestinationNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaStreamAudioSourceNode" title="A MediaElementSourceNode has no inputs and exactly one output, and is created using the AudioContext.createMediaStreamSource method. The number of channels in the output equals the number of channels in AudioMediaStreamTrack. If there is no valid media stream, then the number of output channels will be one silent channel."><code>MediaStreamAudioSourceNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaStreamConstraints" title="The MediaStreamConstraints dictionary is used when calling getUserMedia() to specify what kinds of tracks should be included in the returned MediaStream, and, optionally, to establish constraints for those tracks' settings."><code>MediaStreamConstraints</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaStreamEvent" title="The MediaStreamEvent interface represents events that occurs in relation to a MediaStream. Two events of this type can be thrown: addstream and removestream."><code>MediaStreamEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaStreamTrack" title="The MediaStreamTrack interface represents a single media track within a stream; typically, these are audio or video tracks, but other track types may exist as well."><code>MediaStreamTrack</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaStreamTrackEvent" title="The MediaStreamTrackEvent interface represents events which indicate that a MediaStream has had tracks added to or removed from the stream through calls to Media Stream API methods. These events are sent to the stream when these changes occur."><code>MediaStreamTrackEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaTrackConstraints" title="The MediaTrackConstraints dictionary is used to describe a set of capabilities and the value or values each can take on. A constraints dictionary is passed into applyConstraints() to allow a script to establish a set of exact (required) values or ranges and/or preferred values or ranges of values for the track, and the most recently-requested set of custom constraints can be retrieved by calling getConstraints()."><code>MediaTrackConstraints</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaTrackSettings" title="The MediaTrackSettings dictionary is used to return the current values configured for each of a MediaStreamTrack's settings. These values will adhere as closely as possible to any constraints previously described using a MediaTrackConstraints object and set using applyConstraints(), and will adhere to the default constraints for any properties whose constraints haven't been changed, or whose customized constraints couldn't be matched."><code>MediaTrackSettings</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MediaTrackSupportedConstraints" title="The MediaTrackSupportedConstraints dictionary establishes the list of constrainable properties recognized by the user agent or browser in its implementation of the MediaStreamTrack object. An object conforming to MediaTrackSupportedConstraints is returned by MediaDevices.getSupportedConstraints()."><code>MediaTrackSupportedConstraints</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MessageChannel" title="The MessageChannel interface of the Channel Messaging API allows us to create a new message channel and send data through it via its two MessagePort properties."><code>MessageChannel</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MessageEvent" title="The MessageEvent interface represents a message received by a target object."><code>MessageEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MessagePort" title="The MessagePort interface of the Channel Messaging API represents one of the two ports of a MessageChannel, allowing sending of messages from one port and listening out for them arriving at the other."><code>MessagePort</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Metadata" title="The Metadata interface is used by the File and Directory Entries API to contain information about a file system entry. This metadata includes the file's size and modification date and time."><code>Metadata</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MimeType" title="The MimeType interface provides contains information about a MIME type associated with a particular plugin. NavigatorPlugins.mimeTypes returns an array of this object."><code>MimeType</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MimeTypeArray" title="The MimeTypeArray interface returns an array of MimeType instances, each of which contains information about a supported browser plugins. This object is returned by NavigatorPlugins.mimeTypes."><code>MimeTypeArray</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MouseEvent" title="The MouseEvent interface represents events that occur due to the user interacting with a pointing device (such as a mouse). Common events using this interface include click, dblclick, mouseup, mousedown."><code>MouseEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MouseScrollEvent" title="The MouseScrollEvent interface represents events that occur due to the user moving a mouse wheel or similar input device."><code>MouseScrollEvent</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MouseWheelEvent" title="The MouseWheelEvent interface represents events that occur due to the user turning a mouse wheel."><code>MouseWheelEvent</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MutationEvent" title="Provides event properties that are specific to modifications to the Document Object Model (DOM) hierarchy and nodes."><code>MutationEvent</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MutationObserver" title="MutationObserver provides developers with a way to react to changes in a DOM. It is designed as a replacement for Mutation Events defined in the DOM3 Events specification."><code>MutationObserver</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/MutationRecord" title="A MutationRecord represents an individual DOM mutation. It is the object that is passed to MutationObserver's callback."><code>MutationRecord</code></a></span></span></li> -</ul> -<span>N</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NameList" title="Provides an abstraction for an ordered collection of name and namespace value pairs. Items can be accessed by a 0-based index. The DOM spec does not specify how the collection is to be implemented."><code>NameList</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NamedNodeMap" title="The NamedNodeMap interface represents a collection of Attr objects. Objects inside a NamedNodeMap are not in any particular order, unlike NodeList, although they may be accessed by an index as in an array."><code>NamedNodeMap</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigationPreloadManager" title="The NavigationPreloadManager interface of the the Service Worker API provides methods for managing the preloading of resources with a service worker."><code>NavigationPreloadManager</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Navigator" title="The Navigator interface represents the state and the identity of the user agent. It allows scripts to query it and to register themselves to carry on some activities."><code>Navigator</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigatorConcurrentHardware" title="The NavigatorConcurrentHardware mixin adds to the Navigator interface features which allow Web content to determine how many logical processors the user has available, in order to let content and Web apps optimize their operations to best take advantage of the user's CPU."><code>NavigatorConcurrentHardware</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigatorGeolocation" title="NavigatorGeolocation contains a creation method allowing objects implementing it to obtain a Geolocation instance."><code>NavigatorGeolocation</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigatorID" title="The NavigatorID interface contains methods and properties related to the identity of the browser."><code>NavigatorID</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigatorLanguage" title="NavigatorLanguage contains methods and properties related to the language of the navigator."><code>NavigatorLanguage</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigatorOnLine" title="The NavigatorOnLine interface contains methods and properties related to the connectivity status of the browser."><code>NavigatorOnLine</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigatorPlugins" title="The NavigatorPlugins mixin adds to the Navigator interface methods and properties for discovering and interacting with plugins installed into the browser."><code>NavigatorPlugins</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NavigatorStorage" title="The NavigatorStorage mixin adds to the Navigator and WorkerNavigator interfaces the Navigator.storage property, which provides access to the StorageManager singleton used for controlling the persistence of data stores as well as obtaining information"><code>NavigatorStorage</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NetworkInformation" title="The NetworkInformation interface provides information about the connection a device is using to communicate with the network and provides a means for scripts to be notified if the connection type changes. The NetworkInformation interfaces cannot be instantiated. It is instead accessed through the connection property of the Navigator interface."><code>NetworkInformation</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Node" title="Node is an interface from which a number of DOM API object types inherit; it allows these various types to be treated similarly, for example inheriting the same set of methods, or being tested in the same way."><code>Node</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NodeFilter" title="A NodeFilter interface represents an object used to filter the nodes in a NodeIterator or TreeWalker. They don't know anything about the DOM or how to traverse nodes; they just know how to evaluate a single node against the provided filter."><code>NodeFilter</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NodeIterator" title="The NodeIterator interface represents an iterator over the members of a list of the nodes in a subtree of the DOM. The nodes will be returned in document order."><code>NodeIterator</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NodeList" title="NodeList objects are collections of nodes such as those returned by properties such as Node.childNodes and the document.querySelectorAll() method."><code>NodeList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NonDocumentTypeChildNode" title="The NonDocumentTypeChildNode interface contains methods that are particular to Node objects that can have a parent, but not suitable for DocumentType."><code>NonDocumentTypeChildNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Notation" title="Represents a DTD notation (read-only). May declare format of an unparsed entity or formally declare the document's processing instruction targets. Inherits methods and properties from Node. Its nodeName is the notation name. Has no parent."><code>Notation</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/notification" title="The Notification interface of the Notifications API is used to configure and display desktop notifications to the user."><code>Notification</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NotificationEvent" title="The parameter passed into the onnotificationclick handler, the NotificationEvent interface represents a notification click event that is dispatched on the ServiceWorkerGlobalScope of a ServiceWorker."><code>NotificationEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/NotifyAudioAvailableEvent" title=""><code>NotifyAudioAvailableEvent</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -</ul> -<span>O</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OES_element_index_uint" title="The OES_element_index_uint extension is part of the WebGL API and adds support for gl.UNSIGNED_INT types to WebGLRenderingContext.drawElements()."><code>OES_element_index_uint</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OES_standard_derivatives" title="The OES_standard_derivatives extension is part of the WebGL API and adds the GLSL derivative functions dFdx, dFdy, and fwidth."><code>OES_standard_derivatives</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OES_texture_float" title="The OES_texture_float extension is part of the WebGL API and exposes floating-point pixel types for textures."><code>OES_texture_float</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OES_texture_float_linear" title="The OES_texture_float_linear extension is part of the WebGL API and allows linear filtering with floating-point pixel types for textures."><code>OES_texture_float_linear</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OES_texture_half_float" title="The OES_texture_half_float extension is part of the WebGL API and adds texture formats with 16- (aka half float) and 32-bit floating-point components."><code>OES_texture_half_float</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OES_texture_half_float_linear" title="The OES_texture_half_float_linear extension is part of the WebGL API and allows linear filtering with half floating-point pixel types for textures."><code>OES_texture_half_float_linear</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OES_vertex_array_object" title="The OES_vertex_array_object extension is part of the WebGL API and provides vertex array objects (VAOs) which encapsulate vertex array states. These objects keep pointers to vertex data and provide names for different sets of vertex data."><code>OES_vertex_array_object</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OfflineAudioCompletionEvent" title="The Web Audio API OfflineAudioCompletionEvent interface represents events that occur when the processing of an OfflineAudioContext is terminated. The complete event implements this interface."><code>OfflineAudioCompletionEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OfflineAudioContext" title="The OfflineAudioContext interface is an AudioContext interface representing an audio-processing graph built from linked together AudioNodes. In contrast with a standard AudioContext, an OfflineAudioContext doesn't render the audio to the device hardware; instead, it generates it, as fast as it can, and outputs the result to an AudioBuffer."><code>OfflineAudioContext</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OffscreenCanvas" title="The OffscreenCanvas interface provides a canvas that can be rendered off screen. It is available in both the window and worker contexts."><code>OffscreenCanvas</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/OscillatorNode" title="The OscillatorNode interface represents a periodic waveform, such as a sine wave. It is an AudioScheduledSourceNode audio-processing module that causes a specified frequency of a given wave to be created—in effect, a constant tone."><code>OscillatorNode</code></a></span></span></li> -</ul> -<span>P</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PageTransitionEvent" title="Page transition events fire when a webpage is being loaded or unloaded."><code>PageTransitionEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PannerNode" title="A PannerNode always has exactly one input and one output: the input can be mono or stereo but the output is always stereo (2 channels); you can't have panning effects without at least two audio channels!"><code>PannerNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ParentNode" title="The ParentNode mixin contains methods and properties that are common to all types of Node objects that can have children. It's implemented by Element, Document, and DocumentFragment objects."><code>ParentNode</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PasswordCredential" title="The interface of the Credential Management API provides information about a username/password pair. In supporting browsers an instance of this class may be passed in the credential member of the init object for global fetch."><code>PasswordCredential</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Path2D" title="The Path2D interface of the Canvas 2D API is used to declare paths that are then later used on CanvasRenderingContext2D objects. The path methods of the CanvasRenderingContext2D interface are present on this interface as well and are allowing you to create paths that you can retain and replay as required on a canvas."><code>Path2D</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PaymentAddress" title="The PaymentAddress interface of the Payment Request API stores address information."><code>PaymentAddress</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PaymentRequest" title="The PaymentRequest interface of the Payment Request API manages the process of a user making a payment."><code>PaymentRequest</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PaymentRequestUpdateEvent" title="The PaymentRequestUpdateEvent interface of the the Payment Request API enables a web page to update the details of a PaymentRequest in response to a user action."><code>PaymentRequestUpdateEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PaymentResponse" title="The PaymentResponse interface of the Payment Request API is returned after a user selects a payment method and approves a payment request."><code>PaymentResponse</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Performance" title="The Performance interface provides access to performance-related information for the current page. It's part of the High Resolution Time API, but is enhanced by the Performance Timeline API, the Navigation Timing API, the User Timing API, and the Resource Timing API."><code>Performance</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceEntry" title="The PerformanceEntry object encapsulates a single performance metric that is part of the performance timeline. A performance entry can be directly created by making a performance mark or measure (for example by calling the mark() method) at an explicit point in an application. Performance entries are also created in indirect ways such as loading a resource (such as an image). This interface is exposed to Window and Worker."><code>PerformanceEntry</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceFrameTiming" title="PerformanceFrameTiming is an abstract interface that provides frame timing data about the browser's event loop."><code>PerformanceFrameTiming</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceLongTaskTiming" title="The PerformanceLongTaskTiming interface of the the Long Tasks API reports instances of long tasks."><code>PerformanceLongTaskTiming</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceMark" title="PerformanceMark is an abstract interface for PerformanceEntry objects with an entryType of "mark". Entries of this type are created by calling performance.mark() to add a named DOMHighResTimeStamp (the mark) to the browser's performance timeline."><code>PerformanceMark</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceMeasure" title="PerformanceMeasure is an abstract interface for PerformanceEntry objects with an entryType of "measure". Entries of this type are created by calling performance.measure() to add a named DOMHighResTimeStamp (the measure) between two marks to the browser's performance timeline."><code>PerformanceMeasure</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceNavigation" title="The PerformanceNavigation interface represents information about how the navigation to the current document was done."><code>PerformanceNavigation</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceNavigationTiming" title="The PerformanceNavigationTiming interface provides methods and properties to store and retrieve metrics regarding the browser's document navigation events. For example, this interface can be used to determine how much time it takes to load or unload a document."><code>PerformanceNavigationTiming</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceObserver" title="The PerformanceObserver interface is used to observe performance measurement events and be notified of new performance entries as they are recorded in the browser's performance timeline."><code>PerformanceObserver</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceObserverEntryList" title="The PerformanceObserverEntryList interface is a list of peformance events that were explicitly observed via the observe() method."><code>PerformanceObserverEntryList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformancePaintTiming" title='The PerformancePaintTiming interface of the Paint Timing provides provides timing information about "paint" (also called "render") operations during web page construction. "Paint" refers to conversion of the render tree to on-screen pixels.'><code>PerformancePaintTiming</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceResourceTiming" title="The PerformanceResourceTiming interface enables retrieving and analyzing detailed network timing data regarding the loading of an application's resources. An application can use the timing metrics to determine, for example, the length of time it takes to fetch a specific resource, such as an XMLHttpRequest, <SVG>, image, or script."><code>PerformanceResourceTiming</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PerformanceTiming" title="The PerformanceTiming interface contains properties that offer performance timing information for various events which occur during the loading and use of the current page. You get a PerformanceTiming object describing your page using the window.performance.timing property."><code>PerformanceTiming</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PeriodicWave" title="PeriodicWave has no inputs or outputs; it is used to define custom oscillators when calling OscillatorNode.setPeriodicWave(). The PeriodicWave itself is created/returned by AudioContext.createPeriodicWave()."><code>PeriodicWave</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PermissionStatus" title="The PermissionStatus interface of the Permissions API provides the state of an object and an event handler for monitoring changes to said state."><code>PermissionStatus</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Permissions" title=""><code>Permissions</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PhotoCapabilities" title="The PhotoCapabilities interface of the the MediaStream Image Capture API provides available configuration options for an attached photographic device. A PhotoCapabilities object is retrieved by calling ImageCapture.getPhotoCapabilities()."><code>PhotoCapabilities</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Plugin" title="The Plugin interface provides information about a browser plugin."><code>Plugin</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PluginArray" title="The PluginArray interface is used to store a list of Plugin objects describing the available plugins; it's returned by the window.navigator.plugins property. The PluginArray is not a JavaScript array, but has the length property and supports accessing individual items using bracket notation (plugins[2]), as well as via item(index) and namedItem("name") methods."><code>PluginArray</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Point" title="Point is an interface, which existed only briefly in the CSS Transforms Level 1 specification, which represents a point in 2-dimensional space. It is non-standard, not broadly compatible, and should not be used."><code>Point</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PointerEvent" title="The PointerEvent interface represents the state of a DOM event produced by a pointer such as the geometry of the contact point, the device type that generated the event, the amount of pressure that was applied on the contact surface, etc."><code>PointerEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PopStateEvent" title="An event handler for the popstate event on the window."><code>PopStateEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PortCollection" title=""><code>PortCollection</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Position" title="The Position interface represents the position of the concerned device at a given time. The position, represented by a Coordinates object, comprehends the 2D position of the device, on a spheroid representing the Earth, but also its altitude and its speed."><code>Position</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PositionError" title="The PositionError interface represents the reason of an error occurring when using the geolocating device."><code>PositionError</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PositionOptions" title="The PositionOptions interface describes an object containing option properties to pass as a parameter of Geolocation.getCurrentPosition() and Geolocation.watchPosition()."><code>PositionOptions</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PositionSensorVRDevice" title="The PositionSensorVRDevice interface of the WebVR API represents VR hardware's position sensor. You can access information such as the current position and orientation of the sensor in relation to the head mounted display through the PositionSensorVRDevice.getState() method."><code>PositionSensorVRDevice</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Presentation" title="The Presentation can be defined as two possible user agents in the context: Controlling user agent and Receiving user agent."><code>Presentation</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationAvailability" title="A PresentationAvailability object is associated with available presentation displays and represents the presentation display availability for a presentation request. If the controlling user agent can monitor the list of available presentation displays in the background (without a pending request to start()), the PresentationAvailability object MUST be implemented in a controlling browsing context."><code>PresentationAvailability</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationConnection" title="The PresentationConnection interface of the Presentation API provides methods and properties for managing a single presentation. Each presentation connection is represented by a PresentationConnection object. Both the controlling user agent and receiving user agent MUST implement PresentationConnection."><code>PresentationConnection</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationConnectionAvailableEvent" title="The PresentationConnectionAvailableEvent interface of the Presentation API is fired on a PresentationRequest when a connection associated with the object is created."><code>PresentationConnectionAvailableEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationConnectionCloseEvent" title="The PresentationConnectionCloseEvent interface of the Presentation API is fired on a PresentationConnection when it is closed."><code>PresentationConnectionCloseEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationConnectionClosedEvent" title="A PresentationConnectionClosedEvent is declared when a presentation connection enters a closed state. The reason attribute provides the reason why the connection was closed."><code>PresentationConnectionClosedEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationConnectionList" title="PresentationConnectionList is the collection of incoming presentation connections."><code>PresentationConnectionList</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationReceiver" title="The PresentationReceiver interface of the the Presentation API provides a means for a receiving browsing context to access controlling browsing contexts and communicate with them."><code>PresentationReceiver</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PresentationRequest" title="A PresentationRequest object is used to initiate or reconnect to a presentation made by a controlling browsing context. The PresentationRequest object MUST be implemented in a controlling browsing context provided by a controlling user agent."><code>PresentationRequest</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ProcessingInstruction" title="A processing instruction embeds application-specific instructions in XML which can be ignored by other applications that don't recognize them."><code>ProcessingInstruction</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ProgressEvent" title="The ProgressEvent interface represents events measuring progress of an underlying process, like an HTTP request (for an XMLHttpRequest, or the loading of the underlying resource of an <img>, <audio>, <video>, <style> or <link>)."><code>ProgressEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PromiseRejectionEvent" title="The PromiseRejectionEvent interface represents events which are fired when JavaScript Promises are rejected. These events are particularly useful for telemetry and debugging purposes."><code>PromiseRejectionEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PromiseResolver" title="The PromiseResolver interface represents an object controlling the state and the result value of a Promise."><code>PromiseResolver</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PushEvent" title="The PushEvent interface of the Push API represents a push message that has been received. This event is sent to the global scope of a ServiceWorker. It contains the information sent from an application server to a PushSubscription."><code>PushEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PushManager" title="The PushManager interface of the Push API provides a way to receive notifications from third-party servers as well as request URLs for push notifications."><code>PushManager</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PushMessageData" title="The PushMessageData interface of the Push API provides methods which let you retrieve the push data sent by a server in various formats."><code>PushMessageData</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PushRegistrationManager" title="Returns an interface to register or unregister a push registration, get an active registration, or check the permission status of the registration. This interface has been superceded by PushManager."><code>PushRegistrationManager</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/PushSubscription" title="The PushSubscription interface of the Push API provides a subcription's URL endpoint and allows unsubscription from a push service."><code>PushSubscription</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> - - -<span>R</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCCertificate" title="The interface of the the WebRTC API provides an object represents a certificate that an RTCPeerConnection uses to authenticate."><code>RTCCertificate</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCConfiguration" title="The RTCConfiguration dictionary is used to provide configuration options for an RTCPeerConnection. It may be passed into the constructor when instantiating a connection, or used with the RTCPeerConnection.getConfiguration() and RTCPeerConnection.setConfiguration() methods, which allow inspecting and changing the configuration while a connection is established."><code>RTCConfiguration</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCDTMFSender" title="tbd"><code>RTCDTMFSender</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCDTMFToneChangeEvent" title="The RTCDTMFToneChangeEvent interface represents events sent to indicate that DTMF tones have started or finished finished playing. This interface is used by the tonechange event."><code>RTCDTMFToneChangeEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCDataChannel" title="The RTCDataChannel interface represents a network channel which can be used for bidirectional peer-to-peer transfers of arbitrary data. Every data channel is associated with an RTCPeerConnection, and each peer connection can have up to a theoretical maximum of 65,534 data channels (the actual limit may vary from browser to browser)."><code>RTCDataChannel</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCDataChannelEvent" title="The RTCDataChannelEvent() constructor returns a new RTCDataChannelEvent object, which represents a datachannel event. These events sent to an RTCPeerConnection when its remote peer is asking to open an RTCDataChannel between the two peers."><code>RTCDataChannelEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCIceCandidate" title="The RTCIceCandidate interface of the the WebRTC API represents a candidate Internet Connectivity Establishment (ICE) server for establishing an RTCPeerConnection."><code>RTCIceCandidate</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCIceServer" title="The RTCIceServer dictionary defines how to connect to a single ICE server (such as a STUN or TURN server). It includes both the URL and the necessary credentials, if any, to connect to the server."><code>RTCIceServer</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCIdentityAssertion" title="The RTCIdentityAssertion interface of the the WebRTC API represents the identity of the a remote peer of the current connection. If no peer has yet been set and verified this interface returns null. Once set it can't be changed."><code>RTCIdentityAssertion</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCIdentityErrorEvent" title="The RTCIdentityErrorEvent interface represents an error associated with the identity provider (idP). This is usually for an RTCPeerConnection. Two events are sent with this type: idpassertionerror and idpvalidationerror."><code>RTCIdentityErrorEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCIdentityEvent" title="The RTCIdentityEvent interface represents an identity assertion generated by an identity provider (idP). This is usually for an RTCPeerConnection. The only event sent with this type is identityresult.."><code>RTCIdentityEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCPeerConnection" title="The RTCPeerConnection interface represents a WebRTC connection between the local computer and a remote peer. It provides methods to connect to a remote peer, maintain and monitor the connection, and close the connection once it's no longer needed."><code>RTCPeerConnection</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCPeerConnectionIceEvent" title="The RTCPeerConnectionIceEvent interface represents events that occurs in relation to ICE candidates with the target, usually an RTCPeerConnection. Only one event is of this type: icecandidate."><code>RTCPeerConnectionIceEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCRtpContributingSource" title="The RTCRtpContributingSource interface of the the WebRTC API provides contains information about a given contributing source (CSRC) including the most recent time a packet that the source contributed was played out."><code>RTCRtpContributingSource</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCRtpReceiver" title="The RTCRtpReceiver interface of the the WebRTC API manages the reception and decoding of data for a MediaStreamTrack on an RTCPeerConnection."><code>RTCRtpReceiver</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCRtpSender" title="tbd"><code>RTCRtpSender</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCSctpTransport" title="The RTCSctpTransport interface provides information which describes a Stream Control Transmission Protocol (SCTP) transport. This provides information about limitations of the transport, but also provides a way to access the underlying Datagram Transport Layer Security (DTLS) transport over which SCTP packets for all of an RTCPeerConnection's data channels are sent and received."><code>RTCSctpTransport</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCSessionDescription" title="The RTCSessionDescription interface describes one end of a connection—or potential connection—and how it's configured. Each RTCSessionDescription consists of a description type indicating which part of the offer/answer negotiation process it describes and of the SDP descriptor of the session."><code>RTCSessionDescription</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCSessionDescriptionCallback" title="The RTCSessionDescriptionCallback type is used to represent the callback function passed into the deprecated callback-based version of createOffer() or createAnswer() when using them to create offers or answers."><code>RTCSessionDescriptionCallback</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RTCStatsReport" title="The RTCStatsReport interface is used to provide statistics data about WebRTC connections as returned by the RTCPeerConnection.getStats(), RTCRtpReceiver.getStats(), and RTCRtpSender.getStats() methods."><code>RTCStatsReport</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RadioNodeList" title="The RadioNodeList interface represents a collection of elements in a <form> or a <fieldset> element."><code>RadioNodeList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RandomSource" title="RandomSource represents a source of cryptographically secure random numbers. It is available via the Crypto object of the global object: Window.crypto on Web pages, WorkerGlobalScope.crypto in workers."><code>RandomSource</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Range" title="The Range interface represents a fragment of a document that can contain nodes and parts of text nodes."><code>Range</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ReadableByteStreamController" title="The ReadableByteStreamController interface of the Streams API represents a controller allowing control of a ReadableStream's state and internal queue. Byte stream controllers are for byte streams."><code>ReadableByteStreamController</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ReadableStream" title="The ReadableStream interface of the Streams API represents a readable stream of byte data. It can be used to handle response streams of the Fetch API. "><code>ReadableStream</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ReadableStreamBYOBReader" title='The ReadableStreamDefaultReader interface of the Streams API represents a BYOB ("bring your own buffer") reader that can be used to read stream data supplied by the developer (e.g. a custom ReadableStream.ReadableSteam() constructor).'><code>ReadableStreamBYOBReader</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ReadableStreamBYOBRequest" title="The ReadableStreamBYOBRequest interface of the Streams API represents a pull request into a ReadableByteStreamController view."><code>ReadableStreamBYOBRequest</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ReadableStreamDefaultController" title="The ReadableStreamDefaultController interface of the Streams API represents a controller allowing control of a ReadableStream's state and internal queue. Default controllers are for streams that are not byte streams. "><code>ReadableStreamDefaultController</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ReadableStreamDefaultReader" title="The ReadableStreamDefaultReader interface of the Streams API represents a default reader that can be used to read stream data supplied from a network (e.g. a fetch request). "><code>ReadableStreamDefaultReader</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/RenderingContext" title="RenderingContext is a WebIDL typedef which can refer to any one of the interfaces that represent a graphics rendering context within a <canvas> element: CanvasRenderingContext2D, WebGLRenderingContext, or WebGL2RenderingContext. By using the shorthand RenderingContext, methods and properties which can make use of any of these interfaces can be specified and written more easily; since <canvas> supports several rendering systems, it's helpful from a specification and browser implementation perspective to have a shorthand that means "one of these interfaces.""><code>RenderingContext</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Request" title="The Request interface of the Fetch API represents a resource request."><code>Request</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Response" title="The Response interface of the Fetch API represents the response to a request."><code>Response</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> -<span>S</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAElement" title="The SVGAElement interface provides access to the properties of <a> element, as well as methods to manipulate them."><code>SVGAElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAltGlyphDefElement" title="The SVGAltGlyphDefElement interface corresponds to the <altGlyphDef> element."><code>SVGAltGlyphDefElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAltGlyphElement" title="The SVGAltGlyphElement interface represents an <altglyph> element. This interface makes it possible to implement more sophisticated and particular glyph characters. For some textal representations as: ligatures (e.g. æ, ß, etc ), special-purpose fonts (e.g. musical symbols) or even alternate glyphs such as Asian text strings it is required that a different set of glyphs be used than the normal given character data."><code>SVGAltGlyphElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAltGlyphItemElement" title="The SVGAltGlyphItemElement interface corresponds to the <altGlyphItem> element."><code>SVGAltGlyphItemElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAngle" title="The SVGAngle interface is used to represent a value that can be an <angle> or <number> value. An SVGAngle reflected through the animVal attribute is always read only."><code>SVGAngle</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimateColorElement" title="The SVGAnimateColorElement interface corresponds to the <animateColor> element."><code>SVGAnimateColorElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimateElement" title="The SVGAnimateElement interface corresponds to the <animate> element."><code>SVGAnimateElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimateMotionElement" title="The SVGAnimateMotionElement interface corresponds to the <animateMotion> element."><code>SVGAnimateMotionElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimateTransformElement" title="The SVGAnimateTransformElement interface corresponds to the <animateTransform> element."><code>SVGAnimateTransformElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedAngle" title="The SVGAnimatedAngle interface is used for attributes of basic type <angle> which can be animated."><code>SVGAnimatedAngle</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedBoolean" title="The SVGAnimatedBoolean interface is used for attributes of type boolean which can be animated."><code>SVGAnimatedBoolean</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedEnumeration" title="The SVGAnimatedEnumeration interface is used for attributes whose value must be a constant from a particular enumeration and which can be animated."><code>SVGAnimatedEnumeration</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedInteger" title="The SVGAnimatedInteger interface is used for attributes of basic type <integer> which can be animated."><code>SVGAnimatedInteger</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedLength" title="The SVGAnimatedLength interface is used for attributes of basic type <length> which can be animated."><code>SVGAnimatedLength</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedLengthList" title="The SVGAnimatedLengthList interface is used for attributes of type SVGLengthList which can be animated."><code>SVGAnimatedLengthList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedNumber" title="The SVGAnimatedNumber interface is used for attributes of basic type <Number> which can be animated."><code>SVGAnimatedNumber</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedNumberList" title="The SVGAnimatedNumber interface is used for attributes which take a list of numbers and which can be animated."><code>SVGAnimatedNumberList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedPoints" title="The SVGAnimatedPoints interface supports elements which have a points attribute which holds a list of coordinate values and which support the ability to animate that attribute."><code>SVGAnimatedPoints</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedPreserveAspectRatio" title="The SVGAnimatedPreserveAspectRatio interface is used for attributes of type SVGPreserveAspectRatio which can be animated."><code>SVGAnimatedPreserveAspectRatio</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedRect" title="The SVGAnimatedRect interface is used for attributes of basic SVGRect which can be animated."><code>SVGAnimatedRect</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedString" title="The SVGAnimatedString interface represents string attributes which can be animated from each SVG declaration. You need to create SVG attribute before doing anything else, everything should be declared inside this."><code>SVGAnimatedString</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimatedTransformList" title="The SVGAnimatedTransformList interface is used for attributes which take a list of numbers and which can be animated."><code>SVGAnimatedTransformList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGAnimationElement" title="The SVGAnimationElement interface is the base interface for all of the animation element interfaces: SVGAnimateElement, SVGSetElement, SVGAnimateColorElement, SVGAnimateMotionElement and SVGAnimateTransformElement."><code>SVGAnimationElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGCircleElement" title="The SVGCircleElement interface is an interface for the <circle> element. The circle element is defined by the cx and cy attributes that denote the coordinates of the centre of the circle."><code>SVGCircleElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGClipPathElement" title="The SVGClipPathElement interface provides access to the properties of <clipPath> elements, as well as methods to manipulate them."><code>SVGClipPathElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGColorProfileElement" title="The SVGColorProfileElement interface corresponds to the <color-profile> element."><code>SVGColorProfileElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGComponentTransferFunctionElement" title="The SVGComponentTransferFunctionElement interface defines a base interface used by the component transfer function interfaces."><code>SVGComponentTransferFunctionElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGCursorElement" title="The SVGCursorElement interface provides access to the properties of <cursor> elements, as well as methods to manipulate them."><code>SVGCursorElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGDefsElement" title="The SVGDefsElement interface corresponds to the <defs> element."><code>SVGDefsElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGDescElement" title="The SVGDescElement interface corresponds to the <desc> element."><code>SVGDescElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGElement" title="All of the SVG DOM interfaces that correspond directly to elements in the SVG language derive from the SVGElement interface."><code>SVGElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGEllipseElement" title="The SVGEllipseElement interface provides access to the properties of <ellipse> elements."><code>SVGEllipseElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGEvent" title="This section contains the Scalable Vector Graphics (SVG) event reference documentation."><code>SVGEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGExternalResourcesRequired" title="The SVGExternalResourcesRequired interface defines an interface which applies to all elements where this element or one of its descendants can reference an external resource."><code>SVGExternalResourcesRequired</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEBlendElement" title="The SVGFEBlendElement interface corresponds to the <feBlend> element."><code>SVGFEBlendElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEComponentTransferElement" title="The SVGFEComponentTransferElement interface corresponds to the <feComponentTransfer> element."><code>SVGFEComponentTransferElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFECompositeElement" title="The SVGFECompositeElement interface corresponds to the <feComposite> element."><code>SVGFECompositeElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEConvolveMatrixElement" title="The SVGFEConvolveMatrixElement interface corresponds to the <feConvolveMatrix> element."><code>SVGFEConvolveMatrixElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEDiffuseLightingElement" title="The SVGFEDiffuseLightingElement interface corresponds to the <feDiffuseLighting> element."><code>SVGFEDiffuseLightingElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEDisplacementMapElement" title="The SVGFEDisplacementMapElement interface corresponds to the <feDisplacementMap> element."><code>SVGFEDisplacementMapElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEDistantLightElement" title="The SVGFEDistantLightElement interface corresponds to the <feDistantLight> element."><code>SVGFEDistantLightElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEDropShadowElement" title="The SVGFEDropShadowElement interface corresponds to the <feDropShadow> element."><code>SVGFEDropShadowElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEFloodElement" title="The SVGFEFloodElement interface corresponds to the <feFlood> element."><code>SVGFEFloodElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEFuncAElement" title="The SVGFEFuncAElement interface corresponds to the <feFuncA> element."><code>SVGFEFuncAElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEFuncBElement" title="The SVGFEFuncBElement interface corresponds to the <feFuncB> element."><code>SVGFEFuncBElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEFuncGElement" title="The SVGFEFuncGElement interface corresponds to the <feFuncG> element."><code>SVGFEFuncGElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEFuncRElement" title="The SVGFEFuncRElement interface corresponds to the <feFuncR> element."><code>SVGFEFuncRElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEGaussianBlurElement" title="The SVGFEGaussianBlurElement interface corresponds to the <feGaussianBlur> element."><code>SVGFEGaussianBlurElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEImageElement" title="The SVGFEImageElement interface corresponds to the <feImage> element."><code>SVGFEImageElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEMergeElement" title="The SVGFEMergeElement interface corresponds to the <feMerge> element."><code>SVGFEMergeElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEMergeNodeElement" title="The SVGFEMergeNodeElement interface corresponds to the <feMergeNode> element."><code>SVGFEMergeNodeElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEMorphologyElement" title="The SVGFEMorphologyElement interface corresponds to the <feMorphology> element."><code>SVGFEMorphologyElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEOffsetElement" title="The SVGFEOffsetElement interface corresponds to the <feOffset> element."><code>SVGFEOffsetElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFEPointLightElement" title="The SVGFEPointLightElement interface corresponds to the <fePointLight> element."><code>SVGFEPointLightElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFESpecularLightingElement" title="The SVGFESpecularLightingElement interface corresponds to the <feSpecularLighting> element."><code>SVGFESpecularLightingElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFESpotLightElement" title="The SVGFESpotLightElement interface corresponds to the <feSpotLight> element."><code>SVGFESpotLightElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFETileElement" title="The SVGFETileElement interface corresponds to the <feTile> element."><code>SVGFETileElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFETurbulenceElement" title="The SVGFETurbulenceElement interface corresponds to the <feTurbulence> element."><code>SVGFETurbulenceElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFilterElement" title="The SVGFilterElement interface provides access to the properties of <filter> elements, as well as methods to manipulate them."><code>SVGFilterElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFilterPrimitiveStandardAttributes" title="The SVGFilterPrimitiveStandardAttributes interface defines the set of DOM attributes that are common across the filter primitive interfaces."><code>SVGFilterPrimitiveStandardAttributes</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFontElement" title="The SVGFontElement interface corresponds to the <font> elements."><code>SVGFontElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFontFaceElement" title="The SVGFontFaceElement interface corresponds to the <font-face> elements."><code>SVGFontFaceElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFontFaceFormatElement" title="The SVGFontFaceFormatElement interface corresponds to the <font-face-format> elements."><code>SVGFontFaceFormatElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFontFaceNameElement" title="The SVGFontFaceNameElement interface corresponds to the <font-face-name> elements."><code>SVGFontFaceNameElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFontFaceSrcElement" title="The SVGFontFaceSrcElement interface corresponds to the <font-face-src> elements."><code>SVGFontFaceSrcElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGFontFaceUriElement" title="The SVGFontFaceUriElement interface corresponds to the <font-face-uri> elements."><code>SVGFontFaceUriElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGForeignObjectElement" title="The SVGForeignObjectElement interface provides access to the properties of <foreignObject> elements, as well as methods to manipulate them."><code>SVGForeignObjectElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGGElement" title="The SVGGElement interface corresponds to the <g> element."><code>SVGGElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGGeometryElement" title="The SVGGeometryElement interface represents SVG elements whose rendering is defined by geometry with an equivalent path, and which can be filled and stroked. This includes paths and the basic shapes."><code>SVGGeometryElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGGlyphElement" title="The SVGGlyphElement interface corresponds to the <glyph> element."><code>SVGGlyphElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGGlyphRefElement" title="The SVGGlyphRefElement interface corresponds to the <glyphRef> elements."><code>SVGGlyphRefElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGGradientElement" title="The SVGGradient interface is a base interface used by SVGLinearGradientElement and SVGRadialGradientElement."><code>SVGGradientElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGGraphicsElement" title="The SVGGraphicsElement interface represents SVG elements whose primary purpose is to directly render graphics into a group."><code>SVGGraphicsElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGHKernElement" title="The SVGHKernElement interface corresponds to the <hkern> elements."><code>SVGHKernElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGImageElement" title="The SVGImageElement interface corresponds to the <image> element."><code>SVGImageElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGLength" title="The SVGLength interface correspond to the <length> basic data type."><code>SVGLength</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGLengthList" title="The SVGLengthList defines a list of SVGLength objects."><code>SVGLengthList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGLineElement" title="The SVGLineElement interface provides access to the properties of <line> elements, as well as methods to manipulate them."><code>SVGLineElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGLinearGradientElement" title="The SVGLinearGradientElement interface corresponds to the <linearGradient> element."><code>SVGLinearGradientElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGMPathElement" title="The SVGMPathElement interface corresponds to the <mpath> element."><code>SVGMPathElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGMaskElement" title="The SVGMaskElement interface provides access to the properties of <mask> elements, as well as methods to manipulate them."><code>SVGMaskElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGMatrix" title="Many of SVG's graphics operations utilize 2x3 matrices of the form:"><code>SVGMatrix</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGMeshElement" title="The SVGMeshElement interface provides access to the properties of <mesh> elements."><code>SVGMeshElement</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGMetadataElement" title="The SVGMetadataElement interface corresponds to the <metadata> element."><code>SVGMetadataElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGMissingGlyphElement" title="The SVGMissingGlyphElement interface corresponds to the <missing-glyph> elements."><code>SVGMissingGlyphElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGNumber" title="The SVGNumber interface corresponds to the <number> basic data type."><code>SVGNumber</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGNumberList" title="The SVGNumberList defines a list of SVGNumber objects."><code>SVGNumberList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGPathElement" title="The SVGPathElement interface corresponds to the <path> element."><code>SVGPathElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGPatternElement" title="The SVGPatternElement interface corresponds to the <pattern> element."><code>SVGPatternElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGPoint" title="An SVGPoint represents a 2D or 3D point in the SVG coordinate system."><code>SVGPoint</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGPolygonElement" title="The SVGPolygonElement interface provides access to the properties of <polygon> elements, as well as methods to manipulate them."><code>SVGPolygonElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGPolylineElement" title="The SVGPolylineElement interface provides access to the properties of <polyline> elements, as well as methods to manipulate them."><code>SVGPolylineElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGPreserveAspectRatio" title="The SVGPreserveAspectRatio interface corresponds to the preserveAspectRatio attribute, which is available for some of SVG's elements."><code>SVGPreserveAspectRatio</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGRadialGradientElement" title="The SVGRadialGradientElement interface corresponds to the <RadialGradient> element."><code>SVGRadialGradientElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGRect" title="The SVGRect represents a rectangle. Rectangles consist of an x and y coordinate pair identifying a minimum x value, a minimum y value, and a width and height, which are constrained to be non-negative."><code>SVGRect</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGRectElement" title="The SVGRectElement interface provides access to the properties of <rect> elements, as well as methods to manipulate them."><code>SVGRectElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGRenderingIntent" title="The SVGRenderingIntent interface defines the enumerated list of possible values for rendering-intent attributes or descriptors."><code>SVGRenderingIntent</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGSVGElement" title="The SVGSVGElement interface provides access to the properties of <svg> elements, as well as methods to manipulate them. This interface contains also various miscellaneous commonly-used utility methods, such as matrix operations and the ability to control the time of redraw on visual rendering devices."><code>SVGSVGElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGScriptElement" title="The SVGScriptElement interface corresponds to the SVG <script> element."><code>SVGScriptElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGSetElement" title="The SVGSetElement interface corresponds to the <set> element."><code>SVGSetElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGSolidcolorElement" title="The SVGSolidcolorElement interface corresponds to the <solidcolor> element."><code>SVGSolidcolorElement</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGStopElement" title="The SVGStopElement interface corresponds to the <stop> element."><code>SVGStopElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGStringList" title="The SVGStringList defines a list of DOMString objects."><code>SVGStringList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGStylable" title="The SVGStylable interface is implemented on all objects corresponding to SVG elements that can have style, class and presentation attributes specified on them."><code>SVGStylable</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGStyleElement" title="The SVGStyleElement interface corresponds to the SVG <style> element."><code>SVGStyleElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGSwitchElement" title="The SVGSwitchElement interface corresponds to the <switch> element."><code>SVGSwitchElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGSymbolElement" title="The SVGSymbolElement interface corresponds to the <symbol> element."><code>SVGSymbolElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTRefElement" title="The SVGTRefElement interface corresponds to the <tref> elements."><code>SVGTRefElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTSpanElement" title="The SVGTSpanElement interface represents a <tspan> element."><code>SVGTSpanElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTests" title="The SVGTests interface is used to reflect conditional processing attributes and is mixed into other interfaces for elements that support these attributes."><code>SVGTests</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTextContentElement" title="The SVGTextContentElement interface is implemented by elements that support rendering child text content. It is inherited by various text-related interfaces, such as SVGTextElement, SVGTSpanElement, SVGTRefElement, SVGAltGlyphElement and SVGTextPathElement."><code>SVGTextContentElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTextElement" title="The SVGTextElement interface corresponds to the <text> elements."><code>SVGTextElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTextPathElement" title="The SVGTextPathElement interface corresponds to the <textPath> element."><code>SVGTextPathElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTextPositioningElement" title="The SVGTextPositioningElement interface is implemented by elements that support attributes that position individual text glyphs. It is inherited by SVGTextElement, SVGTSpanElement, SVGTRefElement and SVGAltGlyphElement."><code>SVGTextPositioningElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTitleElement" title="The SVGTitleElement interface corresponds to the <title> element."><code>SVGTitleElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTransform" title="SVGTransform is the interface for one of the component transformations within an SVGTransformList; thus, an SVGTransform object corresponds to a single component (e.g., scale(…) or matrix(…)) within a transform attribute."><code>SVGTransform</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTransformList" title="The SVGTransformList defines a list of SVGTransform objects."><code>SVGTransformList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGTransformable" title="Interface SVGTransformable contains properties and methods that apply to all elements which have attribute transform."><code>SVGTransformable</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGURIReference" title="The SVGURIReference interface is used to reflect the href attribute and the deprecated xlink:href attribute."><code>SVGURIReference</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGUnitTypes" title="The SVGUnitTypes interface defines a commonly used set of constants used for reflecting gradientUnits, patternContentUnits and other similar attributes."><code>SVGUnitTypes</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGUseElement" title="The SVGUseElement interface corresponds to the <use> element."><code>SVGUseElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGVKernElement" title="The SVGVKernElement interface corresponds to the <vkern> elements."><code>SVGVKernElement</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGViewElement" title="The SVGViewElement interface provides access to the properties of <view> elements, as well as methods to manipulate them."><code>SVGViewElement</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SVGZoomAndPan" title="The SVGZoomAndPan interfaceis used to reflect the zoomAndPan attribute, and is mixed in to other interfaces for elements that support this attribute."><code>SVGZoomAndPan</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Screen" title="The Screen interface represents a screen, usually the one on which the current window is being rendered."><code>Screen</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ScreenOrientation" title="The ScreenOrientation interface of the the Screen Orientation API provides information about the current orientation of the document."><code>ScreenOrientation</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ScriptProcessorNode" title=""><code>ScriptProcessorNode</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SecurityPolicyViolationEvent" title="The SecurityPolicyViolationEvent interface is an event sent on a document or worker when its content security policy is violated."><code>SecurityPolicyViolationEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Selection" title="A Selection object represents the range of text selected by the user or the current position of the caret. To obtain a Selection object for examination or modification, call window.getSelection()."><code>Selection</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ServiceWorker" title="The ServiceWorker interface of the ServiceWorker API provides a reference to a service worker. Multiple browsing contexts (e.g. pages, workers, etc.) can be associated with the same service worker, each through a unique ServiceWorker object."><code>ServiceWorker</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ServiceWorkerContainer" title="The ServiceWorkerContainer interface of the ServiceWorker API provides an object representing the service worker as an overall unit in the network ecosystem, including facilities to register, unregister and update service workers, and access the state of service workers and their registrations."><code>ServiceWorkerContainer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ServiceWorkerGlobalScope" title="The ServiceWorkerGlobalScope interface of the ServiceWorker API represents the global execution context of a service worker."><code>ServiceWorkerGlobalScope</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ServiceWorkerMessageEvent" title="The ServiceWorkerMessageEvent interface of the ServiceWorker API contains information about an event sent to a ServiceWorkerContainer target. This extends the default message event to allow setting a ServiceWorker object as the source of a message. The event object is accessed via the handler function of a message event, when fired by a message received from a service worker."><code>ServiceWorkerMessageEvent</code></a></span><span class="indexListBadges"> <span title="This deprecated API should no longer be used, but will probably still work."><i class="icon-thumbs-down-alt"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ServiceWorkerRegistration" title="The ServiceWorkerRegistration interface of the ServiceWorker API represents the service worker registration. You register a service worker to control one or more pages that share the same origin."><code>ServiceWorkerRegistration</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ServiceWorkerState" title="The ServiceWorkerState is associated with its ServiceWorker's state."><code>ServiceWorkerState</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ShadowRoot" title="The ShadowRoot interface of the Shadow DOM API is the root node of a DOM subtree that is rendered separately from a document's main DOM tree."><code>ShadowRoot</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SharedWorker" title="The SharedWorker interface represents a specific kind of worker that can be accessed from several browsing contexts, such as several windows, iframes or even workers. They implement an interface different than dedicated workers and have a different global scope, SharedWorkerGlobalScope."><code>SharedWorker</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SharedWorkerGlobalScope" title="The SharedWorkerGlobalScope object (the SharedWorker global scope) is accessible through the self keyword. Some additional global functions, namespaces objects, and constructors, not typically associated with the worker global scope, but available on it, are listed in the JavaScript Reference. See the complete list of functions available to workers."><code>SharedWorkerGlobalScope</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SourceBuffer" title="The SourceBuffer interface represents a chunk of media to be passed into an HTMLMediaElement and played, via a MediaSource object. This can be made up of one or several media segments."><code>SourceBuffer</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SourceBufferList" title="The SourceBufferList interface represents a simple container list for multiple SourceBuffer objects."><code>SourceBufferList</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechGrammar" title="The SpeechGrammar interface of the Web Speech API represents a set of words or patterns of words that we want the recognition service to recognize."><code>SpeechGrammar</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechGrammarList" title="The SpeechGrammarList interface of the Web Speech API represents a list of SpeechGrammar objects containing words or patterns of words that we want the recognition service to recognize."><code>SpeechGrammarList</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechRecognition" title="The SpeechRecognition interface of the Web Speech API is the controller interface for the recognition service; this also handles the SpeechRecognitionEvent sent from the recognition service."><code>SpeechRecognition</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechRecognitionAlternative" title="The SpeechRecognitionAlternative interface of the Web Speech API represents a single word that has been recognised by the speech recognition service."><code>SpeechRecognitionAlternative</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechRecognitionError" title="The SpeechRecognitionError interface of the Web Speech API represents error messages from the recognition service."><code>SpeechRecognitionError</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechRecognitionEvent" title="The SpeechRecognitionEvent interface of the Web Speech API represents the event object for the result and nomatch events, and contains all the data associated with an interim or final speech recognition result."><code>SpeechRecognitionEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechRecognitionResult" title="The SpeechRecognitionResult interface of the Web Speech API represents a single recognition match, which may contain multiple SpeechRecognitionAlternative objects."><code>SpeechRecognitionResult</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechRecognitionResultList" title="The SpeechRecognitionResultList interface of the Web Speech API represents a list of SpeechRecognitionResult objects, or a single one if results are being captured in continuous mode."><code>SpeechRecognitionResultList</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechSynthesis" title="The SpeechSynthesis interface of the Web Speech API is the controller interface for the speech service; this can be used to retrieve information about the synthesis voices available on the device, start and pause speech, and other commands besides."><code>SpeechSynthesis</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechSynthesisErrorEvent" title="The SpeechSynthesisErrorEvent interface of the Web Speech API contains information about any errors that occur while processing SpeechSynthesisUtterance objects in the speech service."><code>SpeechSynthesisErrorEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechSynthesisEvent" title="The SpeechSynthesisEvent interface of the Web Speech API contains information about the current state of SpeechSynthesisUtterance objects that have been processed in the speech service."><code>SpeechSynthesisEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechSynthesisUtterance" title="The SpeechSynthesisUtterance interface of the Web Speech API represents a speech request. It contains the content the speech service should read and information about how to read it (e.g. language, pitch and volume.)"><code>SpeechSynthesisUtterance</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SpeechSynthesisVoice" title="The SpeechSynthesisVoice interface of the Web Speech API represents a voice that the system supports. Every SpeechSynthesisVoice has its own relative speech service including information about language, name and URI."><code>SpeechSynthesisVoice</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/StereoPannerNode" title="The pan property takes a unitless value between -1 (full left pan) and 1 (full right pan). This interface was introduced as a much simpler way to apply a simple panning effect than having to use a full PannerNode."><code>StereoPannerNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Storage" title="The Storage interface of the Web Storage API provides access to the session storage or local storage for a particular domain, allowing you to for example add, modify or delete stored data items."><code>Storage</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/StorageEstimate" title="The StorageEstimate dictionary is used by the StorageManager to provide estimates of the size of a site's or application's data store and how much of it is in use. The estimate() method returns an object that conforms to this dictionary when its Promise resolves."><code>StorageEstimate</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/StorageEvent" title="A StorageEvent is sent to a window when a storage area it has access to is changed within the context of another document."><code>StorageEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/StorageManager" title="The StorageManager interface of the the Storage API provides an interface for managing persistance permissions and estimating available storage. You can get a reference to this interface using either navigator.storage or WorkerNavigator.storage."><code>StorageManager</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/StorageQuota" title="The storageQuota property of the Navigator interface of the Quota Management API provides means to query and request storage usage and quota information."><code>StorageQuota</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/StyleSheet" title="An object implementing the StyleSheet interface represents a single style sheet. CSS style sheets will further implement the more specialized CSSStyleSheet interface."><code>StyleSheet</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/StyleSheetList" title="Technical review completed."><code>StyleSheetList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SubtleCrypto" title="The SubtleCrypto interface represents a set of cryptographic primitives. It is available via the Crypto.subtle properties available in a window context (via Window.crypto)."><code>SubtleCrypto</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SyncEvent" title="The SyncEvent interface represents a sync action that is dispatched on the ServiceWorkerGlobalScope of a ServiceWorker. "><code>SyncEvent</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/SyncManager" title="The SyncManager interface of the the ServiceWorker API provides an interface for registering and listing sync registrations."><code>SyncManager</code></a></span><span class="indexListBadges"> <span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span></span></span></li> -</ul> -<span>T</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TaskAttributionTiming" title="The TaskAttributionTiming interface of the the Long Tasks API returns information about the work involved in a long task and its associate frame context. The frame context, also called the container is the iframe, embed or object etc. that is being implicated, on the whole, for a long task."><code>TaskAttributionTiming</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Text" title="The Text interface represents the textual content of Element or Attr. If an element has no markup within its content, it has a single child implementing Text that contains the element's text. However, if the element contains markup, it is parsed into information items and Text nodes that form its children."><code>Text</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TextDecoder" title="The TextDecoder interface represents a decoder for a specific method, that is a specific character encoding, like utf-8, iso-8859-2, koi8, cp1261, gbk, etc. A decoder takes a stream of bytes as input and emits a stream of code points. For a more scalable, non-native library, see StringView – a C-like representation of strings based on typed arrays."><code>TextDecoder</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TextEncoder" title="TextEncoder takes a stream of code points as input and emits a stream of bytes. For a more scalable, non-native library, see StringView – a C-like representation of strings based on typed arrays."><code>TextEncoder</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TextMetrics" title="The TextMetrics interface represents the dimension of a text in the canvas, as created by the CanvasRenderingContext2D.measureText() method."><code>TextMetrics</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TextTrack" title="This interface also inherits properties from EventTarget."><code>TextTrack</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TimeEvent" title="Extends Event."><code>TimeEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TimeRanges" title="The TimeRanges interface is used to represent a set of time ranges, primarily for the purpose of tracking which portions of media have been buffered when loading it for use by the <audio> and <video> elements."><code>TimeRanges</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Touch" title="The Touch interface represents a single contact point on a touch-sensitive device. The contact point is commonly a finger or stylus and the device may be a touchscreen or trackpad."><code>Touch</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TouchEvent" title="The TouchEvent interface represents an event sent when the state of contacts with a touch-sensitive surface changes. This surface can be a touch screen or trackpad, for example. The event can describe one or more points of contact with the screen and includes support for detecting movement, addition and removal of contact points, and so forth."><code>TouchEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TouchList" title="The TouchList interface represents a list of contact points with a touch surface; for example, if the user has three fingers on the touch surface (such as a screen or trackpad), the corresponding TouchList object would have one Touch object for each finger, for a total of three entries."><code>TouchList</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TrackDefault" title="The TrackDefault interface provides a SourceBuffer with kind, label, and language information for tracks that do not contain this information in the initialization segments of a media chunk."><code>TrackDefault</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TrackDefaultList" title="The TrackDefaultList interface represents a simple container list for multiple TrackDefault objects."><code>TrackDefaultList</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Transferable" title="The Transferable interface represents an object that can be transfered between different execution contexts, like the main thread and Web workers."><code>Transferable</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TransitionEvent" title="The TransitionEvent interface represents events providing information related to transitions."><code>TransitionEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TreeWalker" title="The TreeWalker object represents the nodes of a document subtree and a position within them."><code>TreeWalker</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/TypeInfo" title=""><code>TypeInfo</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -</ul> -<span>U</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/UIEvent" title="The UIEvent interface represents simple user interface events."><code>UIEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/URL" title="The URL interface represents an object providing static methods used for creating object URLs."><code>URL</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/URLSearchParams" title="The URLSearchParams interface defines utility methods to work with the query string of a URL."><code>URLSearchParams</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/URLUtilsReadOnly" title="The URLUtilsReadOnly interface defines utility methods to work with URLs. It defines only non-modifying methods intended to be used on data that cannot be changed."><code>URLUtilsReadOnly</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/USVString" title="USVString corresponds to the set of all possible sequences of unicode scalar values. USVString maps to a String when returned in JavaScript; it's generally only used for APIs that perform text processing and need a string of unicode scalar values to operate on. USVString is equivalent to DOMString except for not allowing unpaired surrogate codepoints. Unpaired surrogate codepoints present in USVString are converted by the browser to Unicode 'replacement character' U+FFFD, (�)."><code>USVString</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/UserDataHandler" title="When associating user data with a key on a node, Node.setUserData() can also accept, in its third argument, a handler which will be called when the object is cloned, imported, deleted, renamed, or adopted. Per the specification, exceptions should not be thrown in a UserDataHandler. In both document.importNode() and Node.cloneNode(), although user data is not copied over, the handler will be called."><code>UserDataHandler</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/UserProximityEvent" title="The UserProximityEvent indicates whether a nearby physical object is present by using the proximity sensor of a device."><code>UserProximityEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> -<span>V</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRDisplay" title="The VRDisplay interface of the WebVR API represents any VR device supported by this API. It includes generic information such as device IDs and descriptions, as well as methods for starting to present a VR scene, retrieving eye parameters and display capabilities, and other important functionality."><code>VRDisplay</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRDisplayCapabilities" title="The VRDisplayCapabilities interface of the WebVR API describes the capabilities of a VRDisplay — its features can be used to perform VR device capability tests, for example can it return position information."><code>VRDisplayCapabilities</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRDisplayEvent" title="The VRDisplayEvent interface of the WebVR API represents represents the event object of WebVR-related events (see the list of WebVR window extensions)."><code>VRDisplayEvent</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VREyeParameters" title="The VREyeParameters interface of the WebVR API represents all the information required to correctly render a scene for a given eye, including field of view information."><code>VREyeParameters</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRFieldOfView" title="The VRFieldOfView interface of the WebVR API represents a field of view defined by 4 different degree values describing the view from a center point."><code>VRFieldOfView</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRFieldOfViewReadOnly" title="The VRFieldOfViewReadOnly interface of the WebVR API contains the raw definition for the degree value properties required to define a field of view. Inherited by VRFieldOfView."><code>VRFieldOfViewReadOnly</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRFrameData" title="The VRFrameData interface of the WebVR API represents all the information needed to render a single frame of a VR scene; constructed by VRDisplay.getFrameData()."><code>VRFrameData</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRLayerInit" title="The VRLayerInit interface (dictionary) of the WebVR API represents a content layer (an HTMLCanvasElement or OffscreenCanvas) that you want to present in a VR display."><code>VRLayerInit</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRPose" title="The VRPose interface of the WebVR API represents the state of a VR sensor at a given timestamp (which includes orientation, position, velocity, and acceleration information.)"><code>VRPose</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VRStageParameters" title="The VRStageParameters interface of the WebVR API represents the values describing the the stage area for devices that support room-scale experiences."><code>VRStageParameters</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VTTCue" title="VTTCues represent a cue in a text track."><code>VTTCue</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/ValidityState" title="The ValidityState interface represents the validity states that an element can be in, with respect to constraint validation. Together, they help explain why an element's value fails to validate, if it's not valid."><code>ValidityState</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VideoPlaybackQuality" title="The VideoPlaybackQuality interface represents the set of metrics describing the playback quality of a video."><code>VideoPlaybackQuality</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/VisualViewport" title="The VisualViewport interface of the the Visual Viewport API represents the visual viewport for a given window. For a page containing iframes, each iframe, as well as the containing page, will have a unique window object. Each window on a page will have a unique VisualViewport representing the properties associated with that window. You can get a window's viewport using Window.visualViewport."><code>VisualViewport</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> -<span>W</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_color_buffer_float" title="The WEBGL_color_buffer_float extension is part of the WebGL API and adds the ability to render to 32-bit floating-point color buffers."><code>WEBGL_color_buffer_float</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_compressed_texture_astc" title="The WEBGL_compressed_texture_astc extension is part of the WebGL API and exposes Adaptive Scalable Texture Compression (ASTC) compressed texture formats to WebGL."><code>WEBGL_compressed_texture_astc</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_compressed_texture_atc" title="The WEBGL_compressed_texture_atc extension is part of the WebGL API and exposes 3 ATC compressed texture formats. ATC is a proprietary compression algorithm for compressing textures on handheld devices."><code>WEBGL_compressed_texture_atc</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_compressed_texture_etc" title="The WEBGL_compressed_texture_etc extension is part of the WebGL API and exposes 10 ETC/EAC compressed texture formats."><code>WEBGL_compressed_texture_etc</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_compressed_texture_etc1" title="The WEBGL_compressed_texture_etc1 extension is part of the WebGL API and exposes the ETC1 compressed texture format."><code>WEBGL_compressed_texture_etc1</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_compressed_texture_pvrtc" title="The WEBGL_compressed_texture_pvrtc extension is part of the WebGL API and exposes four PVRTC compressed texture formats."><code>WEBGL_compressed_texture_pvrtc</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_compressed_texture_s3tc" title="The WEBGL_compressed_texture_s3tc extension is part of the WebGL API and exposes four S3TC compressed texture formats."><code>WEBGL_compressed_texture_s3tc</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_compressed_texture_s3tc_srgb" title="The WEBGL_compressed_texture_s3tc_srgb extension is part of the WebGL API and exposes four S3TC compressed texture formats for the sRGB colorspace."><code>WEBGL_compressed_texture_s3tc_srgb</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_debug_renderer_info" title="The WEBGL_debug_renderer_info extension is part of the WebGL API and exposes two constants with information about the graphics driver for debugging purposes."><code>WEBGL_debug_renderer_info</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_debug_shaders" title="The WEBGL_debug_shaders extension is part of the WebGL API and exposes a method to debug shaders from privileged contexts."><code>WEBGL_debug_shaders</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_depth_texture" title="The WEBGL_depth_texture extension is part of the WebGL API and defines 2D depth and depth-stencil textures."><code>WEBGL_depth_texture</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_draw_buffers" title="The WEBGL_draw_buffers extension is part of the WebGL API and enables a fragment shader to write to several textures, which is useful for deferred shading, for example."><code>WEBGL_draw_buffers</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WEBGL_lose_context" title="The WEBGL_lose_context extension is part of the WebGL API and exposes functions to simulate losing and restoring a WebGLRenderingContext."><code>WEBGL_lose_context</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WaveShaperNode" title="A WaveShaperNode always has exactly one input and one output."><code>WaveShaperNode</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGL2RenderingContext" title="The WebGL2RenderingContext interface provides the OpenGL ES 3.0 rendering context for the drawing surface of an HTML <canvas> element."><code>WebGL2RenderingContext</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLActiveInfo" title="The WebGLActiveInfo interface is part of the WebGL API and represents the information returned by calling the WebGLRenderingContext.getActiveAttrib() and WebGLRenderingContext.getActiveUniform() methods."><code>WebGLActiveInfo</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLBuffer" title="The WebGLBuffer interface is part of the WebGL API and represents an opaque buffer object storing data such as vertices or colors."><code>WebGLBuffer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLContextEvent" title="The WebContextEvent interface is part of the WebGL API and is an interface for an event that is generated in response to a status change to the WebGL rendering context."><code>WebGLContextEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLFramebuffer" title="The WebGLFramebuffer interface is part of the WebGL API and represents a collection of buffers that serve as a rendering destination."><code>WebGLFramebuffer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLProgram" title="The WebGLProgram is part of the WebGL API and is a combination of two compiled WebGLShaders consisting of a vertex shader and a fragment shader (both written in GLSL). These are then linked into a usable program."><code>WebGLProgram</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLQuery" title="The WebGLQuery interface is part of the WebGL 2 API and provides ways to asynchronously query for information. By default, occlusion queries and primitive queries are available."><code>WebGLQuery</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLRenderbuffer" title="The WebGLRenderbuffer interface is part of the WebGL API and represents a buffer that can contain an image, or can be source or target of an rendering operation."><code>WebGLRenderbuffer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLRenderingContext" title="The WebGLRenderingContext interface provides the OpenGL ES 2.0 rendering context for the drawing surface of an HTML <canvas> element."><code>WebGLRenderingContext</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLSampler" title="The WebGLSampler interface is part of the WebGL 2 API and stores sampling parameters for WebGLTexture access inside of a shader."><code>WebGLSampler</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLShader" title="The WebGLShader is part of the WebGL API and can either be a vertex or a fragment shader. A WebGLProgram requires both types of shaders."><code>WebGLShader</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLShaderPrecisionFormat" title="The WebGLShaderPrecisionFormat interface is part of the WebGL API and represents the information returned by calling the WebGLRenderingContext.getShaderPrecisionFormat() method."><code>WebGLShaderPrecisionFormat</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLSync" title="The WebGLSync interface is part of the WebGL 2 API and is used to synchronize activities between the GPU and the application."><code>WebGLSync</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLTexture" title="The WebGLTexture interface is part of the WebGL API and represents an opaque texture object providing storage and state for texturing operations."><code>WebGLTexture</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLTransformFeedback" title="The WebGLTransformFeedback interface is part of the WebGL 2 API and enables transform feedback, which is the process of capturing primitives generated by vertex processing. It allows to preserve the post-transform rendering state of an object and resubmit this data multiple times."><code>WebGLTransformFeedback</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLUniformLocation" title="The WebGLUniformLocation interface is part of the WebGL API and represents the location of a uniform variable in a shader program."><code>WebGLUniformLocation</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebGLVertexArrayObject" title="The WebGLVertexArrayObject interface is part of the WebGL 2 API, represents vertex array objects (VAOs) pointing to vertex array data, and provides names for different sets of vertex data."><code>WebGLVertexArrayObject</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebSocket" title="The WebSocket object provides the API for creating and managing a WebSocket connection to a server, as well as for sending and receiving data on the connection."><code>WebSocket</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WebSockets_API" title="WebSockets is an advanced technology that makes it possible to open an interactive communication session between the user's browser and a server. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply."><code>WebSockets</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WheelEvent" title="The WheelEvent interface represents events that occur due to the user moving a mouse wheel or similar input device."><code>WheelEvent</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Window" title="The window object represents a window containing a DOM document; the document property points to the DOM document loaded in that window."><code>Window</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WindowBase64" title="The WindowBase64 helper contains utility methods to convert data to and from base64, a binary-to-text encoding scheme. For example it is used in data URIs."><code>WindowBase64</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WindowClient" title="The WindowClient interface of the ServiceWorker API represents the scope of a service worker client that is a document in a browser context, controlled by an active worker. The service worker client independently selects and uses a service worker for its own loading and sub-resources."><code>WindowClient</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WindowEventHandlers" title="WindowEventHandlers mixin describes the event handlers common to several interfaces like Window, or HTMLBodyElement and HTMLFrameSetElement. Each of these interfaces can implement additional specific event handlers."><code>WindowEventHandlers</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WindowOrWorkerGlobalScope" title="The WindowOrWorkerGlobalScope mixin describes several features common to the Window and WorkerGlobalScope interfaces. Each of these interfaces can, of course, add more features in addition to the ones listed below."><code>WindowOrWorkerGlobalScope</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WindowTimers" title="WindowTimers is a mixin used to provide utility methods which set and clear timers. No objects of this type exist; instead, its methods are available on Window for the standard browsing scope, or on WorkerGlobalScope for workers."><code>WindowTimers</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/Worker" title="The Worker interface of the Web Workers API represents a background task that can be easily created and can send messages back to its creator. Creating a worker is as simple as calling the Worker() constructor and specifying a script to be run in the worker thread."><code>Worker</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WorkerGlobalScope" title="The WorkerGlobalScope interface of the Web Workers API is an interface representing the scope of any worker. Workers have no browsing context; this scope contains the information usually conveyed by Window objects — in this case event handlers, the console or the associated WorkerNavigator object. Each WorkerGlobalScope has its own event loop."><code>WorkerGlobalScope</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WorkerLocation" title="The WorkerLocation interface defines the absolute location of the script executed by the Worker. Such an object is initialized for each worker and is available via the WorkerGlobalScope.location property obtained by calling window.self.location."><code>WorkerLocation</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WorkerNavigator" title="The WorkerNavigator interface represents a subset of the Navigator interface allowed to be accessed from a Worker. Such an object is initialized for each worker and is available via the WorkerGlobalScope.navigator property obtained by calling window.self.navigator."><code>WorkerNavigator</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WritableStream" title="The WritableStream interface of the the Streams API provides a standard abstraction for writing streaming data to a destination, known as a sink. This object comes with build-in backpressure and queuing."><code>WritableStream</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WritableStreamDefaultController" title="The WritableStreamDefaultController interface of the the Streams API represents a controller allowing control of a WritableStream's state. When constructing a WritableStream, the underlying sink is given a corresponding WritableStreamDefaultController instance to manipulate."><code>WritableStreamDefaultController</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/WritableStreamDefaultWriter" title="The WritableStreamDefaultWriter interface of the the Streams API is the object returned by WritableStream.getWriter() and once created locks the < writer to the WritableStream ensuring that no other streams can write to the underlying sink."><code>WritableStreamDefaultWriter</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -</ul> -<span>X</span><ul> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XDomainRequest" title="XDomainRequest is an implementation of HTTP access control (CORS) that worked in Internet Explorer 8 and 9. It was removed in Internet Explorer 10 in favor of using XMLHttpRequest with proper CORS; if you are targeting Internet Explorer 10 or later, or wish to support any other browser, you need to use standard HTTP access control."><code>XDomainRequest</code></a></span><span class="indexListBadges"> <span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XMLDocument" title="The XMLDocument interface represent an XML document. It inherits from the generic Document and does not add any specific methods or properties to it: nevertheless, several algorithms behave differently with the two types of documents."><code>XMLDocument</code></a></span><span class="indexListBadges"> <span title="这是一个实验性的 API，请尽量不要在生产环境中使用它。"><i class="icon-beaker"> </i></span></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XMLHttpRequest" title="XMLHttpRequest objects to interact with servers. You can retrieve data from a URL without having to do a full page refresh. This enables a Web page to update just part of a page without disrupting what the user is doing."><code>XMLHttpRequest</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XMLHttpRequestEventTarget" title="XMLHttpRequestEventTarget is the interface that describes the event handlers you can implement in an object that will handle events for an XMLHttpRequest."><code>XMLHttpRequestEventTarget</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XMLSerializer" title=""><code>XMLSerializer</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XPathExpression" title="An XPathExpression is a compiled XPath query returned from document.createExpression(). It has a method evaluate() which can be used to execute the compiled XPath."><code>XPathExpression</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XPathResult" title=""><code>XPathResult</code></a></span></span></li> -<li><span class="indexListRow"><span class="indexListTerm"><a href="/zh-CN/docs/Web/API/XSLTProcessor" title="An XSLTProcessor applies an XSLT stylesheet transformation to an XML document to produce a new XML document as output. It has methods to load the XSLT stylesheet, to manipulate <xsl:param> parameter values, and to apply the transformation to documents."><code>XSLTProcessor</code></a></span></span></li> -</ul> - - - - - -</div><p></p> diff --git a/files/zh-cn/archive/b2g_os/api/navigator/index.html b/files/zh-cn/archive/b2g_os/api/navigator/index.html deleted file mode 100644 index c66a781c5f..0000000000 --- a/files/zh-cn/archive/b2g_os/api/navigator/index.html +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: Navigator (Firefox OS extensions) -slug: Archive/B2G_OS/API/Navigator -translation_of: Archive/B2G_OS/API/Navigator ---- -<p>(zh-CN translation)</p> - -<p>The <code><strong>Navigator</strong></code> interface represents the state and the identity of the user agent. It allows scripts to query it and to register themselves to carry on some activities. This page represents the list of properties and methods added to <code>Navigator</code> on Firefox OS devices. For the list of properties and methods available to any Web sites, consult <a href="/zh-CN/docs/Web/API/Navigator" title="Navigator 接口表示用户代理的状态和标识。 它允许脚本查询它和注册自己进行一些活动。"><code>Navigator</code></a>.</p> - -<p>A <code>Navigator</code> object can be retrieved using the read-only <a href="/zh-CN/docs/Web/API/Window/navigator" title="返回一个navigator对象的引用,可以用它来查询一些关于运行当前脚本的应用程序的相关信息."><code>Window.navigator</code></a> property.</p> - -<p></p><dl><dt class="landingPageList"><a href="/zh-CN/docs/Archive/B2G_OS/API/Navigator/mozHasPendingMessage">Navigator.mozHasPendingMessage()</a></dt><dd class="landingPageList">该方法用来用于判定一个给定类型(type)是否存在未决消息（待处理的消息），返回类型为是(true)或非(false)。</dd><dt class="landingPageList"><a href="/zh-CN/docs/Archive/B2G_OS/API/Navigator/mozSetMessageHandler">Navigator.mozSetMessageHandler()</a></dt><dd class="landingPageList">该方法用来允许应用为系统消息注册处理程序，对消息作出反应。</dd><dt class="landingPageList"><a href="/zh-CN/docs/Archive/B2G_OS/API/Navigator/MozTelephony">Navigator.mozTelephony</a></dt><dd class="landingPageList">返回一个你可以用来从浏览器启动和控制电话呼叫的<a href="/zh-CN/docs/Web/API/Telephony" title="此页面仍未被本地化, 期待您的翻译!"><code>Telephony</code></a>对象。</dd></dl><p></p> diff --git a/files/zh-cn/archive/b2g_os/api/navigator/mozhaspendingmessage/index.html b/files/zh-cn/archive/b2g_os/api/navigator/mozhaspendingmessage/index.html deleted file mode 100644 index ea7a00d867..0000000000 --- a/files/zh-cn/archive/b2g_os/api/navigator/mozhaspendingmessage/index.html +++ /dev/null @@ -1,117 +0,0 @@ ---- -title: Navigator.mozHasPendingMessage() -slug: Archive/B2G_OS/API/Navigator/mozHasPendingMessage -translation_of: Archive/B2G_OS/API/Navigator/mozHasPendingMessage ---- -<p></p><section class="Quick_links" id="Quick_Links"><ol><li><strong><a href="/zh-CN/docs/Web/API/Archive"><code>Archive</code></a></strong></li><li class="toggle"><details open><summary>Related pages for Firefox OS</summary><ol><li><a href="/zh-CN/docs/Web/API/MozAlarmsManager"><code>MozAlarmsManager</code></a></li><li><a href="/zh-CN/docs/Web/API/MozMobileNetworkInfo"><code>MozMobileNetworkInfo</code></a></li><li><a href="/zh-CN/docs/Web/API/MozWifiP2pGroupOwner"><code>MozWifiP2pGroupOwner</code></a></li></ol></details></li></ol></section><div class="warning"> - <p style="text-align: center;">此 API 在 <a href="/zh-CN/docs/Mozilla/Firefox_OS">Firefox OS</a> 的<a href="/zh-CN/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">网页内容或高权限的应用程序</a>上可用。</p> -</div><p></p> - -<h2 id="概要">概要</h2> - -<p>该方法用来用于判定一个给定类型(type)是否存在未决消息（待处理的消息），返回类型为是(true)或非(false)。</p> - -<p>当<a href="/zh-CN/docs/Web/API/Window/navigator/mozSetMessageHandler" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozSetMessageHandler()</code></a> 用于设定一种类型的句柄时，待处理的消息会以异步的方式的传输给应用。 </p> - -<h2 id="语法">语法</h2> - -<pre>navigator.mozHasPendingMessage(type);</pre> - -<h3 id="参数">参数</h3> - -<dl> - <dt><code>type</code></dt> - <dd>类型是字符串，用于表示一个应用注册的处理函数要处理的消息。要获得有效type的完整列表，请参考<a href="/zh-CN/docs/Web/API/Window/navigator/mozSetMessageHandler" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozSetMessageHandler()</code></a>.</dd> -</dl> - -<h2 id="返回值">返回值</h2> - -<p>布尔类型。</p> - -<h2 id="规范">规范</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">规范</th> - <th scope="col">状态</th> - <th scope="col">注解</th> - </tr> - <tr> - <td><a class="external" hreflang="en" lang="en" title="Unknown">Unknown</a></td> - <td><span class="spec-">Unknown</span></td> - <td>定义了系统消息的接口</td> - </tr> - </tbody> -</table> - -<h2 id="浏览器兼容性">浏览器兼容性</h2> - -<p></p><p class="warning"><strong><a href="https://github.com/mdn/browser-compat-data">We're converting our compatibility data into a machine-readable JSON format</a></strong>. - This compatibility table still uses the old format, - because we haven't yet converted the data it contains. - <strong><a href="/zh-CN/docs/MDN/Contribute/Structures/Compatibility_tables">Find out how you can help!</a></strong></p> - -<div class="htab"> - <a id="AutoCompatibilityTable" name="AutoCompatibilityTable"></a> - <ul> - <li class="selected"><a>Desktop</a></li> - <li><a>Mobile</a></li> - </ul> -</div><p></p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari (WebKit)</th> - </tr> - <tr> - <td>Basic support</td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Firefox OS</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td><span style="color: #f00;">未实现</span></td> - <td>1.0</td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - </tr> - </tbody> -</table> -</div> - -<h2 id="参见">参见</h2> - -<ul> - <li><a href="/zh-CN/docs/Web/API/Window/navigator/mozSetMessageHandler" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozSetMessageHandler()</code></a></li> - <li><a href="/en-US/docs/WebAPI/Web_Activities" title="/en-US/docs/WebAPI/Web_Activities">Web Activities</a></li> - <li><a class="external" href="https://groups.google.com/forum/?fromgroups=#%21topic/mozilla.dev.webapi/o8bkwx0EtmM" title="https://groups.google.com/forum/?fromgroups=#!topic/mozilla.dev.webapi/o8bkwx0EtmM">Discussion on the Mozilla WebAPI mailing list.</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/navigator/mozsetmessagehandler/index.html b/files/zh-cn/archive/b2g_os/api/navigator/mozsetmessagehandler/index.html deleted file mode 100644 index 9418c598cc..0000000000 --- a/files/zh-cn/archive/b2g_os/api/navigator/mozsetmessagehandler/index.html +++ /dev/null @@ -1,252 +0,0 @@ ---- -title: Navigator.mozSetMessageHandler() -slug: Archive/B2G_OS/API/Navigator/mozSetMessageHandler -translation_of: Archive/B2G_OS/API/Navigator/mozSetMessageHandler ---- -<p></p><section class="Quick_links" id="Quick_Links"><ol><li><strong><a href="/zh-CN/docs/Web/API/Archive"><code>Archive</code></a></strong></li><li class="toggle"><details open><summary>Related pages for Firefox OS</summary><ol><li><a href="/zh-CN/docs/Web/API/MozAlarmsManager"><code>MozAlarmsManager</code></a></li><li><a href="/zh-CN/docs/Web/API/MozMobileNetworkInfo"><code>MozMobileNetworkInfo</code></a></li><li><a href="/zh-CN/docs/Web/API/MozWifiP2pGroupOwner"><code>MozWifiP2pGroupOwner</code></a></li></ol></details></li></ol></section><div class="warning"> - <p style="text-align: center;">此 API 在 <a href="/zh-CN/docs/Mozilla/Firefox_OS">Firefox OS</a> 的<a href="/zh-CN/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">网页内容或高权限的应用程序</a>上可用。</p> -</div><p></p> - -<h2 id="概要">概要</h2> - -<p>该方法用来允许应用为系统消息注册处理程序，对消息作出反应。</p> - -<p>任何应用都允许注册到任何消息，但一些消息仅仅可以被送到有对应接收权限的应用。不同于DOM事件，如果应用没有针对系统消息的处理程序，它们将留在队列里。如果有排队消息，可以传入一个type参数调用<a href="/zh-CN/docs/Web/API/Window/navigator/mozHasPendingMessage" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozHasPendingMessage()</code></a>查看，当一个处理程序被设置，待处理消息将异步的地发送到应用。</p> - -<h2 id="语法">语法</h2> - -<pre>navigator.mozSetMessageHandler(type, handler);</pre> - -<h3 id="参数">参数<span id="cke_bm_102S" style="display: none;"> </span></h3> - -<dl> - <dt> </dt> - <dt><code><span id="cke_bm_83S" style="display: none;"> </span>type</code></dt> - <dd>type是一个字符串，表示要为其注册处理函数的一类消息。</dd> - <dt><code>handler</code></dt> - <dd>当系统发送消息时，该处理函数被调用，其接收参数由消息类型来确定。</dd> -</dl> - -<h2 id="Specification" name="Specification">消息类型</h2> - -<p>目前Firefox OS允许注册以下消息 :</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Message name</th> - <th scope="col">Handler signature</th> - <th scope="col">Permission</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>activity</code></td> - <td><code>f( <a href="/zh-CN/docs/Web/API/MozActivityRequestHandler" title="此页面仍未被本地化, 期待您的翻译!"><code>MozActivityRequestHandler</code></a> request )</code></td> - <td> </td> - </tr> - <tr> - <td><code>alarm</code></td> - <td><code>f( object unknown )</code></td> - <td>alarms</td> - </tr> - <tr> - <td><code>bluetooth-cancel</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-dialer-command</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-hfp-status-changed</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-opp-transfer-start</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-opp-transfer-complete</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-opp-receiving-file-confirmation</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-opp-update-progress</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-pairedstatuschanged</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-requestconfirmation</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-requestpincode</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>bluetooth-requestpasskey</code></td> - <td><code>f( object unknown )</code></td> - <td>bluetooth</td> - </tr> - <tr> - <td><code>headset-button</code></td> - <td><code>f( object unknown )</code></td> - <td> </td> - </tr> - <tr> - <td><code>icc-stkcommand</code></td> - <td><code>f( object command )</code></td> - <td>settings</td> - </tr> - <tr> - <td><code>notification</code></td> - <td><code>f( object unknown )</code></td> - <td> </td> - </tr> - <tr> - <td><code>push</code></td> - <td><code>f( object <a href="/en-US/docs/WebAPI/Simple_Push#Add_the_push_message_handler">registration</a> )</code></td> - <td><code>push</code></td> - </tr> - <tr> - <td><code>push-register</code></td> - <td><code>f ( )</code></td> - <td><code>push</code></td> - </tr> - <tr> - <td><code>sms-received</code></td> - <td><code>f( <a href="/zh-CN/docs/Web/API/SmsMessage" title="此页面仍未被本地化, 期待您的翻译!"><code>SmsMessage</code></a> sms )</code></td> - <td style="white-space: nowrap;">sms</td> - </tr> - <tr> - <td><code>sms-sent</code></td> - <td><code>f( <a href="/zh-CN/docs/Web/API/SmsMessage" title="此页面仍未被本地化, 期待您的翻译!"><code>SmsMessage</code></a> sms )</code></td> - <td>sms</td> - </tr> - <tr> - <td><code>telephony-call-ended</code></td> - <td><code>f( object call )</code></td> - <td>telephony</td> - </tr> - <tr> - <td><code>telephony-new-call</code></td> - <td><code>f( )</code></td> - <td>telephony</td> - </tr> - <tr> - <td><code>ussd-received</code></td> - <td><code>f( object ussd )</code></td> - <td>mobileconnection</td> - </tr> - <tr> - <td><code>wappush-received</code></td> - <td><code>f( object wappush )</code></td> - <td>wappush</td> - </tr> - </tbody> -</table> - -<h2 id="规范说明">规范说明</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td><a class="external" hreflang="en" lang="en" title="Unknown">Unknown</a></td> - <td><span class="spec-">Unknown</span></td> - <td>Defines the system messaging interfaces.</td> - </tr> - </tbody> -</table> - -<h2 id="浏览器兼容性">浏览器兼容性</h2> - -<p></p><p class="warning"><strong><a href="https://github.com/mdn/browser-compat-data">We're converting our compatibility data into a machine-readable JSON format</a></strong>. - This compatibility table still uses the old format, - because we haven't yet converted the data it contains. - <strong><a href="/zh-CN/docs/MDN/Contribute/Structures/Compatibility_tables">Find out how you can help!</a></strong></p> - -<div class="htab"> - <a id="AutoCompatibilityTable" name="AutoCompatibilityTable"></a> - <ul> - <li class="selected"><a>Desktop</a></li> - <li><a>Mobile</a></li> - </ul> -</div><p></p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari (WebKit)</th> - </tr> - <tr> - <td>Basic support</td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Firefox OS</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td><span style="color: #f00;">未实现</span></td> - <td>1.0</td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - </tr> - </tbody> -</table> -</div> - -<h2 id="参见">参见</h2> - -<ul> - <li><a href="/zh-CN/docs/Web/API/Window/navigator/mozHasPendingMessage" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozHasPendingMessage()</code></a></li> - <li><a href="/en-US/docs/WebAPI/Web_Activities" title="/en-US/docs/WebAPI/Web_Activities">Web Activities</a></li> - <li><a href="https://groups.google.com/forum/?fromgroups=#!topic/mozilla.dev.webapi/o8bkwx0EtmM" title="https://groups.google.com/forum/?fromgroups=#!topic/mozilla.dev.webapi/o8bkwx0EtmM">Discussion on the Mozilla WebAPI mailing list.</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/navigator/moztelephony/index.html b/files/zh-cn/archive/b2g_os/api/navigator/moztelephony/index.html deleted file mode 100644 index 9161c818ba..0000000000 --- a/files/zh-cn/archive/b2g_os/api/navigator/moztelephony/index.html +++ /dev/null @@ -1,85 +0,0 @@ ---- -title: Navigator.mozTelephony -slug: Archive/B2G_OS/API/Navigator/MozTelephony -translation_of: Archive/B2G_OS/API/Navigator/MozTelephony ---- -<p></p><section class="Quick_links" id="Quick_Links"><ol><li><strong><a href="/zh-CN/docs/Web/API/Archive"><code>Archive</code></a></strong></li><li class="toggle"><details open><summary>Related pages for Firefox OS</summary><ol><li><a href="/zh-CN/docs/Web/API/MozAlarmsManager"><code>MozAlarmsManager</code></a></li><li><a href="/zh-CN/docs/Web/API/MozMobileNetworkInfo"><code>MozMobileNetworkInfo</code></a></li><li><a href="/zh-CN/docs/Web/API/MozWifiP2pGroupOwner"><code>MozWifiP2pGroupOwner</code></a></li></ol></details></li></ol></section><p></p> - -<p></p><div class="overheadIndicator nonStandard nonStandardHeader"> - <p><strong><span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span> 非标准</strong><br> - 该特性是非标准的，请尽量不要在生产环境中使用它！</p> - </div><p></p> - -<p></p><div class="warning"> - <p style="text-align: center;">此 API 仅在 <a href="/zh-CN/docs/Mozilla/Firefox_OS">Firefox OS</a> 的<a href="/zh-CN/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">内部应用程序</a>中可用。</p> -</div><p></p> - -<h2 id="Summary" name="Summary">概要</h2> - -<p>返回一个你可以用来从浏览器启动和控制电话呼叫的<a href="/zh-CN/docs/Web/API/Telephony" title="此页面仍未被本地化, 期待您的翻译!"><code>Telephony</code></a>对象。</p> - -<h2 id="Syntax" name="Syntax">语法</h2> - -<pre class="eval">var <em>phone</em> = window.navigator.mozTelephony; -</pre> - -<h2 id="Value" name="Value">值</h2> - -<p><code>navigator.mozTelephony</code>是一个可以用来控制浏览器正在运行的设备上电话功能的<a href="/zh-CN/docs/Web/API/Telephony" title="此页面仍未被本地化, 期待您的翻译!"><code>Telephony</code></a>对象</p> - -<h2 id="详述">详述</h2> - -<p>这是一个非标准实现，但正在作为<a href="http://www.w3.org/2012/sysapps/" title="http://www.w3.org/2012/sysapps/">系统应用工作组</a>的一部分被W3C讨论。</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">详述</th> - <th scope="col">状态</th> - <th scope="col">内容</th> - </tr> - </thead> - <tbody> - <tr> - <td><a class="external" href="https://wiki.mozilla.org/WebAPI/WebTelephony" hreflang="en" lang="en" title="Web Telephony">Web Telephony</a></td> - <td><span class="spec-Draft">Draft</span></td> - <td>Editor Draft (WIP).</td> - </tr> - </tbody> -</table> - -<h2 id="浏览器适应性">浏览器适应性</h2> - -<p>由于诸多原因, 其主要的支持预期在手机浏览器上。</p> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>功能</th> - <th>Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>基本支持</td> - <td><span style="color: #f00;">未实现</span></td> - <td>12.0 (12.0)</td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - <td><span style="color: #f00;">未实现</span></td> - </tr> - </tbody> -</table> -</div> - -<h2 id="参见">参见</h2> - -<ul> - <li><a href="../../../../en/DOM/Using_the_Telephony_API" title="en/DOM/Using the Telephony API">Using the Telephony API</a></li> - <li><a href="/zh-CN/docs/Web/API/Telephony" title="此页面仍未被本地化, 期待您的翻译!"><code>Telephony</code></a></li> - <li><a href="/zh-CN/docs/Web/API/TelephonyCall" title="此页面仍未被本地化, 期待您的翻译!"><code>TelephonyCall</code></a></li> - <li><a href="/zh-CN/docs/Web/API/CallEvent" title="此页面仍未被本地化, 期待您的翻译!"><code>CallEvent</code></a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/permissions_api/index.html b/files/zh-cn/archive/b2g_os/api/permissions_api/index.html deleted file mode 100644 index 0459a9c438..0000000000 --- a/files/zh-cn/archive/b2g_os/api/permissions_api/index.html +++ /dev/null @@ -1,100 +0,0 @@ ---- -title: Permissions API (Firefox OS) -slug: Archive/B2G_OS/API/Permissions_API -translation_of: Archive/B2G_OS/API/Permissions_API ---- -<p></p><section class="Quick_links" id="Quick_Links"><ol><li><strong><a href="/zh-CN/docs/Web/API/Permissions_API">Permissions API</a></strong></li><li><strong><a href="/zh-CN/docs/Web/API/Archive"><code>Archive</code></a></strong></li><li class="toggle"><details open><summary>Related pages for Permissions API</summary><ol><li><a href="/zh-CN/docs/Web/API/Navigator/permissions"><code>Navigator.permissions</code></a></li><li><a href="/zh-CN/docs/Web/API/PermissionStatus"><code>PermissionStatus</code></a></li><li><a href="/zh-CN/docs/Web/API/Permissions"><code>Permissions</code></a></li></ol></details></li></ol></section><div class="overheadIndicator nonStandard nonStandardHeader"> - <p><strong><span title="This API has not been standardized."><i class="icon-warning-sign"> </i></span> 非标准</strong><br> - 该特性是非标准的，请尽量不要在生产环境中使用它！</p> - </div><p></p> - -<p></p><div class="warning"> - <p style="text-align: center;">此 API 仅在 <a href="/zh-CN/docs/Mozilla/Firefox_OS">Firefox OS</a> 的<a href="/zh-CN/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">内部应用程序</a>中可用。</p> -</div><p></p> - -<h2 id="sect1"> </h2> - -<p class="summary"><strong>Permissions API </strong>用于显示应用权限以及让用户管理所有app的使用权限。有了这个API，一个应用可以读取到另一个应用的权限，并且还可以管理其权限范围。 </p> - -<p>权限管理器可以通过<a href="/zh-CN/docs/Web/API/Navigator/mozPermissionSettings" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozPermissionSettings</code></a>属性访问，该属性是 <a href="/zh-CN/docs/Web/API/PermissionSettings" title="此页面仍未被本地化, 期待您的翻译!"><code>PermissionSettings</code></a> 的实例.</p> - -<h2 id="已安装的应用程序权限">已安装的应用程序权限</h2> - -<p><br> - 每个应用程序通过其应用清单请求一些权限。 每次应用程序尝试使用需要显式权限的API时，系统都会提示用户授予或拒绝该权限。 如果他选择不再提示，则用户无法改变主意。 使用此API，可以为用户提供一个界面来管理他为任何应用程序提供的所有权限。</p> - -<p>可以通过使用 <a href="/zh-CN/docs/Web/API/PermissionSettings/get" title="此页面仍未被本地化, 期待您的翻译!"><code>PermissionSettings.get()</code></a>, <a href="/zh-CN/docs/Web/API/PermissionSettings/set" title="此页面仍未被本地化, 期待您的翻译!"><code>set()</code></a>, 和<a href="/zh-CN/docs/Web/API/PermissionSettings/isExplicit" title="此页面仍未被本地化, 期待您的翻译!"><code>isExplicit()</code></a> 等方法。</p> - -<h3 id="读取权限">读取权限</h3> - -<p>要了解给定权限的当前状态，可以使用<a href="/zh-CN/docs/Web/API/PermissionSettings/get" title="此页面仍未被本地化, 期待您的翻译!"><code>PermissionSettings.get()</code></a> 方法. 方法返回一个字符串，给出特定应用程序权限的当前状态。 可能的值是：</p> - -<dl> - <dt><code>允许</code></dt> - <dd>该权限已被授予，不需要任何进一步的用户交互。</dd> - <dt><code>拒绝</code></dt> - <dd>无论是系统还是用户，权限都被拒绝。</dd> - <dt><code>提示</code></dt> - <dd>在需要时，将通过提示明确询问用户。</dd> - <dt><code>未知</code></dt> - <dd>应用程序没有要求此权限，甚至无法提示用户获取此权限。</dd> -</dl> - -<pre class="brush: js">// 检查所有已安装的应用 -var apps = navigator.mozApps.mgmt.getAll(); - -apps.onsuccess = function () { - var permission = navigator.mozPermissionSettings; - - // 检查每个应用的权限 - apps.result.forEach(function (app) { - var request, appName = app.manifest.name; - - for (request in app.manifest.permissions) { - // 获取应用程序的每个权限请求的当前权限 - var p = permission.get(request, app.manifestURL, app.origin, false); - - console.log(appName + ' asked for "' + request + '" permission, which is "' + p + '"') - } - }); -} -</pre> - -<h3 id="设置权限">设置权限</h3> - -<p>要设置权限，只需使用<a href="/zh-CN/docs/Web/API/PermissionSettings/set" title="此页面仍未被本地化, 期待您的翻译!"><code>PermissionSettings.set()</code></a> 方法。它的值可能与通过<a href="/zh-CN/docs/Web/API/PermissionSettings/get" title="此页面仍未被本地化, 期待您的翻译!"><code>get</code></a>方法检索的值相同。</p> - -<div class="note"> -<p><strong>注意:</strong> 根据应用程序的privileges，某些权限是隐式的。 如果由于某种原因应用程序尝试更改隐式的权限，则会引发错误。 为了避免此类错误，可以使用<a href="/zh-CN/docs/Web/API/PermissionSettings/isExplicit" title="此页面仍未被本地化, 期待您的翻译!"><code>PermissionSettings.isExplicit()</code></a> 方法.</p> -</div> - -<pre class="brush: js">// 检查所有已安装的应用 -var apps = navigator.mozApps.mgmt.getAll(); - -apps.onsuccess = function () { - var permission = navigator.mozPermissionSettings; - - // 检查每个应用的权限 - apps.result.forEach(function (app) { - var request, appName = app.manifest.name; - - for (request in app.manifest.permissions) { - // 如果权限不明确 - if (!permission.isExplicit(request, app.manifestURL, app.origin, false) { - // 询问用户应用程序请求的所有权限 - permission.set(request, 'prompt', app.manifestURL, app.origin, false); - } - } - }); -}</pre> - -<h2 id="规范">规范</h2> - -<p>暂无</p> - -<h2 id="再看看">再看看</h2> - -<ul> - <li><a href="/zh-CN/docs/Web/API/Navigator/mozPermissionSettings" title="此页面仍未被本地化, 期待您的翻译!"><code>Navigator.mozPermissionSettings</code></a></li> - <li><a href="/zh-CN/docs/Web/API/PermissionSettings" title="此页面仍未被本地化, 期待您的翻译!"><code>PermissionSettings</code></a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/settingslock/index.html b/files/zh-cn/archive/b2g_os/api/settingslock/index.html deleted file mode 100644 index 50f05a7966..0000000000 --- a/files/zh-cn/archive/b2g_os/api/settingslock/index.html +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: SettingsLock -slug: Archive/B2G_OS/API/SettingsLock -tags: - - API - - B2G - - Firefox OS - - NeedsTranslation - - Non-standard - - Settings - - TopicStub -translation_of: Archive/B2G_OS/API/SettingsLock ---- -<section class="Quick_links" id="Quick_Links"><ol><li><strong><a href="/en-US/docs/Mozilla/Firefox_OS/API/Settings_API">Settings API</a></strong></li><li><strong><a href="/en-US/docs/Mozilla/Firefox_OS/API/Archive"><code>Archive</code></a></strong></li><li data-default-state="open"><a href="#"><strong>Events</strong></a><ol><li><a href="/en-US/docs/Web/Events/settingchange"><code>settingchange</code></a></li></ol></li><li data-default-state="open"><a href="#"><strong>Related pages for Settings API</strong></a><ol><li><a href="/en-US/docs/Mozilla/Firefox_OS/API/MozSettingsEvent"><code>MozSettingsEvent</code></a></li><li><a href="/en-US/docs/Mozilla/Firefox_OS/API/SettingsLock"><code>SettingsLock</code></a></li><li><a href="/en-US/docs/Mozilla/Firefox_OS/API/SettingsManager"><code>SettingsManager</code></a></li></ol></li></ol></section> - -<div class="warning"> - <p style="text-align: center;">This API is available on <a href="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> for <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">internal applications</a> only.</p> -</div> - -<p>The <code><strong>SettingsLock</strong></code> interface represents a lock on settings. it allows a script to modify settings asynchronously, but in a safe way: ordering is guaranteed and the no other script will modify the settings until the modification are done (the next lock objects will start processing after it has been closed).</p> - -<p>Each call to <a href="/en-US/docs/Web/API/SettingsManager/createLock" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager.createLock()</code></a> create a new <code>SettingsLock</code> object.</p> - -<p>All <code>SettingsLock</code> objects are kept in a queue of active locks. When a <code>SettingsLock</code> object is created it's placed at the end of the queue. Calls to get/set places a request against the lock on which it's called. Requests run asynchronously and in the order they are placed against a lock. When the last request for a lock is run, and the success/error event against it has been fired, the lock is removed from the queue and the next lock start to be processed.</p> - -<h2 id="Properties">Properties</h2> - -<dl> - <dt><a href="/en-US/docs/Web/API/SettingsLock/closed" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsLock.closed</code></a></dt> - <dd>Indicates if the lock is no longer the active lock (<code>true</code>) or if it's still the active lock (<code>false</code>)</dd> -</dl> - -<h2 id="Methods">Methods</h2> - -<dl> - <dt><a href="/en-US/docs/Web/API/SettingsLock/set" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsLock.set()</code></a></dt> - <dd>Allows to change the values of a set of settings. This method is asychronous and return a <a href="/en-US/docs/Web/API/DOMRequest" title="The documentation about this has not yet been written; please consider contributing!"><code>DOMRequest</code></a> object.</dd> - <dt><a href="/en-US/docs/Web/API/SettingsLock/get" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsLock.get()</code></a></dt> - <dd>Allows to retrieve the value of a given setting. This method is asychronous and return a <a href="/en-US/docs/Web/API/DOMRequest" title="The documentation about this has not yet been written; please consider contributing!"><code>DOMRequest</code></a> object.</dd> - <dt><a href="/en-US/docs/Web/API/SettingsLock/clear" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsLock.clear()</code></a></dt> - <dd>Clears any action that have not been done yet (remember that <code>get</code> and <code>set</code> are asynchronous). This method is added for testing and it deletes the whole settings DB!</dd> -</dl> - -<h2 id="Specification" name="Specification">Specification</h2> - -<p>Not part of any specification yet; however, this API will be discuss at W3C as part of the <a class="external" href="http://www.w3.org/2012/sysapps/" rel="external" title="http://www.w3.org/2012/sysapps/">System Applications Working Group</a>.</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web/API/SettingsManager" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager</code></a></li> - <li><a href="/en-US/docs/Web/API/SettingsManager/createLock" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager.createLock()</code></a></li> - <li><a href="/en-US/docs/Web/API/Window/navigator/mozSettings" title="The documentation about this has not yet been written; please consider contributing!"><code>navigator.mozSettings</code></a></li> - <li><a href="/en-US/docs/WebAPI/Settings" title="/en-US/docs/WebAPI/Settings">Settings API</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/settingslock/set/index.html b/files/zh-cn/archive/b2g_os/api/settingslock/set/index.html deleted file mode 100644 index 2203fc1169..0000000000 --- a/files/zh-cn/archive/b2g_os/api/settingslock/set/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: SettingsLock.set() -slug: Archive/B2G_OS/API/SettingsLock/set -translation_of: Archive/B2G_OS/API/SettingsLock/set ---- -<section class="Quick_links" id="Quick_Links"> -<ol> - <li><strong><a href="/en-US/docs/Mozilla/Firefox_OS/API/Settings_API">Settings API</a></strong></li> - <li><strong><a href="/en-US/docs/Mozilla/Firefox_OS/API/Archive"><code>Archive</code></a></strong></li> - <li data-default-state="open"><a href="#"><strong>Events</strong></a> - <ol> - <li><a href="/en-US/docs/Web/Events/settingchange"><code>settingchange</code></a></li> - </ol> - </li> - <li data-default-state="open"><a href="#"><strong>Related pages for Settings API</strong></a> - <ol> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/API/MozSettingsEvent"><code>MozSettingsEvent</code></a></li> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/API/SettingsLock"><code>SettingsLock</code></a></li> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/API/SettingsManager"><code>SettingsManager</code></a></li> - </ol> - </li> -</ol> -</section> - - - - - -<div class="warning"> -<p style="text-align: center;">此API在 <a href="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> 上仅可供 <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">内部程序 </a> 使用.</p> -</div> - - - -<h2 id="摘要">摘要</h2> - -<p>这个方法用来更改一或多个已提供的设置的值。</p> - -<p>此方法是异步的，返回一个 <a href="/en-US/docs/Web/API/DOMRequest" title="The documentation about this has not yet been written; please consider contributing!"><code>DOMRequest</code></a> 对象，用于检测更改何时完成（或是否发生错误），并在更改完成后根据需要执行操作。</p> - -<h2 id="语法">语法</h2> - -<pre>SettingsLock.set(settings);</pre> - -<h3 id="参数">参数</h3> - -<dl> - <dt><code>settings</code></dt> - <dd>一个包含了一组键值对的对象，其中每个键表示给定的设置的字符串名称。可能的字符串的确切列表取决于设备。每个Gaia构建可以有自己的设置列表，有关这些字符串的最新列表，请查看 <a class="external" href="https://github.com/mozilla-b2g/gaia/blob/master/build/settings.py" rel="external" title="https://github.com/mozilla-b2g/gaia/blob/master/build/settings.py">the Gaia source code</a>.</dd> -</dl> - -<h2 id="示例">示例</h2> - -<p>这个示例用来打开设备的WIFI。</p> - -<pre class="brush: js">var lock = navigator.mozSettings.createLock(); -var result = lock.set({ - 'wifi.enabled': true -}); - -result.onsuccess = function () { - console.log("The setting has been changed"); -} - -result.onerror = function () { - console.log("An error occure, the setting remain unchanged"); -} -</pre> - -<h2 id="Specification" name="Specification">规范</h2> - -<p>这目前还不是任何规范的一部分; 然而, 此 API 将会作为 <a class="external" href="http://www.w3.org/2012/sysapps/" rel="external" title="http://www.w3.org/2012/sysapps/">System Applications Working Group</a> 的一部分参与W3C的讨论。</p> - -<h2 id="其他">其他</h2> - -<ul> - <li><a href="/en-US/docs/Web/API/SettingsManager" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager</code></a></li> - <li><a href="/en-US/docs/Web/API/SettingsLock" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsLock</code></a></li> - <li><a href="/en-US/docs/WebAPI/Settings" title="/en-US/docs/WebAPI/Settings">Settings API</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/settingsmanager/index.html b/files/zh-cn/archive/b2g_os/api/settingsmanager/index.html deleted file mode 100644 index 946c05f3d6..0000000000 --- a/files/zh-cn/archive/b2g_os/api/settingsmanager/index.html +++ /dev/null @@ -1,66 +0,0 @@ ---- -title: SettingsManager -slug: Archive/B2G_OS/API/SettingsManager -tags: - - API - - B2G - - Firefox OS - - Settings -translation_of: Archive/B2G_OS/API/SettingsManager ---- -<div> -<section class="Quick_links" id="Quick_Links"> -<ol> - <li><strong><a href="/en-US/docs/Mozilla/Firefox_OS/API/Settings_API">Settings API</a></strong></li> - <li><strong><a href="/en-US/docs/Mozilla/Firefox_OS/API/Archive"><code>Archive</code></a></strong></li> - <li data-default-state="open"><a href="#"><strong>Events</strong></a> - <ol> - <li><a href="/en-US/docs/Web/Events/settingchange"><code>settingchange</code></a></li> - </ol> - </li> - <li data-default-state="open"><a href="#"><strong>Related pages for Settings API</strong></a> - <ol> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/API/MozSettingsEvent"><code>MozSettingsEvent</code></a></li> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/API/SettingsLock"><code>SettingsLock</code></a></li> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/API/SettingsManager"><code>SettingsManager</code></a></li> - </ol> - </li> -</ol> -</section> - -<div class="warning"> -<p style="text-align: center;">此API在 <a href="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> 上仅适用于 <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types">内部程序 </a>。</p> -</div> -</div> - -<p>提供对设备设置的访问。</p> - -<h2 id="属性">属性</h2> - -<dl> - <dt><a href="/en-US/docs/Web/API/SettingsManager/onsettingchange" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager.onsettingchange</code></a></dt> - <dd>引用处理程序来管理设置的更改状态。</dd> -</dl> - -<h2 id="Methods" name="Methods">方法</h2> - -<dl> - <dt><a href="/en-US/docs/Web/API/SettingsManager/createLock" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager.createLock()</code></a></dt> - <dd>返回一个异步的安全访问设置的 <a href="/en-US/docs/Web/API/SettingsLock" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsLock</code></a> 对象。</dd> - <dt><a href="/en-US/docs/Web/API/SettingsManager/addObserver" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager.addObserver()</code></a></dt> - <dd>允许绑定一个函数来对给定的设置进行任意的更改。</dd> - <dt><a href="/en-US/docs/Web/API/SettingsManager/removeObserver" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsManager.removeObserver()</code></a></dt> - <dd>允许取消绑定之前使用 <code>addObserver</code> 绑定的处理程序。</dd> -</dl> - -<h2 id="Specification" name="Specification">标准</h2> - -<p>目前还没有成为任何标准的一部分，然而，此API将会作为 <a href="http://www.w3.org/2012/sysapps/" rel="external">System Applications Working Group</a> 的一部分参与W3C的讨论。</p> - -<h2 id="See_also" name="See_also">其他</h2> - -<ul> - <li><a href="/en-US/docs/Web/API/SettingsLock" title="The documentation about this has not yet been written; please consider contributing!"><code>SettingsLock</code></a></li> - <li><a href="/en-US/docs/Web/API/Window/navigator/mozSettings" title="The documentation about this has not yet been written; please consider contributing!"><code>navigator.mozSettings</code></a></li> - <li><a href="/en-US/docs/WebAPI/Settings">Settings API</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/api/tpc_socket_api/index.html b/files/zh-cn/archive/b2g_os/api/tpc_socket_api/index.html deleted file mode 100644 index b2ce9fe405..0000000000 --- a/files/zh-cn/archive/b2g_os/api/tpc_socket_api/index.html +++ /dev/null @@ -1,156 +0,0 @@ ---- -title: TCP Socket API -slug: Archive/B2G_OS/API/TPC_Socket_API -tags: - - API - - Firefox OS - - TCP套接字 - - WebAPI - - 指导 - - 非标准 -translation_of: Archive/B2G_OS/API/TPC_Socket_API ---- -<section class="Quick_links" id="Quick_Links"> -<ol> - <li><strong><a href="/en-US/docs/Web/API/TCP_Socket_API">TCP Socket API</a></strong></li> - <li data-default-state="open"><a href="#"><strong>Interfaces</strong></a> - <ol> - <li><a href="/en-US/docs/Web/API/TCPSocket"><code>TCPSocket</code></a></li> - <li><a href="/en-US/docs/Web/API/TCPServerSocket"><code>TCPServerSocket</code></a></li> - </ol> - </li> - <li data-default-state="open"><a href="#"><strong>Properties</strong></a> - <ol> - <li><a href="/en-US/docs/Web/API/Navigator/mozTCPSocket"><code>Navigator.mozTCPSocket</code></a></li> - </ol> - </li> - <li data-default-state="open"><a href="#"><strong>Events</strong></a> - <ol> - <li><a href="/en-US/docs/Web/Events/data"><code>data</code></a></li> - <li><a href="/en-US/docs/Web/Events/drain"><code>drain</code></a></li> - <li><a href="/en-US/docs/Web/Events/connect"><code>connect</code></a></li> - <li><a href="/en-US/docs/Web/Events/error"><code>error</code></a></li> - </ol> - </li> -</ol> -</section> - -<div class="overheadIndicator nonStandard nonStandardHeader"> -<p><strong>非标准</strong><br> - 这个特性不在当前的W3C标准上,但在Firefox OS平台上受支持. 尽管实现方式可能会在将来发生变化，并且不受浏览器的广泛支持, 它适合在专用于Firefox OS应用程序的代码中使用。</p> -</div> - -<div class="warning"> -<p style="text-align: center;">该API可用于 <a href="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> 上仅适用于 <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security#App_Types" title="特权或认证的应用程序">privileged or certified applications</a>.</p> -</div> - -<h2 id="摘要">摘要</h2> - -<p>TCPSocket API提供了一个完整的API，用于打开和使用TCP连接。 这使应用程序制造商可以实施TCP之上可用的任何协议，例如IMAP，IRC，POP，HTTP等，甚至可以构建自己的协议来满足他们可能拥有的任何特定需求。</p> - -<h2 id="权限">权限</h2> - -<p>为了使用该API，对于所有特权API，都需要在 <a href="/en-US/docs/Web/Apps/Manifest">app manifest</a> 中请求权限。</p> - -<pre class="brush: json notranslate">"permissions" : { - "tcp-socket" : { - "description" : "创建TCP套接字并通过它们进行通信。" - } -}</pre> - -<h2 id="总览">总览</h2> - -<p>This API is available through the <a href="/en-US/docs/Web/API/Navigator/mozTCPSocket" title="The documentation about this has not yet been written; please consider contributing!"><code>Navigator.mozTCPSocket</code></a> property which is itself a <a href="/en-US/docs/Web/API/TCPSocket" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket</code></a> object.</p> - -<h3 id="Opening_a_socket">Opening a socket</h3> - -<p>Opening a socket is done with the <a href="/en-US/docs/Web/API/TCPSocket/open" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.open()</code></a> method. This method expects up to three parameters:</p> - -<ol> - <li>A string representing the hostname of the server to connect to (it can also be its raw IP address).</li> - <li>A number representing the TCP port to be used by the socket (some protocols have a standard port, for example 80 for HTTP, 447 for SSL, 25 for SMTP, etc. Port numbers beyond 1024 are not assigned to any specific protocol and can be used for any purpose.)</li> - <li>A optional object containing up to two options: a boolean named <code>useSecureTransport</code> is the socket needed to use SSL, <code>false</code> by default; and a string named <code>binaryType</code> allows to state the type of data retrieved by the application through the <code><a href="/en-US/docs/Web/Events/data" title="/en-US/docs/Web/Events/data">data</a></code> event, with the expected values <code>string</code> or <code>arraybuffer</code>. By default, it is <code>string</code>.</li> -</ol> - -<pre class="brush: js notranslate">var socket = navigator.mozTCPSocket.open('localhost', 80);</pre> - -<div class="note"> -<p><strong>Note:</strong> Only certified apps can use a port below 1024.</p> -</div> - -<h3 id="Listening_for_connections">Listening for connections</h3> - -<p>Listening for connections is done with the <a href="/en-US/docs/Web/API/TCPSocket/listen" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.listen()</code></a> <span class="inlineIndicator standardNote standardNoteInline" title="Requires FirefoxOS 1.2"><a href="/en-US/docs/Mozilla/Firefox_OS">Requires FirefoxOS 1.2</a></span> method. This method expects up to three parameters:</p> - -<ol> - <li>A number representing the TCP port to be used to listen for connections.</li> - <li>An optional object specifying the details of the socket. This object expects a property called <code>binaryType</code>, which is a string that can have two possible values: "string" or "arraybuffer". If the value is "arraybuffer" then the <a href="/en-US/docs/Web/API/TCPSocket/send" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.send()</code></a> will use <a href="/en-US/docs/Web/API/ArrayBuffer" title="The documentation about this has not yet been written; please consider contributing!"><code>ArrayBuffer</code></a>s and the data received from the remote connection will also be available in that format.</li> - <li>A number representing the maximum length that the pending connections queue can grow.</li> -</ol> - -<pre class="brush: js notranslate">var socket = navigator.mozTCPSocket.listen(8080);</pre> - -<div class="note"> -<p><strong>Note:</strong> Only certified apps can listen on a port below 1024.</p> -</div> - -<h3 id="Sending_data">Sending data</h3> - -<p>Sending data is done using the <a href="/en-US/docs/Web/API/TCPSocket/send" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.send()</code></a> method. The data sent can be either a string or a <code><a href="/en-US/docs/JavaScript/Typed_arrays/Uint8Array" title="/en-US/docs/JavaScript/Typed_arrays/Uint8Array">Uint8Array</a></code> object; however, remember that a TCP socket always deals with binary data. For that reason, it's a lot safer to use <code><a href="/en-US/docs/JavaScript/Typed_arrays/Uint8Array" title="/en-US/docs/JavaScript/Typed_arrays/Uint8Array">Uint8Array</a></code> instead of a string when sending data.</p> - -<p>As per the TCP protocol, it's a good optimization to send a maximum of 64kb of data at the same time. As long as less than 64kb has been buffered, a call to the <a href="/en-US/docs/Web/API/TCPSocket/send" title="The documentation about this has not yet been written; please consider contributing!"><code>send</code></a> method returns <code>true</code>. Once the buffer is full, the method will return <code>false</code> which indicates the application should make a pause to flush the buffer. Each time the buffer is flushed, a <code><a href="/en-US/docs/Web/Events/drain" title="/en-US/docs/Web/Events/drain">drain</a></code> event is fired and the application can use it to resume data sending.</p> - -<p>It's possible to know exactly the current amount of data buffered with the <a href="/en-US/docs/Web/API/TCPSocket/bufferedAmount" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.bufferedAmount</code></a> property.</p> - -<pre class="brush: js notranslate">function getData() { - var data; - - // do stuff that will retrieve data - - return data; -} - -function pushData() { - var data; - - do { - data = getData(); - } while (data != null && socket.send(data)); -} - -// Each time the buffer is flushed -// we try to send data again. -socket.ondrain = pushData; - -// Start sending data. -pushData(); -</pre> - -<h3 id="Getting_data">Getting data</h3> - -<p>Each time the socket gets some data from the host, it fires a <code><a href="/en-US/docs/Web/Events/data" title="/en-US/docs/Web/Events/data">data</a></code> event. This event will give access to the data from the socket. The type of the data depends on the option set when the socket was opened (see above).</p> - -<pre class="brush: js notranslate">socket.ondata = function (event) { - if (typeof event.data === 'string') { - console.log('Get a string: ' + event.data); - } else { - console.log('Get a Uint8Array'); - } -}</pre> - -<p>As the <code><a href="/en-US/docs/Web/Events/data" title="/en-US/docs/Web/Events/data">data</a></code> event is fired as much as needed, it can sometimes be necessary to pause the flow of incoming data. To that end, calling the <a href="/en-US/docs/Web/API/TCPSocket/suspend" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.suspend()</code></a> method will pause reading incoming data and stop firing the <code><a href="/en-US/docs/Web/Events/data" title="/en-US/docs/Web/Events/data">data</a></code>. It's possible to start reading data and firing events again by calling the <a href="/en-US/docs/Web/API/TCPSocket/resume" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.resume()</code></a> method.</p> - -<h3 id="Closing_a_socket">Closing a socket</h3> - -<p>Closing a socket is simply done using <a href="/en-US/docs/Web/API/TCPSocket/close" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket.close()</code></a>.</p> - -<h2 id="Standard">Standard</h2> - -<p>Not part of any specification yet; however, this API is discussed at W3C as part of the <a class="external" href="http://www.w3.org/2012/sysapps/" rel="external" title="http://www.w3.org/2012/sysapps/">System Applications Working Group</a> under the <a href="https://www.w3.org/TR/tcp-udp-sockets/" title="http://www.w3.org/2012/sysapps/raw-sockets/">Raw Sockets</a> proposal.</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web/API/TCPSocket" title="The documentation about this has not yet been written; please consider contributing!"><code>TCPSocket</code></a></li> - <li><a href="https://github.com/soapdog/firefoxos-sample-app-telnet-client" title="Firefox OS Simple Telnet Sample App">Firefox OS Simple Telnet Sample App</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/apps/index.html b/files/zh-cn/archive/b2g_os/apps/index.html deleted file mode 100644 index 1fc5f11e62..0000000000 --- a/files/zh-cn/archive/b2g_os/apps/index.html +++ /dev/null @@ -1,51 +0,0 @@ ---- -title: 制作Firefox OS应用程序 -slug: Archive/B2G_OS/Apps -translation_of: Web/Apps/Fundamentals ---- -<p>在Firefox OS设备上运行的应用程序其实就是一个Web应用程序,这样的应用程序完全是由开放的Web技术编写的,比如JavaScript,HTML,以及CSS.我们的网站上几乎包含了你所需要的所有知识和文档,下面仅列出一些只针对Firefox OS的技术文档.</p> -<div class="row topicpage-table"> - <div class="section"> - <h2 class="Documentation" id="Documentation" name="Documentation">文档和教程</h2> - <dl> - <dt> - <a href="/zh-CN/docs/Mozilla/Firefox_OS/Apps/Writing_a_web_app_for_Firefox_OS" title="/zh-CN/docs/Mozilla/Firefox_OS/Apps/Writing_a_web_app_for_Firefox_OS">为Firefox OS编写一个应用程序</a></dt> - <dd> - 本篇教程可以让你制作出你的第一个Firefox OS应用程序.</dd> - <dt> - <a href="/zh-CN/docs/Mozilla/Firefox_OS/Apps/Tips_and_techniques" title="/zh-CN/docs/Mozilla/Firefox_OS/Apps/Tips_and_techniques">提示和技巧</a></dt> - <dd> - 我们的开发工程师为你提供的各种提示和技巧(还有问题的解决办法)!</dd> - </dl> - <p><span class="alllinks"><a href="/zh-CN/docs/tag/Apps" title="/zh-CN/docs/tag/CSS">查看更多...</a></span></p> - </div> - <div class="section"> - <h2 class="Community" id="Community" name="Community">在社区中寻求帮助</h2> - <p>如果你在开发应用程序的过程中遇到了问题,而且在文档中无法找到解决办法,那么:</p> - <ul> - <li>可以去layout论坛上提问,CSS和HTML方法的问题都可以: <ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-tech-css"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.tech.layout"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.tech.layout/feeds"> Web feed</a></li> -</ul> - <ul> - <li>在Mozilla IRC频道上提问: <a class="link-irc" href="irc://irc.mozilla.org/openwebapps">#openwebapps</a></li> - </ul> - </li> - </ul> - <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">不要忘了"提问的艺术"...</a></span></p> - <h2 class="Tools" id="Tools" name="Tools">工具</h2> - <ul> - <li><span class="external">Firefox内置<a href="/zh-CN/docs/Tools/Debugger" title="/zh-CN/docs/Tools/Debugger">调试器</a>支持远程调试Firefox OS应用程序</span></li> - <li><span class="external">其他的<a href="/zh-CN/docs/Tools" title="/zh-CN/docs/Tools">开发者工具</a></span></li> - </ul> - <p><span class="alllinks"><a href="/zh-CN/docs/tag/Tools" title="/zh-CN/docs/tag/CSS:Tools">查看更多...</a></span></p> - <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">相关话题</h2> - <ul> - <li><a href="/zh-CN/docs/Apps" title="/zh-CN/docs/Apps">Apps</a></li> - </ul> - </div> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/apps/writing_a_web_app_for_firefox_os/index.html b/files/zh-cn/archive/b2g_os/apps/writing_a_web_app_for_firefox_os/index.html deleted file mode 100644 index 87fe8d36c7..0000000000 --- a/files/zh-cn/archive/b2g_os/apps/writing_a_web_app_for_firefox_os/index.html +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: 为Firefox OS写一个web app -slug: Archive/B2G_OS/Apps/Writing_a_web_app_for_Firefox_OS -translation_of: Web/Apps/Fundamentals/Quickstart ---- -<p style="">B2G应用是一个使用HTML,CSS以及JavaScript写成的网络应用（Web Apps）。就像你发布网站一样，你把它们发布在网络上。为了让这个网站可以像一个网络应用一样被安装在你的移动设备上，你不得不给他们加一个标识 （manifest）和一个链接的安装按钮，下面会解释。</p> -<p style="">下面的主题被推荐为起点：</p> -<ul style=""> - <li style="padding: 0px; margin: 0px;"><a href="https://developer.mozilla.org/en-US/docs/Apps/Getting_Started" rel="nofollow" style="padding: 0px; margin: 0px; color: rgb(0, 114, 187); outline: 0px;">准备开始创建应用</a>（app）</li> - <li style="padding: 0px; margin: 0px;"><a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest" rel="nofollow" style="padding: 0px; margin: 0px; color: rgb(0, 114, 187); outline: 0px;">应用标识</a>（App manifest）</li> -</ul> -<p style="">当然，你也可以无拘无束的<a href="https://developer.mozilla.org/en-US/docs/Apps" rel="nofollow" style="padding: 0px; margin: 0px; color: rgb(0, 114, 187); outline: 0px;">沉浸在Open Web Apps的深处</a>!</p> -<h2 id="安装网络应用（Web_app）" style="">安装网络应用（Web app）</h2> -<p style=""> </p> -<p style="">当你把应用和标识(manifest)发布到网上，你必须要让Gecko意识到它。在安装时，Gecko会检查标识文件（manifest）并且把其中的重要记录添加到主屏幕（home screen）和其他地方。</p> -<p style="">在安装应用时，调用<a href="https://developer.mozilla.org/en-US/docs/DOM/Apps.install" rel="nofollow" style="padding: 0px; margin: 0px; color: rgb(0, 114, 187); outline: 0px;">navigator.mozApps.installAPI</a>。下面是一个安装按钮的例子，你可以把他们嵌入到你的应用中：</p> -<p style=""> </p> -<pre class="brush: html"><button id="install"> - 安装这个给力的应用在你的主屏幕上 -</button> - -<script> -(function(){ - function install(ev) { - ev.preventDefault(); - // 定义标识文件的网址（define the manifest URL） - var manifest_url = "http://my.webapp.com/manifest.webapp"; - // 安装这个应用（install the app） - var myapp = navigator.mozApps.install(manifest_url); - myapp.onsuccess = function(data) { - // 应用已经被安装，移出按钮（App is installed, remove button） - this.parentNode.removeChild(this); - }; - myapp.onerror = function() { - // 应用不能被安装（App wasn't installed, info is in） - // installapp.error.name - }; - }; - //获得按钮的信息并且在按钮被点击的时候调用install()（install() get a reference to the button and call install() on click） - var button = document.getElementById('install'); - button.addEventListener('click', install, false); -})(); -</script> -</pre> -<p style="">注意：这个安装按钮也可以被放在应用市场（app market）中，比如<a href="https://developer.mozilla.org/en-US/docs/Apps/Submitting_an_app" rel="nofollow" style="padding: 0px; margin: 0px; color: rgb(0, 114, 187); outline: 0px;">Firefox Marketplace，</a>但是你也可以在你网站的首页放一个非常方便的“安装应用”的按钮</p> -<p style="">现在使用B2G浏览器app浏览你的网站并且点选安装按钮把。</p> diff --git a/files/zh-cn/archive/b2g_os/automated_testing/gaia_performance_tests/index.html b/files/zh-cn/archive/b2g_os/automated_testing/gaia_performance_tests/index.html deleted file mode 100644 index 12c0633e43..0000000000 --- a/files/zh-cn/archive/b2g_os/automated_testing/gaia_performance_tests/index.html +++ /dev/null @@ -1,109 +0,0 @@ ---- -title: Gaia 性能测试 -slug: Archive/B2G_OS/Automated_testing/Gaia_performance_tests -translation_of: Archive/B2G_OS/Automated_testing/Gaia_performance_tests ---- -<div class="summary"> - <p><span class="seoSummary">本文主要讲述了有关在 Gaia 上运行性能测试以及如何创建新的测试。</span></p> -</div> -<h2 id="运行测试">运行测试</h2> -<p>The tests are run on a regular basis on <a href="https://datazilla.mozilla.org/b2g/" title="https://datazilla.mozilla.org/b2g/">Datazilla</a>; however, you can also run them yourself. To do so, you'll need an engineer build with <a href="/en-US/docs/Marionette" title="/en-US/docs/Marionette">Marionette</a> enabled and remote debugging <strong>disabled</strong>. See <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Build_System_Primer#Customizing_the_preferences" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Build_System_Primer#Customizing_the_preferences">Gaia Build System Primer, Customizing the preferences</a> for more information on how doing this.</p> -<h3 id="测试需求">测试需求</h3> -<p>Since <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=915156" title="FIXED: Port the performance testing framework to the new marionette runner">bug 915156</a> landed on December 6th 2013, <code>make test-perf</code> requires Node.js on the host to run the tests. The relevant modules should be installed automatically with <code>npm</code>.</p> -<p>Prior to running the test, you need to configure a runner host. The runner host is a module that will either run the test in <a href="/en-US/Firefox_OS/Using_the_B2G_desktop_client">B2G desktop</a> or on a device (real or virtual — like an <a href="/en-US/Firefox_OS/Using_the_B2G_emulators">emulator</a>). By default it runs in B2G desktop, which is not very relevant for performance. To configure the runner just edit the file <code>local.mk</code> in the Gaia top level directory (create it if it doesn't already exist) and put the following line:</p> -<pre class="brush: bash">MARIONETTE_RUNNER_HOST=marionette-device-host</pre> -<p>This will use the device host runner. The default value is <code>marionette-b2gdesktop-host</code>.</p> -<p>The alternative to this is to do:</p> -<pre class="brush: bash">MARIONETTE_RUNNER_HOST=marionette-device-host make test-perf </pre> -<div class="note"> - <p><strong>Note:</strong> only one device at a time is supported, either an emulator or real device. Make sure you have an <a href="/en-US/Firefox_OS/Platform/Gaia/Hacking">up-to-date Gaia version running on it</a>.</p> -</div> -<h3 id="输出">输出</h3> -<p>By default the test output the data in JSON format. By default it is output to <code>stdout</code> and might be mixed with error message from other commands like <code>npm</code>. This is not a very good idea for automation. So you can redirect this JSON output to a file. Just define <code>MOZPERFOUT</code> for the host runner, either on the command line as an option or in the <code>local.mk</code> file as shown above.</p> -<pre class="brush: bash">MOZPERFOUT=myfile.json</pre> -<p>There is a "spec" reporter that allow reporting the output in a more human readable format. To use it, set the environment as follow:</p> -<pre class="brush: bash">REPORTER=ConsoleMozPerf</pre> -<p>This will make the test output something easier to read. Not easier to parse. There is no real syntax.</p> -<p>For now, any other value will use the JSON reporter.</p> -<div class="note"> - <p><strong>Note:</strong> <code>MOZPERFOUT</code> will be honoured whichever reporter you select.</p> -</div> -<h3 id="对所有_app_运行测试">对所有 app 运行测试</h3> -<p>In general you can run these test on 1.4 and up from Gaia master. 1.3 might no longer be able to have the tests runs. There is an exception for 1.3t (Tarako). since <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1006064" title="FIXED: Port make test-perf to 1.3T">bug 1006064</a> landed, if you want to run the tests against Tarako (1.3t), you should run it from the Gaia 1.3t.</p> -<p>From 2.0 and onwards, we consider that you should run the test from the same Gaia tree.</p> -<pre class="brush: bash">make test-perf<span style="display: none;" id="cke_bm_264C"> </span></pre> -<h3 id="对指定的_app_运行测试">对指定的 app 运行测试</h3> -<pre class="brush: bash">APP=browser make test-perf</pre> -<h3 id="对多个_app_运行测试">对多个 app 运行测试</h3> -<pre class="brush: bash">APPS="browser communications/contacts" make test-perf</pre> -<h3 id="Setting_the_number_of_runs">Setting the number of runs</h3> -<p>By default, each test is run five times. You can change that by setting the value of <code>RUNS</code> before running the tests. For example, to run each test three times you'd use this option:</p> -<pre class="brush: bash">RUNS=3 make test-perf</pre> -<h3 id="已知问题">已知问题</h3> -<p>When running test on Buri/Hamachi (Alcatel one touch fire), you get:</p> -<pre>Not enough fields given the number of keys.</pre> -<p>You can safely ignore the warning. It is just that <code>b2g-info</code> on the device is too old as it comes from 1.2 and we only change Gecko and Gaia on these.</p> -<h2 id="Writing_new_tests">Writing new tests</h2> -<p>With the details of running the test suite out the way, let's now look at how you can write your own performance tests for Gaia.</p> -<h3 id="Startup_event_tests">Startup event tests</h3> -<p>We have setup a standard for app startup events. If you want to test the app startup, please follow the <a href="https://developer.mozilla.org/en-US/Apps/Build/Performance/Firefox_OS_app_responsiveness_guidelines">responsiveness guidelines</a>. The <code>startup_event_test.js</code> test will drive it. Make sure to whitelist your app in <code>/tests/performance/startup_events_test.js</code>, by adding it to the list specified by <code>whitelistedApps</code>. Also as a transition measure, you should add it to <code>whitelistedUnifiedApps</code> which list the apps that use that new method. Once all the apps will be migrated, then we this will disappear - if you can't find it that mean it is not needed anymore.</p> -<div class="note"> - <p><strong>Note:</strong> this is only implemented in 2.0 and later. If you code use <code>startup-path-done</code> events then it is using the old style and should be updated.</p> -</div> -<p>If you want to measure intermediate launch stages that are not part of the reponsiveness standard, you can dispatch these using the method described below. Dispatching performance events is all you need, they will be collected automatically.</p> -<h3 id="其他的_event_基础测试">其他的 event 基础测试</h3> -<p>Now if you want to test specific features in your app you can do so by sending events. The test will be in two part. The instrumentation part that lives in the app itself, and the control part that will use marionette to control the app to perform actions.</p> -<h4 id="Instrumentation">Instrumentation</h4> -<p>To record the events, all you have to do is dispatch them.</p> -<p>First, include our helper in your app:</p> -<pre class="brush: html"><script defer src='/shared/js/performance_testing_helper.js'></script> -</pre> -<div class="note"> - <p><strong>Note</strong>: If you use a module loader like RequireJS or Alameda, you might prefer to use that, which is perfectly fine.</p> -</div> -<p>You need to be cautious and make sure you adjust the <a href="/en-US/Firefox_OS/Platform/Automated_testing/Gaia_unit_tests">unit tests</a> so that the <code>PerformaceTestingHelper</code> is either loaded or shimmed. A simple shim is to put this in the unit test source file:</p> -<pre class="brush: js">var PerformanceTestingHelper = { - dispatch: function() { } -}; -</pre> -<p>The Travis CI jobs we run out of Github will error if you don't do that properly.</p> -<p>Having done that, you can use the helper to dispatch events when it seems appropriate to do so. First you should dispatch a start event. It is important as the '<code>start</code>' event is sent when we register the listeners, so for your feature you likely want to do this much later. So choose where the feature start and add the proper event dispatch.</p> -<pre class="brush: js">PerformanceTestingHelper.dispatch('my-feature-start'); -</pre> -<p>When you're ready to stop collecting data and to report the numbers, you need to send the <code>my-feature-done</code> event, also called the last event, to tell the helper to finish:</p> -<pre class="brush: js">PerformanceTestingHelper.dispatch('my-feature-done');</pre> -<p>Also you might want to send intermediate events as appropriate.</p> -<div class="note"> - <p><strong>Note:</strong> Here we use "my-feature-" as a prefix for the performance event. This is just an example. Please use an obvious name and try to use it consistently.</p> -</div> -<h4 id="Controlling_the_app">Controlling the app</h4> -<p>The second part is writing a JavaScript to the test framework to perform the test. The filename must end with <code>_test.js</code> and live in <code>apps/<myapp>/test/performance/</code>.</p> -<p>It is a lot like a marionette integration test (based on mocha), but with a few twists: in the <code>setup()</code> function you must inject the helper atom that is being used to collect the performance events.</p> -<pre class="brush: js">PerformanceHelper.injectHelperAtom(client);</pre> -<p>You must pass a <code>lastEvent</code> parameter to the <code>PerformanceHelper</code> constructor. This will be the last event on which to wait to test your feature.</p> -<p>When calling <code>performanceHelper.reportRunDurations()</code> toward the end you must pass the name of the start event you dispatched, otherwise the measurement will be from the start, ie when we inject the helper atom. An easy to figure out the error is if you see the start event in the results. And in that case you'll the the startup events as well as these will be dispatched too.</p> -<div class="note"> - <p><strong>Note:</strong> you may want to look at existing test to get a better idea.</p> -</div> -<h3 id="Collecting_memory_statistics">Collecting memory statistics</h3> -<p>You can collect the memory usage for both the b2g process and the current app. Just do</p> -<pre class="brush: js">var memUsage = performanceHelper.getMemoryUsage(app);</pre> -<p><code>app</code> is the application object. <code>memusage</code> will contain several objects enumerating the memory statistics.</p> -<h2 id="Running_tests_from_a_non-engineering_device">Running tests from a non-engineering device</h2> -<p>If you don't have an engineering build on your phone you'll have to do some additional steps:</p> -<ol> - <li>Clone B2G, and build with <code>./config.sh DEVICE-NAME</code> (e.g. <code>./config.sh keon</code>)</li> - <li>Build the Gecko part via <code>./build.sh gecko</code></li> - <li>Connect the phone and flash gecko via <code>./flash.sh gecko</code></li> - <li>Clone Gaia, and create a file <code>build/custom-prefs.js</code> with content <code>user_pref("marionette.defaultPrefs.enabled", true);</code></li> - <li>Enable <a href="/en-US/Firefox_OS/Debugging/Developer_settings#Remote_debugging">Remote Debugging</a> on the phone and run <code>make reset-gaia</code> to reset the phone (or <code>make install-gaia</code> if you trust yourself)</li> - <li>Disable Remote Debugging and verify that everything is OK by running <code>adb devices</code>. The device should show up.</li> - <li>Now running a perf test should work. Verify via <code>RUNS=1 APP=browser make test-perf</code></li> -</ol> -<h2 id="提交_bug">提交 bug</h2> -<p>Please <a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox%20OS">file bugs in Bugzilla</a>, product "Firefox OS", component "Gaia::PerformanceTest".</p> -<h2 id="参考">参考</h2> -<ul> - <li><a href="/en-US/docs/Marionette" title="/en-US/docs/Marionette">Marionette</a></li> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing">Testing Firefox OS</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/automated_testing/gaia_unit_tests/index.html b/files/zh-cn/archive/b2g_os/automated_testing/gaia_unit_tests/index.html deleted file mode 100644 index f5d1fb609c..0000000000 --- a/files/zh-cn/archive/b2g_os/automated_testing/gaia_unit_tests/index.html +++ /dev/null @@ -1,113 +0,0 @@ ---- -title: Gaia 单元测试 -slug: Archive/B2G_OS/Automated_testing/Gaia_unit_tests -tags: - - B2G - - Firefox OS - - Gaia - - Mobile - - tests - - 单元测试 - - 构建文档 - - 自动化 -translation_of: Archive/B2G_OS/Automated_testing/Gaia_unit_tests ---- -<div class="summary"> - <p>作为 Gaia/B2G 源码的一部分，我们已经创建了多个可运行的单元测试，来测试 Gaia 和 B2G 的不同方面。本文则讲述了如何来访问它们。</p> -</div> -<div class="note"> - <p><b>注意</b>: 本文假设您已经完全理解 Gaia 和 B2G 是如何工作的。可参考 <span class="link-https"><a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Gaia/Hacking">Hacking Gaia</a> 来开始学习 Gaia。</span></p> -</div> -<h2 id="运行单元测试">运行单元测试</h2> -<p>您可以在 <a href="/en-US/Firefox_OS/Using_the_B2G_desktop_client">B2G desktop</a> 或 <a href="http://nightly.mozilla.org/">Firefox Nightly</a> 上运行单元测试。您也需要最新的 <a href="https://github.com/mozilla-b2g/gaia/">Gaia 仓库</a>。为了能够执行绝大部分功能，您必须要安装 <a class="external" href="http://nodejs.org/" title="http://nodejs.org/">Node.js</a> 和 <a class="external" href="http://npmjs.org/" title="http://npmjs.org/">NPM</a>。</p> -<div class="note"> - <p><b>注意</b>: 当在安装 test-agent 依赖时，如果下面的命令会因为一种神秘的错误而失败，可能是由于您的 Node.js/NPM 版本太老了。请阅读 <a href="https://github.com/joyent/node/wiki/Installing-Node.js-via-package-manager">通过包管理器来安装 Node.js</a> 以安装最新的版本，并且将 <code>/tools/test-agent/node_modules</code> 文件夹删掉。</p> -</div> -<p>在 Gaia 仓库中有一个 bin/gaia-test 脚本文件， 可以帮助我们以简单的方式运行测试。</p> -<div class="note"> - <p><strong>小心:</strong> this script will generate a profile suited for unit tests in <code>profile-debug</code>. If you already have another profile in this directory it will be overwritten.<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=980496"> Bug 980496</a> aims to make this configurable.</p> -</div> -<h3 id="在_Firefox_中启动_test_runner">在 Firefox 中启动 test runner</h3> -<p>This will run the test server and launch your default Firefox as found in the path:</p> -<pre class="brush: bash">bin/gaia-test</pre> -<h4 id="选择_Firefox_二进制">选择 Firefox 二进制</h4> -<p>You can export the FIREFOX environment variable to your firefox binary. For example, on MacOS X:</p> -<pre class="brush: bash">export FIREFOX=/Applications/FirefoxNightly.app/Contents/MacOS/firefox</pre> -<p>Alternatively, you can pass it as argument to bin/gaia-test:</p> -<pre class="brush: bash">bin/gaia-test <gaia directory> <firefox path></pre> -<h3 id="使用_B2G_Desktop_启动_test_runner">使用 B2G Desktop 启动 test runner</h3> -<p>This will download and launch B2G Desktop:</p> -<pre class="brush: bash">bin/gaia-test -d</pre> -<h3 id="Run_the_tests_from_the_Web_Interface">Run the tests from the Web Interface</h3> -<p>You can simply click on specific tests and then the <em>Execute</em> button.</p> -<h3 id="Run_the_tests_from_the_command_line">Run the tests from the command line</h3> -<p>With the WebSocket server running, and the Test Agent app running in B2G Desktop/Firefox Nightly, run the following command:</p> -<pre>make test-agent-test -</pre> -<p>If you only want to run one app's tests you can specify which via the <code>APP</code> env variable:</p> -<pre>make test-agent-test APP=calendar -</pre> -<p>You can also optionally provide a <a class="external" href="http://visionmedia.github.com/mocha/#reporters" title="http://visionmedia.github.com/mocha/#reporters">reporter</a> to format the test output:</p> -<pre>make REPORTER=List test-agent-test -</pre> -<div class="note"> - <strong>Note:</strong> Not all reporters work, since we currently do not support Doc.</div> -<h3 id="Run_the_tests_as_you_save">Run the tests as you save</h3> -<p>When the server is running, the tests for a file are run automatically when a file is saved or even just touched:</p> -<ul> - <li>When you save a test file, the test file itself is run</li> - <li>When you save another file, it finds a matching file in the <code>test/unit</code> directory, by suffixing the file name with <code>_test.js</code>.</li> -</ul> -<div class="note"> - <p><strong>Note: </strong>It watches only existing files so if you create a new file, you have to restart the agent.</p> -</div> -<h3 id="Running_tests_like_TBPL_does">Running tests like TBPL does</h3> -<p>Gaia unit tests in TBPL are run using a separate runner; this explains how to use it. Please consult the <a href="/en-US/docs/Python/Virtualenv" title="/en-US/docs/Python/Virtualenv">virtualenv</a> docs if you're not familiar with using a Python virtualenv.</p> -<pre class="brush: bash">virtualenv venv -source venv/bin/activate -cd $GAIA/tests/python/gaia-unit-tests -python setup.py develop -cd gaia_unit_test -python main.py --binary /path/to/b2g/desktop/build --profile /path/to/gaia/profile -</pre> -<div class="note"> - <p><strong>Note</strong>: When specifying the path to the B2G desktop build, you should specify the path to <code>b2g-bin</code>, if it exists, otherwise use <code>b2g</code>.</p> -</div> -<p>The Gaia profile must be made using the following:</p> -<pre class="brush: bash">NO_LOCK_SCREEN=1 DEBUG=1 DESKTOP=0 make</pre> -<p>By default, this profile will be generated in <code>$GAIA/profile-debug</code>. <code>bin/gaia-test</code> generates the same profile so you don't need to regenerate it if you already run <code>gaia-test</code>.</p> -<h3 id="Disabling_a_gaia_unit_test_in_TBPL">Disabling a gaia unit test in TBPL</h3> -<p>TBPL uses a blacklist to exclude certain gaia unit tests from being run. To prevent a test from running in TBPL, add its path to <a href="https://github.com/mozilla-b2g/gaia/blob/master/tests/python/gaia-unit-tests/gaia_unit_test/disabled.json">https://github.com/mozilla-b2g/gaia/blob/master/tests/python/gaia-unit-tests/gaia_unit_test/disabled.json</a>.</p> -<h2 id="设置您的_Gaia_应用">设置您的 Gaia 应用</h2> -<p>Although this guide should help make things easier, the best way to learn how to write, set up, and run tests is currently still to look at the source code; in particular, take a look at the <a class="link-https" href="https://github.com/lightsofapollo/gaia/tree/master/apps/gallery/test" title="https://github.com/lightsofapollo/gaia/tree/master/apps/gallery/test">gallery tests</a>.</p> -<h2 id="Using_mocks">Using mocks</h2> -<p>TBD</p> -<h2 id="进阶_脚本在做什么？">进阶: 脚本在做什么？</h2> -<h3 id="产生一个_profile">产生一个 profile</h3> -<p>You need a profile that is generated by this command:</p> -<pre class="brush: bash">NO_LOCK_SCREEN=1 DEBUG=1 DESKTOP=0 make -</pre> -<p>This generates a debug profile in <code>gaia/profile-debug</code>, overriding a previous profile if you already have one.</p> -<ul> - <li><code>DEBUG=1</code> enables the <em>httpd.js</em> extension that makes it possible to directly use the files from the <code>apps/</code> directory.</li> - <li><code>NO_LOCK_SCREEN=1</code> disables the lock screen, which is necessary in B2G Desktop because it's not possible to unlock it using the mouse.</li> - <li><code>DESKTOP=0</code> disables the other addons we normally use in DEBUG mode to run Gaia in Firefox.</li> -</ul> -<h3 id="启动_WebSocket_服务器">启动 WebSocket 服务器</h3> -<p>Test agent (the test runner) ships with a built in WebSocket server that lets you remotely message the browser or device to queue a test run. Often you will want to develop with time saving features like a file watcher that will run your tests when a test file or implementation changes. To take advantage of these features you need to start the server:</p> -<pre class="brush: bash">make test-agent-server -</pre> -<p>Using the WebSocket server provides other tools such as a command line reporter for test results (watch the terminal you ran the command from), a Growl reporter, syntax error notifications, and more.</p> -<p>The agent also watches for modifications in files, and automatically runs the associated tests. It runs when you save the test or if you save the tested file (we use the convention where the test filename is the tested filename with <code>_test</code> appended,<code> </code>see below for more examples). It watches only existing files so if you create a new file, you have to restart the agent.</p> -<h3 id="在_Firefox_OS_Nightly_运行单元测试">在 Firefox OS Nightly 运行单元测试</h3> -<p>You can launch Gaia in Firefox Nightly with the following commands:</p> -<pre class="brush: bash">cd <path to gaia> -<path to nightly>/firefox --no-remote -profile <path to gaia>/profile-debug/ http://test-agent.gaiamobile.org:8080/</pre> -<div class="note"> - <p><strong>Note</strong>: In Mac OSX, The profile path should be absolute path</p> -</div> -<p>You can use Firebug or the integrated debugger to debug the tests; use the <code>debugger</code> keyword to break in the debugger.</p> -<h3 id="使用_B2G_Desktop_运行单元测试">使用 B2G Desktop 运行单元测试</h3> -<p>Launch Gaia and start the "Test Agent" app. From the Test gent app you can select tests to run from the UI.</p> -<h2 id="进阶_test-agent_如何工作">进阶: test-agent 如何工作?</h2> -<p>The Test Agent lives in<a href="https://github.com/mozilla-b2g/js-test-agent"> its own Github repository</a>. You can have look there to understand how it works under the hood.</p> diff --git a/files/zh-cn/archive/b2g_os/automated_testing/index.html b/files/zh-cn/archive/b2g_os/automated_testing/index.html deleted file mode 100644 index a5c2c58f11..0000000000 --- a/files/zh-cn/archive/b2g_os/automated_testing/index.html +++ /dev/null @@ -1,124 +0,0 @@ ---- -title: Firefox OS 自动化测试 -slug: Archive/B2G_OS/Automated_testing -tags: - - B2G - - QA - - 测试 - - 自动化测试 -translation_of: Archive/B2G_OS/Automated_testing ---- -<p></p> -<div class="summary"> - <p>Firefox OS 仍然处在开发中，在可预见的未来中则会对新的硬件加以支持，如何对其进行测试则显得非常重要。 该页面提供的文档主要是对 Firefox OS 多方面进行测试的信息，包括运行不同的测试，自动化，获取报告以及跟踪等。 </p> -</div> -<h2 id="入门">入门</h2> -<dl> - <dt> - <a href="/en-US/Firefox_OS/Running_Tests_on_Firefox_OS_for_Developers">Firefox OS 中运行测试： 开发者指南</a></dt> - <dd> - 这是一个运行测试时入门级的快速开发指南。如果您对 Mozilla 测试和自动化系统没有什么接触，则需要从此处开始。有经验者，则可能对如何运行及怎么运行感兴趣，可以跳过该指南，去学习下面更具体的细节知识。</dd> -</dl> -<h2 id="Gaia_测试">Gaia 测试</h2> -<p>这些文章涵盖了主要的 Gaia 测试套件。</p> -<dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/gaia-ui-tests" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/gaia-ui-tests">Gaia UI 测试</a></dt> - <dd> - 主要针对 Gaia UI 交互和特性的 Python 测试。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Gaia_integration_tests">Gaia 集成测试</a></dt> - <dd> - 基于 Marionette， 针对 Gaia 的 JavaScript 的集成测试。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Gaia_unit_tests" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests">Gaia 单元测试</a></dt> - <dd> - 无 UI 交互的 Gaia 单元测试； 使用 JavaScript 实现，并不基于Marionette。</dd> - <dt> - <a href="/en-US/Firefox_OS/Platform/Automated_testing/Gaia_performance_tests">Gaia 性能测试</a></dt> - <dd> - 基于内部仪器来测量 Gaia app 性能，是树状的测试框架。</dd> -</dl> -<h2 id="B2G_测试">B2G 测试</h2> -<p>下面的指南涵盖了多个不同的测试框架，用于测试 B2G 功能的各个方面。</p> -<dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Mochitests" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Mochitests">Mochitests</a></dt> - <dd> - Gecko 功能和API 测试；基于 HTML & JS。没有与 Gaia 交互。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Reftests" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Reftests">Reftests</a></dt> - <dd> - Gecko 渲染正确性测试。</dd> - <dt> - <a href="/en-US/docs/Marionette/Marionette_JavaScript_Tests" title="/en-US/docs/Marionette/Marionette_JavaScript_Tests">WebAPI tests</a></dt> - <dd> - Gecko 基于 JS WebAPI 测试；绝大多数需要一个模拟器。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/XPCShell" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/XPCShell">xpcshell tests</a></dt> - <dd> - Gecko XPCOM APIs 无头绪测试</dd> - <dt> - <a href="https://github.com/mozilla/b2gperf" title="https://github.com/mozilla/b2gperf">B2GPerf</a></dt> - <dd> - 基于内部仪器来测量 Gaia app 性能。</dd> - <dt> - <a href="https://wiki.mozilla.org/Project_Eideticker" title="https://github.com/mozilla/eideticker">Eideticker</a></dt> - <dd> - 提供了基于视频捕捉的 Firefox OS 性能测量。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/endurance_tests" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/endurance_tests">耐久性测试</a></dt> - <dd> - 长期运行的重复性测试，用于发现内存泄漏和稳定性问题。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/MTBF_tests">MTBF 测试</a></dt> - <dd> - 这是一个基于 non-restart gaia-ui-test 的测试框架。它会试图找到阻碍长时间运行测试的各种问题点。(当前，它由台湾团队来完成，仍然是一个开发中的测试框架)</dd> - <dt> - 内存测试 — 即将推出</dt> - <dd> - Repetitive tests run per-commit to mozilla-central, reporting to <a href="https://areweslimyet.com/" title="https://areweslimyet.com/">https://areweslimyet.com/</a>, designed to find problems with memory usage.</dd> -</dl> -<h2 id="辅助文档">辅助文档</h2> -<p>This section provides links to some of the supporting technologies that underpin Mozilla's tests, which you may want to find more information about.</p> -<dl> - <dt> - <a href="/en-US/docs/Marionette" title="/en-US/docs/Marionette">Marionette</a></dt> - <dd> - 基于 Selenium WebDriver 的远程测试驱动程序。</dd> - <dt> - <a href="/en-US/docs/Marionette/Marionette_JavaScript_Tools" title="/en-US/docs/Marionette/Marionette_JavaScript_Tools">Marionette JavaScript tests</a></dt> - <dd> - A node.js-based runner for Marionette.</dd> - <dt> - <a href="/en-US/docs/Marionette/Python_Marionette" title="/en-US/docs/Marionette/Python_Marionette">Marionette Python tests</a></dt> - <dd> - A Python runner for Marionette.</dd> -</dl> -<div class="note"> - <p><strong>Note</strong>: If you want to run Marionette against a production build (to run gaia integration tests, gaia-ui-tests, etc.), you can <a href="https://github.com/mozilla-b2g/marionette-extension">install Marionette as an extension</a> (this currently only works for 1.3 builds, but more support will be added soon.)</p> -</div> -<h2 id="持续性集成测试和结果报告">持续性集成测试和结果报告</h2> -<p>The following articles cover the continuous integration and result reporting mechanisms Mozilla uses to store and intepret test data.</p> -<dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/TBPL">TBPL</a></dt> - <dd> - Understand the tests and builds that run on TBPL.</dd> - <dt> - <a href="https://wiki.mozilla.org/QA/Execution/Web_Testing/Automation/Jenkins">Jenkins</a></dt> - <dd> - Understand the tests that are run on real devices via Jenkins.</dd> - <dt> - <a href="https://wiki.mozilla.org/B2G/Datazilla" title="https://wiki.mozilla.org/B2G/Datazilla">Datazilla</a></dt> - <dd> - Understand which performance tests are reporting to the <a href="https://datazilla.mozilla.org/b2g/" title="https://datazilla.mozilla.org/b2g/">Datazilla dashboard</a>, and what those tests measure.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Test_Execution_Chart" title="/en-US/docs/Mozilla/Firefox_OS/Testing/Test_Execution_Chart">Test execution chart</a></dt> - <dd> - A chart showing which tests are being run — on what devices and where — and which platforms are supported for each test.</dd> -</dl> -<dl> - <dt> - </dt> -</dl> diff --git a/files/zh-cn/archive/b2g_os/building/index.html b/files/zh-cn/archive/b2g_os/building/index.html deleted file mode 100644 index 838fe7c56f..0000000000 --- a/files/zh-cn/archive/b2g_os/building/index.html +++ /dev/null @@ -1,185 +0,0 @@ ---- -title: 构建B2G -slug: Archive/B2G_OS/Building -translation_of: Archive/B2G_OS/Building ---- -<div> - </div> -<div class="summary"> - <p>一旦建立B2G的构建系统与完成代码的初始化提取和配置，你就可以生成B2G系统了。</p> -</div> -<h2 id="更新代码">更新代码</h2> -<p>在生成B2G系统前，如果这不是你第一次构建B2G， 你也许想要获取最新的代码。要实现这一点，你应该使用下面两个命令更新B2G工具和依赖项：</p> -<pre>git pull -./repo sync -</pre> -<p>You can update a specific make target's repository by specifying its name:</p> -<pre>./repo sync gaia -</pre> -<p>The repo command has other options available that might be interesting; <code>repo help</code> will give you a lot of information.</p> -<h2 id="编译">编译</h2> -<div class="note"> - <p><strong>Note:</strong> Before building, you may want to set up a <code>.userconfig</code> file to customize the build. See <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file" title="/en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file">Customization with the .userconfig file</a> for details.</p> -</div> -<p>To build Boot to Gecko, simply use the <code>build.sh</code> tool:</p> -<pre>cd B2G -./build.sh -</pre> -<p>Time for another coffee break, or possibly a nap (especially if this is your first build).</p> -<h3 id="编译具体的模块">编译具体的模块</h3> -<p>If you want to build just a particular module, such as Gecko, you can specify it by name:</p> -<pre>./build.sh gecko -</pre> -<p>To get a list of the modules you can build, you can do:</p> -<pre>./build.sh modules -</pre> -<h3 id="设置所使用的处理器的核心数">设置所使用的处理器的核心数</h3> -<p>By default, the B2G build scripts use the number of cores your system has plus two as the number of parallel tasks to run. You can change this by specifying the <code>-j</code> parameter when running <code>build.sh</code>. This can be handy if you're using your system for other things while building in the background and need to reduce CPU load a bit. It's also handy when you're having build problems, as it can make reading error output from the build process easier if you have just one task going at a time!</p> -<p>For example, to build using just two parallel tasks:</p> -<pre>./build.sh -j2 -</pre> -<p>The most common use case for this, however, is to prevent builds from running in parallel at all. This makes the output of the process much easier to read, making it easier to sort out build problems. To do this:</p> -<pre>./build.sh -j1 -</pre> -<h3 id="若你的编译系统在运行测试的时候出了差错">若你的编译系统在运行测试的时候出了差错</h3> -<p>Sometimes (especially after build tool or operating system updates) you'll get weird errors like this when the build system runs its post-build tests:</p> -<pre>Generating permissions.sqlite... -test -d profile || mkdir -p profile -run-js-command permissions -WARNING: permission unknown:offline-app -WARNING: permission unknown:indexedDB-unlimited -build/permissions.js:122: NS_ERROR_UNEXPECTED: Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED) [nsIPermissionManager.add] -make[1]: *** [permissions] Error 3 -make: *** [gaia/profile.tar.gz] Error 2</pre> -<p>In this situation, try deleting the <code>gaia/xulrunner-sdk</code> directory and re-pulling the code:</p> -<pre>rm -r gaia/xulrunner-sdk -</pre> -<p>This deletes the downloaded, precompiled copy of <a href="/en-US/docs/XULRunner" title="/en-US/docs/XULRunner">XULRunner</a> that the build system retrieves automatically; on your next build, a new copy of XULRunner will be automatically retrieved.</p> -<h2 id="已知错误">已知错误</h2> -<h3 id="“构建错误！”（Build_failed!）">“构建错误！”（"Build failed!"）</h3> -<p>如果你得到一个普通的“构建错误”信息，你应该尝试重新连接你的手机到电脑上；有时手机可能会因为各种原因被卸载。</p> -<div class="note"> - <p><strong>注意不能在Mac上为Keon配置和构建B2G</strong>. 你需要使用Linux来为它构建系统。</p> -</div> -<h3 id="美洲狮（Mountain_Lion）特定错误">美洲狮（Mountain Lion）特定错误</h3> -<div> - <p>1.如果你正在OS X 10.8 “美洲狮”（Xcode 4.4.1或更新）上构建并发生了如下错误：</p> - <pre class="language-html" style="font-size: 14px;"><code class="language-html">external/qemu/android/skin/trackball.c:130:25: error: 'M_PI' undeclared (first use in this function)</code></pre> - 编辑文件: <code style="font-size: 14px;">B2G/external/qemu/Makefile.android</code> 并在第78行加上:<br> - <pre class="language-html" style="font-size: 14px;"><code class="language-html">MY_CFLAGS += -DM_PI=3.14159265358979323846264338327950288 #/* B2G_fix: not finding M_PI constant */</code></pre> -</div> -<div> - 2. If you are on Mountain Lion and you receive an error during ./build.sh like:</div> -<div> - <pre class="language-html"><code class="language-html">/System/Library/Frameworks/IOKit.framework/Headers/usb/USB.h:797:9: error: too many #pragma options align=reset</code></pre> - <p>Replace all instances of '#pragma options align=reset' with '#pragma pack()' inside /System/Library/Frameworks/IOKit.framework/Headers/usb/USB.h</p> -</div> -<h3 id="未定义符号（Undefined_symbols_）_sqlite3_androidopt_handle_pragma_和__sqlite3_androidopt_open">未定义符号（Undefined symbols ）"_sqlite3_androidopt_handle_pragma" 和 "_sqlite3_androidopt_open"</h3> -<p>这个错误会在你在OS X 10.7 及更新系统上使用 Xcode 4.5 及更新构建使出现，为解决这个问题，请在external/sqlite/dist/Android.mk文件上应用补丁<a href="https://groups.google.com/forum/#%21msg/android-building/yAfPyUqCsiQ/7zvICk4GWjYJ">https://groups.google.com/forum/#!msg/android-building/yAfPyUqCsiQ/7zvICk4GWjYJ</a>。</p> -<h3 id="KeyedVector.h19331_error_indexOfKey_was_not_declared_in_this_scope">KeyedVector.h:193:31: error: indexOfKey was not declared in this scope</h3> -<p>这个错误在你使用较新的gcc版本时出现，安装gcc/g++/g++-multilib 4.6.x版本。详见<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file" title="Mozilla/Firefox_OS/Customization_with_the_.userconfig_file">使用</a><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file" title="Mozilla/Firefox_OS/Customization_with_the_.userconfig_file">.userconfig文件自定应</a>.</p> -<div class="note"> - <p><strong>社区友情提示:</strong> 稍微的修改一下B2G的代码（gcc会告诉你如何改），使用gcc 4.7.x也是可能的，但是这并没有任何的帮助，无论是对于修改的代码还是你会遇到的bug来说。</p> -</div> -<h3 id="arm-linux-androideabi-g_Internal_error_Killed_(program_cc1plus)">arm-linux-androideabi-g++: Internal error: Killed (program cc1plus)</h3> -<p>如果你见到了这样的信息，很有可能是内存不足造成的，在执行<code>./build.sh之前</code>确保你有足够的可用内存，如果你的系统有4GB RAM应该就可以正常运行。</p> -<h3 id="...is_referenced_by_DSO_error">"...is referenced by DSO" error</h3> -<p>如果在构建模拟器时你得到了这样的信息： /usr/bin/ld: out/host/linux-x86/obj/EXECUTABLES/triangleCM_intermediates/triangleCM: hidden symbol `_XGetRequest' in out/host/linux-x86/obj/STATIC_LIBRARIES/libSDL_intermediates/libSDL.a(SDL_x11dyn.o) is referenced by DSO.</p> -<p>你可以通过各种版本的二进制包工具获得，如果你使用Debian Stable，你可以通过安装<code>binutils-gold包来使用</code><em>gold</em>连接器，注意，<code>binutils已经安装了<em>gold</em></code>连接器，但是并没有默认使用；<code>binutils-gold</code>就是来做这件事的（让它默认使用）。</p> -<h3 id="如果你在编译系统运行测试时遇到编译错误">如果你在编译系统运行测试时遇到编译错误</h3> -<p>有时，特别是编译工具或操作系统升级之后，在编译系统运行编译后测试时，你会遇到一些奇怪的错误。</p> -<pre class="language-html"><code class="language-html">Generating permissions.sqlite... -test -d profile || mkdir -p profile -run-js-command permissions -WARNING: permission unknown:offline-app -WARNING: permission unknown:indexedDB-unlimited -build/permissions.js:122: NS_ERROR_UNEXPECTED: Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED) [nsIPermissionManager.add] -make[1]: *** [permissions] Error 3 -make: *** [gaia/profile.tar.gz] Error 2</code></pre> -<p>在这种情况下，尝试删除 <code>gaia/xulrunner-sdk 目录并从重新拷贝一份代码：</code></p> -<pre class="language-html"><code class="language-html">rm -r gaia/xulrunner-sdk</code></pre> -<p>这会删除编译系统自动恢复的已下载的<a href="https://developer.mozilla.org/en-US/docs/XULRunner" title="/en-US/docs/XULRunner">XULRunner</a>的预编译副本，在你下一次编译时，系统会自动恢复一个新的副本。</p> -<h3 id="（无法获取）Cannot_fetch_platformlibcore">（无法获取）Cannot fetch platform/libcore</h3> -<p>如果你尝试为Nexus S编译B2G(<code>./config.sh nexus-s</code>)并遇到了libcore相关的错误，那是我们使用开源项目git的缘故，为了解决这个问题，像下面这样检出B2G manifest：</p> -<pre class="brush: bash language-html"><code class="language-bash">git clone https://github.com/mozilla-b2g/b2g-manifest.git</code></pre> -<p>在这个仓库中编辑文件 <code>nexus-s.xml</code>, 用一个aosp的入口引用来替换开源git的入口，像下面这个样子：</p> -<pre class="brush: xml language-xml"><code class="language-xml"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>default</span> <span class="token attr-name">revision</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>refs/tags/android-4.0.4_r1.2<span class="token punctuation">"</span></span> - <span class="token attr-name">remote</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>aosp<span class="token punctuation">"</span></span> - <span class="token attr-name">sync-j</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">"</span>4<span class="token punctuation">"</span></span> <span class="token punctuation">/></span></span></code></pre> -<p>提交这些改变并改变B2G主仓库主分支中的<code>config.sh文件，使你的检出指向你本地修改过的manifest而不是Mozilla提供的：</code></p> -<pre class="brush: bash language-html"><code class="language-bash">GITREPO=${GITREPO:-"file:///home/path/to/my/b2g-manifest"}</code></pre> -<h3 id="clang_errors_when_building_with_Xcode_5_on_Mac">clang errors when building with Xcode 5 on Mac</h3> -<p>If you are building on Mac OS X 10.8 with Xcode 5, you will likely see errors like the following:</p> -<pre class="brush: bash language-html"><code class="language-bash">clang: error: argument unused during compilation: '-include system/core/include/arch/darwin-x86/AndroidConfig.h' -clang: error: argument unused during compilation: '-U DEBUG' -clang: error: argument unused during compilation: '-U DEBUG' -clang: error: argument unused during compilation: '-MF out/host/darwin-x86/obj/EXECUTABLES/obbtool_intermediates/Main.d' -make: *** [out/host/darwin-x86/obj/EXECUTABLES/obbtool_intermediates/Main.o] Error 1</code></pre> -<p>This is because Xcode 5 changes the g++ compiler in <code>/usr/bin</code>, which breaks the build process if you try to use it to compile. In order to work around the problem, edit the following line in <code>build/core/combo/HOST_darwin-x86.mk:</code></p> -<pre class="brush: bash language-html"><code class="language-bash">HOST_CXX := g++</code></pre> -<p>to</p> -<pre class="brush: bash language-html"><code class="language-bash">HOST_CXX := g++-4.6 -ifeq (,$(wildcard /usr/local/bin/g++-4.6)) - HOST_CXX := g++ -endif</code></pre> -<p>Next, you'll want to uninstall gcc, using brew (this assumes you've run the <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites#Run_Firefox_OS_Mac_Bootstrap">Mac OS bootstrap script</a> — if not, you'll need to complete that step before continuing):</p> -<pre class="brush: bash language-html"><code class="language-bash">brew uninstall gcc-4.6</code></pre> -<p>Now reinstall gcc with multilib and c++ support:</p> -<pre class="brush: bash language-html"><code class="language-bash">brew install --enable-cxx https://gist.github.com/artlogic/6988658/raw/aeb9d1ea098274ad3f3fe2637b9df7f308a8a120/gcc-4.6.rb</code></pre> -<p>Make sure /usr/local/bin is on your PATH. You can do this temporarily by typing the following into the command prompt:</p> -<pre class="brush: bash language-html"><code class="language-bash">export PATH=/usr/local/bin:$PATH</code></pre> -<p>You can make the above change permanent by adding it to the <code>.bash_profile</code> file in your home directory.</p> -<p>After you've set your PATH, make sure you can run both of the following commands:</p> -<pre class="brush: bash language-html"><code class="language-bash">gcc-4.6 -v - -g++-4.6 -v</code></pre> -<p>If either of these commands fail, you may need to relink your gcc using brew with the following command:</p> -<pre class="brush: bash language-html"><code class="language-bash">brew link --overwrite gcc-4.6</code></pre> -<p>It's also possible that <code>/usr/bin/c++</code> is not pointing at clang++ as it should be with Xcode 5 installed. You can determine if it is by typing the following:</p> -<pre class="brush: bash language-html"><code class="language-bash">ls -l /usr/bin/c++</code></pre> -<p>It should return something that looks like this:</p> -<pre class="brush: bash language-html"><code class="language-bash">lrwxr-xr-x 1 root admin 7 Sep 19 11:40 /usr/bin/c++ -> clang++</code></pre> -<p>If c++ is pointing at something other than clang++, update it with the following commands:</p> -<pre class="brush: bash language-html"><code class="language-bash">sudo rm /usr/bin/c++ - -sudo ln -s /usr/bin/clang++ /usr/bin/c++</code></pre> -<h3 id="Cannot_pull_files_from_backup_directory">Cannot pull files from backup directory</h3> -<p>This could happen when the USB connection is broken while the script pulls data from device to computer.</p> -<p>When you run the script again, you'll probably get the following (the example is for the Peak device):</p> -<pre class="brush: bash language-html"><code class="language-bash"><code>Pulling files from ../../../backup-peak -cat: ../../../backup-peak/system/build.prop: No such file or directory -Found firmware with build ID -Pulling "libaudioeq.so" -cp: cannot stat `../../../backup-peak/system/lib/libaudioeq.so': No such file or directory -Failed to pull libaudioeq.so. Giving up. - -> Build failed! < - -Build with |./build.sh -j1| for better messages -If all else fails, use |rm -rf objdir-gecko| to clobber gecko and |rm -rf out| to clobber everything else.</code></code></pre> -<p>To solve this, it is not necessary to remove the whole objdir-gecko or out directories. Just remove the backup directory, like this (for the example above):</p> -<pre class="brush: bash language-html"><code class="language-bash"><code class="brush: bash">$rm -rf backup-peak</code></code></pre> -<h3 id="Emulator_build_issues"><strong>Emulator build issues</strong></h3> -<p>If you are making an <strong>emulator</strong> build, you need to pay attention to these issues:</p> -<div class="note"> - <p><strong>First, note that you shouldn't use the x86 emulator — it is hard to install and not well supported.</strong></p> -</div> -<p>Next, the build-system for the emulator builds both 32bit and 64bit versions of the emulator. As the emulator depends on OpenGL, this means that you need to have both 32bit and 64bit versions of OpenGL libraries installed on your system. See the discussion in <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=897727" title="https://bugzilla.mozilla.org/show_bug.cgi?id=897727">bug 897727</a>.</p> -<p>There are two ways that you can solve this problem:</p> -<h4 id="Solution_1_have_both_32bit_and_64bit_OpenGL_libs_installed_with_the_right_symlinks">Solution #1: have both 32bit and 64bit OpenGL libs installed, with the right symlinks</h4> -<p>If your linux distro has multilib packages for OpenGL libraries, you can attempt installing them. You might then have to manually create some symlinks.</p> -<p>For example, here is the situation on Ubuntu 12.04 LTS x86-64. On this distribution, the <code>libgl1-mesa-dev</code> package cannot be installed simultaneously in x86-64 and i386 versions, but you can have the following combination of packages simultaneously installed:</p> -<pre class="bz_comment_text language-html" id="comment_text_12"><code class="language-html">sudo apt-get install libgl1-mesa-dev libglapi-mesa:i386 libgl1-mesa-glx:i386</code></pre> -<p>After having run this command, you will still have to manually create some symlinks for the emulator build to succeed:</p> -<pre class="note language-html"><code class="language-html">sudo ln -s /usr/lib/i386-linux-gnu/libX11.so.6 /usr/lib/i386-linux-gnu/libX11.so -sudo ln -s /usr/lib/i386-linux-gnu/mesa/libGL.so.1 /usr/lib/i386-linux-gnu/libGL.so</code></pre> -<h4 id="Solution_2_just_patch_the_emulator_so_it_only_builds_64bit">Solution #2: just patch the emulator so it only builds 64bit</h4> -<p>Just apply <a href="https://bug897727.bugzilla.mozilla.org/attachment.cgi?id=786280" title="https://bug897727.bugzilla.mozilla.org/attachment.cgi?id=786280">this patch</a> to the sdk/ git repository under the B2G repo. This will cause the B2G emulator to only attempt to build the 64bit emulator if you're on a 64bit system, thus avoiding any multilib issues. The 32bit emulator is unused anyway on a 64bit system. This is the simplest solution, until this patch eventually bit-rots.</p> -<h2 id="下一步">下一步</h2> -<p>After building, your next step depends on whether you built Boot to Gecko for the emulator or for a real mobile device; see the following articles for details:</p> -<ul> - <li><a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_emulators" title="en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_emulators">Using the B2G emulators</a></li> - <li><a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client" title="en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client">Using the B2G desktop client</a></li> - <li><a href="/en-US/docs/Mozilla/Boot_to_Gecko/Installing_Boot_to_Gecko_on_a_mobile_device" title="en-US/docs/Mozilla/Boot_to_Gecko/Installing_Boot_to_Gecko_on_a_mobile_device">Installing Boot to Gecko on a mobile device</a></li> - <li><a href="/en-US/docs/Mozilla/Boot_to_Gecko/Pandaboard" title="en-US/docs/Mozilla/Boot_to_Gecko/Pandaboard">Installing Boot to Gecko on a pandaboard</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/b2g_os_update_packages/index.html b/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/b2g_os_update_packages/index.html deleted file mode 100644 index f1198f2f1f..0000000000 --- a/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/b2g_os_update_packages/index.html +++ /dev/null @@ -1,477 +0,0 @@ ---- -title: 创建及获取B2G OS更新包 -slug: Archive/B2G_OS/Building_and_installing_Firefox_OS/B2G_OS_update_packages -translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/B2G_OS_update_packages ---- -<div class="summary"> -<p>待我慢慢来翻译吧。20190416</p> - -<p> </p> - -<p>你若想让 B2G OS用户很容易地就能在其设备上进行系统更新，你需要给他们创建一个更新包。</p> - -<p>If you want to allow B2G OS users to easily update the version of the system code on their devices, you need to create an update package for them to use. This article goes through the different types of update package available and covers building the package, hosting the updates (and how the system polls for available updates), and applying and verifying those updates.</p> -</div> - -<p>Creating and applying an update is split into four steps:</p> - -<ol> - <li>Building incremental update packages from old version(s) to a new version on a build host.</li> - <li>Finding the right update package to download on the client.</li> - <li>Downloading the update.</li> - <li>Applying the update to existing files on the device.</li> -</ol> - -<p>Each of these steps are covered below.</p> - -<div class="note"> -<p><strong>Note</strong>: There are a number of useful tools for building and testing Firefox OS system updates, available at <a href="https://github.com/mozilla-b2g/B2G/tree/master/tools/update-tools">b2g/tools/update-tools</a>.</p> -</div> - -<h2 id="Prerequisites_2"><span class="mw-headline" id="Prerequisites">Prerequisites</span></h2> - -<p>To build and apply updates you must ensure that your build has the updater and associated update tools enabled. By default those are enabled only in <strong>userdebug</strong> and <strong>user</strong> variants. You can however force building them by adding the following line to your <a href="/en-US/Firefox_OS/Customization_with_the_.userconfig_file">.userconfig file</a>:</p> - -<pre>export B2G_UPDATER=1</pre> - -<p>To sign update packages you will need a Java runtime environment (JRE) or Java software development kit (JDK) installed and the <strong>java</strong> command available in the default path.</p> - -<h2 id="Types_of_update"><span class="mw-headline" id="Types_of_updates">Types of update</span></h2> - -<p>There are two types of updates to know about: FOTA (Firmware Over-The-Air) and Gecko/Gaia OTA (Over-The-Air). Let's look at the differences between them.</p> - -<h3 id="FOTA_updates_2"><span class="mw-headline" id="FOTA_updates">FOTA updates</span></h3> - -<p><span class="mw-headline">We can update the entire B2G OS system through <strong>FOTA updates</strong>, the technology behind which is shared with the Android project. The locations on the phone's hard drive that can be changed using FOTA updates include the system partition, kernel, modem baseband, recovery image used for updating, or any other file on the device.</span></p> - -<p>B2G OS does not depend on a particular FOTA client; the interface is abstracted through an API we call <a class="externallink" href="http://git.mozilla.org/?p=b2g/librecovery.git;a=blob;f=librecovery.h;h=a6e13374f9bffcf947a39d6f3348290d67113321;hb=HEAD" rel="nofollow" title="http://git.mozilla.org/?p=b2g/librecovery.git;a=blob;f=librecovery.h;h=a6e13374f9bffcf947a39d6f3348290d67113321;hb=HEAD">librecovery</a>. However, we recommend using the GOTA recovery client (see below for more details), and the discussion here assumes GOTA is being used.</p> - -<p>FOTA update packages mainly consist of a file called <code>update.zip</code>. This package consists of</p> - -<ul> - <li>A set of binary diffs and new files required to update the client to the newer software version</li> - <li>An "update script" that controls how the diffs and new files are loaded onto the client</li> - <li>An internal signature used to verify the update package</li> -</ul> - -<p>This format and set of files are the same as those used in normal Android updates, except that B2G OS additionally wraps the <code>update.zip</code> package in a <code>mar</code> wrapper (MAR stands for <strong>Mozilla ARchive</strong>). This <code>mar</code> wrapper allows an additional level of verification, which is explained below.</p> - -<h3 id="GeckoGaia_OTA_updates"><span class="mw-headline" id="Gecko.2FGaia_OTA_updates">Gecko/Gaia OTA updates</span></h3> - -<p><span class="mw-headline">Alteratively we can updat</span>e <em>just</em> t<span class="mw-headline">he Gecko and Gaia files on a B2G OS device, through a mechanism we call <strong>Gecko/Gaia OTA updates</strong>. All of the Gecko and Gaia files — comprising the core Gecko runtime and the device's user interface — are in the <code>/system/b2g</code> directory on the device.</span> This is the only directory that OTA updates can make changes to.</p> - -<p>Gecko/Gaia OTA updates use the same technology that's used to update the Firefox desktop web browser. Much like the FOTA <code>update.zip</code> packages discussed above, OTA updates consist of a MAR file containing a set of binary diffs and new files needed to update the client to a newer software version.</p> - -<p>The Gecko client verifies the integrity of <code>MARs</code> that it downloads, and <code>MARs</code> can be signed by multiple parties.</p> - -<h2 id="Why_have_two_update_technologies"><span class="mw-headline" id="Why_have_two_update_technologies.3F">Why have two update technologies?</span></h2> - -<p>OTA updates are not as comprehensive as FOTA updates, but they are a lot more user friendly and easy to apply, and will often be fine for what you need to update:</p> - -<ul> - <li>Gecko/Gaia OTA updates can be applied "in the background", while B2G OS continues to run normally. This provides a much better user experience because users don't need to reboot their phone and wait while an update is applied. Instead, the update is applied while the user continues to use the phone, and when the update is finished the user only needs to agree to restart the main <code>b2g</code> process. This takes a matter of seconds, instead of the minutes that are usually required to apply FOTA updates.</li> - <li>Gecko/Gaia OTA update packages can sometimes be smaller than FOTA update packages, though not always; they should never be larger. This means that users can sometimes have less data to download.</li> -</ul> - -<p>Of course, if you need to update files outside Gecko/Gaia, you will have to go for the full FOTA package route.</p> - -<p>Let's move on and examine the package building process.</p> - -<h2 id="Building_update_packages"><span class="mw-headline" id="Building_updates_for_multiple_software_versions">Building update packages</span></h2> - -<p>Building updates is the process of generating the files needed to update B2G OS clients from <em>version X</em> of the software to a newer <em>version Y</em>. The update package that's needed to update the client depends on what files have changed between <em>version X</em> and <em>version Y</em>.</p> - -<ul> - <li>If <strong>only</strong> files in <code>/system/b2g</code> have changed, we will generate a Gecko/Gaia OTA update</li> - <li>If any files in a location outside of <code>/system/b2g</code> changed, we will generate a FOTA update</li> -</ul> - -<p>To generate an incremental update package (for both FOTA and Gecko/Gaia OTA updates), our tools require full builds of both <em>version X</em> and <em>version Y</em>. <strong>Full build</strong> means that the package includes all the files that are needed to Flash a client. When we produce a full build for <em>version X</em>, we don't know which future versions we will be updating to from version<em>X</em> . Because of that, we build both full FOTA packages and Gecko/Gaia packages for each version. This allows us to generate either a Gecko/Gaia OTA incremental update, or a FOTA incremental update if needed, between <em>version X </em>and all future versions.</p> - -<p>At a high level, the process of building an update looks like this:</p> - -<ol> - <li>With software <em>version X</em> - - <ul> - <li>Generate a complete Gecko/Gaia OTA <code>MAR</code> for the contents of <code>/system/b2g</code>.</li> - <li>Generate a complete FOTA target files zip, optionally signing it, for the device partitions. The target files zip is referenced below as <code>DEVICE-target_files-$VARIANT.$USER.zip</code>, and is a zip containing the files to update the phone directories, including <code>SYSTEM/</code>, <code>BOOT/</code>, etc. A full FOTA <code>update.zip</code> can be generated from the target files zip.</li> - </ul> - </li> - <li>With software <em>version Y</em> - <ul> - <li>Generate a complete Gecko/Gaia OTA <code>MAR</code> for the contents of <code>/system/b2g</code>.</li> - <li>Generate a complete FOTA target files zip, optionally signing it, for the device partitions. The target files zip is referenced below as <code>DEVICE-target_files-$VARIANT.$USER.zip</code>, and is a zip containing the files to update the phone directories, including <code>SYSTEM/</code>, <code>BOOT/</code>, etc. A full FOTA <code style="font-style: normal;">update.zip</code> can be generated from the target files zip.</li> - </ul> - </li> - <li>If only files in <code>/system/b2g</code> have changed, generate an incremental Gecko/Gaia OTA update <code>MAR</code> from <em>version X</em> to <em>version Y</em>.</li> - <li>Otherwise, generate an incremental FOTA <code>update.zip</code> from <em>version X </em>to <em>version Y</em>. Wrap the incremental FOTA <code>update.zip</code> in a <code>MAR</code> for delivery to the B2G client.</li> - <li>Sign the packages as required by delivery agreements.</li> -</ol> - -<p>The subsections below describe how to use B2G's tools to implement each of these steps.</p> - -<div class="note"> -<p><strong>Note</strong>: the steps below assume that you have already set up a b2g build environment at the location <code>$b2g</code>. The commands below reference the <code>$b2g/build.sh</code> helper script, but <code>make</code> can also be used.</p> -</div> - -<h3 id="Generating_a_complete_GeckoGaia_OTA_update_MAR"><span class="mw-headline" id="Generating_a_complete_Gecko.2FGaia_OTA_update_MAR">Generating a complete Gecko/Gaia OTA update MAR</span></h3> - -<p>To generate a complete OTA update MAR from the last successful <code>b2g</code> build (e.g. that you <a href="/en-US/Firefox_OS/Building">built</a> yourself), you need to invoke the <code>gecko-update-full</code> target. To place the MAR at <code>$b2g/objdir-gecko/dist/b2g-update/b2g-gecko-update.mar</code>, use the following commands:</p> - -<pre class="brush: bash">$ cd $b2g -$ ./build.sh gecko-update-full -$ cp objdir-gecko/dist/b2g-update/b2g-gecko-update.mar <destination> -</pre> - -<h3 id="Generating_a_full_FOTA_update_MAR"><span class="mw-headline" id="Generating_a_complete_Gecko.2FGaia_OTA_update_MAR">Generating a full FOTA update MAR</span></h3> - -<p>To generate a full FOTA update MAR from the last successful <code>b2g</code> build (e.g. that you <a href="/en-US/Firefox_OS/Building">built</a> yourself), you need to invoke the <code>gecko-update-fota-full</code> target. This includes the contents of the entire <code>/system</code> partition. Here are the commands you need:</p> - -<pre class="brush: bash">$ cd $b2g -$ ./build.sh gecko-update-fota-full -</pre> - -<p>This will generate a ZIP file (<code>$PRODUCT_OUT/fota/full/update.zip</code>) and a MAR file (<code>$PRODUCT_OUT/fota-$TARGET_DEVICE-update-full.mar</code>). The ZIP file can be directly used with <code>adb sideload</code>, while the MAR is intended for distribution in the same manner as any other update package.</p> - -<h3 id="Generating_a_FOTA_update_MAR_plus_recovery_package">Generating a FOTA update MAR plus recovery package</h3> - -<p>As of Firefox OS 2.2 (mid April and beyond) we added a new make target, which can be invoked as follows:</p> - -<pre class="brush: bash">$ cd $b2g -$ ./build.sh gecko-update-fota-fullimg</pre> - -<p>This is used to produce a recovery package that will dump a set of partitions images. The default set is controlled by the variable <code>B2G_FOTA_FULLIMG_PARTS</code>, defined in <code>gonk-misc/Android.mk</code> (along with most of the other new features seen below.) It's a space-separated string of <code>mountpoint:image</code> instances to include. The default value is <code>"/boot:boot.img /system:system.img /recovery:recovery.img /cache:cache.img"</code>.</p> - -<p>Along with this we have also introduced some new environment variables to control the production of the two other make targets — <code>gecko-update-fota</code> and <code>gecko-update-fota-full</code>:</p> - -<ul> - <li>The first is <code>B2G_FOTA_PARTS</code>, which follows the same syntax pattern as <code>B2G_FOTA_FULLIMG_PARTS</code>. This allows us to produce these update packages but arbitrarily dump partition images along with those, e.g. boot partition, modem firmware, etc.</li> - <li><code>B2G_FOTA_PARTS_FORMAT</code> provides a way to describe a set of partitions that we want formatted during the installation of the recovery package. It's a space-separated list of mount points to make use of during the formatting.</li> - <li>We also have two new variables that allow us to wipe caches and/or data during the build procedure: - <ul> - <li><code>B2G_FOTA_WIPE_DATA</code></li> - <li><code>B2G_FOTA_WIPE_CACHE</code></li> - </ul> - </li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: All of these new features heavily rely on having a proper <code>recovery.fstab</code> file provided for the device in question.</p> -</div> - -<h3 id="Generating_a_partial_GeckoGaia_FOTA_update_MAR"><span class="mw-headline" id="Generating_a_complete_Gecko.2FGaia_OTA_update_MAR">Generating a partial Gecko/Gaia FOTA update</span> MAR</h3> - -<p>A partial FOTA update uses the same mechanism as a full FOTA update, but by default only includes Gecko/Gaia updates like a regular OTA update. Additional files outside of Gecko/Gaia (such as fonts) can also be included.</p> - -<p>The rationale for generating a partial FOTA update package is mainly related to licensing issues: when building a complete FOTA update package, the whole system partition (at least) will be included. This may include blobs that you don't have the authorization to redistribute. However, since MAR distribution is useful and Gecko/Gaia themselves are free software, there is no reason we should not be able to distribute them in this manner. A partial FOTA allows you to only update a subset of the system. An OTA update could be used instead in this scenario but it does come at a cost: OTA updates require enough space on the system partition to hold both the existing Gecko/Gaia files as well as the unpacked update files. A partial FOTA update does not suffer from this limitation as it can overwrite the existing files with the updated ones.</p> - -<p>To create a partial FOTA update from the last successful <code>b2g</code> build (e.g. that you <a href="/en-US/Firefox_OS/Building">built</a> yourself), Invoke the <code>gecko-update-fota</code> target with the following commands:</p> - -<pre class="brush: bash">$ cd $b2g -$ ./build.sh gecko-update-fota -</pre> - -<p>This will generate a ZIP file (<code>$PRODUCT_OUT/fota/partial/update.zip</code>) and a MAR file (<code>$PRODUCT_OUT/fota-$TARGET_DEVICE-update.mar</code>). The ZIP file can be directly used with <code>adb sideload</code>, while the MAR is intended for distribution in the same manner as any other update package.</p> - -<p>The construction can be controlled with a couple of environment variables, the most useful of which are documented below:</p> - -<table> - <thead> - <tr> - <th scope="col">Variable</th> - <th scope="col">Meaning</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>$B2G_FOTA_DIRS</code></td> - <td>Space-separated list of directories to include in the update. Defaults to <code>system/b2g</code>.</td> - </tr> - <tr> - <td><code>$TARGET_UPDATE_BINARY</code></td> - <td>Binary used to execute the Edify script inside the package. When none is provided, a pre-built updater binary from ICS is used.</td> - </tr> - <tr> - <td><code>$FOTA_FINGERPRINTS</code></td> - <td>Comma-separated list of Android fingerprints to check against. The use case is to be able to distribute Gecko/Gaia update packages on top of a controlled Gonk base system that we cannot legally distribute. For example, Open C community builds are using this.</td> - </tr> - </tbody> -</table> - -<div class="note"> -<p><strong>Note</strong>: A complete set of these variables is defined in the <a href="https://github.com/mozilla-b2g/gonk-misc/blob/master/Android.mk">Android.mk file of the gonk-misc repository</a>; note that <code>$FOTA_FINGERPRINTS</code> is used in our <a href="https://github.com/mozilla-b2g/B2G/blob/d75c2351fb32216c78a1f6c50835796af8756068/tools/update-tools/update_tools.py#L837">update_tools.py</a> tool.</p> -</div> - -<h3 id="Generating_a_complete_FOTA_target_files_zip"><span class="mw-headline" id="Generating_a_complete_FOTA_update_zip_and_target_files_zip">Generating a complete FOTA target files zip</span></h3> - -<p>Invoke the <code>target-files-package</code> target to build a target files zip that can be used to generate both incremental and full FOTA update packages. The target files zip can also be signed by custom keys to ensure that only FOTA updates from known sources can be installed. After signing target files, all images and updates (also OTA) need to be generated again to catch the inserted keys.</p> - -<div class="note"> -<p><strong>Note</strong>: The target files zip is generated in the location <code>out/target/product/$DEVICE/obj/PACKAGING/target_files_intermediates/$DEVICE-target_files-$VARIANT.$USER.zip</code></p> -</div> - -<p>The following commands will carry out this step:</p> - -<pre class="brush: bash">$ cd $b2g -$ ./build.sh target-files-package -$ cp out/target/product/$DEVICE/obj/PACKAGING/target_files_intermediates/$DEVICE-target_files-$VARIANT.$USER.zip <destination> -</pre> - -<p>The variable values in the commands listed above should be filled in as follows:</p> - -<table> - <thead> - <tr> - <th scope="col">Variable</th> - <th scope="col">Meaning</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>$DEVICE</code></td> - <td>Device name for the AOSP product</td> - </tr> - <tr> - <td><code>$VARIANT</code></td> - <td><code>eng</code>, <code>user</code>, or <code>userdebug</code></td> - </tr> - <tr> - <td><code>$USER</code></td> - <td>The build username</td> - </tr> - </tbody> -</table> - -<h3 id="Signing_a_complete_FOTA_target_files_zip"><a name="signing-target-files-package"></a>Signing a complete FOTA target files zip</h3> - -<p>Proper releases should typically be signed by custom release keys only known to the vendor. Having such keys will prevent FOTA updates where the source is unknown from being installed, hence introducing an extra security layer. For this to work, the images flashed to a device need to include public keys while the updates need to be signed by the corresponding private key. </p> - -<p>The first step is to generate custom keys and store them in a safe place. The Android Open Source Project has a script for generating these keys. For full compatibility, get this script from the branch corresponding to the Gonk version of the device in question. <a href="https://android.googlesource.com/platform/development/+/master/tools/make_key">Here is the master branch version</a>.</p> - -<p>A couple of keys are needed — create them with the following commands. <code>releasekey</code> is the key to use for signing FOTA update packages.</p> - -<pre class="brush: bash">$ development/tools/make_key releasekey '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com' -$ development/tools/make_key platform '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com' -$ development/tools/make_key shared '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com' -$ development/tools/make_key media '/C=US/ST=California/L=Mountain View/O=Android/OU=Android/CN=Android/emailAddress=android@android.com' -</pre> - -<p>With keys present, the target files zip can be signed using the following commands. This will insert the public keys and modify build properties to reflect the fact that it has been signed.</p> - -<pre class="brush: bash">$ cd $b2g -$ ./build/tools/releasetools/sign_target_files_apks \ -<span style="font-size: 1rem;"> --default_key_mappings $RELEASEKEY_FOLDER \</span> -<span style="font-size: 1rem;"> --replace_ota_keys \</span> -<span style="font-size: 1rem;"> --signapk_path prebuilts/sdk/tools/lib/signapk.jar \</span> -<span style="font-size: 1rem;"> $UNSIGNED_TARGET_FILES_ZIP \</span> -<span style="font-size: 1rem;"> $SIGNED_TARGET_FILES_ZIP</span></pre> - -<p><span style="font-size: 1rem;">The variable values in the commands listed above should be filled in as follows:</span></p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Variable</th> - <th scope="col">Meaning</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>$RELEASEKEY_FOLDER</code></td> - <td>The path to the folder containing the custom keys</td> - </tr> - <tr> - <td><code>$UNSIGNED_TARGET_FILES_ZIP</code></td> - <td>The FOTA target files zip to sign.</td> - </tr> - <tr> - <td><code>$SIGNED_TARGET_FILES_ZIP</code></td> - <td>The signed FOTA target files zip to be generated</td> - </tr> - </tbody> -</table> - -<h3 id="Generating_an_incremental_OTA_update_MAR_2"><span class="mw-headline" id="Generating_an_incremental_OTA_update_MAR">Generating an incremental OTA update MAR</span></h3> - -<p>In this example, we're assuming that we're generating an update from software <em>version X</em> to <em>version Y</em>. The location of the full Gecko/Gaia OTA <code>MAR</code> built from software <em>version X</em> using the instructions above will be called <code>$MAR_X</code> below. This might be a path on a build server like <code>/home/build/b2g/versions/X/update.mar</code>. Similarly, the location of the full <code>MAR</code> built from <em>version Y</em> will be called <code>$MAR_Y</code>.</p> - -<p>The tool <code>build-gecko-mar.py</code> will generate an incremental Gecko/Gaia OTA update MAR using <code>$MAR_X</code> and <code>$MAR_Y</code>. We'll call the destination of the generated file <code>$GENERATED_INCREMENTAL_MAR_X_Y</code>. Use the following commands for this step:</p> - -<pre class="brush: bash">$ cd $b2g -$ ./tools/update-tools/build-gecko-mar.py --from $MAR_X --to $MAR_Y $GENERATED_INCREMENTAL_MAR_X_Y -</pre> - -<h3 id="Generating_an_incremental_FOTA_update_zip_2"><span class="mw-headline" id="Generating_an_incremental_FOTA_update_zip">Generating an incremental FOTA update zip</span></h3> - -<p>In this example, we're assuming that we're generating an update from software <em>version X</em> to <em>version Y</em>. The location of the full FOTA target zip built from software <em>version X </em>using the instructions above will be called <code>$TARGET_FILES_X</code> below. This might be a path on a build server like <code>/home/build/b2g/versions/X/target_files.zip</code>. Similarly, the location of the full FOTA target zip built from <em>version Y </em>will be called <code>$TARGET_FILES_Y</code>.</p> - -<p>The tool <code>build/tools/releasetools/ota_from_target_files</code> will generate an incremental FOTA update.zip using <code>$TARGET_FILES_X</code> and <code>$TARGET_FILES_Y</code>. We'll call the destination of this intermediate file <code>$INTERMEDIATE_FOTA_UPDATE_FOTA_X_Y</code>.</p> - -<p>After this <code>update.zip</code> is generated, the last step is to wrap it in a <code>MAR</code> for delivery to the B2G client. The tool <code>tools/update-tools/build-fota-mar.p</code> does this step. We'll call the destination of this generated file <code>$GENERATED_INCREMENTAL_FOTA_X_Y</code>.</p> - -<p>Use the following commands to complete this step:</p> - -<pre class="brush: bash">$ cd $b2g -$ ./build/tools/releasetools/ota_from_target_files -v \ - --incremental_from $TARGET_FILES_X \ - --signapk_path prebuilts/sdk/tools/lib/signapk.jar \ - --package_key $FOTA_SIGNING_KEY \ - $TARGET_FILES_Y \ - $INTERMEDIATE_FOTA_UPDATE_FOTA_X_Y -$ ./tools/update-tools/build-fota-mar.py $INTERMEDIATE_FOTA_UPDATE_FOTA_X_Y --output=$GENERATED_INCREMENTAL_FOTA_X_Y -</pre> - -<p>The variable values in the commands listed above should be filled in as follows:</p> - -<table> - <thead> - <tr> - <th scope="col">Variable</th> - <th scope="col">Meaning</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>$TARGET_FILES_X</code></td> - <td>The FOTA target files zip for <em>version X</em></td> - </tr> - <tr> - <td><code>$TARGET_FILES_Y</code></td> - <td>The FOTA target files zip for <em>version Y</em></td> - </tr> - <tr> - <td><code>$INTERMEDIATE_FOTA_UPDATE_FOTA_X_Y</code></td> - <td>A temporary update.zip to generate a <span style="font-family: courier new,andale mono,monospace;">MAR</span> from</td> - </tr> - <tr> - <td><code>$GENERATED_INCREMENTAL_FOTA_X_Y</code></td> - <td>The destination incremental update zip wrapped in a <code>MAR</code> for delivery to clients</td> - </tr> - <tr> - <td><code>$FOTA_SIGNING_KEY</code></td> - <td>Path to the prefix for a private key and public cert for signing the update zip. <code>$FOTA_SIGNING_ZIP.pk8</code> and <code>$FOTA_SIGNING_ZIP.x509.pem</code> should both exist on the file system. If <code>$TARGET_FILES_X</code> is not signed this option can be omitted; the default testkey will still be picked up. In case <code>$TARGET_FILES_X</code> is a custom release key, refer to the <a href="#signing-target-files-package">target files zip signing section</a> on how to create it, and don't forget to sign <code>$TARGET_FILES_Y</code>.</td> - </tr> - </tbody> -</table> - -<h2 id="Hosting_updates_and_polling_for_updates_on_the_client_side"><span class="mw-headline" id="Hosting_updates_.28respectively.2C_polling_for_updates_on_the_client_side.29">Hosting updates and polling for updates on the client side</span></h2> - -<p>B2G OS clients poll for updates by fetching and parsing an <strong>update manifest</strong>: <code>update.xml</code>. B2G OS clients are configured to poll for updates on specific servers — they query a specially-constructed path on the server. HTTPS is the recommended protocol that the client uses to query the server, however HTTP is also supported. The server and path polled by clients can be changed by shipping an update to existing clients that changes the polling code.</p> - -<p>In the examples below, we'll assume that updates are hosted on the server <code>updates.b2g.com</code>.</p> - -<p>The URL polled by the client commonly contains the following parameters:</p> - -<table> - <thead> - <tr> - <th scope="col">Parameter</th> - <th scope="col">Explanation</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>PRODUCT_MODEL</code></td> - <td>The name of the device model. This is the <code>ro.product.model</code> value in the B2G property database.</td> - </tr> - <tr> - <td><code>CHANNEL</code></td> - <td>The update "channel". This is useful for testing: servers can be configured to host, for example, "nightly", "beta", and "release" channels.</td> - </tr> - <tr> - <td><code>VERSION</code></td> - <td>The client's software version. For example, "18.0.2".</td> - </tr> - <tr> - <td><code>BUILD_ID</code></td> - <td>A unique ID such as a timestamp, configured for a particular build.</td> - </tr> - </tbody> -</table> - -<p>The Firefox client uses the value of its configured update host and these values to construct a URL to poll at runtime. The structure is as follows:</p> - -<pre>https://aus4.mozilla.org/update/3/%PRODUCT%/%VERSION%/%BUILD_ID%/%PRODUCT_DEVICE%/%LOCALE%/%CHANNEL%/%OS_VERSION%/%DISTRIBUTION%/%DISTRIBUTION_VERSION%/update.xml</pre> - -<p>A real example of such a URL is as follows:</p> - -<pre class="brush: xml">https://aus4.mozilla.org/update/3/B2G/37.0a1/20141214040212/flame/en-US/nightly-b2g37/Boot2Gecko%202.2.0.0-prerelease%20%28SDK%2019%29/default/default/update.xml?force=1</pre> - -<p>If the server returns a "404 Not Found" in response to the client's request, then there is no update available. If the server returns a "200" and a manifest file, then there may be an update available. The manifest describes the newly available build; that is, the build the <strong>client would update to</strong>. An example manifest is:</p> - -<pre class="brush: xml"><?xml version="1.0"?> -<updates> - <update type="major" appVersion="19.0" version="19.0" extensionVersion="19.0" buildID="20121210123456" - licenseURL="http://www.mozilla.com/test/sample-eula.html" - detailsURL="http://www.mozilla.com/test/sample-details.html" - isOSUpdate="true"> - <patch type="partial" URL="https://updates.b2g.com/release/unagi1/18.0/20121203123456/update.mar" - hashFunction="SHA512" hashValue="5111e033875752b7d9b32b4795152dea5ef954cb8a9d4a602dd19a923b464c43521287dcb5781faf3af76e6dc5e8a3dd9c13edea18c1f2c8f3bd89e17d103d6f" - size="41901319"/> - </update> -</updates> -</pre> - -<p>This follows the same schema as the B2G build manifest (see <a href="https://wiki.mozilla.org/Software_Update:updates.xml_Format">updates.xml Format</a> for more details). The fields in the manifest describe:</p> - -<ul> - <li>Metadata used to show a user interface on the client.</li> - <li>Metadata about the newly-available version.</li> - <li>The location of the update package.</li> - <li>Metadata used to verify the download of the update package.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: There is a useful update script available at <a href="https://github.com/mozilla-b2g/B2G/blob/master/tools/update-tools/build-update-xml.py">build-update-xml.py</a>, which given a MAR file, builds a B2G OS update.xml for testing.</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: The client device or the user may wish to decline an update.</p> -</div> - -<div class="note"> -<p><strong>Note:</strong> <code>isOSUpdate="true"</code> is needed for FOTA updates but not for OTA updates.</p> -</div> - -<p>Using the mechanisms described above, servers can host update packages to update any old client version to the newest version. Or they may host only a "linear update history" in which clients must upgrade through a single path.</p> - -<p>The details of the interaction between build servers and the update host is currently beyond the scope of this document. It is highly dependent on the production environment. You can find some more details on our <a href="https://wiki.mozilla.org/Software_Update">Software Update</a> wiki page.</p> - -<h2 id="Verifying_and_applying_updates_2"><span class="mw-headline" id="Verifying_and_applying_updates">Verifying and applying updates</span></h2> - -<p>After a B2G OS client has successfully polled for an update (<a href="https://support.mozilla.org/en-US/kb/how-do-i-check-firefox-os-updates-and-install-them">handled from within the system</a>), downloaded it, and verified the integrity of the downloaded update package, the final step is to apply the update.</p> - -<p>The first step in applying an update is to verify the signatures embedded in the <code>MAR</code> packages (see <a href="#Generating_an_incremental_FOTA_update_zip">Generating an incremental FOTA update zip</a> for how these are created). This is done by the B2G OS client itself after checking the integrity of the downloaded package. The code used for this is the same for both FOTA and Gecko/Gaia OTA updates.</p> - -<div class="note"> -<p><strong>Note</strong>: It is not the MAR file that gets signed: it's the FOTA zip file that gets bundled into the MAR that's signed by <code>build/tools/releasetools/ota_from_target_file</code>. The signing of the FOTA update works the same as it does on Android; if you just run the script without specifying the key, it will use the developer key at <code>build/target/product/security/testkeys.*</code>. This is ok for testing but when you create a real update you need a secure key — i.e. one that no-one else knows about. The device will also verify that signature before applying the patch, so a device's initial images will need to contain the key as well.</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: The keys referred to above are found in the Android build systems; we've forked it in our <a href="https://github.com/mozilla-b2g/platform_build">platform_build repo</a>.</p> -</div> - -<p>After signatures are verified, the process of applying an update diverges between Gecko/Gaia OTA updates and FOTA updates. Let's look at the differences between the two at this point.</p> - -<h3 id="Applying_GeckoGaia_OTA_updates"><span class="mw-headline" id="Applying_Gecko.2FGaia_OTA_updates">Applying Gecko/Gaia OTA updates</span></h3> - -<p>The B2G OS client applies these using the <code>updater</code> binary. This is part of the Gecko distribution and is the same code used to apply updates to desktop Firefox. As described above, the update is applied while the B2G OS client continues to run normally. Users are able to make and receive calls, run apps, browse the web, etc. while updates are being applied.</p> - -<p>The specific details of the <code>updater</code> binary are beyond the scope of this document, but it works approximately like so:</p> - -<ul> - <li>It makes a copy of the <code>/system/b2g</code> files.</li> - <li>It applies binary patches, removes old files, and adds new ones as specified by the <code>MAR</code> file.</li> - <li>It restarts the main <code>b2g</code> process so that it uses all the new files.</li> -</ul> - -<p>After the <code>b2g</code> process finishes restarting, the user will be running the new version of the B2G client software.</p> - -<h3 id="Applying_FOTA_updates_2"><span class="mw-headline" id="Applying_FOTA_updates">Applying FOTA updates</span></h3> - -<p>The FOTA client applies these. The Gecko client "hands off" the update to be applied by calling into the <a class="externallink" href="http://git.mozilla.org/?p=b2g/librecovery.git;a=blob;f=librecovery.h;h=a6e13374f9bffcf947a39d6f3348290d67113321;hb=HEAD" rel="nofollow" title="http://git.mozilla.org/?p=b2g/librecovery.git;a=blob;f=librecovery.h;h=a6e13374f9bffcf947a39d6f3348290d67113321;hb=HEAD">librecovery</a> API. What happens after this step is specific to each FOTA client.</p> - -<p>In the implementation of librecovery used for the GOTA client, the downloaded update package is staged to be applied and special commands are enqueued for the recovery client. librecovery then reboots the device into recovery mode. The recovery client then runs the update script in the <code>update.zip</code> to update files and partitions as needed. The recovery client may need to reboot multiple times in order to update all files.</p> - -<p>After the final reboot, the device will be running the new version of the B2G OS client software.</p> diff --git a/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/firefox_os_build_overview/index.html b/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/firefox_os_build_overview/index.html deleted file mode 100644 index 7e27a80e43..0000000000 --- a/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/firefox_os_build_overview/index.html +++ /dev/null @@ -1,105 +0,0 @@ ---- -title: Firefox OS 的编译综述 -slug: Archive/B2G_OS/Building_and_installing_Firefox_OS/Firefox_OS_build_overview -translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS/B2G_OS_build_process_summary ---- -<div class="summary"> - <p>构建和安装Firefox OS火狐操作系统需要消耗大量的时间，网络带宽，和计算机硬件配置。不幸的是，编译过程中很容易发生错误。本文档大致描述了构建过程及步骤来帮助用户们了解概况。每个步骤的详细信息会在相应的链接页面中给出。</p> -</div> -<div class="note"> - <p><span style="font-weight: bold;">注意：</span> 在Firefox OS火狐操作系统的构建过程中会多次引用到“B2G”或“Boot2Gecko”这个词。 “Boot2Gecko”是Firefox OS项目的始称。</p> -</div> -<h2 id="构建的目标：四个“映像”文件">构建的目标：四个“映像”文件</h2> -<p>构建过程的总体目的是构建四个可以复制到Firefox OS设备的文件。</p> -<table style="width: 90%; vertical-align: top; margin: 4px auto;"> - <tbody> - <tr> - <td><b>boot.img</b></td> - <td>（启动映像）包含Linux内核和一个主文件系统映像，后者提供一套精简可用的Unix工具。</td> - </tr> - <tr> - <td><b>system.img</b></td> - <td>（系统映像）包含Firefox OS火狐操作系统的核心，包括了Gonk的一部分，Gecko的接口以及B2G的可执行文件。</td> - </tr> - <tr> - <td><b>userdata.img</b></td> - <td>（用户数据映像）包含Gecko的概要界面和设备上的Gaia风格的web应用程序。</td> - </tr> - <tr> - <td><b>recovery.img</b></td> - <td>（还原映像）包含一个Linux内核和一个主文件系统映像，后者附带一个<span style="line-height: 1.5;">能够让用户修复</span><span style="line-height: 1.5;">错误安装的简单工具。</span></td> - </tr> - </tbody> -</table> - -<p>一旦创建了这四个映像文件，就可以将它们转移到设备里了。</p> -<p>Firefox OS 火狐操作系统是建立在Android开源项目（AOSP）的基础之上的。AOSP 的工具—— <code>adb</code> 和 <code>fastboot</code> （快速启动工具）提供了强大的方式来访问和操作设备。很显然，比如，命令行指令 <code>adb reboot-bootloadr</code> 能够使得被控设备重启并停留在bootloader（引导程序）<span style="line-height: 1.5;">的前期，此时再通过命令行指令 </span><code style="font-size: 14px;">fastboot flash $partition $image 可以把映像文件复制到设备</code><span style="line-height: 1.5;">中。</span></p> -<h3 id="启动映像">启动映像</h3> -<p>启动映像（<code>boot.img</code>）是由 Linux 内核和一个包含了核心软件和初始化脚本的根分区组成。后者将被复制到设备内存中以便设备的调用，因此被称为“虚拟内存盘”（或者是<a href="http://zh.wikipedia.org/zh-cn/RAM_disk">RAM盘</a>，译者注）。<span style="line-height: 1.5;">启动映像将被复</span><span style="line-height: 1.5;">制到</span><span style="line-height: 1.5;">设备的“boot”分区，而</span><span style="line-height: 1.5;">在</span><span style="line-height: 1.5;">设备的文件系统运行时，可以通过工具在根目录下访问</span><span style="line-height: 1.5;">RAM盘的内容</span><span style="line-height: 1.5;">，比如使用 </span><code style="font-size: 14px;">adb shell访问</code><span style="line-height: 1.5;">。</span></p> -<p>启动映像还将在根目录的 <code>default.prop </code>文件中建立超级用户（root user）的权限。</p> -<p>启动映像是可以进行修改的——通过检查该文件，再把文件拆分为内核部分和虚拟内存盘映像，提取、修改原先的虚拟内存盘映像中的内容并重新组合为一个能运行的 boot.img 文件。看看这个例子： <a href="http://k.japko.eu/alcatel-otf-hackers-guide-1.html">Alcatel One Touch Fire Hacking (Mini) Guide</a> （无中文）。</p> -<p>在被刷入设备之前，可以通过“旁加载”的方法来测试启动映像；启动设备，并停留在<span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">bootloadr</span>引导加载程序阶段，然后使用<span style="line-height: 1.5;">命令</span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">fastboot boot /some/path/to/boot.img</span><span style="line-height: 1.5;">从启动映像中加载启动并进行测试，这样就不需要</span><span style="line-height: 1.5;">安装这个启动映像来进行测试了。</span></p> -<h3 id="系统映像">系统映像</h3> -<p>系统映像 (<code>system.img</code>) 提供了 Firefox OS 火狐操作系统的核心：</p> -<ul> - <li><strong>Gonk</strong>: 操作系统的底层组件。</li> - <li><strong>Gecko</strong>: 火狐浏览器的 HTML 显示和 JavaScript 引擎的端口。</li> - <li><strong>B2G</strong>: 操作系统的核心进程。</li> -</ul> -<div class="note"> - <p>请参阅 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform">the Firefox OS platform</a> 指南以获得更多关于<span id="Dst[0][65:72:5:6]">平台</span><span id="Dst[0][74:85:7:10]">体系结构</span><span>的</span><span id="Dst[0][38:41:12:13]">详细</span><span id="Dst[0][43:53:14:15]">信息。</span></p> -</div> -<p>系统映像将会被复制到<code>设备的 <code>system（<code><code>系统</code></code>）</code></code>分区上，并在设备运行时存取到文件系统上的 <code>/system/</code> 目录中。</p> -<div class="note"> - <p><strong>注意：</strong> 系统映像也同样提供了设备所需要的二进制文件，最常见的就是手机无线电模块的<span id="Dst[0][96:101:38:41]"> RIL （<span id="Dst[0][96:101:38:41]">无线电</span><span id="Dst[0][103:111:42:43]">接口</span><span class="dhighlight" id="Dst[0][113:118:44:45]">层</span>）</span>。</p> -</div> -<h3 id="用户数据映像">用户数据映像</h3> -<p><span style="line-height: 1.5;">用户数据映像</span><span style="line-height: 1.5;">(</span><code style="font-size: 14px;">userdata.img</code><span style="line-height: 1.5;">) </span><span style="line-height: 1.5;">提供了设备运行时加载的Gaia应用。</span></p> -<p>用户数据映像将被复制到设备的 <code>userdata</code> 分区上，并在设备运行时存取到文件系统上的 <code>/data/</code> 目录中。很显然，在 <code>/data/b2g/ 目录中</code>包含了用户设备的 Mozilla Gecko <em>配置</em>。而 <code>/data/local/webapps/ 目录里包含了真实的给用户使用的网络</code><code>应用程序</code>。</p> -<h3 id="还原映像">还原映像</h3> -<p>还原映像<span style="line-height: 1.5;"> (</span><code style="font-size: 14px;">recovery.img</code><span style="line-height: 1.5;">) </span><span style="line-height: 1.5;">含有一个一模一样的内核和一个与当前启动映像类似的虚拟内存盘</span><span style="line-height: 1.5;">。可是还原映像使用了一个不同的初始化脚本，当用户使用设备上的硬件按钮时，这个脚本将触发一系列还原命令。</span></p> -<p>还原映像将被复制到设备的 <code>recovery</code> 分区上，这是个文件系统在正常启动时不会被挂载的分区。</p> -<h2 id="构建的步骤：准备、配置、构建、安装">构建的步骤：准备、配置、构建、安装</h2> -<p>Firefox OS 的整个编译安装过程分为四个步骤：</p> -<table style="width: 90%; vertical-align: top; margin: 4px auto;"> - <tbody> - <tr> - <td><b>准备</b></td> - <td>获取所有编译过程中用到的工具和程序，比如说合适的编译器和库文件。</td> - </tr> - <tr> - <td><strong>配置</strong></td> - <td>下载源代码，并<code>创建.configure 文件，这个文件用于<span style="font-family: 'Open Sans', sans-serif; line-height: 1.5;">定义与编译相关的环境变量 ，包括定义路径和变量</span><span style="font-family: 'Open Sans', sans-serif; line-height: 1.5;">。</span></code></td> - </tr> - <tr> - <td><b>构建</b></td> - <td>构建用户的 Gecko 配置文件和设备的 Gaia 网络应用程序。</td> - </tr> - <tr> - <td><b>安装</b></td> - <td>在设备上安装文件</td> - </tr> - </tbody> -</table> - -<p> </p> -<h3 id="准备">准备</h3> -<p>最初的准备必须做好，以确保在编译时能够备齐所需的全部软件，比如编译器和编译工具。</p> -<p>这个步骤可以手动操作或者使用脚本自动执行。详细请参考 <a href="/en-US/Firefox_OS/Firefox_OS_build_prerequisites" title="Firefox OS build prerequisites">Firefox OS build prerequisites</a> （未翻译）页面。</p> -<div class="note"> - <p><strong>注意：</strong> 在 Unix 系统或者 类 Unix 系统的机子上，所需的软件可以把它们的程序名作为指令参数使用 unix 的命令行的 <code>which <em><code><em>命令</em></code>来查找得知。</em></code></p> -</div> -<h3 id="配置">配置</h3> -<p>真正编译始于获取 Firefox OS （或者 B2G）的副本，可以通过在Git上克隆（clone）B2G项目完成。构建配置的过程既包括获取所有构建所需的源代码副本的过程；也包括创建 .config 文件的过程。</p> -<p>这需要运行一个 <code>config.sh</code> 脚本。详细请参考 <a href="/en-US/Firefox_OS/Preparing_for_your_first_B2G_build" title="Preparing for your first B2G build">Preparing for your first B2G build</a> （未翻译）页面。</p> -<p>配置脚本需要指定构建设备的类型参数，构建名字是指与CPU的架构相关的代号（code names）而不是特定的设备，并且暂时无法指定某个构建过程与具体某个物理设备相对应。可用的代号列表见<a href="https://developer.mozilla.org/en-US/Firefox_OS/Phones">这里</a>（未翻译）。</p> -<p>在配置过程中还会用到AOSP项目的<span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">repo工具，用于下载或更新构建过程中所需代码的副本。不同版本的副本会保存在</span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">.repo/projects目录下。配置过程将下载大量数据，这需要花费很长的时间。</span></p> -<h3 id="构建">构建</h3> -<p><span style="line-height: 1.5;">构建这一步骤将编译所有源文件，并生成映像文件。</span></p> -<p>这需要运行<span style="line-height: 1.5;"> </span><code style="font-size: 14px;">build.sh脚本。详细请参考</code><span style="line-height: 1.5;"> </span><a href="/en-US/Firefox_OS/Building" style="line-height: 1.5;" title="Building">Building Firefox OS</a><span style="line-height: 1.5;"> 页面。</span></p> -<p>默认情况下，工具会对所有代码进行尝试构建，从AOSP项目工具到Linux内核，再到Gaia层的网络应用程序。因为这个构建过程是一个整体过程，所以有时当编译失败后，会不知道失败在哪一步。</p> -<p>当然为了避免上述情况的发生，也可以只构建整个代码某一特定的部分。比如，Gecko系统部分只在调用有 <code>gecko</code> 参数的构建脚本时才被构建。同样对于Gaia部分也是如此。后面的章节将解释如何在分开编译完成后再安装这些部分到设备上去。</p> -<p>同样也可以构建本章在第一部分所提到的几个映像文件。比如说，可以通过命令 <code>./build.sh out/platform/$target/system.img，构建系统映</code><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">像system.img，这里</span><span style="line-height: 1.5;"> </span><code style="font-size: 14px;">$target</code><span style="line-height: 1.5;"> 参数要和配置过程中保持一致。</span></p> -<h3 id="安装">安装</h3> -<p>通过运行脚本 <span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">flash.sh</span><span style="line-height: 1.5;">将最新编译的代码安装到设备上。</span></p> -<p id=".E7.8B.AC.E7.AB.8B.E5.88.86.E5.BC.80.E7.9A.84.E6.9E.84.E5.BB.BA.E7.9A.84.E9.83.A8.E5.88.86.E5.8F.AF.E4.BB.A5.E9.80.9A.E8.BF.87.E5.9C.A8.E8.84.9A.E6.9C.AC.E4.B8.AD.E6.B7.BB.E5.8A.A0.E7.9B.B8.E5.BA.94.E5.8F.82.E6.95.B0.E8.BF.9B.E8.A1.8C.E5.AE.89.E8.A3.85.E3.80.82.E6.AF.94.E5.A6.82.EF.BC.8C.E5.8F.AF.E4.BB.A5.E9.80.9A.E8.BF.87.E6.8C.87.E4.BB.A4..2Fflash.sh_gaia..E5.8F.AA.E5.AE.89.E8.A3.85Gaia.E9.83.A8.E5.88.86.E7.9A.84.E7.BD.91.E7.BB.9C.E5.BA.94.E7.94.A8.E7.A8.8B.E5.BA.8F.E3.80.82">独立分开构建的部分可以通过在脚本中添加相应参数进行安装。比如，可以通过指令<code>./flash.sh gaia</code>.只安装Gaia部分的网络应用程序。</p> diff --git a/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/index.html b/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/index.html deleted file mode 100644 index 5adf2904fe..0000000000 --- a/files/zh-cn/archive/b2g_os/building_and_installing_firefox_os/index.html +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: 编译及安装Firefox OS火狐操作系统 -slug: Archive/B2G_OS/Building_and_installing_Firefox_OS -translation_of: Archive/B2G_OS/Building_and_installing_B2G_OS ---- -<div class="summary"> - <p style="">Firefox OS火狐操作系统正在紧张地开发之中，目前还未正式发布（2013年2月底已向媒体展示实体手机样机），因而保证你能有最新安装版的最优方法，是搭建并安装一个你自己的版本。本页列出的文章将指导你怎样在仿真器或兼容设备上构建和安装Firefox OS，以及火狐浏览器的<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Boot_to_Gecko/Introduction_to_Gaia" title="Mozilla/Boot_to_Gecko/Introduction_to_Gaia">Gaia</a>用户界面。</p> -</div> -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h2 class="Documentation" id="获取和构建_Firefox_OS" style="">获取和构建 Firefox OS</h2> - <dl> - <dt> - <em><a href="/en-US/Firefox_OS/Building_and_installing_Firefox_OS/Firefox_OS_build_overview">Firefox OS 的构建综述 </a></em></dt> - <dd> - 构建和安装Firefox OS火狐操作系统需要消耗大量的时间，网络带宽，和计算机硬件配置。此部分将大致描述构建的过程、步骤以及目标，帮助用户自行进行构建。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites" title="Mozilla/Firefox_OS/Firefox OS build prerequisites">构建 Firefox OS 之前</a></em></dt> - <dd> - 第一次构建 Firefox OS 之前所需要了解和准备的工作。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Preparing_for_your_first_B2G_build" title="Mozilla/Firefox_OS/Preparing for your first B2G build">构建 Firefox OS 的准备</a></em></dt> - <dd> - <span style="line-height: 1.5;">构建 Firefox OS，你需要获取源代码并配置构建过程所需要的参数。本篇文章将告诉你该怎么做。</span></dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Building" title="Mozilla/Firefox_OS/Building">构建 Firefox OS</a></em></dt> - <dd> - 如何构建Firefox OS。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Porting" title="/en-US/docs/Mozilla/Firefox_OS/Porting">移植 Firefox OS</a></em></dt> - <dd> - 关于如何移植 Firefox OS 到新的设备中。</dd> - </dl> - <p><span class="alllinks"><a href="/en-US/docs/tag/B2G" title="tag/B2G">全部内容...</a></span></p> - </td> - <td> - <h2 class="Community" id="安装_Firefox_OS_或者_Gaia" style="">安装 Firefox OS 或者 Gaia</h2> - <dl> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Choosing_how_to_run_Gaia_or_B2G" title="Mozilla/Firefox_OS/Choosing how to run Gaia or B2G">选择如何运行 Gaia 或 Firefox OS</a></em></dt> - <dd> - 你可以在火狐浏览器中使用 Gaia ，可以在手机上的 Firefox OS 中，也可以在桌面模拟器上。本篇文章将帮助你做出选择。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Using_Gaia_in_Firefox" title="Mozilla/Firefox_OS/Using Gaia in Firefox">在 Firefox 中使用 Gaia</a></em></dt> - <dd> - 如何在桌面火狐浏览器中使用Gaia。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client" title="Mozilla/Firefox_OS/Using the B2G desktop client">使用 Firefox OS 桌面客户端</a></em></dt> - <dd> - 本篇文章指导你使用桌面客户端版本的Firefox OS；桌面客户端将 Gaia 环境模拟成一个桌面应用程序。这个模拟比在火狐浏览器中使用Gaia要真实，但没有使用模拟器的效果好。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_emulators" title="Mozilla/Firefox_OS/Using the B2G emulators">使用 Firefox OS 模拟器</a></em></dt> - <dd> - 本篇文章将指导你构建和使用Firefox OS模拟器，以及选择不同的模拟器。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Installing_on_a_mobile_device" title="Mozilla/Firefox_OS/Installing on a mobile device">在移动设备上安装 Firefox OS</a></em></dt> - <dd> - 如何在手机设备上安装 Firefox OS。</dd> - <dt> - <em><a href="/en-US/docs/Mozilla/Firefox_OS/Dual_boot_of_B2G_and_Android_on_SGS2" title="Mozilla/Firefox_OS/Dual boot of B2G and Android on SGS2">在 SGS2 上 实现 Firefox OS 和 Android 双系统引导 </a></em></dt> - <dd> - 在三星 Galaxy S2上如何设置Firefox OS和Android双系统启动环境。</dd> - </dl> - </td> - </tr> - </tbody> -</table> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/building_the_b2g_desktop_client/index.html b/files/zh-cn/archive/b2g_os/building_the_b2g_desktop_client/index.html deleted file mode 100644 index 89b2385295..0000000000 --- a/files/zh-cn/archive/b2g_os/building_the_b2g_desktop_client/index.html +++ /dev/null @@ -1,262 +0,0 @@ ---- -title: Building the B2G desktop client -slug: Archive/B2G_OS/Building_the_B2G_desktop_client -translation_of: Archive/B2G_OS/Building_the_B2G_OS_simulator ---- -<div class="summary"> -<p>The B2G OS simulator lets you run Gaia and Web apps in a Gecko-based environment somewhat similar to an actual device. It doesn't emulate device hardware, so it's not adequate for testing device APIs, and isn't a replacement for testing on actual hardware. However, it does have several APIs enabled that aren't available on Firefox such as the <a href="/en-US/docs/WebAPI/Contacts">Contacts</a> and <a href="/en-US/docs/WebAPI/Settings">Settings</a> APIs. It can therefore be useful during the development of your application, or while working on the Gaia user interface itself. This article covers downloading or building the Firefox OS simulator, as well as how to use it.</p> -</div> - -<div class="note"> -<p><strong>Note:</strong> The easiest way to use the Firefox OS desktop client is to use the <a href="/en-US/docs/Tools/Firefox_OS_Simulator">Firefox OS Simulator add-on</a> via <a href="/en-US/docs/Tools/WebIDE">WebIDE</a>. It does not require you to build the simulator yourself.</p> -</div> - -<h2 id="Download_nightly_builds">Download nightly builds</h2> - -<p>Just like <a href="http://nightly.mozilla.org" title="http://nightly.mozilla.org">Firefox Nightlies</a>, the B2G OS simulator desktop client (identified by <em>b2g-</em>) is automatically built every day from the latest source code. The latest build is <a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central/" title="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central/">available from the Mozilla FTP server</a>. Be sure to pick the latest version and the right archive for your operating system. This lets you bypass having to build it yourself. In addition, you don't have to download Gaia on your own either.</p> - -<p>Be sure to install the application in a writeable location; the application needs to be able to update the included Gaia profile.</p> - -<p>You can now skip ahead to <a href="#Running_the_simulator" title="#Running_the_simulator">Running the simulator</a>, unless you actually want to build it for yourself. This is necessary if you want to make and test changes to the codebase.</p> - -<h2 id="Building_the_simulator">Building the simulator</h2> - -<p>The first thing you need to do is set up a <a href="/En/Developer_Guide/Build_Instructions#Build_prerequisites" title="En/Developer_Guide/Build_Instructions#Build_prerequisites">standard Mozilla build environment</a>. Once you have that, you can pull down the code you'll need and configure it to build the Firefox OS desktop client.</p> - -<h3 id="Downloading_the_code_for_the_first_time">Downloading the code for the first time</h3> - -<p>In a directory where you'd like the source code to go, clone the <code>mozilla-central</code> repository that contains all of Gecko:</p> - -<pre class="brush: bash"> hg clone http://hg.mozilla.org/mozilla-central</pre> - -<p><span style="line-height: 21px;">Alternatively, you can download the same code from Github:</span></p> - -<pre class="brush: bash"> git clone https://github.com/mozilla/gecko-dev</pre> - -<h3 id="Updating_the_code">Updating the code</h3> - -<p>When you do subsequent builds, you should make sure to pull in the latest changes:</p> - -<pre class="brush: bash">cd mozilla-central -hg pull -u -</pre> - -<p>or</p> - -<pre class="brush: bash">cd gecko-dev -git pull -</pre> - -<h3 id="Create_a_mozconfig">Create a mozconfig</h3> - -<p>Next, you need to create a file called <code>.mozconfig</code> in the <code>mozilla-central</code> directory to configure the build system to build the Boot to Gecko client instead of Firefox. This file should contain the following:</p> - -<pre class="brush: bash">. "$topsrcdir/b2g/config/mozconfigs/common" - -mk_add_options MOZ_OBJDIR=../build # This line should be commented if you use gecko-dev or <code>mozilla-central</code> -mk_add_options MOZ_MAKE_FLAGS="-j9 -s" - -ac_add_options --enable-application=b2g -ac_add_options --disable-libjpeg-turbo - -# This option is required if you want to be able to run Gaia's tests -ac_add_options --enable-tests - -# turn on mozTelephony/mozSms interfaces -# Only turn this line on if you actually have a dev phone -# you want to forward to. If you get crashes at startup, -# make sure this line is commented. -#ac_add_options --enable-b2g-ril</pre> - -<p>You also need to include the line <code>ENABLE_MARIONETTE=1</code> in the file if you want to run <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Mochitests">Mochitests</a> in the B2G desktop client (either <code>mochitest-b2g-desktop</code> or <code>mochitest-plain</code>) or if you want to run <a href="/en-US/Firefox_OS/Platform/Automated_testing/gaia-ui-tests/Gaia_UI_Tests_Run_Tests">Gaia unit tests</a>.</p> - -<h3 id="Building">Building</h3> - -<p>Now you can build the desktop client with the following command (run this from inside the <code>mozilla-central</code> directory):</p> - -<pre class="brush: bash">./mach build -</pre> - -<p>The built client will be placed in the <code>objdir/dist/bin</code> directory (based on the value you specify for <code>MOZ_OBJDIR</code> in the <code>mozconfig</code> file).</p> - -<div class="note"> -<p><strong>Note:</strong> If you have any trouble first <a href="/en-US/docs/Developer_Guide/Build_Instructions#Build_prerequisites">check the dependencies</a>.</p> -</div> - -<h2 id="Downloading_Gaia">Downloading Gaia</h2> - -<p>By default the simulator desktop client will show an empty screen because it doesn't know which web app to load initially as the system app. The collection of system apps and default apps that come with Firefox OS — Gaia — needs to be downloaded.</p> - -<p>To download Gaia for the first time, clone the source code repository on GitHub:</p> - -<pre class="brush: bash">git clone https://github.com/mozilla-b2g/gaia -cd gaia</pre> - -<p>To update an already existing clone of Gaia, you can pull in the latest changes from GitHub:</p> - -<pre class="brush: bash">cd gaia -git pull -</pre> - -<h2 id="Creating_a_custom-settings.json">Creating a custom-settings.json</h2> - -<p>If you know what you're doing and you want to set various config options you can create the file <code>gaia/build/config/custom-settings.json</code> and add them there, for example:</p> - -<pre><span class="brush: js">{ - "lockscreen.enabled": false, - "lockscreen.locked": false, - "devtools.debugger.remote-enabled": true -}</span></pre> - -<p>This example is useful for bypassing the lockscreen, which is otherwise impossible to bypass on desktop because it can't be unlocked using a mouse or trackpad.</p> - -<h2 id="Generating_a_profile">Generating a profile</h2> - -<p>Next we need to set up Gaia's apps for the desktop simulator. This includes packaging the Gaia apps in the same way as they would be installed on the device, as well as setting up the permissions for the privileged system apps. We do this by generating a profile. The following command (run in the downloaded <code>gaia</code> directory) will take care of that:</p> - -<pre class="brush: bash">make DESKTOP_SHIMS=1 NOFTU=1 DEBUG=1 -</pre> - -<p>This should create a <code>profile-debug</code> directory below the <code>gaia</code> directory. The new profile contains a customized extension and other configuration details needed to make B2G run properly.</p> - -<div class="note"> -<p><strong>Note</strong>: There is currently a bug (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1180103" title="B2G desktop client get an empty homescreen when run w/ debug profile (gaia/profile-debug)">bug 1180103</a>) that causes Gaia debug profiles to render with an empty homescreen when run through the Firefox OS Simulator (through WebIDE, or whatever.) This can be worked around by building with <code>DEBUG=1 DESKTOP=0 make</code> instead of <code>DEBUG=1</code>.</p> -</div> - -<h2 id="Running_the_simulator">Running the simulator</h2> - -<p>Once you've built the client (or downloaded and installed the nightly desktop application) and downloaded Gaia , you're ready to fire up the simulator.</p> - -<h3 id="Running_on_Linux">Running on Linux</h3> - -<p>To run the simulator on Linux using the embedded Gaia profile, just run the <code>b2g</code> executable. The binary is in the archive you downloaded earlier or in the <code>objdir/dist/bin</code> directory if you built the client yourself.</p> - -<pre class="brush: bash">b2g -profile gaia/profile-debug -</pre> - -<p>You may experience annoying rendering problems. To avoid them, add the following line to your <code>gaia/profile/user.js</code> file:</p> - -<pre>user_pref("layers.acceleration.disabled", true); -</pre> - -<h3 id="Running_on_Mac">Running on Mac</h3> - -<p>If you downloaded the Nightly build, you can simply launch it from the Finder as usual. Any console output is visible by running the standard Console utility program included with your Mac.</p> - -<p>If you want to specify a different Gaia profile (such as your separate download Gaia from above), you need to bypass the <code>b2g</code> wrapper program and run the <code>b2g</code> binary. The command line is slightly more complicated due to the location of the <code>b2g</code> binary and the need for absolute paths when specifying the profile directory:</p> - -<pre>.../B2G.app/Contents/MacOS/b2g-bin -profile /full/path/to/gaia/profile-debug -</pre> - -<h3 id="Running_on_Windows">Running on Windows</h3> - -<p>Running the Nightly build on Windows is as simple as launching <code>b2g.exe</code>. If you want to customize the execution, you can do so by running the <code>b2g.exe</code> executable instead; this bypasses the wrapper program that automatically uses the bundled Gaia.</p> - -<h2 id="Command_line_options">Command line options</h2> - -<p>There are a number of command line options you can use to adjust the runtime experience while using the desktop simulator. You can get a list by using the <code>-help</code> option. This section covers some of the particularly interesting ones.</p> - -<h3 id="option-screen" name="option-screen">Specifying the screen size</h3> - -<p>You can specify the screen size of the device you want to simulate using the <code>-screen</code> option:</p> - -<pre class="brush: bash">b2g -screen<em> <width></em>x<em><height></em>@<em><dpi></em></pre> - -<p>Where <em><width></em>, <em><height></em>, and <em><dpi></em> are fairly self-explanatory parameters: the width and height of the device's screen in pixels and the device resolution in DPI. Here's some real examples:</p> - -<pre class="brush: bash">b2g -screen 320x480 -b2g -screen 320x480@160 -</pre> - -<p>Optionally, you can specify certain devices by name to simulate their screen size and resolution:</p> - -<ul> - <li><code>iphone</code></li> - <li><code>ipad</code></li> - <li><code>nexus_s</code></li> - <li><code>galaxy_nexus</code></li> - <li><code>galaxy_tab</code></li> - <li><code>wildfire</code></li> - <li><code>tattoo</code></li> - <li><code>salsa</code></li> - <li><code>chacha</code></li> -</ul> - -<p>These preset devices are defined in <a href="https://github.com/mozilla/gecko-dev/blob/master/b2g/chrome/content/screen.js">screen.js</a>.</p> - -<p>In order to select different screen you probably have to specify the profile path as follow:</p> - -<div class="geckoVersionNote"> -<p>./b2g-bin --profile ./gaia/profile/ --screen=galaxy_tab</p> -</div> - -<h3 id="option-console" name="option-console">Opening the JavaScript console</h3> - -<p>You can open the JavaScript console when launching the desktop simulator by launching it from the command line with the <code>-jsconsole</code> flag. After building, just do:</p> - -<pre class="brush: bash">.../b2g -jsconsole -profile <em>/path/to/your/profile</em></pre> - -<p>If you've installed the Nightly build on a Mac, you can do the following:</p> - -<pre class="brush: bash">/Applications/B2G.app/Contents/MacOS/b2g -jsconsole -profile <em>/path/to/your/profile-debug</em></pre> - -<div class="note"> -<p><strong>Note:</strong> On production builds of Firefox OS, console logging (for example <a href="/zh-CN/docs/Web/API/Console/log" title="向 Web 控制台输出一条消息。"><code>console.log()</code></a>) is disabled by default. In order to enable it, open the <a href="/en-US/Firefox_OS/Debugging/Developer_settings">Developer settings</a> and enable the <em>Console Enabled</em> preference.</p> -</div> - -<h3 id="option-runapp" name="option-runapp">Launching a specific application at startup</h3> - -<p>You can specify an application to be launched automatically when b2g starts up in the simulator. This is done as soon as the rest of the system is done loading up. To do this, just use the <code>-runapp</code> option, which takes as a parameter the name of the application to run. For example:</p> - -<pre class="brush: bash"> .../b2g -profile <em>/path/to/your/gaia/profile-debug</em> -runapp email</pre> - -<div class="note"> -<p><strong>Note</strong>: The specified name is normalized by converting it to all lower case and removing all dashes and spaces. This normalized name is then compared to similarly normalized names from the manifests of available apps' manifests. For example, the name of the email app is currently "E-mail", but <code>-runapp email</code> will work because of this normalization.</p> -</div> - -<p>If you specify the <code>-runapp</code> option without an argument, or with an empty argument, the simulator will output to your terminal a list of the known applications as well as a brief usage message.</p> - -<div class="note"> -<p><strong>Note:</strong> Using the <code>-runapp</code> option disables the lock screen as a side effect and does not re-enable it. It's assumed that you won't use this command on a profile on which you will be testing the lock screen, or you will turn it back on manually using <em>Settings > Screen Lock</em>. Feel free to contribute a patch to change this behavior if it's a problem.</p> -</div> - -<h2 id="Usage_tips">Usage tips</h2> - -<p>This section provides a few helpful tips to using the B2G desktop client.</p> - -<ul> - <li>The Esc key performs the same function as the "back" button.</li> - <li>The Home key performs the same function as the "home" button; if you're on a Mac, the Home key is available as Fn + ← (Fn + Left Arrow).</li> - <li>The End key performs the same function as the "power" button; if you're on a Mac, the End key is available as Fn + → (Fn + Right Arrow).</li> - <li>the Page Up and Page Down keys perform the same functions as the "Volume Up" and "Volume Down" buttons respectively; if you're on a Mac, the Page Up key is available as Fn + ↑ (Fn + Up Arrow) and the Page Down key is available as Fn + ↓ (Fn + Down Arrow).</li> - <li>A long press on the Home key opens the "Card View"; if you're on Mac, Cmd + Fn + ← (Cmd + Fn + Left Arrow) opens the "Card View".</li> -</ul> - -<h2 id="Troubleshooting_A_blank_screen_when_the_simulator_starts">Troubleshooting: A blank screen when the simulator starts</h2> - -<p>When you start b2g using <code>b2g -profile gaia/path/to/gaia/profile</code> a blank screen may show up along with an error "Cannot reach app://system.gaiamobile.org". To fix this there are a couple of things you can check:</p> - -<ul> - <li>Rebuild the gaia profile using the <code>DEBUG=1 make</code> profile in the gaia directory.</li> - <li>Run b2g again.</li> - <li>If this doesn't fix it, check if there is any other process listening on port 8080. The default profile of Gaia starts <code>httpd.js</code>, which listens on port 8080. When running a debug profile, B2G connects to localhost:8080. If some other process is running on port 8080, b2g will fail to display the home screen of gaia. - <ol> - <li>To find out if this is the case, you can enable logging on <code>httpd.js</code>. The <code>httpd.js</code> in the profile resides in the location <code>gaia/profile/extensions/httpd/content/httpd.js</code>. Open this file for editing.</li> - <li>Change the line <code>var DEBUG=false;</code> to <code>var DEBUG=true;</code></li> - <li>Save the file and restart B2G. On the console you will now be able to view the httpd's logs.</li> - </ol> - </li> -</ul> - -<h2 id="Next_steps">Next steps</h2> - -<p>Now that you have a simulated build of Boot to Gecko running, you can do testing, development, and other work in it:</p> - -<ul> - <li><a href="/en/Mozilla/Boot_to_Gecko/Debugging_on_Boot_to_Gecko" title="en/Mozilla/Boot_to_Gecko/Debugging_on_Boot_to_Gecko">Debugging on Boot to Gecko</a></li> - <li><a href="/en/Mozilla/Boot_to_Gecko/Testing_Boot_to_Gecko" title="en/Mozilla/Boot_to_Gecko/Testing_Boot_to_Gecko">Testing Boot to Gecko</a></li> -</ul> - -<p> - <audio style="display: none;"> </audio> -</p> diff --git a/files/zh-cn/archive/b2g_os/customization_with_the_.userconfig_file/index.html b/files/zh-cn/archive/b2g_os/customization_with_the_.userconfig_file/index.html deleted file mode 100644 index 0cfc69ac0b..0000000000 --- a/files/zh-cn/archive/b2g_os/customization_with_the_.userconfig_file/index.html +++ /dev/null @@ -1,107 +0,0 @@ ---- -title: 定制 .userconfig 文件 -slug: Archive/B2G_OS/Customization_with_the_.userconfig_file -tags: - - B2G - - Firefox OS - - build - - userconfig -translation_of: Archive/B2G_OS/Customization_with_the_.userconfig_file ---- -<div class="summary"> - <p>通过将一些 bash 代码放在 B2G 源码 .userconfig 文件中， 您能够对编译过程的一些方面进行定制。 本文将对修改能达到的效果及如何修改进行介绍。</p> -</div> -<p> <code>.userconfig</code> 文件并没有被源代码控制，因此当您更新源码树时，您的更改不会被覆盖。它需要在 <a href="https://github.com/mozilla-b2g/B2G">B2G 根目录</a>下被创建; 也就是和 <code>flash.sh</code>, <code>build.sh</code>, 等在一个目录下。在运行您的配置和编译步骤时，需要添加该文件。</p> -<p>The <code>.userconfig</code> file, if it exists, is sourced by the <code>load-config.sh</code> script, which is in turn sourced by these scripts: <code>flash.sh</code>, <code>build.sh</code> (through <code>setup.sh</code>), <code>run-gdb.sh</code>, <code>run-emulator.sh</code> and <code>tools/mach_b2g_bootstrap.py</code>. The <code>run-<em>*</em>.sh</code> scripts use it to determine where Gecko is for your build. The <code>mach_b2g_boostrap.py</code> script is used by every B2G related <a href="/en-US/docs/Developer_Guide/mach">mach</a> command.</p> -<div class="warning"> - <p><b>重要</b>: 您的 .userconfig 文件应该在 B2G 源码根目录下，而不是您的 home 目录！</p> -</div> -<h2 id="Changing_the_Gecko_source_tree">Changing the Gecko source tree</h2> -<p>By default, the build uses the gecko tree, which is cloned from a tree in github. Some people like to use <a href="https://developer.mozilla.org/en-US/docs/Developer_Guide/Source_Code/Mercurial#mozilla-inbound_%28used_for_landing_your_patches%29" title="https://developer.mozilla.org/en-US/docs/Developer_Guide/Source_Code/Mercurial#mozilla-inbound_%28used_for_landing_your_patches%29">mozilla-inbound</a>, or <a href="https://developer.mozilla.org/en-US/docs/Developer_Guide/Source_Code/Mercurial#mozilla-central_%28main_development_tree%29" title="https://developer.mozilla.org/en-US/docs/Developer_Guide/Source_Code/Mercurial#mozilla-central_%28main_development_tree%29">mozilla-central</a>. To do this create your clone whereever you like and add a line to your <code>.userconfig</code> which sets <code>GECKO_PATH</code>, for example:</p> -<pre>export B2G_DIR=${B2G_DIR:-$(cd $(dirname $0); pwd)} -echo "B2G_DIR = ${B2G_DIR}" - -export GECKO_PATH=${B2G_DIR}/mozilla-inbound -echo "GECKO_PATH = ${GECKO_PATH}" -</pre> -<div class="note"> - <p><strong>Note</strong>: if building against a custom Gecko in Mac OS X, the <code>mozilla-central</code> directory must be in a case sensitive file system or else <code>GECKO_PATH</code> will be ignored. You can check whether the file system is case sensitive by running this in a Terminal window:</p> - <pre>echo -n This file system is case->tmp; echo -n in>>TMP; echo sensitive>>tmp; cat tmp</pre> - <p>Getting <code>B2G_DIR</code> the way it is above allows your <code>.userconfig</code> to work without having hard-coded paths.</p> -</div> -<h2 id="Changing_Gaia_settings">Changing Gaia settings</h2> -<p>Sometimes, you'd like to be able to change gaia settings. For example, enabling adb in a user build. The gaia Makefile passes in <code>--override build/custom-settings.json</code> when calling <code>build/settings.py</code>, so we can write some bash which will write <code>{"devtools.debugger.remote-enabled": true}</code> into the <code>custom-settings.json</code> file. We try to avoid changing <code>custom-settings.json</code> if we don't need to, so we actually write into <code>custom-settings.json.new</code> and if the contents differ from <code>custom-settings.json</code> then we'll replace it.</p> -<pre>export GAIA_PATH=${GAIA_PATH:-$(cd gaia; pwd)} -export CUSTOM_SETTINGS="${GAIA_PATH}/build/config/custom-settings.json" -cat > "${CUSTOM_SETTINGS}.new" <<EOF -{"devtools.debugger.remote-enabled": true} -EOF -if [[ -f ${CUSTOM_SETTINGS} ]] && cmp "${CUSTOM_SETTINGS}" "${CUSTOM_SETTINGS}.new" >& /dev/null; then - rm "${CUSTOM_SETTINGS}.new" -else - mv "${CUSTOM_SETTINGS}.new" "${CUSTOM_SETTINGS}" -fi -</pre> -<p>Another easier way is to configure a <code>build/config/custom-prefs.js</code> file in the Gaia working directory, so that means in <code>gaia/build/config/custom-prefs.js</code> if you're in the B2G directory. See <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Build_System_Primer#Customizing_the_preferences" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Build_System_Primer#Customizing_the_preferences">Gaia Build System Primer, Customizing the preferences</a>.</p> -<div class="note"> - <p><strong>Note:</strong> Currently the build is not smart enough to look in a different directory based on <code>GAIA_PATH</code>. This is different from how <code>GECKO_PATH</code> behaves. If you wish to use a separate Gaia clone you can <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Build_System_Primer" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Build_System_Primer">manually run make</a> from that directory.</p> -</div> -<h2 id="Create_a_debug_build">Create a debug build</h2> -<p>To build a debug build, put the following line in your <code>.userconfig</code> file:</p> -<pre>export B2G_DEBUG=1</pre> -<h2 id="Profiling_build">Profiling build</h2> -<p>To enable profiling (for best results with the built-in (SPS) platform profiler), add the following to your <code>.userconfig</code> file then rebuild:</p> -<pre>export MOZ_PROFILING=1</pre> -<div class="warning"> - <p>Do NOT pair with B2G_NOOPT. The results will be meaningless!</p> -</div> -<h2 id="Disable_the_optimizer">Disable the optimizer</h2> -<p>To disable the optimizer (which may create builds that are easier to debug), add the following to your <code>.userconfig</code> file then rebuild:</p> -<pre>export B2G_NOOPT=1</pre> -<h2 id="Disable_First_Time_User_experience">Disable First Time User experience</h2> -<p>If you build and reflash a lot, going through the First Time User experience constantly can be annoying. You can disable this by adding the following to your .userconfig:</p> -<pre>export NOFTU=1</pre> -<h2 id="Enable_gaia_developer_mode">Enable gaia developer mode</h2> -<p>If you plan to develop apps or hack gaia, you can automatically set various usefull settings and preferences to ease working with the device. For example, it will automatically enable the remote debugging feature and disable the prompt when an incoming debugging connection starts.</p> -<p>What you need is the following export added to your .userconfig:</p> -<pre>export DEVICE_DEBUG=1</pre> -<h2 id="Enable_valgrind">Enable valgrind</h2> -<p>Valgrind is useful for debugging memory or threading issues with your application. For more information on running valgrind, see <a href="/en-US/Firefox_OS/Debugging/Debugging_B2G_using_valgrind">Debugging B2G using valgrind [en-US]</a>.</p> -<p>To use valgrind under B2G, add the following to your .userconfig:</p> -<pre>export B2G_VALGRIND=1</pre> -<h2 id="Changing_the_default_host_compiler">Changing the default host compiler</h2> -<p>On some recent distributions which use GCC 4.7 as the default compiler you will need to specify an older version in order to be able to build, to do so add two lines to your <code>.userconfig</code> file setting the <code>CC</code> and <code>CXX</code> variables to set the alternate C and C++ compilers respectively. For example to set the GCC 4.6 compiler on Ubuntu 12.10 use:</p> -<pre>export CC=gcc-4.6 -export CXX=g++-4.6 -</pre> -<p>Or if you're using a version built from sources provide the full path to the exectuables:</p> -<pre>export CC=/opt/gcc-4.6.4/bin/gcc -export CXX=/opt/gcc-4.6.4/bin/g++ -</pre> -<h2 id="Specify_a_custom_Gecko_object_tree_location">Specify a custom Gecko object tree location</h2> -<p>Once you start changing gecko source trees and other build options, you may want to also modify where your objects get stored (so, for example, all of your debug objects go into a different tree from your non-debug objects). So you might do something like:</p> -<pre>export GECKO_OBJDIR=${GECKO_PATH}/objdir-gonk-debug -</pre> -<p>Using <code>${GECKO_PATH}</code> makes it easy to switch between different gecko trees (eg: central, beta, aurora, etc).</p> -<h2 id="Keeping_both_debug_and_non-debug_objects">Keeping both debug and non-debug objects</h2> -<p>You can use your <code>.userconfig</code> file to switch back and forth between debug and release builds without having to rebuild everything each time!</p> -<dl> -</dl> -<pre class="brush:bash;">export B2G_DIR=${B2G_DIR:-$(cd $(dirname $0); pwd)} -echo "B2G_DIR = ${B2G_DIR}" - -export GECKO_PATH=${B2G_DIR}/mozilla-inbound -echo "GECKO_PATH = ${GECKO_PATH}" - -export B2G_DEBUG=1 -echo "B2G_DEBUG = ${B2G_DEBUG}" - -export GECKO_OBJDIR=${GECKO_PATH}/objdir-gonk -if [[ "${B2G_DEBUG}" != "0" ]]; then - export GECKO_OBJDIR=${GECKO_OBJDIR}-debug -fi -if [[ "${GECKO_PATH/*mozilla-inbound*/mozilla-inbound}" == "mozilla-inbound" ]]; then - export GECKO_OBJDIR=${GECKO_OBJDIR}-m-i -fi -echo "GECKO_OBJDIR = ${GECKO_OBJDIR}"</pre> -<p>The <code>echo</code> commands help remind you what your current settings are. To switch between debug and release builds, simply change the value of <code>B2G_DEBUG</code> on line 7.</p> diff --git a/files/zh-cn/archive/b2g_os/debugging/debugging_b2g_using_gdb/index.html b/files/zh-cn/archive/b2g_os/debugging/debugging_b2g_using_gdb/index.html deleted file mode 100644 index b4939ee2f8..0000000000 --- a/files/zh-cn/archive/b2g_os/debugging/debugging_b2g_using_gdb/index.html +++ /dev/null @@ -1,88 +0,0 @@ ---- -title: 使用 gdb 及相关工具调试 B2G -slug: Archive/B2G_OS/Debugging/Debugging_B2G_using_gdb -tags: - - B2G - - Firefox OS - - Mobile - - 调试 -translation_of: Archive/B2G_OS/Debugging/Debugging_B2G_using_gdb ---- -<div class="summary"> - <p><strong><code>gdb</code></strong> 是一个命令行调试器，提供了许多有用的选项，可以用来调试 Firefox OS 应用程序。其他相关的工具也是同样有效的，比如 <strong><code>b2g-ps</code></strong>, 它是对标准 ps 工具的封装，会显示 B2G 实例中运行的每个进程的名称。本文则描述了如何使用这些工具来执行 Fiefox OS 调试工作。</p> -</div> -<h2 id="在单进程模式下启动调试器">在单进程模式下启动调试器</h2> -<div class="note"> - <p><strong>注意:</strong> 在运行调试器前，你可能想要建立一个 <code>.userconfig</code> 文件来自定义一些配置。请查看 <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file" title="/en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file">Customization with the .userconfig file</a> 获取更多信息。</p> -</div> -<p>要重启 Firefox OS 并在 gdb 控制下运行，只需要简单的运行 <code>run-gdb.sh</code> 脚本就可以了：</p> -<pre>./run-gdb.sh -</pre> -<div class="note"> - <p><strong>注意:</strong> 如果你想要在模拟器上调试，请确保并没有连接手机；否则可能会与模拟器上调试 gdb 相冲突。</p> -</div> -<p>如果 Firefox OS 已经在运行，你想要在不重启的情况下附加在上面，也可以这样做：</p> -<pre>./run-gdb.sh attach -</pre> -<h2 id="调试_out-of-process_任务">调试 out-of-process 任务</h2> -<p>Because of the threaded nature of Firefox OS, 你可能需要掉时除了主 B2G 任务之外的任务。最简单的方式就是使用 <code>b2g-ps</code> 命令来找出你需要调试的进程的 PID：</p> -<pre>$ adb shell b2g-ps -b2g root 106 1 189828 56956 ffffffff 40101330 S /system/b2g/b2g -Browser app_0 4308 106 52688 16188 ffffffff 400db330 S /system/b2g/plugin-container -</pre> -<p>此处， Browser 是一个子进程用作 browser 应用的 "content process" 。因此如果在本例中，你想要调试 content process, 可以这么做：</p> -<pre>$ ./run-gdb.sh attach 4308</pre> -<p>有时候，如果有任何子进程被创建就立刻通知是非常有用的。我们可以在启动 <code>run-gdb.sh</code> 时添加 <code>MOZ_DEBUG_CHILD_PROCESS</code> 环境变量来实现：</p> -<pre>MOZ_DEBUG_CHILD_PROCESS=1 ./run-gdb.sh</pre> -<p>运行上面命令后，在 Firefox OS 中启动一个 OOP 应用时，就会输出新任务 plugin-container 的 PID。Having done this, launching an OOP application on Firefox OS will output the PID of the plugin-container for the new task, and will sleep for 30 seconds, enough time for you to run the attach command we saw above:</p> -<pre>$ ./run-gdb.sh attach 4308</pre> -<p>If you are trying to debug something that occurs during boot, you have to launch the debugger instance for the new application fairly quickly. Once the new debugger is launched, you should immediately press "c" to continue running the new task.</p> -<h2 id="支持">支持</h2> -<h3 id="What_level_of_functionality_to_expect">What level of functionality to expect</h3> -<p>The following debugging features at least should definitely work. If they don't, it's likely that a simple tweak to your setup will make them work:</p> -<ul> - <li>Symbols for all libraries (except perhaps certain drivers on certain Android phones)</li> - <li>Backtraces with full debug info (except for optimized-away argument values)</li> - <li>Breakpoints: you should be able to break on a symbol, or on a file:line, or on an address. All should work.</li> - <li>Single-stepping ('s' and 'n' should both work)</li> -</ul> -<p>The following debugging features are <strong>not</strong> supported. Don't try to use them.</p> -<ul> - <li>Watchpoints.</li> -</ul> -<h3 id="Troubleshooting">Troubleshooting</h3> -<p>Here are a few things to try first whenever GDB is not working as described above.</p> -<h4 id="Ensure_that_your_B2G_clone_is_up-to-date">Ensure that your B2G clone is up-to-date</h4> -<p>Always keep in mind to that to update your B2G clone you must run these <strong>two</strong> commands:</p> -<pre>git pull -./repo sync</pre> -<p>Forgetting the <code>git pull</code> there is a typical reason why you'd end up with an old <code>run-gdb.sh</code> and not benefit from recent improvements.</p> -<h4 id="确保你已经附着在了正确的进程上">确保你已经附着在了正确的进程上</h4> -<p>Attaching to the wrong process (e.g. main B2G process versus Browser process) would explain why your breakpoints don't get hit.</p> -<h4 id="Ensure_that_symbols_are_correctly_read">Ensure that symbols are correctly read</h4> -<ol> - <li>In <code>gdb</code>, use <code>info shared</code> to check that symbols are correctly read: - <pre>(gdb) info shared -From To Syms Read Shared Object Library -0xb0001000 0xb0006928 Yes out/target/product/otoro/symbols/system/bin/linker -0x40051100 0x4007ed74 Yes /hack/b2g/B2G/out/target/product/otoro/symbols/system/lib/libc.so -0x401ab934 0x401aba2c Yes /hack/b2g/B2G/out/target/product/otoro/symbols/system/lib/libstdc++.so -...</pre> - </li> - <li>The <code>Syms Read</code> column should say <code>Yes</code> everywhere. Maybe on some android phone you would see <code>Yes (*)</code> for some system libraries or drivers; that would be OK. You should not see any <code>No.</code></li> - <li>If you do see a <code>No</code>, that is your first problem and you must solve it before looking at anything else.</li> - <li>Look for any error messages in the terminal output just after you typed your <code>run-gdb.sh</code> command.</li> - <li>Also check in that terminal output that the GDB command is sane. In particular, its last command line argument should be the path to your b2g executable. Here is a sane example: - <pre>prebuilt/linux-x86/toolchain/arm-linux-androideabi-4.4.x/bin/arm-linux-androideabi-gdb -x /tmp/b2g.gdbinit.bjacob /hack/b2g/B2G/objdir-gecko/dist/bin/b2g</pre> - </li> - <li>Check the value of these GDB variables: <code>solib-search-path</code> and <code>solib-absolute-prefix:</code> - <pre>(gdb) show solib-search-path -The search path for loading non-absolute shared library symbol files is /hack/b2g/B2G/objdir-gecko/dist/bin:out/target/product/otoro/symbols/system/lib:out/target/product/otoro/symbols/system/lib/hw:out/target/product/otoro/symbols/system/lib/egl:out/target/product/otoro/symbols/system/bin:out/target/product/otoro/system/lib:out/target/product/otoro/system/lib/egl:out/target/product/otoro/system/lib/hw:out/target/product/otoro/system/vendor/lib:out/target/product/otoro/system/vendor/lib/hw:out/target/product/otoro/system/vendor/lib/egl. -(gdb) show solib-absolute-prefix -The current system root is "out/target/product/otoro/symbols".</pre> - </li> -</ol> -<div class="note"> - <p><strong>Note</strong>: If you need more help, try the #b2g IRC channel. If you think you found a bug, report it on the <a href="https://github.com/mozilla-b2g/B2G/issues" title="https://github.com/mozilla-b2g/B2G/issues">B2G issue tracker</a>.</p> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/debugging/debugging_ooms/index.html b/files/zh-cn/archive/b2g_os/debugging/debugging_ooms/index.html deleted file mode 100644 index 2b6b511092..0000000000 --- a/files/zh-cn/archive/b2g_os/debugging/debugging_ooms/index.html +++ /dev/null @@ -1,62 +0,0 @@ ---- -title: 调试 Firefox OS 的内存溢出错误 -slug: Archive/B2G_OS/Debugging/Debugging_OOMs -translation_of: Archive/B2G_OS/Debugging/Debugging_OOMs ---- -<div class="summary"> - <p><span class="seoSummary">当 Firefox OS 设备内存溢出时，低内存管理器以及低内存消息系统就会 kill 掉一些进程，从而保持 OS 运行。 当 kernel 选择 kill 掉前台进程时， 就会看到你正在使用的 app 有一个明显的 crash 现象。 本文主要描述了如何理解和调试 OOM crash 问题。</span></p> -</div> -<div class="note"> - <p><b>注意：</b> 如果你并不了解内存条件在 Firefox OS 上是如何管理的，请在阅读本文前参考 <a href="/en-US/Firefox_OS/Platform/Out_of_memory_management_on_Firefox_OS">Out of memory management on Firefox OS</a></p> -</div> -<h2 id="调试_OOM_crash">调试 OOM crash</h2> -<p>假设你已经复现了你认为是由于手机内存溢出所导致的 crash 问题。下面的步骤可以帮助我们理解这些错误是如何产生的。 </p> -<h3 id="步骤_1_验证确实是_OOM">步骤 1: 验证确实是 OOM </h3> -<p>首先，我们需要检查下是否 crash 是否确实是由于内存溢出所导致的。运行命令 <code>adb shell dmesg </code>可以查看。如果 app 确实是由于 OOM 被 kill 掉的， 你就会看到下面类似的语句输出：</p> -<pre class="brush: bash"><4>[06-18 07:40:25.291] [2897: Notes+]send sigkill to 2897 (Notes+), adj 2, size 30625</pre> -<p>这一行表示手机的低内存管理器 kill 掉了 Notes+ app (进程 id 2897), 当被 kill 时，其 <code>oom_adj 2</code> 。size 是以 pages 为单位的，每个 page 表示 4kb。因此，在此情况下， Notes+ app 使用了 30625 * 4kb = 120mb 的内存。</p> -<h4 id="题外话_如果不是_OOM">题外话: 如果不是 OOM </h4> -<p>如果你在 <code>dmesg</code> 输出中没有看到类似的信息，你的 crash 可能就不是 OOM。下面的步骤就是将 crash 的进程附加在 <code>gdb</code> 上进行调试，并获取 backtrace，就像下面代码所示：</p> -<pre class="brush: bash">$ cd path/to/B2G/checkout -$ adb shell b2g-ps -# Note pid of the app that you're going to crash -$ ./run-gdb.sh attach <pid> -(gdb) continue -# crash the app -(gdb) bt</pre> -<p>当报出 bug 时， 关注上述命令的输出，同时伴随这 <code>adb logcat</code> 的输出。如果你的 crash 是由于 OOM 导致的， <code>gdb</code> backtrace 就没有什么用了。 因为 OOM crash 是由发送到 kernel 的信号所触发的，而不是进程中错误代码执行时所导致的。</p> -<h3 id="步骤_2_收集内存报告">步骤 2: 收集内存报告</h3> -<p>在您已经验证您的 crash 确实是由于 OOM 导致的，下面要做的就是在 app crash 前收集关于手机的内存报告。内存报告会帮助我们理解内存都在哪些方面被使用了。 这个步骤有点困难， 因为一旦 app 出现 crash, 就没有办法从那个进程获取到内存报告。当然也没有办法在 kernel 试图去 kill 一个进程时，才来出发内存报告，那就太晚了。</p> -<p>要从手机上获取内存报告， 首先要更新你的构建树，才能获取到最新版本的相关工具。 <code>repo sync</code> 是不能实现这个要求的；你必须执行 <code>git fetch && git merge</code> 或 <code>git pull </code>命令才可以:</p> -<pre class="brush: bash">$ cd path/to/B2G/checkout -$ git fetch origin -$ git merge --ff-only origin</pre> -<p>现在你就可以运行使用下面命令来运行内存报告工具了：</p> -<pre class="brush: bash">$ tools/get_about_memory.py</pre> -<p>一旦获取了你所想要的内存报告，就可以将问题的目录（名称为 <code>about-memory-N</code>）压缩，并附加在相关的 bug 上。但是，只有在你运行这些命令时，你所关注的 app 还活着，并且耗费了大量的内存时，才是管用的。此时也有一些选项。</p> -<h4 id="Step_2_选项_1_获取不同的设备Get_a_different_device">Step 2, 选项 1: 获取不同的设备Get a different device</h4> -<p>一般最简单的方式就是使用包含更多 RAM 的设备。从步骤 1 中获知当产生 crashed 时，进程会使用多少内存，因此你可以简单的等待，直到进程使用了那么多的内存时，就获取内存报告。 <code>b2g-info</code> 工具就会显示出不同的 B2G 进程使用了多少内存。你可以使用下面的命令循环的运行这个工具：</p> -<pre class="brush: bash">$ adb shell 'while true; do b2g-info; sleep 1; done'</pre> -<p>如果在设备上无法获取 <code>b2g-info</code> ，你就可以使用 <code>b2g-procrank</code> 来替代。</p> -<h4 id="Step_2_option_2_Fastest_finger">Step 2, option 2: Fastest finger</h4> -<p>如果无法获得包含更多 RAM 的设备，就可已尝试着去在 app crash 前运行 <code>get_about_memory.py</code> 。 你也可以向上节一样循环运行 <code>b2g-info</code> 来计算何时运行 <code>get_about_memory.py</code>. 运行内存报告时会将手机上的所有进程冻结一段时间，因此在进程 OOM 之前抓取内存报告并不困难。</p> -<h4 id="Step_2_option_3_Use_a_smaller_testcase">Step 2, option 3: Use a smaller testcase</h4> -<p>We often hit OOMs when doing something like "loading a file of at least size X in the app."</p> -<p>If the app crashes very quickly with a testcase of size X, you could try running a similar but smaller testcase (say, size X/2) and capturing a memory report after that succeeds. The memory report generated this way often gives us good insights into the OOM crash that we ultimately care about.</p> -<h4 id="Step_2_option_4_Run_B2G_on_your_desktop">Step 2, option 4: Run B2G on your desktop</h4> -<p>If the worst comes to the worst, you can run B2G on your desktop, which probably has much more RAM than your FxOS phone. This is tricky because B2G running on a desktop machine is a different in some key ways from B2G running on a phone.</p> -<p>In particular, B2G on desktop machines has multiprocess disabled by default. It doesn't really work 100% correctly anywhere, but it works most accurately on Linux and Mac. (Follow <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=923961">Bug 923961</a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=914584">Bug 914584</a>, <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=891882">Bug 891882</a>) You can test on your desktop without multiprocess enabled, but in my experience a lot of our high memory usage issues are caused by our interprocess communication code, so that won't necessarily trigger the bug you're seeing.</p> -<p>It's also not as convenient to take memory reports from a B2G desktop process. On Linux, you can send signal 34 to the main B2G process and it'll write <code>memory-report-*.gz</code> files out to <code>/tmp</code>.<br> - <br> - One advantage to using B2G desktop builds is that you can use your favorite desktop debugging tools, such as Instruments on Mac OSX. We've had a lot of success with this in the past. To collect a memory report using Instruments on OS X, choose "New -> Mac OS X -> Allocations". Start b2g-desktop and you should see multiple "plugin-container" processes in the activity monitor. You will need 2 Instruments activities: 1 to trace the allocations on the main b2g process and another to trace the allocations on the app you wish to analyze. Attach the instrument activities and execute your test case.</p> -<p>To analyze how much memory your app is using, analyze call trees. Check the "Invert Call Tree" tick, and sort by bytes used. This will show you which part of your app is using lots of memory. Below is a screenshot of a sample analysis of memory usage for an app:</p> -<p><img alt="Screen shot of instruments." src="https://mdn.mozillademos.org/files/6439/instrumentsScreenShot.png" style="width: 800px; height: 492px;"><br> - <br> - For more information on setting up B2G desktop builds, read our <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Hacking">Hacking Gaia</a> page.</p> -<h3 id="步骤_3_分析内存报告">步骤 3: 分析内存报告 </h3> -<p>当运行 <code>get_about_memory.py</code> 时，它就会打开 Firefox 中的内存报告。这个文件包含系统上所有进程的内存使用信息。 Note that you can hover over any leaf node to get a description of what that node describes. 你真正要寻找的是在 crashing 进程中 ”异常变大“ 的事物。此处的 "unusually large" means by capturing a memory report of your app when it's not using a ton of memory and comparing that to the errant memory report.</p> -<p>阅读内存报告需要一些实践，因此请在需要的时候就发问吧。这个领域的专家在 #memshrink on IRC.</p> -<h3 id="步骤_4_必要时使用_DMD_重新构建">步骤 4: 必要时使用 DMD 重新构建</h3> -<p>One common line item to stick out in memory reports captured before apps crash is <code>heap-unclassified</code>. <code>heap-unclassified</code> counts memory allocated by the process that isn't covered by any other memory reporter. If you have high <code>heap-unclassified</code>, the memory report can't tell you anything else about what that memory belongs to. Our tool for digging into <code>heap-unclassified</code> is called DMD. This works on B2G, but you must <a href="/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS">build B2G</a> yourself in order for it to work because DMD requires local symbols that are only kept on the build machine.</p> -<p>To find out more information on running DMD and interpreting its output, read the <a href="https://wiki.mozilla.org/Performance/MemShrink/DMD">Mozilla Wiki DMD page</a>.<br> - </p> diff --git a/files/zh-cn/archive/b2g_os/debugging/developer_settings/index.html b/files/zh-cn/archive/b2g_os/debugging/developer_settings/index.html deleted file mode 100644 index 0b59d842f7..0000000000 --- a/files/zh-cn/archive/b2g_os/debugging/developer_settings/index.html +++ /dev/null @@ -1,161 +0,0 @@ ---- -title: Firefox OS 开发者设置 -slug: Archive/B2G_OS/Debugging/Developer_settings -translation_of: Archive/B2G_OS/Debugging/Developer_settings ---- -<div class="summary"> - <p><span class="seoSummary">在 Firefox OS Settings 应用中有一个开发者面板。这个面板提供了许多选项可以使您在 Firefox OS 上调试 open web app 更简单。本文则对有效的选项和如何使用进行了介绍。</span></p> -</div> -<p>开发者选项的设置面板故意将路径设置的不太好找，这是为了避免不需要这些选项的终端用户无意中打开该选项，从而使设备变得更慢或者在界面中显示出特殊的效果。该面板与下图类似 （下图是一个运行 Firefox OS 2.0 2014 四月版本的 Geeksphone keon ）：</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7801/developermenu-short.png" style="width: 320px; height: 480px; display: block; margin: 0px auto;"></p> -<p>可以通过下面路径找到开发者面板：</p> -<ul> - <li>Firefox OS <1.4 版本， 通过 <em>Settings > Device information > More Information > Developer 打开开发者面板。</em></li> - <li>Firefox 1.4+ 版本， 首先需要在路径 <em>Settings > Device information > More Information > Check the Developer Menu checkbox 下使能开发者面板。完成后，就可以通过 </em> <em>Settings > Developer 来访问开发者面板。</em></li> -</ul> -<p>下面的章节则对开发者面板中的每个选项进行了介绍，包括它们是做什么的以及为何有效。</p> -<h2 id="开发者工具设置">开发者工具设置</h2> -<h3 id="通过_USB_调试">通过 USB 调试</h3> -<p>“远程调试” 选项会在 Firefox OS 设备上对 <a href="/en-US/docs/Tools/Debugger" title="/en-US/docs/Tools/Debugger">远程调试功能</a> 进行使能。同时也使能了 <a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB</a> 命令用法。在<strong> </strong> Firefox <1.4 版本，只是一个复选框；在 Firefox 1.4 中是一个下拉选框，其中有三个有效的选项：</p> -<ul> - <li>Disabled: 远程调试被禁用 (默认情况)</li> - <li>ADB only: 允许通过 ADB 对访问设备</li> - <li>ADB and Devtools: 允许通过 ADB 和 Firefox Devtools 如 <a href="/en-US/Firefox_OS/Using_the_App_Manager">App Manager</a> 访问设备</li> -</ul> -<h3 id="开发者_HUD">开发者 HUD</h3> -<p>Firefox OS 1.4+ 版本中， 点击该部分会进入开发者 HUD 选择视图。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7803/developerhud-new.png" style="width: 320px; height: 480px; margin: 0px auto; display: block;"></p> -<p>在显示开发者信息的 FIrefox OS UI 的顶部，有一个复选框可涌来使能或禁用开发者 HUD 全部的功能，下面有 5 个复选框可以用来启用或禁用：</p> -<ul> - <li><strong>Log changes in adb</strong>: 使用 adb logcat 时启用设备 log记录 </li> - <li><strong>Warnings</strong>: 显示终端警告</li> - <li><strong>Errors</strong>: 显示终端错误</li> - <li><strong>Security issues</strong>: 显示潜在的安全问题</li> - <li><strong>Reflows</strong>: 当发生时，显示 reflows（这里可能至再次重复此场景，但不太确切）</li> - <li><strong><a href="/en-US/Firefox_OS/Platform/Architecture#Jank">Jank</a>/Jank threshold</strong>: 通知手机用户出现出现不可接受的 Jank 的数目，其门限值可以设定。</li> - <li><strong>Frames per second</strong>: 显示每秒的 frames，在下面 <a href="#Frames_per_second">Frames_per_second</a> 章节中有介绍。</li> - <li><strong>Time to load</strong>: 显示撞在信息的时间，在下面章节 <a href="#Time_to_load">Time_to_load</a> 有介绍。</li> - <li><strong>App memory</strong>: 显示 app 使用的内存信息，并允许您启用或禁用不同的内存使用系统。请参考 <a href="#App_memory">App_memory</a> 获取更多信息。</li> -</ul> -<h4 id="每秒帧数（Frames_per_second）">每秒帧数（Frames per second）</h4> -<p>启用该选项会使 Firefox OS 显示界面左上角显示 3 个数字； 这个数字表示的是在滑动窗口中近期的平均值，指瞬时数据，但又是相当精确的。实际上，所有的数字都是推测出来的：</p> -<ul> - <li>左侧的数字是 合成速率（<strong>composition rate）</strong>: 这个估计值是指Firefox OS 每秒钟向硬件 framebuffer 所绘制的帧数。 这仅仅是一个用户界面所接收帧数速率的估计值。例如，即使屏幕没有变化， 计数器可能也会报告出每秒 60次的速率， 但真实的情况是此时用户的接收速率应该是 0。 然而，当您知道这种情况后，并且经其他的测量工具真实， 这种监测器仍时一个有效而且简单的工具。</li> - <li>中间的数字是 <strong>layer transaction rate</strong>, 表示每秒钟绘制和通知合成器的估计次数。 这个数字对 Gecko 平台工程师是非常有用的， 但是它应该小于或等于左侧的合成速率。</li> - <li>右手侧的数字是的屏幕大小的百分比作为绘制的像素值。数字 273 表示屏幕被绘制了 2.73 次。最佳的情况是该数字应尽可能接近 100。</li> -</ul> -<p><img alt="A screenshot of Firefox OS, showing three numbers in the top left hand corner that are measurements of app framerate." src="https://mdn.mozillademos.org/files/6889/framerate-fxos.jpg" style="width: 357px; height: 640px; display: block; margin: 0px auto;"></p> -<h4 id="装载时间">装载时间</h4> -<p>Firefox OS 也有一个工具可以帮助测量启动时间，尤其是“初次绘制“ 时间。 由工具所显示的值 — 位于 Firefox OS 界面右上角 — 是指从距今最近的应用的启动时间到应用第一次绘制自己 UI 估计值 之间的时间间隔，间隔以毫秒为单位。 这个数字只是接近“第一次真正画界面”的时间，一般会比实际值要小。 然而， 降低这以数值一般与改善真正的启动时间有直接关系， 因此它可以用来快速的测量优化问题。</p> -<p><img alt="A screenshot of Firefox OS, showing a number in the top right hand corner that is a measurement of the current app startup time, in milliseconds." src="https://mdn.mozillademos.org/files/6891/startup-time-fxos.jpg" style="width: 378px; height: 640px; display: block; margin: 0px auto;"></p> -<h4 id="App_内存">App 内存</h4> -<p>它会显示有关 app 所使用内存的信息， 并且允许您启用或禁用使用内存的不同条目以显示当前 app 所使用的内存。 例如，下面的截图显示了只有 App 内存 和 Js 对象勾选了，就会在界面右下角提示 Settings app 中 Js 对象使用了 414.77KB 内存。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7731/memory-usage.png" style="width: 320px; height: 480px; display: block; margin: 0px auto;"></p> -<h3 id="Flash_重绘区域">Flash 重绘区域</h3> -<p>In this mode, every time a region of the screen is painted by Gecko, Gecko blits a random translucent color over the painted region. Ideally, only parts of the screen that visually change between frames will "flash" with a new color. But sometimes more area than is needed is repainted, causing large areas to "flash". This symptom may indicate that application code is forcing too much of its scene to update. It may also indicate bugs in Gecko itself.</p> -<p><img alt="A screenshot of Firefox OS with a number of transparent overlays, showing the parts of the screen repainted with each new animation frame." src="https://mdn.mozillademos.org/files/6893/paint-update-fxos.jpg" style="width: 378px; height: 640px; display: block; margin: 0px auto;"></p> -<h2 id="Graphics_settings">Graphics settings</h2> -<h3 id="Enable_APZ_for_all_content_(was_Async_PanZoom)">Enable APZ for all content (was Async Pan/Zoom)</h3> -<p>When enabled, the Async Pan/Zoom module allows panning and zooming to be performed on asynchronously, on another thread, with some noticeable differences to rendering behaviour. To find out more, read the <a href="https://wiki.mozilla.org/Platform/GFX/APZ">MozillaWiki APZ</a> article.</p> -<h3 id="Tiling_(was_Layers_Enable_tiles)">Tiling (was Layers: Enable tiles)</h3> -<p>Introduced in Firefox OS 1.4, this feature enables the painting of content to the screen in smaller chunks ("tiles") rather than painting the whole screen at once. This is mainly useful for platform QA work involving reducing checkerboarding and finding regression windows.</p> -<h3 id="Simple_tiling_(was_Layers_Simple_tiles)">Simple tiling (was Layers: Simple tiles)</h3> -<p>This flips between the two different content painting implementations described in the section above.</p> -<h3 id="Hardware_composer_(was_Enable_hardware_compositing)">Hardware composer (was Enable hardware compositing)</h3> -<p>When enabled, this setting causes the device to use its <a href="https://source.android.com/devices/graphics.html#hwc">Hardware Composer</a> to composite visual elements (surfaces) to the screen.</p> -<h3 id="Draw_tile_borders_(was_Layers_Draw_tile_borders)">Draw tile borders (was Layers: Draw tile borders)</h3> -<p>This is very similar to the <a href="#Draw_layer_borders">Draw layer borders</a> option, the difference being that it also draws the borders for individual tiles as well as the borders around layers.</p> -<h3 id="Draw_layer_borders">Draw layer borders</h3> -<p>When this setting is enabled, a brightly colored border is added around all the different layers painted to the display — great for diagnosing layout issues.</p> -<p><img alt="A screenshot from Firefox OS showing an opened select form with the draw layers borders option enabled, resulting in colored borders being drawn on all the different rendered layers." src="https://mdn.mozillademos.org/files/6897/paint-layers-borders.png" style="width: 320px; height: 480px; display: block; margin: 0px auto;"></p> -<h3 id="Dump_layers_tree">Dump layers tree</h3> -<p>This option causes a copy of the compositor's layer tree to be dumped to logcat on every frame composited to the screen; this is mainly useful for platform graphics performance work, rather than regular web development.</p> -<h3 id="Cards_View_Screenshots">Cards View: Screenshots</h3> -<p>When enabled, this specifies that app screenshots will be taken when the open apps are displayed in card view. If disabled, app icons are shown in the center of blank cards for the card view instead.</p> -<h2 id="窗口管理设置">窗口管理设置</h2> -<h3 id="Software_home_button">Software home button</h3> -<p>Enabling this option creates a software home button that can provide the same functionality as the equivalent hardware button if it is not available. This is intended for future use on devices that are likely to not have hardware home buttons, like tablets.</p> -<h3 id="Home_gesture">Home gesture</h3> -<p>Enabling this option allows you to swipe upwards towards the center from outside the screen to bring up the homescreen. Again, this can provide the same functionality as the equivalent hardware button if it is not available, and is intended for future use on devices that are likely to not have hardware home buttons, like tablets.</p> -<h3 id="Edges_gesture">Edges gesture</h3> -<p>Enabling this option allows you to swipe left and right from outside the screen towards the center, to navigate to the next and previous sheets (either web pages in the browser, or views inside another app.) This basically works like the browser navigator bar in Firefox.</p> -<h3 id="Continuous_transition">Continuous transition</h3> -<p>This setting allows you to decide whether app keyboards open immediately or continuously (with a transition). Disabling such transition effects are useful on low end devices, when they cause performance to suffer.</p> -<h3 id="App_transition">App transition</h3> -<p>Turn this on and then off again and you will disable all app closing/opening transitions: all apps will now just show immediately, without the smooth animation, and keyboards will also open/close without animation. Like "Continuous transition enabled", this is meant for improving performance on low end devices, but it has more of an effect.</p> -<h3 id="App_suspending">App suspending</h3> -<p>If enabled, this specifies that when an app is killed in the background, it will be kept in history and reopened when you open it from homescreen/card view. If disabled, such apps are not kept in history/card view.</p> -<h2 id="Debug_settings">Debug settings</h2> -<h3 id="Log_slow_animations">Log slow animations</h3> -<p>This tool tries to help developers understand why animations are not offloaded to the compositor to be run efficiently as possible. It reports "bugs" like trying to animate elements that are too large, or trying to animate CSS properties that can't be offloaded. The messages you'll get on the device will look like the following:</p> -<pre>I/Gecko ( 5644): Performance warning: Async animation disabled because frame size (1280, 410) is bigger than the viewport (360, 518) [div with id 'views'] -</pre> -<h3 id="Wi-Fi_output_in_adb">Wi-Fi output in adb</h3> -<p>Enabling this option adds information about Wi-Fi to the adb logs (error logs from the console can be accessed using <code>adb logcat | grep "Error"</code> in the Terminal.)</p> -<h3 id="Bluetooth_output_in_adb">Bluetooth output in adb</h3> -<p>Enabling this option adds information about Bluetooth to the adb logs (error logs from the console can be accessed using <code>adb logcat | grep "Error"</code> in the Terminal.)</p> -<h3 id="Console_enabled">Console enabled</h3> -<p>When enabled, this option lets you use the <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Using_the_Remote_Web_Console" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Using_the_Remote_Web_Console">Web Console</a> in Firefox to remotely access the console output on the device; without this option enabled, the <a href="/zh-CN/docs/Web/API/Console/log" title="向web控制台输出一条消息."><code>console.log()</code></a> function does nothing.</p> -<h3 id="Gaia_debug_traces">Gaia debug traces</h3> -<p>Enabling this directly enables DEBUG traces in Gaia; see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=881672" title="FIXED: Enabling a DUMP function for all Gaia apps">bug 881672</a> for more details.</p> -<div class="note"> - <p><strong>Note</strong>: Unfortunately, not every app supports this mechanism to print their debug log. Instead, they control a "DEBUG" flag in code directly, so enabling this flag does NOT ensure that you'll see all debug logs.</p> -</div> -<h3 id="Show_accessibility_settings">Show accessibility settings</h3> -<p>This enables the accessibility settings menu, subsequently found at <em>Settings > Accessibility</em>. The options contained within the accessibility settings are as follows:</p> -<h4 id="Screen_reader">Screen reader</h4> -<p>Enabling this option turns on Firefox OS's screen reader. This is technology that allows a blind person to use a Firefox OS device. Currently at a very early stage, it changes the way the standard touch events work. When the screen reader is on, you must interact with the screen as follows:</p> -<ul> - <li>Touch somewhere to focus that app (or whatever) and be alerted as to what it is. This is indicated both by audible speech output and a rectangle around the selected item. Double tap anywhere on the screen (two taps in rapid succession) to activate the item that has the rectangle around it.</li> - <li>Swipe from left to right to move sequentially through items on the screen. Items are moved through from left to right, then top to bottom, including scrolling the screen vertically if there are more items to display, and you will be alerted as to each one's name via speech output and a rectangle. Swiping right to left moves through the items in reverse order. Again, double-tap the screen to execute the currently highlighted item.</li> - <li>Do a swipe with two fingers — left, right, up or down — to scroll the screen in that direction. This is equivalent to swiping one finger across the screen in the given direction when the screen reader is not running. For example, a two-finger swipe left on the first home screen will flip to the second one, and a two-finger swipe upwards on a home screen or browser would cause the screne to scroll downwards to show more content.</li> -</ul> -<div class="note"> - <p><strong>Note</strong>: If you have turned the screen reader on and wish to disable it again, you must navigate back to the setting via these new gestures and double-tap the checkbox once it is highlighted to turn it off again. That will restore the touch screen functionality to its default behaviour.</p> -</div> -<p><strong>Note</strong>: In Firefox 1.4 and above, there is a quick toggle for the screen reader. Press volume up, then down, three times (up, down, up, down, up, down). The screen reader will instruct you to perform this same action again (volume up, down, up, down, up, down) to turn it on if it is not running, or to turn it off if it is already running. If you do not want to change the current toggle state, simply do something else. That way, you can turn it on and off at will to test your web application for accessibility without having to navigate the accessibility settings menu each time.</p> -<h4 id="Speech_volume">Speech volume</h4> -<p>A slider that controls how loud the speech is delivered.</p> -<h4 id="Speech_rate">Speech rate</h4> -<p>A slider that controls how fast the speech is delivered.</p> -<h3 id="Launch_first_time_use">Launch first time use</h3> -<p>The "Launch first time use" button runs the first-time startup program; this lets you go through the initial setup and tutorial process, and is useful when trying to debug that process, or if you want to re-configure your device from scratch.</p> -<h2 id="Obsolete_settings">Obsolete settings</h2> -<p>This section lists settings that are no longer provided, or no longer exist in the same state, but might still be interesting if you are running an older version of Firefox OS.</p> -<h3 id="Accessibility">Accessibility</h3> -<p>In versions of Firefox earlier than newer 1.4 versions, this controls the accessibility settings, as explained in the <a href="#Show_accessibility_settings">Show_accessibility_settings</a> section above.</p> -<h3 id="Grid">Grid</h3> -<p>The "Grid" option, when enabled, causes the Firefox OS display to be overlaid with a grid pattern to help you gauge positioning and alignment of items. For example, below we see the Browser app running with the Grid option enabled:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5071/Grid.png" style="width: 320px; height: 480px; display: block; margin: 0px auto;"></p> -<p>The grid's heavier lines are 32 pixels apart, both horizontally and vertically.</p> -<h3 id="Show_frames_per_second">Show frames per second</h3> -<p>In Firefox OS versions older than newer 1.4, enabling this displays frames per second, as explained in the <a href="#Frames_per_second">Frames_per_second</a> section above.</p> -<h3 id="Show_time_to_load">Show time to load</h3> -<p>In Firefox OS versions older than newer 1.4, enabling this displays time to load information, as explained in the <a href="#Time_to_load">Time_to_load</a> section above.</p> -<h3 id="Rocketbar_enabled">Rocketbar enabled</h3> -<p>In Firefox OS versions older than newer 1.4, this option enables the new <a href="https://groups.google.com/forum/#!topic/mozilla.dev.gaia/Nlfbrq1KMP0">Firefox Rocketbar</a> on your device, which provides a useful new way to switch between apps, search, and more. When enabled, you'll find a search icon at the top left of the device, and the RocketBar can be brought up by swiping from the top left of the device towards the bottom left.</p> -<div class="note"> - <p><strong>Note</strong>: In newer versions of Firefox OS, Rocketbar is enabled automatically and cannot be turned off.</p> -</div> -<h3 id="Contacts_debugging_output_in_adb">Contacts debugging output in adb</h3> -<p>Enabling this option adds debugging information about contacts to the adb logs (error logs from the console can be accessed using <code>adb logcat | grep "Error"</code> in the Terminal.)</p> -<h3 id="Progressive_paint_(was_Layers_Progressive_paint)">Progressive paint (was Layers: Progressive paint)</h3> -<p>This was introduced to help with debugging of the <a href="https://wiki.mozilla.org/Platform/GFX/APZ">Async Panning/Zoom module</a> (APZ) during its implementation. Now APZ implementation is complete, this option is deprecated, and will be removed from future versions (see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1003228" title="FIXED: Remove unnecessary APZ-related settings and menu items">bug 1003228</a>).</p> -<h3 id="Displayport_Heuristics">Displayport Heuristics</h3> -<ul> - <li>Default</li> - <li>Center displayport</li> - <li>Assume perfect paints</li> - <li>Taller displayport</li> - <li>Faster paints</li> - <li>No checkerboarding</li> -</ul> -<p>These options were introduced to help with debugging of the <a href="https://wiki.mozilla.org/Platform/GFX/APZ">Async Panning/Zoom module</a> (APZ) during its implementation, specifically to allow QA to experiment with different repainting heuristics to see which resulted in the least amount of checkboarding.. Now APZ implementation is complete, these options are deprecated, and will be removed from future versions (see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=1003228" title="FIXED: Remove unnecessary APZ-related settings and menu items">bug 1003228</a>).</p> -<h2 id="Keyboard_layouts">Keyboard layouts</h2> -<p>In addition to the developer-specific options listed above, Firefox OS < 1.4's developer settings featured keyboard layout options. These let you toggle on and off the then-experimental Chinese input methods:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5079/InputMethods.png"></p> -<p>As of Firefox 1.4, these options have been removed. This is because the Chinese keyboard layout implementations (zhuyin and pinyin) have now been completed.</p> -<div class="note"> - <p><strong>Note</strong>: For other keyboard layouts still under development, such as Japanese, we now have a build-time config to opt them in.</p> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/debugging/index.html b/files/zh-cn/archive/b2g_os/debugging/index.html deleted file mode 100644 index a83bb6ae67..0000000000 --- a/files/zh-cn/archive/b2g_os/debugging/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: Debugging on Firefox OS -slug: Archive/B2G_OS/Debugging -tags: - - B2G - - Debugging - - Firefox OS - - NeedsTranslation - - QA - - Testing - - TopicStub -translation_of: Archive/B2G_OS/Debugging ---- -<div class="summary"> - <p><span class="seoSummary">There are two main types of debugging you'll want to with Firefox OS: debugging apps, and debugging other aspects of the system.</span> This section of the site provides articles covering the different tools at your disposal to debug your Firefox OS code.</p> -</div> -<h2 id="Debugging_apps">Debugging apps</h2> -<p>When debugging your web apps, the best tool at your disposal is Mozilla's powerful <a href="/en-US/Firefox_OS/Using_the_App_Manager">App Manager</a>, which allows you to run your apps directly on a real device or simulator, update any changes instantly, and debug them directly on the device using Mozilla's excellent <a href="https://developer.mozilla.org/en-US/docs/Tools" title="en-US/docs/Tools">developer tools</a>. This should be your first choice, especially for app/Gaia debugging.</p> -<dl> - <dt> - <a href="/en-US/Firefox_OS/Using_the_App_Manager">Using the App Manager</a></dt> - <dd> - The App Manager is a new tool available in Firefox for Desktop, which provides a number of useful tools to help you test, deploy and debug HTML5 web apps on Firefox OS phones and the Firefox OS Simulator, directly from your browser.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_OOMs">Debugging out of memory errors on Firefox OS</a></dt> - <dd> - This article describes how B2G's multiprocess architecture affects what the phone does when we run out of memory, and how to understand and debug OOM crashes.</dd> -</dl> -<h2 id="Debugging_GaiaB2G">Debugging Gaia/B2G</h2> -<p>If you want to debug code from the Gaia apps suite or B2G itself, the following tools will be of use to you.</p> -<dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_using_the_desktop_B2G_client" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_using_the_desktop_B2G_client">Debugging using the desktop B2G client</a></dt> - <dd> - You can use the dedicated B2G desktop application (and associated tools) to debug multiple aspects of B2G and Gaia.</dd> - <dt> - <a href="/en-US/Firefox_OS/Hacking_Firefox_OS/Quickstart_guide_to_Gaia_development">Quickstart guide to Gaia development</a></dt> - <dd> - This guide provides a very quick easy guide to developing and debugging Gaia apps, including running Gaia inside desktop Firefox, and debugging Gaia with App Manager.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_B2G_using_gdb" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_B2G_using_gdb">Debugging B2G using gdb</a></dt> - <dd> - The popular gdb debugger can be used to debug Firefox OS and web apps running on a device, or on an emulator. This guide will show you how it's done.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_B2G_using_valgrind" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_B2G_using_gdb">Debugging B2G using Valgrind</a></dt> - <dd> - Valgrind gives developers access to information about memory allocations, threads, and other information important to performance. This guide shows how to run Valgrind either on desktop B2G or select phone hardware.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Debugging/HTTP_logging#Firefox_OS_phones" title="/en-US/docs/Mozilla/Debugging/HTTP_logging#Firefox_OS_phones">Getting NSPR logs in B2G</a></dt> - <dd> - You can use NSPR logs to record HTTP and other networking.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Debugging/Debugging_OpenGL" title="/en-US/docs/Mozilla/Debugging/Debugging_OpenGL">Debugging OpenGL</a></dt> - <dd> - How to debug OpenGL code on Firefox OS.</dd> -</dl> -<h2 id="General_setup_and_information"><strong>General setup and information</strong></h2> -<p>The following articles provide information on individual aspects of setup for Firefox OS development. The chances are that you won't need these, especially if you are just debugging apps using the App Manager. But we have made them available here in case you do.</p> -<dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Developer_settings" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Developer_settings">Developer settings for Firefox OS</a></dt> - <dd> - There are a number of settings options available for developers on Firefox OS. This guide explains what they do and how to take advantage of them.</dd> - <dt> - <a href="/en-US/Firefox_OS/Debugging/Installing_ADB">Installing and using ADB</a></dt> - <dd> - Many aspects of Firefox OS development require installation of <code>adb</code>, the Android Debug Bridge. This article explains how to do that, and shares some common useful ADB commands.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/On-device_console_logging" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/On-device_console_logging">On-device console logging</a></dt> - <dd> - How to log to console on a Firefox OS device, and how to access the resulting logs for review on your computer.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Debugging_Firefox_OS_apps_in_desktop_Firefox">Connecting a Firefox OS device to the desktop</a></dt> - <dd> - This short guide explains how to set up your Firefox OS device and your desktop so that the desktop can communicate with the device over USB.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Setting_up" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Setting_up">Setting up to debug Firefox OS code</a></dt> - <dd> - Before you can begin using most of the tools integrated into Firefox for debugging code running under Firefox OS, you need to do a little configuration work. This article explains what you need to do.</dd> -</dl> diff --git a/files/zh-cn/archive/b2g_os/debugging/taking_screenshots/index.html b/files/zh-cn/archive/b2g_os/debugging/taking_screenshots/index.html deleted file mode 100644 index a1ca14b2aa..0000000000 --- a/files/zh-cn/archive/b2g_os/debugging/taking_screenshots/index.html +++ /dev/null @@ -1,69 +0,0 @@ ---- -title: 截屏 -slug: Archive/B2G_OS/Debugging/taking_screenshots -tags: - - Firefox OS - - 截屏 - - 调试 -translation_of: Archive/B2G_OS/Debugging/taking_screenshots ---- -<div class="summary"> - <p><span class="seoSummary">在许多场合下截屏都是非常有用的，例如将你的工作展示给客户端或者在 Marketplace 中发布应用。本文则对在 Firefox OS 手机中如何截屏进行了说明。</span></p> -</div> -<div class="note"> - <p><strong>Note</strong>: Android 会觉得非常熟悉。这些步骤都是类似的。</p> -</div> -<h2 id="准备你的手机">准备你的手机</h2> -<ol> - <li>在手机上到 <a href="/en-US/Firefox_OS/Debugging/Developer_settings">Developer Settings </a> 查看远程调试和终端是否使能</li> - <li>确保你的手机已经 <a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB installed</a> 并且正常工作</li> - <li>通过 USB 将手机连接到电脑</li> -</ol> -<h2 id="截屏">截屏</h2> -<p>你当前可以有 4 种方式可以实现： 使用终端，在 Eclipse 中使用 DDMS， 在手机上使用手机上的组合按键，或者使用 App Manager。</p> -<h3 id="终端">终端</h3> -<p>打开一个终端窗口，依次输入下面 3 个命令：</p> -<ol> - <li>使用下面的命令截屏（如果你想要称之为其他的名称，可以修改 <code>screenshot.png</code>）<br> - <code>adb shell screencap -p /sdcard/screenshot.png</code></li> - <li>从电脑中获取图片：<br> - <code>adb pull /sdcard/screenshot.png</code></li> - <li>在设备中删除截屏图片<br> - <code>adb shell rm /sdcard/screenshot.png</code></li> -</ol> -<p>Alternatively, you can use ffmpeg:</p> -<ol> - <li>Make sure you have ffmpeg installed: - <ol> - <li>On Mac, if you use MacPorts, you can do this with <code>sudo port install ffmpeg</code>. For homebrew, do <code>brew install ffmpeg</code>.</li> - <li>On Linux (Ubuntu/Debian), use <code>sudo apt-get install ffmpeg</code>.</li> - </ol> - </li> - <li><code>cd</code> into the <code>B2G/gaia</code> directory.</li> - <li>Use the <code>make screenshot</code> command to take a screenshot.</li> - <li>You now have a screenshot called <code>screenshot.png</code>.</li> -</ol> -<h3 id="DDMS">DDMS</h3> -<p>Open Eclipse.</p> -<ol> - <li>Open DDMS: <em>Window > Open Perspective > Other > DDMS</em>.</li> - <li>On the left side panel, in the <em>Devices</em> tab, click the <em>Screen capture</em> button.</li> - <li>A new window appears with several options; click on <em>Save</em> button to save your screenshot.</li> -</ol> -<div class="note"> - <p><strong>Note</strong>: To learn more about DDMS, have a look at the <a href="http://developer.android.com/tools/debugging/ddms.html" title="DDMS documentation">DDMS documentation</a> .</p> -</div> -<h3 id="Phone_button_combination">Phone button combination</h3> -<ol> - <li>On Firefox OS versions up to 2.0, simultaneously hold down the <em>Home</em> and <em>Power</em> buttons for a few seconds.</li> - <li>On Firefox OS version 2.1 and beyond, simultaneously hold down the <em>Volume Down</em> and <em>Power</em> buttons for a few seconds.</li> -</ol> -<p>This takes a screenshot, which is saved in your Gallery. You can now copy the picture from your SDCard to your computer using whatever method suits you best.</p> -<div class="note"> - <p><strong>Note</strong>: The button combination change was made because many people feel that <em>Home</em> and <em>Power</em> is more difficult to do that it should be, especially with one hand, plus devices with no hardware <em>Home</em> button are not very well supported (you can't use a software <em>Home</em> button in many places in Gaia, such as the lock screen.)</p> -</div> -<h3 id="App_ManagerSimulator">App Manager/Simulator</h3> -<ol> - <li>Go to the <a href="https://developer.mozilla.org/en-US/Firefox_OS/Using_the_App_Manager">App Manager</a>, connect to your phone, and navigate to the <strong>Device</strong> tab on the left.</li> - <li>Click on the <strong>Screenshot</strong> button at the bottom of the page (is at the same place that you startes the simulator).</li> -</ol> diff --git a/files/zh-cn/archive/b2g_os/developing_firefox_os/customizing_the_b2g.sh_script/index.html b/files/zh-cn/archive/b2g_os/developing_firefox_os/customizing_the_b2g.sh_script/index.html deleted file mode 100644 index 0406de37db..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_firefox_os/customizing_the_b2g.sh_script/index.html +++ /dev/null @@ -1,44 +0,0 @@ ---- -title: 定制 b2g.sh 脚本 -slug: Archive/B2G_OS/Developing_Firefox_OS/Customizing_the_b2g.sh_script -translation_of: Archive/B2G_OS/Developing_Firefox_OS/Customizing_the_b2g.sh_script ---- -<div class="summary"> - <p>在手机上， <code><a href="/en-US/docs/Mozilla/Firefox_OS/Architecture#The_userspace_process_architecture" title="/en-US/docs/Mozilla/Firefox_OS/Architecture#The_userspace_process_architecture">b2g</a></code> 应用程序 (它提供了 Firefox OS API 以及其他的东西）是通过 <code>/system/bin/b2g.sh</code> 脚本启动的。你可以对这个脚本进行定制，以修改 Firefox OS 的行为，本文则是介绍了这些内容。</p> -</div> -<h2 id="设定环境变量">设定环境变量</h2> -<p>如果你仅仅是想要对单个运行的 B2G 设定环境变量，可以执行下面命令：</p> -<pre class="brush: bash">adb shell stop b2g -adb shell "export ENV_VAR=value && /system/bin/b2g.sh" -</pre> -<p>如果你想要在任何时候都使用相同的环境能够变量，可以向下节描述中对 <code>b2g.sh</code> 进行编辑。</p> -<h2 id="编辑_b2g.sh">编辑 b2g.sh</h2> -<p>For debugging, you may want to set environment variables to get logging information or to otherwise affect how the <code>b2g</code> program runs. You can do this by editing the <code>b2g.sh</code> script. There aren't any tools included on the phone to edit the file in place, so you'll need to copy it to your computer first.</p> -<ol> - <li>Connect the phone to your computer, open a terminal window, and execute the following command to edit the script: - <pre>adb pull /system/bin/b2g.sh</pre> - </li> - <li>Edit the script to make the changes you want. For example, suppose you'd like to see some logging output (which requires a debug build), then you might add something like: - <pre>export NSPR_LOG_FILE=/data/local/tmp/mylog.txt -export NSPR_LOG_MODULES=Layers:5 -</pre> - </li> - <li>Run the following commands to save your updated <code>b2g.sh</code> script to the phone and restart <code>b2g</code>: - <pre>adb shell stop b2g -adb remount -adb push b2g.sh /system/bin -adb shell chmod 0755 /system/bin/b2g.sh -adb shell start b2g -</pre> - </li> -</ol> -<div class="note"> - <p><strong>Note:</strong> <code>/data/local/tmp</code> is the only place on the filesystem which is writable by content processes.</p> -</div> -<h2 id="参考">参考</h2> -<ul> - <li><a href="/en-US/docs/Mozilla/Boot_to_Gecko/Building_and_installing_Boot_to_Gecko" title="/en-US/docs/Mozilla/Boot_to_Gecko/Building_and_installing_Boot_to_Gecko">Building and installing Firefox OS</a></li> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/Architecture" title="/en-US/docs/Mozilla/Firefox_OS/Architecture">Firefox OS architecture overview</a></li> - <li><a href="/en-US/docs/Mozilla/Boot_to_Gecko/Debugging_on_Boot_to_Gecko" title="/en-US/docs/Mozilla/Boot_to_Gecko/Debugging_on_Boot_to_Gecko">Debugging on Firefox OS</a></li> -</ul> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/developing_firefox_os/filing_bugs_against_firefox_os/index.html b/files/zh-cn/archive/b2g_os/developing_firefox_os/filing_bugs_against_firefox_os/index.html deleted file mode 100644 index 2e5eb4050c..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_firefox_os/filing_bugs_against_firefox_os/index.html +++ /dev/null @@ -1,157 +0,0 @@ ---- -title: 为 Firefox OS 提交 Bug -slug: Archive/B2G_OS/Developing_Firefox_OS/Filing_bugs_against_Firefox_OS -translation_of: Archive/B2G_OS/Developing_Firefox_OS/Filing_bugs_against_Firefox_OS ---- -<div class="summary"> -<p><span class="seoSummary">本文是对 Firefox OS 项目提交 Bug 的指南， 包括 Gaia 和 B2G。</span></p> -</div> - -<h2 id="Bugzilla">Bugzilla</h2> - -<p>与 Mozilla 中的大多数项目一样，我们用 <a href="/zh-CN/docs/Mozilla/Bugzilla">Bugzilla</a> 作为软件缺陷的追踪管理。当你发现程序错误时，你可以向 <a href="https://bugzilla.mozilla.org/">bugzilla</a> 中的 <a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox%20OS">Firefox OS 产品</a>提交 bug 报告，其中包含 <a href="/zh-CN/Firefox_OS/Platform/Gaia">Gaia</a>、<a href="/zh-CN/Firefox_OS/Platform/Gonk">Gonk</a> 以及 Firefox OS <a href="/zh-CN/docs/Mozilla/Gecko">Gecko</a> 等组件。你可以从这里报告关于Firefox OS、B2G、Gaia 等组件的 bug。</p> - -<div class="note"> -<p><strong>注意</strong>： The Mozilla <a href="https://wiki.mozilla.org/B2G/QA">B2G QA Wiki</a> page also has some useful resources on handling Firefox OS bugs; the most useful pages are <a href="https://wiki.mozilla.org/B2G/QA/Bugzilla">Bugzilla Usage</a> and <a href="https://wiki.mozilla.org/Bugmasters/Projects/FirefoxOS">Incoming bug triage for Firefox OS</a>.</p> -</div> - -<h3 id="提交_Bug">提交 Bug </h3> - -<p>你可以依照 <a href="/zh-CN/docs/Mozilla/QA/Bug_writing_guidelines">bug 报告撰写指南</a>中的内容来报告优秀的 bug，你也可以在下面发现更多的细节。</p> - -<h3 id="强制和可选字段">强制和可选字段</h3> - -<p>在报告新 bug 时，有一些必填域：</p> - -<table style="height: 235px; width: 625px;" class="standard-table"> - <thead> - <tr> - <th scope="col">字段</th> - <th scope="col"><strong>描述</strong></th> - </tr> - </thead> - <tbody> - <tr> - <td>类别</td> - <td>选择这个bug所属的类型，如果你不清楚这个问题所属的类型，你可以将它放到"常规"问题当中。</td> - </tr> - <tr> - <td>概要</td> - <td>简要描述这个bug的概要。</td> - </tr> - <tr> - <td>描述</td> - <td> - <p>清楚地描述情况，一个好的bug报告应该包含有:1.重现的步骤(STR), 2.预期结果(程序本应该出现的结果)和实际结果(因为bug产生的结果), 3.顺便说明出现bug的频率(即:您多次重复这样的步骤后这个bug出现次数)。</p> - </td> - </tr> - <tr> - <td>版本信息</td> - <td>进入 设置>设备信息>更多信息 并且将下列信息与bug一并提交:操作系统版本，内部版本号，平台版本，构建标识，更新方式。(如果你有一台带安装了adb功能的运行Mac或者Linux的电脑，你可以直接运行<a href="https://github.com/Mozilla-TWQA/B2G-flash-tool/blob/master/check_versions.py">这个脚本</a>，并且黏贴这个脚本的输出结果到bug报告中)。</td> - </tr> - <tr> - <td>截图</td> - <td>请抓取一个截图方便我们分析这个bug。(在Flame设备上，可以同时按住电源键和音量下键两秒直至设备显示截屏通知，然后通过USB线传输到电脑上以便提交)。</td> - </tr> - <tr> - <td>录制视频</td> - <td>如果这个bug的截图不方便传输或者难以通过截图来捕获，请录制一段关于这个bug的视频，你可以将视频文件上传作为bug报告的附件，也可以上传至YouTube网站并且复制视频链接至报告中。</td> - </tr> - <tr> - <td>ADB 运行日志</td> - <td>如果你的电脑安装了ADB工具，请将你的设备连接到电脑并且在ADB中运行以下命令|adb logcat|。请将这个命令的输出信息复制到一个文本文档中并且附到bug报告中。</td> - </tr> - </tbody> -</table> - -<p>以下是可选域：</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">字段</th> - <th scope="col"><strong>描述</strong></th> - </tr> - </thead> - <tbody> - <tr> - <td>依赖/块</td> - <td>列出多个bug之间的联系。</td> - </tr> - <tr> - <td>关键词</td> - <td>为bugzilla列出关键词. 特殊的团队将用它们来追踪。</td> - </tr> - <tr> - <td>白板</td> - <td>包含标签，为追踪bug添加标签，你不能未经许可就擦除其他的标签。</td> - </tr> - <tr> - <td>看点别的</td> - <td>有时候，两个问题是相互有关联的，你可以指定它们。</td> - </tr> - <tr> - <td>旗子</td> - <td>用于追踪的旗子; the most used flag in Firefox OS bugs is blocking-b2g. If a bug is set as blocking-b2g, it means we should pay more attention to it as it threatens to block a release.</td> - </tr> - <tr> - <td>Security</td> - <td>If a bug is related to personal data security, loss of earnings, and other such issues, you should check the checkbox and it will only be visiable to involved employees.</td> - </tr> - </tbody> -</table> - -<p>To find more information on bugzilla fields, you can view the <a href="https://bugzilla.mozilla.org/page.cgi?id=fields.html">Bugzilla Fields</a> page on Bugzilla.</p> - -<h3 id="常见关键字">常见关键字</h3> - -<p>下面的表格提供了你将在 Firefox OS 的 bug 报告中经常见到的关键字。</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">关键字</th> - <th scope="col"><strong>描述</strong></th> - </tr> - </thead> - <tbody> - <tr> - <td>meta</td> - <td>Indicates that the bug is a status tracking bug. Mozilla uses this tag to tracking multiple bug or user story implementation statuses. Once marked like this, developers should not land patches on top of such bugs. Please be reminded that project managers and QA staff will use meta bugs for tracking.</td> - </tr> - <tr> - <td>qablocker</td> - <td>Use this keyword for bugs that are blocking testing (manual or automated testing of a feature) and need to be fixed by the next Beta or RC milestone.</td> - </tr> - <tr> - <td>qawanted</td> - <td>Use this keyword for bugs that need more info, require reproducing or testcasing, or are duplicates (but you can't find the original bug being duplicated). Required QA work progress is recorded in the whiteboard; you should remove this keyword when the required QA work has been completed.</td> - </tr> - <tr> - <td>regression</td> - <td>This keyword means that the problem was fixed, but then it came back (regressed) and the bug in question is a new bug, filed to track the regression. It can also refer to problems outside those identified in pre-check in and smoke tests, which were found in current builds and that were known to be working in previous builds. Tracking these bugs helps us to identify areas that are fragile, prone to breakage and are good candidates for adding to smoke and pre-check in tests.</td> - </tr> - <tr> - <td>regressionwindow-wanted</td> - <td>Indicates that the bug is a regression, and would strongly benefit from someone identifying the time period in which it happened, ideally to a specific check in.</td> - </tr> - <tr> - <td>steps-wanted</td> - <td>Highlights a bug that would greatly benefit from someone identifying the steps to reproduce it.</td> - </tr> - <tr> - <td>verifyme</td> - <td>Means that this bug is ok to verify with the latest B2G build by someone other than the QA Contact indicated. The bug has specific machine configuration details indicated for verifying the fix. You should try to reproduce the failure, and, if you agree that the resolution of <em>Fixed</em> is correct, mark the <em>Status</em> as <em>Verified</em>.<br> - <br> - You should always indicate the build/OS/platform(s) used to verify the bug in the bug comments, before you change the <em>Status</em> to <em>Verified</em>. If the bug is reported on all three platforms and you only have one platform to verify the fix on, go ahead and do so and note it in the bug, but do not mark the bug as <em>Verified</em>. All platforms must be checked before moving <em>Status</em> to <em>Verified</em>.<br> - <br> - Finally, if other bugs have been marked as a duplicate of the bug you're verifying, be sure to check and mention those as well. Often developers mark related — but not identical — bugs as duplicates, and these can be overlooked if not checked.</td> - </tr> - </tbody> -</table> - -<div class="note"> -<p><strong>注意</strong>：有关 Gaia 开发中对 bug 的处理的更多信息，请见<a href="/zh-CN/Firefox_OS/Developing_Gaia/Submitting_a_Gaia_patch">向 Gaia 提交补丁</a>。</p> -</div> - -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/developing_firefox_os/index.html b/files/zh-cn/archive/b2g_os/developing_firefox_os/index.html deleted file mode 100644 index 888de98cc8..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_firefox_os/index.html +++ /dev/null @@ -1,45 +0,0 @@ ---- -title: Firefox OS 开发 -slug: Archive/B2G_OS/Developing_Firefox_OS -tags: - - NeedsTranslation - - TopicStub -translation_of: Archive/B2G_OS/Developing_Firefox_OS ---- -<div class="summary"> - <p>本部分提供了许多有用的文档，主要包括在编译和写应用时对Firefox OS修改和定制的不同方式以及您如何能够帮助我们对平台进行开发。</p> -</div> -<dl> - <dt> - <a href="/zh-CN/docs/Mozilla/Firefox_OS/Developing_Firefox_OS/Quickstart_guide_to_Gaia_development">Gaia开发快速入门</a></dt> - <dd> - Gaia是指<a href="https://developer.mozilla.org/apps">web应用</a>的集合，并由这些应用共同组成了 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> 的前端。在Firefox OS 屏幕上显示的内容都使用了开放web技术，其中包括主屏幕和所有的原生应用 。本指南主要对如何快速使用和修改Gaia层应用进行了简单介绍。</dd> - <dt> - <a href="/en-US/Firefox_OS/Platform/Gaia/Build_System_Primer">系统编译入门</a></dt> - <dd> - 文章介绍了Gaia编译系统是如何工作的，包括Makefile文件，编译过程，环境变量以及隐含的自定义配置等。</dd> - <dt> - <a href="/zh-CN/docs/Firefox_OS/Platform/Gaia/Hacking">Hacking Gaia</a></dt> - <dd> - 文章提供了开发和修改Gaia的详细指南。</dd> - <dt> - <a href="/en-US/Firefox_OS/Hacking_Firefox_OS/Market_customizations_guide">Market customizations guide</a></dt> - <dd> - Market customizations allow you to specify build-time customization instructions (for example, which apps should be included in your build) in separate directories, without modifying the core Gaia repo. You can include your own customizations in distinct directories, or use the preexisting directories that come with the source. These customizations are specified with build options. In this article we look in detail at how to create and use these customizations.</dd> - <dt> - <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Tips_and_tricks/modifying_hosts_file" title="/en-US/docs/Mozilla/Firefox_OS/Tips_and_tricks/modifying_hosts_file">Modifying the hosts file</a></dt> - <dd> - A guide to what can be achieved by modifying the Firefox OS hosts file.</dd> - <dt> - <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file" title="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file">Customization with the .userconfig file</a></dt> - <dd> - How to customize the build and execution of Firefox OS by changing the <code>.userconfig</code> file.</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Hacking_Firefox_OS/Customizing_the_keyboard">Customizing the keyboard in Firefox OS apps</a></dt> - <dd> - This guide shows how to customize the keyboard in your Firefox OS apps.</dd> - <dt> - <a href="/en-US/docs/Firefox_OS/Hacking_Firefox_OS/Localizing_Firefox_OS">Firefox OS 本地化</a></dt> - <dd> - A guide to localising the Firefox OS platform, making it available in your preferred languages.</dd> -</dl> diff --git a/files/zh-cn/archive/b2g_os/developing_firefox_os/market_customizations_guide/index.html b/files/zh-cn/archive/b2g_os/developing_firefox_os/market_customizations_guide/index.html deleted file mode 100644 index 91fc8d5aab..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_firefox_os/market_customizations_guide/index.html +++ /dev/null @@ -1,979 +0,0 @@ ---- -title: 市场自定义指南 -slug: Archive/B2G_OS/Developing_Firefox_OS/Market_customizations_guide -translation_of: Archive/B2G_OS/Developing_Gaia/Market_customizations_guide ---- -<div class="summary"> -<p><span class="seoSummary">市场定制允许您在独立的文件夹指定构建时定制指令（例如，在构建时哪个app应被包括其中）而不必修改核心的Gaia仓库。您能够将自己的定制项放在不同的目录或使用代码中已存在的目录。这些定制是由 build 选项指定的。本文会对如何创建和使用这些定制项进行深入探讨。</span></p> -</div> - -<h2 id="定制概览">定制概览</h2> - -<p>从 1.0.1 开始， Firefox OS 所采用的定制机制都是相同的。<br> - <br> - We have created a full-featured <a href="https://github.com/mozilla-b2g/gaia/tree/master/customization">Gaia distribution customization sample</a> as part of the gaia repo: study this to learn first-hand what can be done with build-time customization. It will also be referenced in the article below.</p> - -<div class="note"> -<p><strong>注意</strong>: send a pull request to the above referenced Github repo if you have any suggestions for improving the customization sample, or see something that has been changed in this article but not updated in the code.</p> -</div> - -<p>Below is the tree structure for the customization sample:</p> - -<pre> customize-sample - ├── power - │ ├── carrier_power_on.png - │ └── carrier_power_off.png - ├── ringtones - │ ├── list.json - │ └── ringer_dream_theme.ogg - ├── wallpapers - │ ├── customize.png - │ └── list.json - ├── browser.json - ├── calendar.json - ├── contacts.json - ├── costcontrol.json - ├── homescreens.json - ├── network.json - ├── sensors.json - ├── settings.json - ├── sms-blacklist.json - ├── support.json - ├── wapuaprof.json - └── apps.list</pre> - -<div class="note"> -<p><strong>注意</strong>: 所有的文件都是可选的。如果您没有提供这个文件，就会使用系统的默认配置。</p> -</div> - -<p>We will discuss all these optional customizations in the sections that follow, but first let's see how to apply the customization to Gaia.</p> - -<h2 id="定制步骤">定制步骤</h2> - -<p>要将定制样例应用在 Gaia：</p> - -<ol> - <li>从 <a href="https://github.com/mozilla-b2g/gaia">https://github.com/mozilla-b2g/gaia</a> 地址 Clone Gaia 源码</li> - <li>你可以将 <code>gaia/customization/</code> 文件夹拷贝到新的文件夹来进行你自己的本地化，或者是编辑 <code>gaia/customization/</code> 文件夹本身。这个路径就是指下面所讲的 <code><DISTRIBUTION_PATH></code>; 将该目录更改为你自己的文件路径。</li> - <li>通过 USB 附加在 Firefox OS 设备上，并检查是否它是否可以通过 USB 辨认</li> - <li>构建 Gaia， 使用 <code>GAIA_DISTRIBUTION_DIR</code> 环境变量指定定制样例的位置，如下所示： - <pre class="brush: bash">GAIA_DISTRIBUTION_DIR=<DISTRIBUTION_PATH> make production</pre> - </li> - <li>现在就应该在你的 Firefox OS 设备上应用了你的定制的修改。</li> -</ol> - -<p>如果你将定制样例文件夹拷贝到了 <code>gaia/distribution/， 就可以在没有指定环境变量运行</code> <code>make</code> 命令：</p> - -<pre class="brush: bash">make production</pre> - -<div class="note"> -<p><strong>Note</strong>: 可通过 Gaia 构建脚本进行定制。 请参考 <a href="/en-US/Firefox_OS/Developing_Gaia/make_options_reference">make options reference</a> 获取构建脚本定制的信息。</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: SIM card-specific customizations are included at build time, but applied at runtime during the First Time Usage experience.</p> -</div> - -<h2 id="构建时定制">构建时定制</h2> - -<p>Let's now go through the different options available in the sample.</p> - -<h3 id="power">power/</h3> - -<p>Custom power on/off animations (or static images) are included here. Files can be MP4 for animations or PNG for static images.</p> - -<p>Valid file names are:</p> - -<ul> - <li><code>carrier_power_on.png</code></li> - <li><code>carrier_power_on.mp4</code></li> - <li><code>carrier_power_off.png</code></li> - <li><code>carrier_power_off.mp4</code></li> -</ul> - -<h3 id="ringtones">ringtones/</h3> - -<p>Custom ringtones are included here. <code>list.json</code> should contain the filenames of the ringtones, like this:</p> - -<pre class="brush: js"> { - "ringer_classic_courier.opus": "", - "ringer_dream_theme.ogg": "", - "ringer_loud_windchimes.opus": "", - "ringer_bitbounce.opus": "" - }</pre> - -<p>Custom ringtones are selectable in the Firefox OS settings app through <em>Sound > Ringer</em>. The default ringtone must be set in <code>settings.json</code>, using DataURI, you can use <strong>datauri</strong> command which is available on node/npm, install it by <strong>npm install datauri -g</strong> and convert file to DataURI by <strong>datauri <FILE></strong></p> - -<h3 id="wallpapers">wallpapers/</h3> - -<p>Custom wallpapers (PNG files) should be included here and listed in <code>list.json</code>, after which they can be selected in the Firefox OS settings app through <em>Display > Wallpaper</em>.</p> - -<p>The default wallpaper must be set in settings.json, using the following line:</p> - -<pre class="brush: js">"wallpaper.image": "image location"</pre> - -<div class="note"> -<p><strong>Note</strong>: The image can be specified as a file path, or a Base 64 encoded data URI.</p> -</div> - -<h3 id="browser.json">browser.json</h3> - -<p>This file allows you to add customizations into the actual Browser app, such as bookmarks and default search engine. See the section <a href="/en-US/Firefox_OS/Hacking_Firefox_OS/Market_customizations_guide#Browser_bookmarks_.26_default_search_engine">Browser bookmarks & default search engine</a> for more details on what to put in this file.</p> - -<h3 id="calendar.json">calendar.json</h3> - -<p>This file allows you to use your own custom calendars in the Firefox OS Calendar app. You'll need to specify your own Google Oauth credentials. In addition, calendar CalDav API access is needed: To generate the required API key and secret, you need to apply at Google's <a href="https://developers.google.com/google-apps/calendar/caldav/v2/guide#creating_your_client_id">creating your client ID</a> page; follow these instructions:</p> - -<ol> - <li>Open the <a href="https://code.google.com/apis/console/b/0">API console</a>.</li> - <li>Create a project and enable <em>Calendar CalDav API</em> in <em>APIs & auth > APIs</em>.</li> - <li>Click on <em>Credentials</em>.</li> - <li>Click on <em>Create new client ID</em></li> - <li>Set the <em>Application type</em> to Installed application, and <em>Installed application type</em> to <em>Other</em>, then press <em>Create Client ID</em>. This should give you a <em>Client ID</em> and <em>Client secret</em>.</li> - <li>Open the <code>calendar.json</code> file, change the <code>client_id</code> and <code>client_secret</code> to the <em>Client ID</em> and <em>Client secret</em> you got from the Google API console, and save and close.</li> -</ol> - -<div class="note"> -<p><strong>Note</strong>: API usage is limited to 1,000,000 requests/day</p> -</div> - -<h3 id="camera.json_(Gallery_and_Camera_app_image_sizes)">camera.json (Gallery and Camera app image sizes)</h3> - -<div class="code-body highlight"> -<pre class="line"><span class="p">{</span> - <span class="nt">"maxImagePixelSize"</span><span class="p">:</span> <span class="mi">6000000</span><span class="p">,</span> - <span class="nt">"maxSnapshotPixelSize"</span><span class="p">:</span> <span class="mi">4000000</span><span class="p">,</span> - <span class="nt">"requiredEXIFPreviewSize"</span><span class="p">:</span> <span class="p">{</span> - <span class="nt">"width"</span><span class="p">:</span> <span class="mi">1200</span><span class="p">,</span> - <span class="nt">"height"</span><span class="p">:</span> <span class="mi">1222</span> - <span class="p">}</span> -<span class="p">}</span></pre> -</div> - -<p><code>maxImagePixelSize</code> and <code>maxSnapshotPixelSize</code> are maximum pixel sizes of an image Gallery and Camera is allowed to view. Default to 5 mega-pixels (5*2<sup>20</sup> pixels; 5mp).</p> - -<p>Optionally, you can also define variables to specify the minimum EXIF preview size that will be displayed as a full-screen preview by adding <code>requiredEXIFPreviewSize</code> property. If you do not specify this property then EXIF previews will only be used if they are big enough to fill the screen in either width or height in both landscape and portrait mode.</p> - -<h3 id="contacts.json">contacts.json</h3> - -<p>Contacts listed here will be included in the phone's contacts database as soon as Gaia is built.</p> - -<p>Here's an example <code>contacts.json</code> file:</p> - -<pre class="brush: js">[ - { - "name": ["John Doe"], - "givenName": ["John"], - "familyName": ["Doe"], - "nickname": ["Johnny"], - "category": ["Work", "Racing Team"], - "email": [ - { - "type": ["personal"], - "value": "john.doe@example.org", - "pref": true - }, - { - "type": ["work"], - "value": "jdoe@example.com" - } - ], - "adr": [ - { - "type": ["personal"], - "streetAddress": "123 Foopy St.", - "locality": "San Francisco", - "region": "Downtown", - "postalCode": "94030", - "countryName": "US" - } - ] - }, - { - "name": ["CarrierX"], - "email": [ - { - "type": ["work"], - "value": "support@carrierx.com" - } - ], - "url": [ - { - "type": ["work"], - "value": "https://www.carrierx.com" - } - ] - } - ]</pre> - -<div class="note"> -<p><strong>Note</strong>: See the <a href="/en-US/docs/WebAPI/Contacts">Contacts API page</a> for details on the layout of Contacts objects.</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: For SIM-card dependent customizations, see the <a href="#Browser_bookmarks_and_default_search_engine">Browser bookmarks and default search engine</a> section.</p> -</div> - -<h3 id="homescreens.json">homescreens.json</h3> - -<p>homescreens.json defines what apps to show in the Firefox OS dock and homescreen, and in which order. By default the file looks like this:</p> - -<pre class="brush: js">{"homescreens": [ - [ - ["apps", "communications", "dialer"], - ["apps", "sms"], - ["apps", "browser"], - ["apps", "camera"] - ] - ]}</pre> - -<p>This causes the four described apps to appear in the dock. If we added another array, that set of apps would appear on page 1 of the homescreen, the next set on page 2, etc.</p> - -<pre class="brush: js">{"homescreens": [ - [ // We're in the dock! - ["apps", "communications", "dialer"], - ["apps", "sms"], - ["apps", "browser"], - ["apps", "camera"] - ], - [ // We're on Page 1 of the homescreen - ["apps", "email"], - ["apps", "settings"], - ["apps", "clock"], - ["apps", "calendar"] - ], - [ // We're on Page 2 of the homescreen - ["external-apps", "customapp1"], - ["external-apps", "customapp2"], - ["external-apps", "customapp3"], - ["external-apps", "customapp4"] - ] - ]}</pre> - -<p>The first item inside each sub-array is the folder the app appears inside; the second is the app directory name.</p> - -<h4 id="Collections">Collections</h4> - -<p>Collections are groups of apps that have their own icon that appears on the homescreen. When this icon is tapped, a new screen appears containing all the icons for the apps in the collection. Have a look at the <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/homescreen/collections">collections directory in the source code</a> to get more of an idea of how these work.</p> - -<p>By default, four Collections are prefilled on the first page of the Gaia homescreen: <em>Social</em>, <em>Games</em>, <em>Music</em>, and <em>Entertainment</em>. In <code>homescreens.json</code> it's possible to define what collections to load, what pages they should appear in and in what order. For example, if we wanted to specify these four default collections to appear, we would write this:</p> - -<pre class="brush: js">{"homescreens": [ - [ - ["apps/homescreen/collections", "social"], - ["apps/homescreen/collections", "games"], - ["apps/homescreen/collections", "music"], - ["apps/homescreen/collections", "showbiz"] - ], [ - ["apps", "communications", "dialer"], - ["apps", "sms"], - ["apps", "browser"], - ["apps", "camera"] - ] - ]}</pre> - -<p>Each top level array position refers to a page of the homescreen. Here, the collections would appear in the dock, and the individual apps would appear on page 1 of the homescreen.</p> - -<div class="note"> -<p><strong>Note</strong>: Collection names are written in lowercase.</p> -</div> - -<p>Collections can be chosen from the following list:</p> - -<ul> - <li><code>showbiz</code>: Discover entertainment apps.</li> - <li><code>funny</code>: Enjoy the latest funny apps.</li> - <li><code>games</code>: Play games online.</li> - <li><code>local</code>: What's happening around you?</li> - <li><code>music</code>: Listen to favorite songs.</li> - <li><code>news</code>: Keep updated with your world news sources.</li> - <li><code>shopping</code>: Follow shopping trends.</li> - <li><code>social</code>: Follow you social networks in everywhere.</li> - <li><code>sports</code>: The best apps about sports.</li> - <li><code>tv</code>: Apps related to media.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: As of Firefox OS 1.3, you can define your own custom collections. You simply create them inside the <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/homescreen/collections">collections directory</a> as explained below, and point to them inside <code>collections.json</code> as shown above.</p> -</div> - -<h4 id="What_collections_contain">What collections contain</h4> - -<p>Collections are composed of two types of app.<br> - <br> - <strong>Local apps</strong> are defined at build time by means of manifest files, located at <code>/apps/homescreen/collections/<collectionName>/manifest.collection</code>. The local apps contained within each collection are defined in the mainfest file. For example, the social collection (contains dialer, sms, contacts and email apps) manifest looks like so:</p> - -<pre class="brush: js">{ - "name": "Social", - "role": "collection", - "provider_id": "289", // adaptive search identifier - "apps": [ - ["apps", "communications", "dialer"], - ["apps", "sms"], - ["apps", "communications", "contacts"], - ["apps", "email"] - ], - "default_locale": "en-US", - "icons": { - "60": "/collections/social/icon.png", - "90": "/collections/social/icon@1.5x.png", - "120": "/collections/social/icon@2x.png" - } - }</pre> - -<p><strong>Remote apps</strong> are supplied by the adaptive search provider at runtimee, when the device is online.</p> - -<h4 id="How_to_translate_collections">How to translate collections</h4> - -<p>Collection translations have to be defined in locale files in within the homescreen app, in the <code>apps/homescreen/locales/</code>. directory. Each different locale file has a name structure looking like <code>collections.<langCode>.properties</code> — where <code><langCode></code> is for example <code>fr</code> for French — and contains simple lines containing the default English string and translated version. An example from the French locale file follows:</p> - -<pre><span class="c1"># Add bookmark to homescreen</span><span class="na"> -add-to-home-screen</span><span class="o">=</span><span class="s">Ajouter à l’écran d’accueil</span><span class="na"> -add-to-home-screen-header</span><span class="o">=</span><span class="s">Ajouter un lien</span><span class="na"> -website-name</span><span class="o">=</span><span class="s">Nom du site web</span><span class="na"> -address</span><span class="o">=</span><span class="s">Adresse</span><span class="na"> -added-to-home-screen</span><span class="o">=</span><span class="s">Ajouté à l’écran d’accueil</span></pre> - -<h3 id="network.json_(not_in_customization_folder)">network.json (not in customization folder)</h3> - -<div class="warning"> -<p><strong>Important</strong>: This is no longer supported in Firefox OS 1.4.</p> -</div> - -<p>In Firefox OS < 1.4, this file can be created in <code>gaia/apps/settings/resources</code>, and it allows you to set the network types supported by the device. Firefox OS supports the following types:</p> - -<ul> - <li>'wcdma/gsm' (WCDMA preffered)</li> - <li>'gsm'</li> - <li>'wcdma'</li> - <li>'wcdma/gsm-auto' (GSM preffered)</li> - <li>'cdma/evdo' (CDMA preffered)</li> - <li>'cdma'</li> - <li>'evdo'</li> - <li>'wcdma/gsm/cdma/evdo' (Automatic)</li> -</ul> - -<p>An example is as follows:</p> - -<pre class="brush: js">{ - "types": [ - "cdma/evdo", - "cdma", "evdo" - ] -}</pre> - -<h3 id="sensors.json">sensors.json</h3> - -<p>Defines the sensor capabilities of the device. By default it contains:</p> - -<pre class="brush: js">{ "ambientLight": true }</pre> - -<p>You can set the value to <code>false</code> if you want to disable device sensor capabilities.</p> - -<h3 id="settings.json">settings.json</h3> - -<p>This file allows you to set default wallpaper/ringtones, lockscreen enable/disable, bluetooth on/off, etc. You can consult <a href="https://github.com/mozilla-b2g/gaia/blob/master/build/config/common-settings.json">build/config/common-settings.json</a> to find out what settings can be set in <code>settings.json</code>; for example you can set <code><span class="nt">"wifi.enabled"</span><span class="p">:</span> <span class="kc">false</span></code> to disable wifi by default.</p> - -<h4 id="Customize_default_Homescreen_APP">Customize default Homescreen APP</h4> - -<p>homescreen.appName allows you to set specific APP as default Homescreen APP.</p> - -<div class="code-body highlight"> -<pre class="line"><span class="p">{</span> <span class="nt">"homescreen.appName"</span><span class="p">:</span> <span class="s2">"homescreen-stingray"</span> <span class="p">}</span></pre> -</div> - -<h3 id="sms-blacklist.json">sms-blacklist.json</h3> - -<p>This file contains a custom SMS blacklist: numbers specified in this file can't have SMS message sent to them. This list will overwrite <code>blacklist.json</code> file in the SMS app. The numbers are specified in an array, like so:</p> - -<pre>["11223344", "55667788"]</pre> - -<h3 id="cellbroadcast">cellbroadcast</h3> - -<p>Listening Channels:</p> - -<ul> - <li>availability: runtime: Settings — <code>ril.cellbroadcast.searchlist</code></li> - <li>type: string</li> - <li>valid format: <code>\d(-\d)?(,\d(-\d))*</code></li> -</ul> - -<p>Disable event reporting:</p> - -<ul> - <li>availability: - <ul> - <li>run time: Settings — <code>ril.cellbroadcast.disabled</code></li> - <li>build time: Preference — <code>ril.cellbroadcast.disabled</code></li> - </ul> - </li> - <li>type: boolean</li> - <li>meaning: true to completely shutdown Cell Broadcast reporting.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: Default settings are available in <a href="https://mxr.mozilla.org/gaia/source/shared/resources/apn/operator_variant.xml">operator_variant.xml</a>.</p> -</div> - -<h3 id="support.json">support.json</h3> - -<p>This file contains support contacts, including online support & telephone support. When included, this file will overwrite <code>support.json</code> in the Settings app. Since these customizations will overwrite the default settings, if you want to keep default settings and add some extra resources you should copy those settings from the built-in apps and add your own customization onto them.</p> - -<p>Here's an example of what the JSON should look like:</p> - -<pre class="brush: js">{ - "onlinesupport": { - "href": "http://support.mozilla.org/", - "title": "Mozilla Support" - }, - "callsupport": [ - { - "href": "tel:12345678", - "title": "Call Support 1" - }, - { - "href": "tel:87654321", - "title": "Call Support 2" - } - ] - }</pre> - -<h3 id="WAP_user_agent_profile_(wapuaprof.json)">WAP user agent profile (wapuaprof.json)</h3> - -<p>The WAP user agent profile overrides the user agent information when sending WAP packets. If you want to override the default WAP user agent profile based on MCC/MNC, you can use this one to do it (further explained in <a href="#runtime_customization">runtime customization</a>).</p> - -<h3 id="apps.list">apps.list</h3> - -<p>This allows you to specify which apps you want to load up at runtime (in a similar manner to <code>variant.json</code>, as explained in the <a href="#Applications">Applications</a> section below.) The applications are specified like so:</p> - -<pre class="brush: bash">apps/* -external-apps/* -outoftree_apps/*</pre> - -<p>You can specify individual apps rather than whole folders of apps, like this:</p> - -<pre class="brush: bash">apps/email -apps/settings</pre> - -<div class="note"> -<p><strong>Note</strong>: If you want to include custom external apps as part of your Gaia build, you need to build them in a specific way, and then place them into the <code>gaia/external-apps/</code> folder. Read <a href="#Building_Prebundled_web_apps">Building Prebundled web apps</a> to find out how.</p> -</div> - -<div class="warning"> -<p><strong>Important</strong>: Apps that you add as part of a customized Firefox OS build need to be added in agreement with Mozilla's Distribution Agreement.</p> -</div> - -<h2 id="Other_customization_options">Other customization options</h2> - -<p>There are many other customizations that can be made, which we should explore more. Let's look at them now.</p> - -<div class="note"> -<p><strong>Note</strong>: The build script used in many of the below sections can be found in <a href="https://github.com/mozilla-b2g/gaia/blob/master/build/applications-data.js">gaia/build/applications-data.js</a>. This gets copied into an <code>init.json</code> file in the browser app directory at build time.</p> -</div> - -<h3 id="Browser_bookmarks_and_default_search_engine">Browser bookmarks and default search engine</h3> - -<p>The default bookmarks and default search engine can be customised at build time, with different variants for each country and network in a single build. The customised data is inserted into the browser app the first time it is run, based on the <a href="http://en.wikipedia.org/wiki/Mobile_country_code">MCC and MNC</a> codes of the SIM card present in the device at the time.</p> - -<div class="note"> -<p><strong>Note</strong>: Bookmarks can be customised in Firefox OS 1.0.1+; default search engines can be customised in Firefox OS 1.2+.</p> -</div> - -<p>The example below (<code>browser.json</code>) shows a configuration for Vivo in Brazil (724006, where 724 is Brazil and 006 is Vivo according to the MCC and MNC codes), along with a default fallback (000000) in case a non-matching SIM card or no SIM card is present.</p> - -<pre class="brush: js">content = { - '000000': { - 'bookmarks': [ - { 'title': 'Mozilla', - 'uri': 'http://mozilla.org', - 'iconUri': - 'data:image/png;base64,AAABAAIAEBAAAAEAIABo[truncated]' - }, - { 'title': 'Firefox OS', - 'uri': 'http://mozilla.org/firefoxos', - 'iconUri': - 'data:image/png;base64,AAABAAIAEBAAAAEA[truncated]' - } - ], - 'searchEngines' : [ - { - 'title': 'Google', - 'uri': 'http://www.google.com/search?q={searchTerms}', - 'iconUri': - 'data:image/png;base64,AAABAAIAEBAAAAEAIABoBAA[truncated]' - } - ], - 'settings' : { - 'defaultSearchEngine': 'http://www.google.com/search?q={searchTerms}' - } - }, - - '724006': { - "bookmarks": [ - { "title": "Vivo Busca", - "uri": "http://www.google.com.br/m/search", - "iconUri": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAC[truncated]" - }, - { "title": "Serviços e Downloads", - "uri": "http://vds.vivo.com.br", - "iconUri": "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACA[truncated]" - }, - { - "title": "Site Vivo", - "uri": "http://www.vivo.com.br/conteudosmartphone", - "iconUri": "data:image/jpg;base64,/9j/4AAQSkZJRg[truncated]" - } - ], - 'searchEngines' : [ - { - 'title': 'Yahoo', - 'uri': 'http://search.yahoo.com/search?q={searchTerms}', - 'iconUri': - 'data:image/png;base64,AAABAAIAEBAAAAEAIABoBAA[truncated]' - } - ], - 'settings' : { - 'defaultSearchEngine': 'http://search.yahoo.com/search?q={searchTerms}' - } - } - };</pre> - -<p>In the example, if a Vivo SIM card from Brazil is entered on first run the user will see Vivo bookmarks and Yahoo as the default search engine. If another SIM card or no SIM card is entered on first run the user will see Mozilla bookmarks and Google as the default search engine. There are a few important parts to note:</p> - -<ul> - <li>The <code>defaultSearchEngine</code> property <em>must</em> match the <code>uri</code> property of the search engine specified. This string acts as a template for the <code>{searchTerms}</code> placeholder, which will get replaced with the user's search query at run time. Other values such as search strings may be appended to the query string in the URL template.</li> - <li>The favicon URLs shown are base64 encoded data URLs of the image data (truncated for brevity) rather than HTTP URLs. This is recommended so that the icons will still appear the first time the browser is run, even if the user has not connected to the Internet yet.</li> - <li>Notice that multiple customisations can be applied for different networks and different countries in a single build, with a different 6 digit code representing each variant. The 6 digit code is constructed from the MCC code plus the MNC code, each padded with zeros to ensure it is 3 digits long.</li> - <li>When populating the default data the browser will first look for an exact match with the MCC and MNC codes, then if there is no match it will look for MCC+000, and finally if there's still no match it will fall back to 000+000.</li> - <li>When upgrading between versions of Gaia, new customisations will only be applied if that type of customisation is a new feature in the new version of Gaia being upgraded to. Previous customisations will not be overwritten.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: The browser application will show bookmarks in reverse order, the first bookmark in the json will be shown the last one and so on.</p> -</div> - -<h3 id="Data_and_messaging_settings">Data and messaging settings</h3> - -<p>Device data and messaging settings are runtime customizable.</p> - -<p>To apply specific settings, change <code>gaia/shared/resources/apn/apns_conf_local.xml</code>, simply adding or editing carrier blocks as required:</p> - -<pre class="brush: xml"> <apn carrier="Test Network" - mcc="001" - mnc="01" - apn="internet" - user="user" - password="password" - proxy="127.0.0.1" - port="8080" - mmsc="http://127.0.0.1" - mmsproxy="127.0.0.1" - mmsport="8080" - authtype="0" - type="default,supl,mms" - /></pre> - -<h3 id="Voicemail_and_cell_broadcast_settings">Voicemail and cell broadcast settings</h3> - -<p>To apply specific voicemail and cell broadcast settings, change <code>gaia/shared/resources/apn/operator_variant.xml</code>. Add or edit a carrier block, changing attributes as needed:</p> - -<pre class="brush: xml"> <operator carrier="Test Network with Operator Variant Settings" - mcc="001" - mnc="01" - cellBroadcastSearchList="0,1,2,3" - voicemail="999999" - /></pre> - -<h3 id="WAP_user_agent_profile">WAP user agent profile</h3> - -<p>The WAP user agent profile is another app that supports runtime customization. It overrides the user agent information when sending WAP packets, based on MCC/MNC. The profile overriding has <code>url</code> and <code>tagname</code> parts, but we only support <code>url</code> in our current implementation.</p> - -<p>The WAP user agent profile uses the same coding style for its key as the browser app, although "000000" is used as the default profile. An example follows:</p> - -<pre class="brush: js"> { - "000000": { - "url": "http://example.url/default.xml" - }, - "123001": { - "url": "http://example.url/custom123001.xml" - } - }</pre> - -<p>In this example, the <code>url</code> of the default profile is <code>http://example.url/default.xml</code>; for mcc = 123 and mnc = 001, the <code>url</code> <code>is http://example.url/custom123001.xml</code>. If there was another ic card with mcc = 123 and mnc=100, its url would be <code>http://example.url/default.xml</code>.</p> - -<p>If the 000000 is removed from this example, like so:</p> - -<pre class="brush: js"> { - "123001": { - "url": "http://example.url/custom123001.xml" - } - }</pre> - -<p>the <code>url</code> of UA profile of ic card with mcc = 123, mnc = 001 is now overridden as <code>http://example.url/custom123001.xml</code>. No others will be overridden.</p> - -<p>If we have the "000000" as before, but we also have a "123001" case with no <code>url</code> inside it, like so:</p> - -<pre class="brush: js"> { - "000000": { - "url": "http://example.url/default.xml" - }, - "123001": {} - }</pre> - -<p>All UA profile urls are now overridden as <code>http://example.url/default.xml</code></p> - -<h3 id="Applications">Applications</h3> - -<p>Applications installed in Firefox OS can be customized at runtime, in a number of ways (see also <a href="/en-US/Firefox_OS/Platform/Gaia/Hacking#Customizing_the_build-time_apps">Customizing the build-time apps</a>). Perhaps the most powerful way is to edit the <code>variant.json</code> configuration file, which allows apps to be selectively installed and placed in the desired position in the homescreen, depending on the MCC/MNC. The customized applications will be added to the standard applications list.</p> - -<p>The relevant part of the <code>variant.json</code> file typically looks like so.</p> - -<pre class="brush: js"> { - "apps": { - "puzzle": - { - "manifestURL": "https://owd.tid.es/store/packages/fe8e4a866c518a42db9d2041568684c1.webapp" - }, - "store": - { - "manifestURL": "https://owd.tid.es/store/manifest.webapp", - "installOrigin": "https://www.openwebdevice.com" - } - }, - "operators": [ - { - "id": "movistar-co", - "mcc-mnc": [ - "214-01", - "214-02" - ], - "apps": [ - { - "id": "store", - "screen": 0, - "location": 2 - } - ] - }, - { - "id": "movistar-mx", - "mcc-mnc": [ - "215-23" - ], - "apps": [ - { - "id": "store", - "screen": 0, - "location": 2 - }, - { - "id": "puzzle" - } - ] - } - ] - }</pre> - -<ul> - <li>The first object of the JSON is called <code>apps</code>, and defines the custom applications to be copied at buildtime. The example uses two applications, one hosted (store) and one packaged (puzzle). Notice that while packaged apps only require the <code>manifestURL</code>, hosted ones also need the <code>installOrigin</code> in order to download them.</li> - <li>The second object, called <code>operators</code>, is responsible of the configuration based on MCC/MNC. The object contains an array of objects for each MCC/MNC pair. These objects define the <code>id</code> of the operator, a MCC/MNC list for the configuration and a list of <code>apps</code> objects defining which applications are going to be installed at runtime in each case.</li> - <li>Each <code>apps</code> object requires an <code>id</code> property and has two optional arguments to set the position in the homescreen: - <ul> - <li>The <code>screen</code> property sets the screen number.</li> - <li>The <code>location</code> property sets the position on that screen.</li> - </ul> - </li> -</ul> - -<h3 id="Support_contacts_default_contacts_wallpaper_ringtone">Support contacts, default contacts, wallpaper & ringtone</h3> - -<p>The same file <code>variant.json</code> file — used to configure applications at runtime depending on the MCC/MNC — also allows you to configure specific resources by adding some attributes under each operator object. Thus, an operator can have the following settings:</p> - -<pre class="brush: js"> { apps: ... - "operators": [ - { - "id": "movistar-co", - "mcc-mnc": [ - "214-01", - "214-02" - ], - "apps": [ - { - "id": "store", - "screen": 0, - "location": 2 - } - ], - "support_contacts": "resources/support_contacts_movistar.json", - "default_contacts": "resources/contacts_movistar.json", - "ringtone": { - "path": "resources/Movistar_Mid_ABR_128kbps.ogg", - "name": "Tono Movistar" - }, - "wallpaper": "resources/customize.jpg" - }, - ... - }</pre> - -<p>For each operator:</p> - -<ol> - <li><code>support_contacts</code> specifies a path to a file containing contacts to be shown on the help screen (<code>Settings > Help</code>), offering the same functionality as <a href="#support.json">support.json</a>. The file format is: - - <pre class="brush: js"> { - "onlinesupport": { - "title": "Mozilla Support", - "href": "http://test.mozilla.org/support" - }, - "callsupport1": { - "title": "Call Support (Primary)", - "href": "tel:14155550001" - }, - "callsupport2": { - "title": "Call Support (Secondary)", - "href": "tel:14155550002" - } - }</pre> - </li> - <li><code>default_contacts</code> contains the path to a file containing contacts that will be preloaded to the Contacts application, depending on the MCC/MNC pair present at run time. The section names are the MCC/MNC pair, and section contents should be an array of contacts following the same format as <a href="#contacts.json">contacts.json</a>. For example: - <pre class="brush: js"> { - "123123": - [ - {name: ["John Doe"]}, - // etc - ], - } -</pre> - </li> - <li><code>ringtone</code> sets the default ringtone and contains two attributes, both mandatory: - <ul> - <li>path: The path to the ringtone audio file.</li> - <li>name: The name to display when the ringtone is shown in settings.</li> - </ul> - </li> - <li><code>wallpaper</code> contains the path to the image file (PNG) that will be set as a default wallpaper.</li> -</ol> - -<h2 id="Building_Prebundled_web_apps">Building Prebundled web apps</h2> - -<p>Earlier on, we discussed the <a href="#apps.list">apps.list</a> file, and how this can be used to add built-in apps to your build. These apps need to be built in a certain way, then added to the <code>gaia/external-apps</code> directory.<br> - <br> - To build Prebundled web apps, you can utilize our <a href="https://github.com/yurenju/gaia-preload-app">gaia-preload-app</a> script, which builds a prebundled webapp from a given <code>.webapp</code> URL. It can accept hosted web app manifests, or packaged app mini-manifests.</p> - -<h3 id="To_bundle_a_single_web_app">To bundle a single web app</h3> - -<p>Find a <code>.webapp</code> URL that want to bundle, and run the command to bundle it, as follows:</p> - -<pre>python preload.py http://<webapp url></pre> - -<p>This will generate a directory with the same name as the target webapp's name, e.g. <code>accuweather</code>.</p> - -<h3 id="Batch_process_to_bundle_multiple_web_apps">Batch process to bundle multiple web apps</h3> - -<p>You can create a file called <code>list</code>, containing all the app names and <code>.webapp</code> locations you want to bundle all together in a batch. The format is:</p> - -<pre> myFirstApp,https://www.firstapp.com/manifest.webapp - mySecondApp,https://www.secondapp.com/manifest.webapp - etc.</pre> - -<p>You need to save this <code>list</code> file in the same directory as our <code>preload.py</code> script, then run the following command:</p> - -<pre> $ python preload.py</pre> - -<p>The <code>preload.py</code> script will parse the list file and do the batch conversion for you.</p> - -<h3 id="Prebundled_web_app_metadata.json">Prebundled web app metadata.json</h3> - -<p>Every Prebundled webapp should have a <code>metadata.json</code> file contained within its root directory. The <a href="https://marketplace.firefox.com/">Firefox Marketplace</a> counts on this <code>metadata.json</code> file for auto-updating. This file is auto-generated by the preload.py script.<br> - <br> - For a hosted webapp, the properties of <code>metadata.json</code> are:</p> - -<ul> - <li><code>origin</code>: The domain name from the webapp url.</li> - <li><code>manifestURL</code>: The location of the web app manifest for a hosted app.</li> - <li><code>installOrigin(hosted)</code>: The location the app was installed from in the customization. For customizations, this should always be <code>https://marketplace.firefox.com</code>.</li> - <li><code>etag</code>: this is the webapp manifest <code>etag</code> used for checking for updates. The <code>etag</code> value is retrieved by the <code>parse</code> <code>html</code> header when downloading the <code>.webapp</code> file from the server.</li> - <li><code>"removable": false</code>; Set this to <code>true</code> to make this app not removable from the homescreen.</li> - <li><code>"type": "hosted"</code>; Set the <code>type</code> to <code>hosted</code> to get standard web permissions for your app. <code>privileged</code> and <code>certified</code> types are not allowed for hosted webapps.</li> -</ul> - -<p>For a packaged webapp, the properties of <code>metadata.json</code> are:</p> - -<ul> - <li><code>origin</code>: The origin will be <code>app://<app name></code>, e.g. <code>app://poppit</code>.</li> - <li><code>manifestURL</code>: This should be the location of the mini-manifest. For customizations right now, the <code>manifestURL</code> will always be a mini-manifest from <code>marketplace.firefox.com</code>.</li> - <li><code>installOrigin(hosted)</code>: The location the app was installed from in the customization. For customizations, this should always be <code>https://marketplace.firefox.com</code>.</li> - <li><code>etag</code>: This is the webapp manifest <code>etag</code> used for checking for updates. The <code>etag</code> value is retrieved by the <code>parse html</code> header when downloading the <code>.webapp</code> file from the server.</li> - <li><code>packageEtag</code>: This is the app package's <code>etag,</code> retrieved by the <code>parse html</code> header when downloading the package from the server once an update has been detected.</li> - <li><code>"removable": false</code>; Set this to <code>true</code> to make this app not removable from the homescreen.</li> - <li><code>"type": "privileged"</code>; Set the <code>type</code> to <code>privileged</code> to get extra permissions; set the <code>type</code> as <code>certified</code> to get the highest permission level available for Firefox OS system resources.</li> -</ul> - -<h3 id="Packaged_web_app_update.webapp_format">Packaged web app update.webapp format</h3> - -<p>Packaged webapps have an <code>update.webapp</code> file, which is used for auto-updates. The format is similar to <code>manifest.webapp</code>, but you have to include additional attributes:</p> - -<ul> - <li><code>package_path</code> is the path to the packaged (zip) file.</li> - <li><code>size</code> is the package size, in bytes.</li> -</ul> - -<pre class="brush: js"> { - "name": "Game Pack", - "icons": {"60": "/icon-60.png", "128": "/icon-128.png"}, - "version": "1.1.2", - "package_path": "/application.zip", - "developer": {"url": "http://abc.com", "name": "abc Inc."}, - "release_notes": "2nd release", - "locales": {"es": {"launch_path": "/index-es.html", "description": "show me customization."}}, - "size": 5460141 - }</pre> - -<h3 id="Pre-bundled_web_app_AppCache_format">Pre-bundled web app AppCache format</h3> - -<p>If your web app's <code>manifest.webapp</code> has an <code>appcache_path</code> included in it, the <code>preload.py</code> script will fetch the AppCache file pointed to, and pre-fetch all the resources described in the AppCache file. The Pre-bundled webapp AppCache is a bit different, as Gecko recognizes a different format, but this is auto generated by the <code>preload.py</code> script.</p> - -<p>The translated file structure is:</p> - -<pre> <app name> - ├── manifest.webapp - └── cache - ├── manifest.appcache - └── <resources> -</pre> - -<div class="note"> -<p><strong>Note</strong>: If a different name is given to the AppCache file in the <code>appcache_path</code>, it needs to be renamed to <code>manifest.appcache</code> and saved in the <code>cache</code> folder.</p> -</div> - -<h2 id="FAQ">FAQ</h2> - -<p>The following is a list of common questions about market customizations, and their answers.</p> - -<h3 id="What_can_be_customized">What can be customized?</h3> - -<ul> - <li>Brand - <ul> - <li>Start up & Power off animations</li> - <li>Network name on Lock screen and in Utility Tray.</li> - <li>First Run Experience logos</li> - </ul> - </li> - <li>Localization - <ul> - <li>Installed locales (shared/locales)</li> - <li>Default locale (<code>GAIA_DEFAULT_LOCALE</code>)</li> - <li>Default keyboard layouts (Multiple keyboards can be enabled, not tied to locale)</li> - </ul> - </li> - <li>Apps - <ul> - <li>Preinstalled third party apps (Handled by <code>customize.py</code>)</li> - <li>Home grid app placement (Handled by <code>customize.py</code>)</li> - <li>Licensing</li> - <li>In-app payment provider configuration</li> - </ul> - </li> - <li>Settings - <ul> - <li>Default screen brightness</li> - <li>Device Information — Model (name or #)</li> - <li>Device Information — Legal Information link or content</li> - <li>Help — Online support link</li> - <li>Help — Call support phone number</li> - <li>Help — User guide link</li> - <li>APN</li> - <li>MMS message size limitation</li> - <li>MMS message retrieval mode</li> - </ul> - </li> - <li>Media preloads - <ul> - <li>Wallpapers</li> - <li>Music</li> - <li>Videos</li> - <li>Gallery</li> - </ul> - </li> - <li>Sounds - <ul> - <li>Start up & Power off</li> - <li>Ring tone</li> - <li>Message tone</li> - </ul> - </li> - <li>Everything.me - <ul> - <li>Option to enable or disable the feature</li> - <li>Set of default categories and apps</li> - </ul> - </li> - <li>Browser - <ul> - <li>Default bookmarks</li> - <li>Default search engine</li> - </ul> - </li> -</ul> - -<h3 id="How_and_where_do_you_define_a_customized_app_grid_layout">How and where do you define a customized app grid layout?</h3> - -<p>This is currently defined in <code>gaia/apps/homescreen/js/init.json</code>. <code>customize.py</code> takes care of building this in the correct format.</p> - -<h3 id="Is_it_possible_to_define_whether_an_app_is_removable_in_the_homescreen_configuration">Is it possible to define whether an app is removable in the homescreen configuration?</h3> - -<p>No. All apps in <code>/system/b2g</code> are non removable, those in <code>/data</code> are removable. Since all preloaded apps come from <code>/system</code>, we need to move them to <code>/data</code> if we want them to be removable.</p> - -<h3 id="How_do_you_add_a_preloaded_packaged_or_hosted_app_to_the_build">How do you add a preloaded packaged or hosted app to the build?</h3> - -<p>These should both be added to <code>gaia/external-apps</code>. <code>customize.py</code> will allow entry of the URL to a packaged app or a hosted app manifest, and will download it into the correct place and create <code>metadata.json</code>. This will serve as the "build step".</p> - -<p>We have different metadata for packaged and hosted apps to distinguish them.</p> - -<p>See <a href="#Building_Prebundled_web_apps">Building Prebundled web apps</a> for more details.</p> - -<h3 id="How_do_you_prepare_a_preloaded_hosted_app_for_initial_offline_support">How do you prepare a preloaded hosted app for initial offline support?</h3> - -<p>You need to provide all the files to cache in the directory <code>external-apps/MY_APP/cache</code>, along with the AppCache manifest.</p> - -<p>Again, see <a href="#Building_Prebundled_web_apps">Building Prebundled web apps</a> for more details.</p> - -<h3 id="What_Marketplace_Customizations_Are_Possible">What Marketplace Customizations Are Possible?</h3> - -<ul> - <li>On-device - <ul> - <li>The customization on the device regarding payments is limited to populating a whitelist of payment providers. There are a couple prefs for this, documented on <a href="https://wiki.mozilla.org/WebAPI/WebPayment#Testing">Web Payments</a>.</li> - <li>For example, Mozilla B2G phones will ship with <a href="https://github.com/mozilla/webpay#readme">our implementation of the payment provider</a> in a whitelist so that it is accessible to the Marketplace and third party apps for in-app purchases via <a href="/zh-CN/docs/Web/API/Navigator/mozPay" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozPay</code></a>. Some more info on providers is available at <a href="https://wiki.mozilla.org/WebAPI/WebPaymentProvider">Web Payment Providers</a>.</li> - <li>If any carrier wants to implement their own payment processor and whitelist it, they are free to do so. However, the <a href="https://marketplace.firefox.com/">Firefox Marketplace</a> is only configured to enable purchases through Mozilla's payment provider at this time.</li> - </ul> - </li> - <li>On-server - <ul> - <li>The merchant app sets a price point for the product and Mozilla's backend payment processor chooses the currency based on the user's network. None of currency, regional taxation, or L10N is controlled by device configs (yet).</li> - <li>Category in the Firefox Marketplace specific to the carrier with your operator logo/name in the region.</li> - <li>Featured apps / promotions in the Firefox Marketplace, specified by the Carrier.</li> - </ul> - </li> -</ul> - -<p>There are many other considerations when adding a region or carrier. See <a href="https://wiki.mozilla.org/Marketplace/AddingRegionsAndCarriers">Adding Regions and Carriers</a> for more details.</p> - -<h3 id="How_do_I_package_and_store_per-market_customization_changes">How do I package and store per-market customization changes?</h3> - -<p>Store only the files changed; currently these are in various locations in the filesystem. In B2G v2, we are considering consolidating these into a single location, similar to the branding directories we have for Gecko.</p> - -<h3 id="How_do_you_build_the_product_with_a_specific_market's_configuration">How do you build the product with a specific market's configuration?</h3> - -<p>Copy your changed files into a checkout of Gaia, and build using that modified Gaia. <code>customize.py</code> will provide a UI for setting relevant switches, create the appropriate files in the appropriate places in the gaia checkout, and then build the profile from that gaia.</p> - -<h3 id="How_to_customize_power_on_off_animation">How to customize power on / off animation?</h3> - -<ul> - <li>This animation uses <a href="http://www.droidforums.net/forum/droid-hacks/33932-bootanimation-zip-file-explained.html">Android's <code>bootanimation.zip</code>/<code>desc.txt</code> format</a>.</li> - <li>This lets us create multi-part animation sequences where we can specify things like size, framerate, and number of times an animation sequence loops for each part.</li> - <li>There is also an animated PNG transition animation that bridges the gap between this <code>bootanimation.zip</code> sequence and the transition to the lockscreen, which is performed by Gaia.</li> - <li>The size on disk of the default animation is 8.2MB (looping) + 3.6MB (frame 18 transition) = 11.8MB total.</li> - <li>Currently, the shutdown animation is a custom css animation based on a design specified in <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=809342" title="FIXED: [System] Need a shutdown animation implementation">bug 809342</a>.</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/developing_firefox_os/modifying_hosts_file/index.html b/files/zh-cn/archive/b2g_os/developing_firefox_os/modifying_hosts_file/index.html deleted file mode 100644 index 569bd5b114..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_firefox_os/modifying_hosts_file/index.html +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: 修改 hosts 文件 -slug: Archive/B2G_OS/Developing_Firefox_OS/modifying_hosts_file -tags: - - Android - - B2G - - Firefox OS - - hosts -translation_of: Archive/B2G_OS/Developing_Firefox_OS/modifying_hosts_file ---- -<div class="summary"> - <p>由于遭受攻击，阻止不希望的连接，将请求重定向到一个特定 IP 等原因，有时您需要对机器上的 hosts 文件进行编辑。本文则阐述了如何修改您 Fiefox OS 手机上的 hosts 文件。 在 Linux 系统下，它位于 /system/etc 目录下，而在 Mac OSX 系统下，位于 /etc 目录下。</p> -</div> -<h2 id="准备您的手机">准备您的手机</h2> -<p>打开手机，进入<a href="/en-US/Firefox_OS/Debugging/Developer_settings#The_Developer_panel">开发者设置面板Developer settings panel</a> 检查一下：</p> -<ul> - <li>"远程调试" (在 Firefox OS 1.4 以及以上版本，在 select 菜单中选择 "ADB and Devtools" )</li> - <li>"终端使能"</li> -</ul> -<p>将手机插入您的电脑上。</p> -<p>下面，修改 hosts 文件的步骤就与 Android 相同了。 Android开发者则能够快速的进行设置。</p> -<h2 id="终端中的步骤">终端中的步骤</h2> -<ol> - <li>打开终端窗口</li> - <li>重新装载设备上的 /system 分区，以获得读-写 权限。 - <pre class="brush: bash">adb remount</pre> - </li> - <li>在电脑上获取 hosts 文件 - <pre class="brush: bash">adb pull /system/etc/hosts /tmp</pre> - </li> - <li>按照所需修改 /tmp/hosts 文件并保存。例如 : - <pre class="brush: bash">127.0.0.1 localhost -ip.to.re.direct hostName</pre> - </li> - <li>将修改的 hosts 文件推送到设备 - <pre class="brush: bash">adb push /tmp/hosts /system/etc/hosts</pre> - </li> -</ol> -<p>这样就完成啦，您的 hosts 文件现在就应更新啦。</p> -<div class="note"> - <p><b>注意</b>: 要了解更多关于 ADB 的内容，请参考 <a href="http://developer.android.com/tools/help/adb.html" title="http://developer.android.com/tools/help/adb.html">ADB 文档</a>。</p> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/developing_firefox_os/quickstart_guide_to_gaia_development/index.html b/files/zh-cn/archive/b2g_os/developing_firefox_os/quickstart_guide_to_gaia_development/index.html deleted file mode 100644 index 6000b95c7d..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_firefox_os/quickstart_guide_to_gaia_development/index.html +++ /dev/null @@ -1,193 +0,0 @@ ---- -title: Gaia 开发快速入门 -slug: Archive/B2G_OS/Developing_Firefox_OS/Quickstart_guide_to_Gaia_development -translation_of: Firefox_OS/Developing_Gaia ---- -<div class="summary"> -<p>本指南提供了关于Gaia apps调试和开发的快速入门步骤，内容包括在桌面版Firefox中运行Gaia和Firefox OS App Manager中运行Gaia。 在阅读指南之前，您需要具备如下条件： 了解HTML5技术，熟悉MVC设计模式并且对Firefox OS 有着强烈的兴趣。在学习完成本指南后，您能够掌握如下知识： Gaia app的基本架构，修改Gaia apps的基本工作流程以及如何对apps进行测试。</p> -</div> - -<h2 id="您需要什么">您需要什么?</h2> - -<p>有两种方式对Gaia/B2G的开发环境进行配置，分别是配置本地的环境或者使用 FoxBox 编译环境. 下面就让我们分别通过这两种方式来运行Gaia吧！</p> - -<h3 id="配置本地环境">配置本地环境</h3> - -<ol> - <li>首先，您要完成对<a href="http://git-scm.com/book/en/Getting-Started-Installing-Git">Git的安装</a>.如果您更喜欢在可视化环境下工作，可以考虑安装下Github客户端 (<a href="http://mac.github.com/">GitHub for Mac</a> / <a href="http://windows.github.com/">GitHub for Windows</a>).Git可以更新代码，对更改进行提示以及观察其他开发者的工作，因此十分有必要来熟练掌握它。</li> - <li>然后就是在本地机器上要获得一份Moziila Gaia的仓库: <a href="https://github.com/mozilla-b2g/gaia">https://github.com/mozilla-b2g/gaia</a>. 最好的方式就是fork这份仓库，并且通过使用命令<code>git clone https://github.com/<your github name>/gaia.git</code>.将您fork的仓库clone到本机的电脑上。由于仓库相当大，大约在700M左右，可能需要花费一些时间。</li> - <li>完成上面的步骤，您就可以在终端中进入仓库 (<code>cd gaia</code>) 并且运行 <code>DEBUG=1 make</code> 命令编译以及配置调试模式下的Gaia仓库。命令运行中会下载 <a href="/zh-CN/docs/Mozilla/Projects/XULRunner">XULRunner</a> -- 我们可以使用它对Mozilla运行时的包进行安装，更新和卸载，还可以使用它执行所需的编译步骤。 - <div class="note"><strong>Note</strong>:如果您想要了解更多，可参考<a href="/zh-CN/Firefox_OS/Platform/Gaia/Hacking#Make_options">Gaia Make options</a>。</div> - </li> - <li>在完成工作区的配置后, 就需要来安装<a href="http://nightly.mozilla.org/">Firefox Nightly 版本</a>。</li> - <li>在Nightly版本中, 可以选择是使用火狐仿真器扩展插件还是App Manager插件，这主要取决于您到底喜欢哪种工作流程.如果身边没有可用的物理设备，但选择使用APP Manager的方式，虽然 The App Manager 扩展插件已经预安装在nightly 版本中，但是您仍然需要安装 <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/">Firefox OS simulator</a>。</li> - <li>安装 <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/">ADB helper </a>来调试手机等远程设备。</li> - <li>您可能想要获得一部 Firefox OS 手机. 在手机上可以获取到诸如应用程序的启动事件，帧速率等各种使用信息。同样，一旦能够在设备上运行真实的操作系统，您也可以轻松的对所有支持的设备APIs进行测试。</li> -</ol> - -<h3 id="配置FoxBox虚拟环境">配置FoxBox虚拟环境</h3> - -<p>FoxBox是指包含在VM(虚拟机）中的Firefox OS编译环境，由 Vagrant 和 VirtualBox提供。它有许多优点，最主要的就是在可以为您完成大量的配置工作，从而使您能够专心的进行开发工作。要了解它的完整的内容，可以阅读 <a href="https://github.com/gasolin/foxbox">FoxBox GitHub repo README</a>.</p> - -<p>现在您已经完成了基本工作区的配置，让我们下面一起向应用进发吧！</p> - -<h2 id="Firefox_OS_原生应用">Firefox OS 原生应用</h2> - -<p>Gaia 源码中提供的原生的HTML5应用如下所示：</p> - -<ul> - <li>Bluetooth</li> - <li>Browser</li> - <li>Calendar</li> - <li>Camera</li> - <li>Clock</li> - <li>Contacts</li> - <li>Cost Control</li> - <li>Dialer</li> - <li>FL</li> - <li>FM</li> - <li>Gallery</li> - <li>Homescreen</li> - <li>Keyboard</li> - <li>Music</li> - <li>PDF.js</li> - <li>Ringtones</li> - <li>Search</li> - <li>Setringtone</li> - <li>Settings</li> - <li>SMS</li> - <li>System</li> - <li>Video</li> - <li>Wallpaper</li> - <li>WAPPush</li> -</ul> - -<p>当手机开机时，第一个启动的应用是系统应用（System app）。该应用主要是负责打开和管理主屏幕。在主屏幕界面则可以启动其他的应用以执行以执行各种功能。例如，当用户点击手机图标时，则会从主屏幕启动拨号盘应用 。当用户在拨号时想要查看联系人列表时，又可以启动联系人应用。</p> - -<h2 id="一起来探索下一些应用的结构">一起来探索下一些应用的结构</h2> - -<p>原生应用都存放在 <code>gaia/apps/</code> 文件夹下. 每个 Gaia 应用的文件夹下都包含下面的组件:</p> - -<ul> - <li><code>manifest.webapp文件</code>: 存放关于应用的元数据。</li> - <li><code>style文件夹</code>: 存放CSS文件。</li> - <li><code>js</code> 文件夹: 存放 JavaScript 文件。</li> - <li><code>locales</code> 文件夹: 存放翻译成不同语言的字符串</li> - <li> 一个HTML 文件: 通常是 (但不限于) <code>index.html</code>.</li> -</ul> - -<p>有一些应用还可能有下面的组件:</p> - -<ul> - <li><code>elements文件夹</code>: 存放其他视图的HTML文件</li> - <li><code>test</code> 文件夹: 运行关于应用的测试代码。</li> - <li><code>resources</code> 文件夹:存放诸如电影，声音等其他的资源.</li> - <li><code>build</code> 文件夹.</li> -</ul> - -<div class="warning"> -<p><strong>重要</strong>: 除了上面列举的文件外，还可能会存在一些额外的文件，比如LazyLoaders以及定制的模板引擎和其他一些关于应用的优化。你也可能会注意到，在不同的应用或者 <code>.js</code> 文件中使用的模式也不尽相同。 记住，这是一个开源的app/OS， 它是由很多人编码而成的，因此这些应用也是使用不同的模式和编程风格而完成的。</p> -</div> - -<div class="note"> -<p><strong>注意</strong>:本节是对Gaia应用总体布局的介绍。您自己在创建web应用时，当前必须要创建的文件只有 <code>manifest.webapp文件</code>；其他的文件都是可选的。</p> -</div> - -<p>我相信，如果您有关于web开发的经验，就会尽其所能的对一些app进行修改，从而使它们不断得到完善。</p> - -<h2 id="我们一起来启动一些应用吧">我们一起来启动一些应用吧</h2> - -<p>在对这些应用进行修改后，如果想立刻看到修改后带来的变化，可以通过下面的几种方式来实现：在 Firefox Nightly中运行,将应用推送到物理设备端，或者通过Firefox OS 应用管理器（可以在模拟器上或者真实设备上）运行。</p> - -<h3 id="运行在Firefox_Nightly中">运行在Firefox Nightly中</h3> - -<p>要在Firefox Nightly中运行Gaia以及查看应用 , 需要使用下面的结构来运行命令:</p> - -<pre class="brush: bash">/path/to/firefoxnightly -profile /path/to/B2G/gaia/profile-debug -no-remote</pre> - -<p>例如在Mac OS X中，可以运行下面的命令：</p> - -<pre class="brush: bash">/Applications/FirefoxNightly.app/Contents/MacOS/firefox -profile /Users/bob/git/gaia/profile-debug -no-remote</pre> - -<div class="note"> -<p><strong>Note:</strong> <code><em>-no-remote</em></code> 是用来阻止使用已存在的Firefox实例，从而创建一个新的Firfox应用来运行定制的Gaia配置文件。 <code>profile-debug</code> 是指运行Gaia调试模式下的配置文件，该文件是使用之前步骤中的 <code>DEBUG=1</code> <code>make command</code> 命令生成。</p> -</div> - -<p>在启动时会耗费一些时间，但是最终Gaia实例以及许多控制选项会在一个新的浏览器窗口中运行。</p> - -<p><img alt="A UI screen showing the Gaia user interface running in Firefox nightly: a phone screen and number of tool bar controls." src="https://mdn.mozillademos.org/files/7161/Screen%20Shot%202014-02-13%20at%2012.48.png" style="display: block; height: 467px; margin: 0px auto; width: 800px;"></p> - -<p>另外如果您只想在浏览器中运行一个应用，一个更加快速的方法就是在浏览器中通过file://URL的格式简单的输入应用的根HTML文件（例如在浏览器中打开index.html）。然后可以使用 <a href="/zh-CN/docs/Tools/Responsive_Design_View">Responsive Design View</a> 工具观察在小屏幕分辨率的效果. 如果想要做一些快速UI开发/调试的工作，这是一个非常有用的方法，而且在实例装载方面也有许多优势。此时，火狐开发者工具也是十分有用的，例如测试CSS调整的效果。</p> - -<div class="note"> -<p><strong>注意</strong>: 由于该方法并不能对硬件设备进行访问，因此有许多功能都无法工作，再加上你无法看到app启动的过程，在主屏幕看到图标等弊端，比较而言，运行在物理设备上还是最好的办法，这在下面章节中有介绍。</p> -</div> - -<h3 id="运行在物理设备上">运行在物理设备上</h3> - -<p>要将更改后的Gaia推送到物理Firefox OS 设备，您需要:</p> - -<ol> - <li>已完成对 <a href="/zh-CN/Firefox_OS/Debugging/Installing_ADB"><code>adb</code></a> 的安装或者安装了前面描述的l <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/">ADB helper</a> .</li> - <li>在终端中输入<span style="font-family: 'Courier New','Andale Mono',monospace; line-height: normal;">adb devices命令来检查您的手机是否和电脑通过</span> <code style="font-size: 14px;">adb</code> 命令建立了成功的连接。</li> - <li>在Gaia目录下输入<code>make reset-gaia</code> 命令从而通<font face="'Courier New', 'Andale Mono', monospace"><span style="line-height: normal;">过</span></font><code>adb</code><font face="'Courier New', 'Andale Mono', monospace"><span style="line-height: normal;">推送到手机</span></font></li> -</ol> - -<p>这种方式会耗费些时间，如果使用App manager则会更快一些。</p> - -<h3 id="在_App_Manager中运行">在 App Manager中运行</h3> - -<p>只要您的Firefox 版本在1.2以上，就可以在App Manager中运行更改后的app，在下节会对该部分内容进行介绍。</p> - -<h2 id="使用_App_Manager来调试">使用 App Manager来调试</h2> - -<p>在完成对应用的更改后（或者<a href="/zh-CN/docs/Web/API/Apps">创建新的应用</a> ），就可以在App Manager来调试它们。</p> - -<p>在调试之前，需要具备下面的条件： App Manager和设备之间能够正常通信，如果没有物理设备可以使用 Firefox OS 仿真器。这些条件在<a href="/zh-CN/Firefox_OS/Using_the_App_Manager">使用App Manager</a> 有详细阐述。</p> - -<p>下面就是选择想要调试的应用了 — 在 App Manager中添加包应用控制，并选择要调试的应用的文件夹。首次操作应用时，需要点击“Start”按钮将应用安装在 设备端/模拟器端并启动它。之后就可以点击“Update”按钮将更新推送到设备/模拟器端，而且使用Mozilla的<a href="/zh-CN/docs/Tools">开发工具</a>在设备端对应用直接调试。</p> - -<p>例如，下面就是在App Manager中运行 Contacts 应用的图示。</p> - -<p><img alt="A card showing details of the Gaia contacts app: a simple contacts application." src="https://mdn.mozillademos.org/files/7135/contacts-app-screenshot.png" style="display: block; height: 358px; margin: 0px auto; width: 868px;"></p> - -<p>同时也可以去尝试下调试的一些功能，例如，运行一些终端命令或者对更改CSS特性。</p> - -<p><img alt="A screenshot of the Mozilla App Manager" src="https://mdn.mozillademos.org/files/7137/debugger.png" style="display: block; height: 357px; margin: 0px auto; width: 700px;"></p> - -<h2 id="为项目贡献代码">为项目贡献代码</h2> - -<p>只要您对自己在Gaia仓库中的更改感到满意，就可以向GitHub上的代码库提交pull请求。如果您不知道怎么做，可以去参考GitHub 帮助页面的 <a href="https://help.github.com/articles/using-pull-requests">Using Pull Requests</a>。</p> - -<p>实际上，您的pull请求如果没有经过Gaia开发团队的讨论和认可是不会被接受的。 您可以在 dev-gaia@lists.mozilla.org 邮件列表, 或者是在 <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a>.的 #gaia IRC 通道与Gaia 开发团队进行联系。</p> - -<p>另外一个课程就是如何在<a href="https://bugzilla.mozilla.org/">Mozilla Bugzilla</a> 系统中提交Bug。在提交Bug时，要使用 <a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox%20OS">Firefox OS project bug form</a> (选择 Gai或者一个合适的子集作为component). 但在提交Bug前，首先要在Bugzilla 中搜寻下问题是否已经被其他人提过。 如果没有，就需要考虑下面两点：</p> - -<ul> - <li>如果您的bug所指的是一个明显的错误— 也就是说是一个真正意义上的bug — 那接下来就直接填写就可以了.</li> - <li>如果您的bug是请求实现的一个新功能，那最好先在邮件列表/IRC中讨论后再决定。</li> -</ul> - -<div class="note"> -<p><strong>注意</strong>:如果您不知道到底该怎么提bug，就是想要寻找一些相关的bug进行处理， 可以寻求 Josh Matthews' <a href="http://www.joshmatthews.net/bugsahoy/?b2g=1">Bugs Ahoy</a> 应用来帮忙。</p> -</div> - -<h2 id="常见问题">常见问题</h2> - -<p>下面的内容是对在桌面上使用Gaia调试应用的一些常见问题的答案。</p> - -<div class="note"> -<p><strong>Note</strong>: 多参考 <a href="https://developer.mozilla.org/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gaia/Hacking#High_resolution_image_assets" title="https://developer.mozilla.org/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gaia/Hacking#High_resolution_image_assets">Hacking gaia</a> 中关于可以设置的make选项对调试Gaia是非常有帮助的。</p> -</div> - -<h3 id="我能够在火狐桌面版浏览器中对高分辨率的设备进行仿真吗">我能够在火狐桌面版浏览器中对高分辨率的设备进行仿真吗?</h3> - -<p>必须的！</p> - -<ol> - <li>首先可以运行下面命令来确保在qHD和WVGA设备上图片是不失真的 - <pre class="language-html">GAIA_DEV_PIXELS_PER_PX=1.5 DEBUG=1 make</pre> - </li> - <li>然后，在火狐中打开 <a href="https://developer.mozilla.org/about:config" title="/about:config">about:config</a>页面，通过将<code style="font-size: 14px;">layout.css.devPixelsPerPx</code> 标志位变为<code style="font-size: 14px;">1.5来更改浏览器的密度。</code></li> - <li>最后，可以使用 <a href="/zh-CN/docs/Tools/Responsive_Design_View">Responsive Design View</a> 变为320 x 533 px (这种设置与设备上 CSS 480 x 800 像素的效果是等价的 .)</li> -</ol> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/customizing_build-time_apps/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/customizing_build-time_apps/index.html deleted file mode 100644 index 573e3ac09a..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/customizing_build-time_apps/index.html +++ /dev/null @@ -1,117 +0,0 @@ ---- -title: 定制构建时 apps -slug: Archive/B2G_OS/Developing_Gaia/Customizing_build-time_apps -tags: - - Apps - - B2G - - Firefox OS - - Gaia - - 'l10n:priority' - - 定制 - - 指南 -translation_of: Archive/B2G_OS/Developing_Gaia/Customizing_build-time_apps ---- -<div class="summary"> -<p><span class="seoSummary">作为一个开发者或设备厂商，您可能由于各种原因想要对 Friefox OS 首次启动时的 app 进行定制。本文则说明了完成该需求的不同机制。</span></p> -</div> - -<h2 id="Gaia_中的_App_存放位置">Gaia 中的 App 存放位置</h2> - -<p>运行在 Firefox OS 中的 app 都位于 Gaia 源码树下，共有两个存储位置：</p> - -<ul> - <li><a href="https://github.com/mozilla-b2g/gaia/tree/master/apps">gaia/apps/</a>: 系统默认的 app 存放在此处， 如 calendar, email, settings, 等。</li> - <li><a href="https://github.com/mozilla-b2g/gaia/tree/master/dev_apps">gaia/dev-apps</a>: 其他 app 的存放在此，如在自定义过程中包含的 app。</li> -</ul> - -<p>如果您想要在编译 Gaia/B2G 时忽略或添加这些 app， 有下面几种方式可以实现：</p> - -<h2 id="野蛮的定制方法">野蛮的定制方法</h2> - -<p>所谓“野蛮”的方法是指在编译前， 将不想要参与编译的 app 直接删除即可。</p> - -<h2 id="编辑配置列表">编辑配置列表</h2> - -<p>相比而言，更优雅的方法则是编辑 <code>apps-*.list</code> 文件 (位于不同的设备目录下，在 <a href="https://github.com/mozilla-b2g/gaia/tree/master/build/config">gaia/build/config/</a> 内部，如 <code>phone/</code> 和 <code>tablet/</code>) ，将需要编译的 app 路径包括进去。例如， <a href="https://github.com/mozilla-b2g/gaia/blob/master/build/config/phone/apps-production.list">gaia/build/config/phone/apps-production.list</a> 格式如下所示：</p> - -<pre class="brush: bash">apps/bluetooth -apps/bookmark -apps/browser -apps/calendar -apps/callscreen -etc.</pre> - -<p>注意，您也可以使用如下代码指定目录下的所有 app:</p> - -<pre class="brush: bash">apps/*</pre> - -<p>至于在编译时，具体选择哪个 <code>apps-*.list</code> 文件的代码在 <a href="https://github.com/mozilla-b2g/gaia/blob/master/Makefile">gaia/Makefile</a> 文件中指定来，其形式如下所示：</p> - -<pre class="brush: cpp"><span class="nv">GAIA_DEVICE_TYPE</span><span class="o">?=</span>phone - ... -GAIA_APP_TARGET?=engineering - ... -ifeq ($(MAKECMDGOALS), demo) -GAIA_DOMAIN=thisdomaindoesnotexist.org -GAIA_APP_TARGET=demo -else ifeq ($(MAKECMDGOALS), dogfood) -DOGFOOD=1 -else ifeq ($(MAKECMDGOALS), production) -PRODUCTION=1 -endif - ... -ifeq ($(PRODUCTION), 1) -GAIA_OPTIMIZE=1 -GAIA_APP_TARGET=production -endif - -ifeq ($(DOGFOOD), 1) -GAIA_APP_TARGET=dogfood -endif - ... -ifndef GAIA_APP_CONFIG -GAIA_APP_CONFIG=build$(SEP)config$(SEP)apps-$(GAIA_APP_TARGET).list -endif</pre> - -<p>最初， <code>GAIA_APP_TARGET</code> 变2量被设置为 <code>engineering</code> ，<code><span class="nv">GAIA_DEVICE_TYPE</span></code> 变量被设置成 <code>phone</code>, 因此默认情况下编译 Gaia 时会使用 <a href="https://github.com/mozilla-b2g/gaia/blob/master/build/config/phone/apps-engineering.list">gaia/config/phone/app-engineering.list</a> (其中包括所有的测试，deomo 等）。</p> - -<p>要指定其他应用程序列表的用法，请在运行<code>make</code>命令时指定不同的选项。比如用 <a href="https://github.com/mozilla-b2g/gaia/blob/master/build/config/phone/apps-production.list">gaia/build/config/phone/apps-production.list</a> 进行构建, 比如，你要使用：</p> - -<pre class="brush: bash">PRODUCTION=1 make</pre> - -<p>如果你专门指定<code>DEMO=1</code>进行构建, 那么它将使用<a href="https://github.com/mozilla-b2g/gaia/blob/master/build/config/phone/apps-demo.list">apps-demo.list</a>. 如果你专门指定<code>DOGFOOD=1</code>进行构建, 则它将会使用<a href="https://github.com/mozilla-b2g/gaia/blob/master/build/config/phone/apps-dogfood.list">apps-dogfood.list</a>.</p> - -<p>你可以完全覆盖该决定通过编辑 <code>GAIA_APP_CONFIG</code> 文件在 <a href="https://github.com/mozilla-b2g/gaia/blob/master/Makefile">gaia/Makefile</a>目录中, 并提供你自己的 <code>apps-*.list</code> 文件.</p> - -<p><a href="https://github.com/mozilla-b2g/gaia/blob/master/Android.mk#L24-L28">gaia/Android.mk</a> 包括下面命令：</p> - -<pre class="brush: cpp">ifneq ($(filter user userdebug, $(TARGET_BUILD_VARIANT)),) -GAIA_MAKE_FLAGS += PRODUCTION=1 -B2G_SYSTEM_APPS := 1 -endif</pre> - -<p>当你构建的时候, 如果 <code>VARIANT=user</code> 或者 <code>VARIANT=userdebug</code> 被设定 (这些将会在 <code>TARGET_BUILD_VARIANT</code> 变量中反映), <code>PRODUCTION=1</code> 在构建Gaia时会自动设置.</p> - -<div class="note"> -<p><strong>注意</strong>: 要了解其他有效的 make 选项，请参考 <a href="/en-US/Firefox_OS/Developing_Gaia/make_options_reference">make options 参考文档</a>。</p> -</div> - -<h2 id="使用市场化定制">使用市场化定制</h2> - -<p>第三种也是最完善（但最复杂）的方法是使用自定义方式.这将允许您在单独的目录中指定构建时的自定义说明，而无需修改Gaia的核心存储库。 您可以再不同的目录中包括自己的自定义项，或者使用源附带的目录。</p> - -<p>例如，使用<code>GAIA_DISTRIBUTION_DIR</code> 这个环境变量来指定自定义示例的位置, 像这样:</p> - -<pre class="brush: bash"><code class="language-html">GAIA_DISTRIBUTION_DIR=<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>DISTRIBUTION_PATH</span><span class="punctuation token">></span></span> make production</code></pre> - -<p>更多有关分发机制的自定义实例请参考以下网页<a href="https://github.com/mozilla-b2g/gaia/tree/master/customization">https://github.com/mozilla-b2g/gaia/tree/master/customization</a></p> - -<p>定制完全属于您的个人主题，要了解更多信息，欢迎访问我们的市场定制指南<a href="/en-US/Firefox_OS/Developing_Firefox_OS/Market_customizations_guide">Market Customizations guide</a>.</p> - -<div class="note"> -<p><strong>注意</strong>: 如果您希望在 Gaia 编译时包含一些自定义的外部 app， 则需要以指定的方式编译它们，并且将它们放在 <code>gaia/dev-apps/</code> 文件夹中。请参考 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Developing_Firefox_OS/Market_customizations_guide#Building_Prebundled_web_apps">Building Prebundled web apps</a> 获取更多内容。</p> -</div> - -<div class="warning"> -<p><strong>重要</strong>: 如果您是创建自定义B2G/Gaia 版本进行分发的设备供应商，则需要满足一些条件才能将firefox marketplace应用程序包含在手机/平板电脑等设备中。有关更多详细信息，欢迎联系Mozilla！</p> -</div> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/customizing_the_keyboard/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/customizing_the_keyboard/index.html deleted file mode 100644 index 64b9152bc5..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/customizing_the_keyboard/index.html +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: 在 Firefox OS 中定制键盘 -slug: Archive/B2G_OS/Developing_Gaia/Customizing_the_keyboard -translation_of: Archive/B2G_OS/Developing_Gaia/Customizing_the_keyboard ---- -<div class="summary"> - <p>This document explains how to add custom keyboard layouts containing their own languages/scripts to Firefox OS v1.2 and up.</p> -</div> -<h2 id="Gaia_内置键盘_app_状态_system_架构">Gaia 内置键盘 app 状态 & system 架构</h2> -<p>Two major features have been implemented in Firefox OS, as of October 2013.</p> -<ul> - <li>A build flag to turn keyboard/spellcheck dictionaries to include in the build in the default Gaia Keyboard app on and off (see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=884752" title="FIXED: keyboard build-time customization">bug 884752</a>).</li> - <li>An OS-level feature that allows users to install third-party keyboard apps from the Firefox Marketplace. This will be available starting from Firefox OS v2.0. See <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=816869" title="FIXED: [Meta] Enable third-party keyboards">bug 816869</a> and <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=964670" title="FIXED: [Keyboard][User Story] Enable 3rd party keyboard framework with OOP">bug 964670</a> for details.</li> -</ul> -<p>To come up with a new keyboard layout, you can put a layout file in Gaia, build the keyboard app using a build config, or come up with your own keyboard app and install it on the phone.</p> -<h2 id="如何生成一个键盘应用_(keyboard_app)">如何生成一个键盘应用 (keyboard app)</h2> -<p>You can use Gaia's built-in keyboard app as a template, or fork it. The basic ideas are:</p> -<ul> - <li>In the manifest file, declare your app as <code>input</code> in the <code>role</code> property.</li> - <li>Make sure you have the <code>input</code> permission specified.</li> -</ul> -<p>After that, you can install your keyboard, and it will show up on the bottom half of the screen whenever the user is focused to an input field. The space issues that arise from this can be dealt with by:</p> -<ul> - <li>Using the old, classic <code>window.resize</code> to update the area your app should occupy.</li> - <li>Using the new, shiny <code>navigator.mozInputMethod</code> API to mutate the content of the input given; see the Mozilla Wiki <a href="https://wiki.mozilla.org/WebAPI/KeboardIME">KeyboardIME API page</a> for details.</li> -</ul> -<div class="note"> - <p>TBD: provide sample code and/or a small template app</p> -</div> -<h2 id="How_to_add_a_custom_layout_to_your_template_in_the_Gaia_keyboard_app">How to add a custom layout to your template in the Gaia keyboard app</h2> -<ol> - <li>See the <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/keyboard/CONFIGURE">keyboard CONFIGURE details</a> for more information. Depending on the language you might want to add a dictionary, or include an interactive IME (for Asian languages).</li> - <li>If you add layouts for a newly supported language, you may want to add them as default layouts for that language in <a href="https://github.com/mozilla-b2g/gaia/blob/master/build/config/keyboard-layouts.json">build/config/keyboard-layouts.json</a>.</li> -</ol> -<h3 id="Spell_check_word_suggestion_dictionary">Spell check / word suggestion dictionary</h3> -<div class="note"> - <p>TBD</p> -</div> -<h3 id="Asian_IME">Asian IME</h3> -<p>East Asian languages (<a href="https://en.wikipedia.org/wiki/CJK">Chinese, Japanese, and Korean</a>) use a fairly complex script that involves thousands of characters. As there is no way to put thousands of keys on a hardware or software keyboard, users rely on an indexing program called <a href="https://en.wikipedia.org/wiki/Input_method">input method</a>, or IME for short, to convert a series of symbols into selections of characters.<br> - <br> - How symbols should be converted and how "smart" the IME should be depends on the method chosen, implementation itself, and often <a href="https://en.wikipedia.org/wiki/Natural_language_processing">NLP science</a>, which is outside the scope of this document. Note that it is highly recommended to put the database part into <a href="/en-US/docs/IndexedDB">IndexedDB</a>, in order to conserve memory on a mobile device.</p> -<h4 id="IM_Engine_interface_in_Gaia_keyboard_app">IM Engine interface in Gaia keyboard app</h4> -<p>Assuming you have an IME library readily available for converting symbols into characters (''IM Engine'' in our terminology), you would need to use the defined interface within the Gaia Keyboard app to receive symbols from the layout and output the characters. <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/keyboard/js/keyboard.js#L32-L115">The current API is documented on Github</a>.</p> -<p>We invite implementations in order to further refine this API within Gaia.</p> -<h4 id="Make_your_IM_engine_work_with_your_layout">Make your IM engine work with your layout</h4> -<p>To get your IM engine working with your keyboard layout:</p> -<ol> - <li>Put a new layout in layout.js as described in the previous section.</li> - <li>Reference the IM engine with the <code>imEngine</code> property. When your layout is enabled, the keyboard app will start loading the script located at <code>keyboard/js/imes/<imEngine>/<imEngine>.js</code>.</li> - <li>Set up the APIs to receive and send the keys/characters when the script is loaded and <code>init</code>'d.</li> - <li>Do whatever you want in response to the user input. When the user taps any keys on the keyboard, it would typically get sent to the IM engine.</li> -</ol> -<h4 id="Known_implementations">Known implementations</h4> -<ul> - <li><a href="https://github.com/timdream/jszhuyin">JSZhuyin</a> is the first implementation of Gaia Keyboard Asian IM engine, for Traditional Chinese incorporating Zhuyin IME.</li> - <li><a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/keyboard/js/imes/jskanji">JSKanji</a> is a prototype IM engine written for Japanese.</li> - <li><a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/keyboard/js/imes/jspinyin">JSPinyin</a> is written for Simplified Chinese and works by tapping Pinyin symbols.</li> - <li>As a demonstration, <a href="http://chewing.csie.net/">Chewing</a>, an C/C++ open-source Zhuyin IME for Traditional Chinese, was <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=845685">cross-compiled with emscripten</a> and linked with the Gaia keyboard.</li> - <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=835261">JSHangul</a> is a prototype IM engine for Korean, and is currently in development.</li> -</ul> -<h2 id="讨论和问答">讨论和问答</h2> -<p>Please come to the <a href="https://lists.mozilla.org/listinfo/dev-gaia">dev-gaia</a> mailing list or the #gaia channel on irc.mozilla.org. #mozilla-taiwan is the de-facto Chinese-language channel for this topic.<br> - <br> - </p> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/different_ways_to_run_gaia/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/different_ways_to_run_gaia/index.html deleted file mode 100644 index c77e27efea..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/different_ways_to_run_gaia/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: 运行 Gaia 的不同方式 -slug: Archive/B2G_OS/Developing_Gaia/Different_ways_to_run_Gaia -translation_of: Archive/B2G_OS/Developing_Gaia/Different_ways_to_run_Gaia ---- -<div class="summary"> - <p><span class="seoSummary">您可以通过 App Manager中，在 Desktop Firefox 中直接运行，作为专用桌面版本(Desktop B2G), 在仿真器中, 或在可兼容的移动设备中</span><span class="seoSummary">运行 Gaia</span><span class="seoSummary">。本文则对上述每个方式如何实现的进行总结，以及链接到更深的内容。</span></p> -</div> -<h2 id="它与真实的东西有多接近？">它与真实的东西有多接近？</h2> -<p dir="ltr" id="docs-internal-guid-46d8bd5f-ac65-2c23-a6c9-cc3bc3dc3cd5">Some of the solutions for running Gaia detailed in this article are closer to the experience on a real device than others. The order of ease for running is as follows:</p> -<ol dir="ltr"> - <li>Gaia in simulator</li> - <li>Gaia in Desktop Firefox</li> - <li>Gaia in B2G Desktop</li> - <li>Gaia in Emulator</li> - <li>Gaia flashed on phone</li> - <li>Gaia+Gecko flashed on phone</li> -</ol> -<p>The order of “how close it is to the shipped product” is exactly the opposite of this. Depending on the feature you’re working on, you’ll have to find the environment that suits the problem.</p> -<h2 id="在_App_ManagerFirefox_OS_simulator_中使用_Gaia">在 App Manager/Firefox OS simulator 中使用 Gaia</h2> -<p>The quickest way to try Gaia is via the <a href="/en-US/Firefox_OS/Using_the_App_Manager">Firefox App Manager</a>.<br> - <br> - App Manager is a developer tool available in Firefox for Desktop. It provides a number of useful tools to help you test, deploy and debug HTML5 web apps on Firefox OS phones and the Firefox OS Simulator, directly from your browser.<br> - <br> - In desktop Firefox Browser 26+, open the App Manager using <em>Tools > Web Developer > App Manager</em>. Tap Start Simulator (once you've installed it) and you are ready to experience Firefox OS.</p> -<h2 id="B2G_Desktop">B2G Desktop</h2> -<p>B2G Desktop is a desktop build of the app runtime used on Firefox OS devices which you can use to run Gaia on your desktop computer.</p> -<p>You can download a <a href="http://nightly.mozilla.org/#Desktop%20Boot2Gecko">nightly build of B2G desktop</a> from the <a href="http://nightly.mozilla.org/">Firefox Nightly site</a>. Depending on what version you are targeting, you may want a specific version of latest-mozilla-b2g18. There are builds for Linux (32 bit and 64 bit), Mac OS X and Windows.</p> -<p>Nightly builds come packaged with a recent version of gaia. Once you've downloaded the archive, all you need to do is extract it to a folder and run the b2g binary from the extracted folder.</p> -<pre class="brush: bash">$ cd b2g -$ ./b2g</pre> -<p>To run B2G with your own version of Gaia for development purposes you first need to build a profile from your clone:</p> -<pre class="brush: bash">$ cd /path/to/gaia -$ DEBUG=1 DESKTOP=0 make</pre> -<p>This will generate a directory in your <code>gaia</code> directory called <code>profile</code>. The <code>DEBUG</code> part runs Gaia as hosted apps on a built-in web server, rather than the default packaged apps which have to be re-packaged after every change. You can find the path to the profile directory by taking a look at last line of output after running the above command, which should look like:</p> -<pre class="brush: bash">Profile Ready: please run [b2g|firefox] -profile /path/to/gaia/profile</pre> -<p>You can then run B2G Desktop with your generated profile like so:</p> -<pre class="brush: bash">$ ./b2g /path/to/gaia/profile</pre> -<p>If you want to you can build your own B2G desktop from source.</p> -<div class="note"> - <p><strong>Note:</strong> On Mac OS X, the <code>b2g</code> binary will be inside B2G.app. To run B2G Desktop on this platform you will need the following command:<br> - <code>./B2G.app/Contents/MacOS/b2g /path/to/gaia/profile</code></p> -</div> -<h2 id="在_Desktop_Firefox_中使用_Gaia">在 Desktop Firefox 中使用 Gaia</h2> -<p>It's also possible to run Gaia inside of Firefox. This gives you the advantages of having a rapid development cycle, as well as standard web development tools and debuggers. See <a href="/en-US/Firefox_OS/Developing_Gaia/Running_the_Gaia_codebase">Running the Gaia codebase</a> for details on how to do this.</p> -<div class="note"> - <p><strong>Note</strong>: FoxBox is a Firefox OS build environment contained in a VM (Virtual Machine), powered by Vagrant and VirtualBox. This has many advantages, but the main one is that it does a lot of configuration for you, leaving you to get on with development work. For full instructions, read the <a class="external external-icon" href="https://github.com/gasolin/foxbox">FoxBox GitHub repo README</a>.</p> -</div> -<h2 id="在真实设备中烧写_Gaia">在真实设备中烧写 Gaia</h2> -<p dir="ltr" id="docs-internal-guid-46d8bd5f-ac6a-0884-5265-76e0fe740fa6">要在真实设备上烧写新版本的 Gaia 需要下列步骤：</p> -<ol dir="ltr"> - <li>首先请确认您本地的电脑上有 Gaia 仓库，并且 <a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB</a> 已安装。</li> - <li>确认您已经使能 <a href="/en-US/Firefox_OS/Debugging/Developer_settings#Debugging_via_USB">Debugging via USB</a> 选项。</li> - <li>通过 USB 将您的设备连接到电脑上。</li> - <li>如果您有一个连接的设备，可以继续下面的命令。或者您（ Windows 或 Linux 系统的用户）可能需要检查下 OEM USB 驱动页面来对您电脑中的 USB 驱动进行正确配置。</li> - <li>在 Gaia 仓库中运行下面命令以对手机进行复位以及更新您的 Gaia 源码： - <pre class="brush: bash">$ make reset-gaia</pre> - </li> - <li>要测试非 System app， 您可以在不重启设备情况下运行下面命令来安装： - <pre class="brush: bash" dir="ltr">$ make install-gaia</pre> - </li> - <li>如果您只是想安装一个指定的 app， 可以通过 APP 变量来完成， 就如下面的命令： - <pre class="brush: bash">$ make install-gaia APP=browser</pre> - </li> -</ol> -<p dir="ltr">要检查您的设备是否已正确的通过 USB 连接， 可以键入下面命令：</p> -<pre class="brush: bash" dir="ltr">$ adb devices</pre> -<p dir="ltr">您应该获取到如下类似的结果：</p> -<pre class="brush: bash" dir="ltr">List of devices attached -emulator-5554 device</pre> -<h2 id="编译_Gecko_和_Gaia_并在仿真器或真实设备中使用">编译 Gecko 和 Gaia 并在仿真器或真实设备中使用</h2> -<p>如果您有一个可兼容的移动设备，则可以 <a href="/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS" title="Mozilla/Firefox_OS/Building_and_installing_Firefox_OS">编译和安装您自己的 Firefox OS 版本</a> 并且将其运行在仿真器或推送到实际设备上。</p> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/index.html deleted file mode 100644 index ea781858de..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/index.html +++ /dev/null @@ -1,54 +0,0 @@ ---- -title: Gaia 开发 -slug: Archive/B2G_OS/Developing_Gaia -translation_of: Archive/B2G_OS/Developing_Gaia ---- -<div class="summary"> - <p><span class="seoSummary">Gaia 是 Firefox OS 用户界面及一套原生app：它包括 lock screen, home screen, dialer, 以及其他应用。简而言之，Gaia是运行在Firefox OS 平台的一个复杂的web应用集合 。这组文档会涵盖为Gaia工程贡献代码所需要的所有知识。</span></p> -</div> -<p>在本指南中，我们会带您为 <em>Gaia</em> 贡献代码的有效的工作流程—此处的贡献是指为<em> Gaia</em> 代码库添加新的功能以及为 <em>Gaia</em> 工程解决bug。第一组文档是需要顺序阅读的，但如果您需要更新下您在特定步骤的知识，也可以阅读指定的章节。</p> -<p>后面，我们就会提供包括额外主题的参考资料和信息。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7951/gaia-2.0-screen.png" style="width: 320px; float: right; padding: 0px 0px 30px 30px; height: 533px;"></p> -<h2 id="基础">基础</h2> -<ol> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Running_the_Gaia_codebase">运行 Gaia 代码库</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Understanding_the_Gaia_codebase">理解 Gaia 代码库</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Making_Gaia_code_changes">修改 Gaia 代码</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Test_Gaia_code_changes">测试 Gaia 变化的代码</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Submitting_a_Gaia_patch">提交 Gaia patch</a></li> -</ol> -<h2 id="Gaia_构建参考">Gaia 构建参考</h2> -<ul> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Build_System_Primer">Gaia 构建系统入门</a></li> - <li><a href="/en-US/Firefox_OS/Developing_Gaia/Customizing_build-time_apps">定制构建时 app</a></li> - <li><a href="/en-US/Firefox_OS/Developing_Gaia/make_options_reference">Make 选项参考文档</a></li> - <li><a href="/en-US/Firefox_OS/Developing_Gaia/Gaia_tools_reference">Gaia 工具参考文档</a></li> -</ul> -<h2 id="参考">参考</h2> -<ul> - <li><a href="/en-US/Firefox_OS/Developing_Firefox_OS/Filing_bugs_against_Firefox_OS">处理 Firefox OS 中的bug </a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Gaia/Gaia_apps">Gaia apps 指南</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Different_ways_to_run_Gaia">运行 Gaia 的不同方式</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Market_customizations_guide">市场定制指南</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Customizing_the_keyboard">在 Firefox OS app 中定制键盘</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Localizing_Firefox_OS">Firefox OS 本地化</a></li> -</ul> -<p></p><div class="overheadIndicator communitybox"> - - <div class="column-container"> - <h2 id="加入_Gaia_社区">加入 Gaia 社区</h2> - <div class="column-half"> - <div class="communitysubhead">请选择你喜欢的方式加入我们：</div> - <ul class="communitymailinglist"> - <li><a href="https://lists.mozilla.org/listinfo/dev-gaia"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.gaia"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.gaia/feeds"> Web feed</a></li> -</ul> - </div> - <div class="column-half"> - <ul class="communitycontact"><li><strong>IRC: </strong><a href="irc://irc.mozilla.org/gaia">#gaia</a> <span class="smaller">(<a href="https://wiki.mozilla.org/IRC">了解 IRC</a>)</span></li><li><strong>Other IRC channels: </strong><a href="irc://irc.mozilla.org/b2g" title="Discuss B2G, the overall Firefox OS platform">#b2g</a>, <a href="irc://irc.mozilla.org/openwebapps" title="Talk with Web app developers">#openwebapps</a>, <a href="irc://irc.mozilla.org/webapi" title="Discuss Web APIs used to create powerful Web apps">#webapi</a></li></ul> - </div> - </div> -</div><p></p> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/localizing_firefox_os/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/localizing_firefox_os/index.html deleted file mode 100644 index dfd446cac6..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/localizing_firefox_os/index.html +++ /dev/null @@ -1,107 +0,0 @@ ---- -title: Firefox OS 本地化 -slug: Archive/B2G_OS/Developing_Gaia/Localizing_Firefox_OS -translation_of: Archive/B2G_OS/Developing_Gaia/Localizing_B2G_OS ---- -<div class="summary"> - <p><span class="seoSummary">在本指南中，我们会告诉您如何简单的对 Firefox OS 进行本地化，尤其是 Gaia 接口和 apps。我们会从帮助您从配置电脑开始，继而描述如何本地化 Gaia 字符串， 最后介绍如何在您的工作中执行 l10n 测试。</span></p> -</div> -<h2 id="准备您的工具">准备您的工具</h2> -<p>为了能获得 Gaia 的源码并在您的电脑中测试本地化字符串， 您需要确保在电脑中已安装了下面的工具和语言：</p> -<dl> - <dt> - GNU make</dt> - <dd> - make 是一个有用的小工具，用来从源码中创建构建操作。当您准备好在电脑上进行 l10n 测试时，它就会排上用场。下载和安装 make 工具是非常简单的，可以直接<a href="http://www.gnu.org/software/make/">借助 GNU 网站完成</a>。 如果您在使用 Mac OSX， 则需要从 <a href="https://itunes.apple.com/us/app/xcode/id497799835?mt=12" style="text-decoration: underline;" title="https://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=7&cad=rja&ved=0CFQQFjAG&url=https%3A%2F%2Fitunes.apple.com%2Fus%2Fapp%2Fxcode%2Fid497799835%3Fmt%3D12&ei=6ZItUeDqDeejiAK90IDYCA&usg=AFQjCNGrxKmVtXUdvUU3MhqZhP4MHT6Gtg&bvm=bv.42965579,d.cGE">App Store</a> 中安装 XCode 和 XCode's 命令行工具。</dd> - <dt> - git</dt> - <dd> - git 是一个版本控制系统，用来存储正在积极开发的 Gaia 源代码。下载和安装 git 是非常简单的，能够<a href="http://git-scm.com/">直接借助它们的网站</a>来完成。</dd> - <dt> - Python</dt> - <dd> - Python 是一种编程语言，将帮助您创建对 l10n 测试的 Firefox OS 构建过程。 下载和安装 Python 是非常简单的，可以<a href="http://www.python.org/getit/" title="http://www.python.org/getit/">直接通过它们的网站</a>来完成。</dd> - <dt> - Mercurial (hg)</dt> - <dd> - Mercurial (hg) 也是一个版本控制系统， 会收藏稳定的 Gaia版本以用于 l10n， 本地仓库也是一样。 下载和安装 Mercurial 是非常简单的，能够直接通过 <a href="http://mercurial.selenic.com/downloads/" title="http://mercurial.selenic.com/downloads/">直接通过它们的网站来完成</a>。</dd> - <dt> - compare-locales</dt> - <dd> - compare-locales 是一个 Python 脚本，可以帮助本地化工作者评估它们的工作并将需要本地化的内容与已经本地化的内容分离（称之为 diff) 。 下载和安装 compare-locales 是非常简单的，可以 <a href="https://developer.mozilla.org/en-US/docs/Compare-locales" title="https://developer.mozilla.org/en-US/docs/Compare-locales">done 直接通过 compare-locales wiki 页面完成</a>。请注意，如果您仅仅使用命令行或文本编辑器，该工具是必须的。如果您使用 pootel, Tansifex 或 Pontoon 等工具，则不需要使用它。</dd> -</dl> -<h2 id="配置本地化仓库">配置本地化仓库</h2> -<p>在您确认已经完成对上面软件列表的下载和安装后，就可以在您的电脑中获取源码并本地化字符串了。</p> -<ol> - <li>请在命令行下，进入您存储 Gaia 代码和本地化字符串的目录</li> - <li>使用 hg， 将 en-US 仓库 clone 到本地， 请使用下面的命令完成。<br> - <pre>hg clone https://hg.mozilla.org/gaia-l10n/en-US -</pre> - </li> - <li>现在，使用带有下面结构的命令 clone 您的本地化仓库。下面例子中，第二行命令则是指将繁体中文 clone 到对应的文件夹中。 <br> - <pre>hg clone https://hg.mozilla.org/gaia-l10n/your-locale-code -hg clone https://hg.mozilla.org/gaia-l10n/zh-TW/ B2G/gaia/locales/zh-TW</pre> - </li> - <li>现在运行下面的命令：<br> - <pre class="brush: json">LOCALE_BASEDIR=locales/ LOCALES_FILE=locales/languages_mine.json make</pre> - </li> -</ol> -<p>本地化文件会在 <code>languages_mine.json 文件中列出，其结构如下所示：</code></p> -<pre class="brush: json">{ - "en-US" : "English (US)", - "fr" : "Français (fr)" -}</pre> -<p>在此文件中，您应该有一个列表的字符串去翻译！请注意， 如果您开始对 Friefox OS 新的语言进行本地化，则不需要创建一个 diff, 因为所有的字符串都是新字串，都需要我们来翻译。</p> -<div class="note"> - <p><b>注意</b>: 在本地构建自动化脚本时，请参考 <a href="https://gist.github.com/timdream/7716684">这个要点 gist</a>。</p> -</div> -<p> </p> -<h2 id="翻译_Gaia_字符串">翻译 Gaia 字符串</h2> -<p>The workflow for translating Gaia strings largely depends upon the tools you're using to translate. This part of the process is similar to the regular translation phase for other Mozilla products. The <a href="https://developer.mozilla.org/en-US/docs/Localization_Quick_Start_Guide/Translation_phase" title="https://developer.mozilla.org/en-US/docs/Localization_Quick_Start_Guide/Translation_phase">Translation Phase page of the Localization Quick Start Guide</a> contains a list of all the tools used to translate strings within Mozilla products along with tutorials on how to translate with those tools. This page will be useful to you whether you're part of a l10n team trying to decide what tool to use to translate Gaia strings or you're looking for the right tutorial for the tool your team currently uses.</p> -<h2 id="Firefox_OS_L10n_测试">Firefox OS L10n 测试</h2> -<p>There are two main methods for performing l10n testing on Firefox OS: desktop builds and mobile builds. Currently, the desktop method is the most widely used method for l10n testing.</p> -<h3 id="Desktop_l10n_testing">Desktop l10n testing</h3> -<ol> - <li>Download and install the latest boot2gecko nightly desktop build by visiting <a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-b2g18/" title="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-b2g18/"><code>http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-b2g18/</code></a>and downloading the package that corresponds to your operating system. Look for the packages that contain the word <em>localizer</em> in them. This indicates that the build has all of the locales listed on <a href="https://github.com/mozilla-b2g/gaia/blob/master/locales/languages_all.json" title="https://github.com/mozilla-b2g/gaia/blob/master/locales/languages_all.json"><code>languages-all.json</code></a> enabled.</li> - <li>Clone the latest version of Gaia by navigating to the directory on your desktop where you would like it to download and entering this command in the command line utility: <code>git clone git://github.com/mozilla-b2g/gaia.git</code></li> - <li>If your team is localizing Firefox OS for the first time, you'll need to enable your locale. If not, grab yourself a drink while everyone else enables their locale. - <ol> - <li>While in the command line, navigate inside your gaia clone and run this command to clone your locale's repo: <code>hg clone ssh://hg.mozilla.org/gaia-l10n/your-locale-code</code></li> - <li>Open the <code>languages.json</code> file located in the <code>shared/resources</code> directory in the gaia repository you just cloned.</li> - <li>Add your locale information according to this format: "en-US" : "English (US)", and save the file.</li> - <li>Finally, run the command: <code>make multilocale</code> This enables your locale on your desktop build.</li> - </ol> - </li> - <li>Create your Gaia profile by running this command: <code>DEBUG=1 make -C gaia profile</code></li> - <li>Finally, you can run Firefox OS with your locale profile and begin testing. Do this by entering this command: <code>b2g/b2g -profile gaia/profile</code>. If you're using Mac OS X, run this command: <code>/Applications/B2G.app/Contents/MacOS/b2g -profile gaia/profile</code></li> - <li>To update your desktop builds, simply navigate to your Gaia repo clone and enter this command: <code>git pull</code></li> -</ol> -<h3 id="Mobile_l10n_testing">Mobile l10n testing</h3> -<p> - <i> - This section will grow as more devices that support Firefox OS become available to localizers.</i> -</p> -<h3 id="What_to_look_for_when_l10n_testing">What to look for when l10n testing</h3> -<p>Localization testing for a mobile operating system has some similarites to localization testing for a desktop application. Here are some guidelines on what to look for when performing localization testing on your work:</p> -<ol> - <li>See if your translations fit inside UI text elements.</li> - <li>Ensure that the tone, style, and terminology are consistant throughout the entire product.</li> - <li>Look for untranslated English strings in the UI. These may be hard-coded into Gaia or they may caused by element ID errors.</li> - <li>Make sure that time and dates display according your regions standards.</li> -</ol> -<h2 id="发现本地化相关_bugs">发现本地化相关 bugs</h2> -<p>Here are some links to bugzilla in order to give you examples of bugs that have been encountered while using the phones. This will give you an idea of where to look at for bugs as well as an example in filing these kinds of bugs.</p> -<ul> - <li><a class="moz-txt-link-freetext" href="http://bit.ly/100bcsC">http://bit.ly/100bcsC</a> - this is a general list of l10n B2G bugs</li> - <li><a class="moz-txt-link-freetext" href="https://bugzilla.mozilla.org/show_bug.cgi?id=846060">https://bugzilla.mozilla.org/show_bug.cgi?id=846060</a></li> - <li><a class="moz-txt-link-freetext" href="https://bugzilla.mozilla.org/show_bug.cgi?id=852739">https://bugzilla.mozilla.org/show_bug.cgi?id=852739</a></li> -</ul> -<p>General rules when filing a Localization bug:</p> -<ul> - <li>if the bug is specific to the language, then file under the Mozilla Localization (under Other Products) and cc the localizer. Don't forget to flag your bug with the appropriate tracking flag</li> - <li>if it's not specific to the language, file under FirefoxOS Product, and cc the localizer. Don't forget to flag your bug with the appropriate tracking flag</li> - <li>If you are in doubt, file under FirefoxOS Product, and cc the localizer. Don't forget to flag your bug with the appropriate tracking flag</li> -</ul> -<p>For those of you who use <a href="http://moztrap.mozilla.org/" title="http://moztrap.mozilla.org/">Moztrap</a>, looking at the existing test cases under the FirefoxOS "localization" tags and seeing if you can pass the tests on your device is also a good way to test Firefox OS localizations.</p> -<h2 id="下面要做的">下面要做的</h2> -<p>Now you're ready to start localizing! So open up your favorite l10n tool and go for it! As always, if you have questions that are not covered in this document, please send them to the <a href="http://www.mozilla.org/about/forums/#dev-l10n" title="http://mailto:_dev-l10n@lists.mozilla.org">mozilla.dev.l10n newsgroup</a>.</p> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/make_options_reference/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/make_options_reference/index.html deleted file mode 100644 index 19e5b61e40..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/make_options_reference/index.html +++ /dev/null @@ -1,186 +0,0 @@ ---- -title: make 选项参考 -slug: Archive/B2G_OS/Developing_Gaia/make_options_reference -translation_of: Archive/B2G_OS/Developing_Gaia/make_options_reference ---- -<div class="summary"> - <p>在Gaia仓库下的执行make命令会创建一个Gaia配置文件，继而装载到您的设备端或运行在 <a style="text-decoration: underline;" href="/en-US/Firefox_OS/Using_the_B2G_desktop_client">B2G Desktop</a> 中。本文会对make不同的选项详细探究。</p> -</div> -<div class="note"> - <p><b>注意</b>: 在Makefile文件中有许多环境变量，不要太依赖它们，因为在将来可能会去掉。</p> -</div> -<p>创建的配置文件一般存放在gaia的根目录下，例如 <code>/gaia/profile </code>文件夹，其中包括下面的条目： </p> -<ul> - <li><code>defaults/</code>: 文件夹中会包含默认的配置信息，也就是重启手机后装载的信息。</li> - <li><code>extensions/</code>: 文件夹下包含的是扩展项。</li> - <li><code>settings.json</code>: Settings 文件</li> - <li><code>user.js</code>: 文件中包含更多的设置/配置信息</li> - <li><code>webapps/</code>: 文件夹中包含所有需要安装到手机上的web 应用。</li> -</ul> -<div class="note"> - <p><b>注意：</b> 当您已经生成了一个配置文件而且想要构建一个新的文件，就必须在构建新的配置文件前，将原有的删除。</p> -</div> -<h2 id="默认命令">默认命令</h2> -<pre class="brush: bash">make</pre> -<p>该命令只是给您一个非调试下的默认编译。 对于一个带有品牌的构建，您需要使用<a href="#Official_Mozilla_branding_make">Official Mozilla branding make</a>命令; 对于调试构建，您需要使用 <a href="#Debug_make">Debug make</a>命令。</p> -<h2 id="推送到设备端">推送到设备端</h2> -<pre class="brush: bash">make install-gaia - -make reset-gaia -</pre> -<p>使用 <a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB</a> (Android Debug Bridge) 安装工具，上面的make命令会将Gaia推送到设备端。 <code>install-gaia</code> 会将Gaia更新从您工作的文件夹推送到设备端。 <code>reset-gaia</code> 在将Gaia推送到手机前会清除所有现存的配置，配置文件，web 应用以及数据库信息。</p> -<h2 id="编译特定的应用">编译特定的应用</h2> -<pre class="brush: bash">APP=system make - -APP=system make install-gaia</pre> -<p>当一个配置文件已存在时， <code>APP</code> 参数允许您指定特定的app重新打包，而不是对所有的Gaia应用重新打包和重新发布。</p> -<h2 id="指定自定义的profile文件夹">指定自定义的profile文件夹</h2> -<p>您可以指定一个自定义的文件夹来构建您的profile文件。例如使用 <code>PROFILE_FOLDER：</code></p> -<pre class="brush: bash">PROFILE_FOLDER=profile-b2g-desktop make</pre> -<h2 id="不同设备的编译">不同设备的编译</h2> -<p>下面几个 make 选项是不同的设备进行编译，其用途也会不同。</p> -<h3 id="创建Gaia的手机端编译">创建Gaia的手机端编译</h3> -<pre class="brush: bash">GAIA_DEVICE_TYPE=phone make</pre> -<p>此次编译是从 <code>/gaia/build/config/phone/apps-engineering.list 文件</code>获取app的。</p> -<h3 id="创建Gaia的平板端编译">创建Gaia的平板端编译</h3> -<pre class="brush: bash">GAIA_DEVICE_TYPE=tablet make</pre> -<p>此次编译是从 <code>/gaia/build/config/tablet/apps-engineering.list </code>文件获取app的。</p> -<h2 id="不同的编译类型">不同的编译类型</h2> -<p>有些选项可以创建出不同的编译类型，其目的也有所不同。</p> -<h3 id="Production_make">Production make</h3> -<pre class="brush: bash">PRODUCTION=1 make</pre> -<p>它会创建 Gaia 的生产型编译版本</p> -<ul> - <li>Gaia is run as packaged apps, which are harder to debug, but are the best available state for apps in terms of available API permissions, etc.</li> - <li>Test app 不会包含在其中</li> - <li>默认情况下，远程调试是关闭的</li> - <li>锁屏功能是开启的（反过来会切断 USB 连接）</li> - <li>Marionette is turned off</li> - <li>初次用户体验时开启的</li> - <li>Offline cache is used.</li> -</ul> -<div class="note"> - <p><b>注意</b>: 您也可以使用 <code>make production 替换该命令。</code></p> -</div> -<h3 id="Debug_make">Debug make</h3> -<pre class="brush: bash">DEBUG=1 make</pre> -<p>The <code>DEBUG</code> variable runs Gaia as hosted apps on a built-in web server on a specific <code>GAIA_PORT</code>, rather than the default of packaged apps which have to be re-packaged after every change; this makes things easier to test. Launching the profile with the latest Firefox Nightly will also give you nice B2G specific panels on the Firefox Developer Tools.</p> -<p>In addition:</p> -<ul> - <li>Test apps are included in the build.</li> - <li>Remote debugging is turned on by default.</li> - <li>Lock screen is turned off (USB connections won't be interrupted.)</li> - <li><a href="/en-US/docs/Mozilla/QA/Marionette">Marionette</a> is turned on, which is needed when running Gaia <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests">unit tests</a>.</li> - <li>First time user experience is turned off.</li> - <li>Offline cache is not used, even if it is generated.</li> -</ul> -<h3 id="Device_debug_make">Device debug make</h3> -<pre class="brush: bash">DEVICE_DEBUG=1 make</pre> -<p>它可以禁用设备的锁屏， 并且启用 ADB 工具，因此在设备调试时是非常有用的。</p> -<p>在 Firefox OS version > 1.2 以上版本，当想要使用 <a style="text-decoration: underline;" href="/en-US/Firefox_OS/Using_the_App_Manager">App Manager</a> 调试 Firefox OS webapps 时指定这个参数。</p> -<h3 id="Debug_desktop_make">Debug desktop make</h3> -<pre class="brush: bash">DEBUG=1 DESKTOP=0 make</pre> -<p>这个选项可以创建一个 desktop 调试版本， 在 <a href="/en-US/Firefox_OS/Using_the_B2G_desktop_client">B2G desktop</a> 中运行。</p> -<h3 id="官方_Mozilla_分支_make">官方 Mozilla 分支 make</h3> -<pre class="brush: bash">MOZILLA_OFFICIAL=1 make</pre> -<p>Use this to make an official Mozilla-branded build.</p> -<h3 id="Dogfood_make">Dogfood make</h3> -<pre class="brush: bash">DOGFOOD=1 make</pre> -<p>Dogfooding options and utilities are turned on, for example the Feedback app, which allows doog fooders to easily submit feedback on the OS.</p> -<h3 id="System_apps_make">System apps make</h3> -<pre class="brush: bash">B2G_SYSTEM_APPS=1 make</pre> -<p>这个环境变量能将 app 推送到 <code>/system/b2g</code> 而不是 <code>/data/local</code>。当进行 user 编译时应使用这个命令。 当运行 <code>make production 这个命令会自动设置。可用作</code><code>install-gaia</code> 或 <code>reset-gaia</code>。</p> -<h3 id="发布和市场化定制编译">发布和市场化定制编译</h3> -<pre class="brush: bash">GAIA_DISTRIBUTION_DIR=./dir</pre> -<div class="note"> - <p><b>注意</b>: Read <a href="/en-US/Firefox_OS/Hacking_Firefox_OS/Market_customizations_guide">Market Customizations</a> for more details.</p> -</div> -<h2 id="开发者调试选项">开发者/调试选项</h2> -<p>There are also make options for adding/removing features or changing settings, for debugging purposes.</p> -<h3 id="使能远程调试">使能远程调试</h3> -<pre class="brush: bash">REMOTE_DEBUGGER=1</pre> -<p>This enables remote debugging on the device, the same as using the option in the <a href="/en-US/Firefox_OS/Debugging/Developer_settings#Remote_debugging">developer settings</a>.</p> -<h3 id="JavaScript_优化_make">JavaScript 优化 make</h3> -<pre class="brush: bash">GAIA_OPTIMIZE=1 make</pre> -<p>This triggers an optimization pass on Gaia's JavaScript, concatenating/compressing the files. This is automatically set when running <code>make production</code>. This can be used for <code>install-gaia</code> or <code>reset-gaia</code> too.</p> -<h3 id="高分辨率图片资源">高分辨率图片资源</h3> -<pre class="brush: bash">GAIA_DEV_PIXELS_PER_PX=1.5 make</pre> -<p>When packaging the app, this option replaces images with their <code>*@1.5x.(gif|jpg|png)</code> equivalents if such images exist. You need to use the above option as part of a standard <code>make</code> command, for example:</p> -<pre class="brush: bash">GAIA_DEV_PIXELS_PER_PX=1.5 make reset-gaia - -GAIA_DEV_PIXELS_PER_PX=1.5 make install-gaia</pre> -<p>Gaia is currently targetting the following screen resolutions:</p> -<ul> - <li>qHD: ~540×960; device pixel ratio = 1.6875</li> - <li>WVGA: ~480×800; device pixel ratio = 1.5</li> - <li>HBGA (320x240); device pixel ratio = 1</li> -</ul> -<p>use <code>GAIA_DEV_PIXELS_PER_PX</code> to make sure the images looks sharp on qHD and WVGA devices. see <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag#A_pixel_is_not_a_pixel" title="https://developer.mozilla.org/en-US/docs/Mozilla/Mobile/Viewport_meta_tag#A_pixel_is_not_a_pixel">A pixel is not a pixel</a> for more information about device pixels per css pixels.</p> -<h3 id="低内存_profile_编译">低内存 profile 编译</h3> -<pre class="brush: bash">GAIA_MEMORY_PROFILE=low make</pre> -<p>This variable generates a low memory profile version of Gaia, aimed at low memory devices like the Tarako.</p> -<h3 id="Haida_features">Haida features</h3> -<pre class="brush: bash">HAIDA=1 make reset-gaia</pre> -<p>This build enables the Haida feature set, which is currently limited to <a href="https://wiki.mozilla.org/FirefoxOS/systemsfe/epm#Rocketbar_Results">rocketbar</a> and <a href="https://wiki.mozilla.org/FirefoxOS/Haida#Edge_Gestures_Between_Open_Content">edge</a> gestures, but will likely include other features in the near future.</p> -<h3 id="禁用初次用户体验_(FTU)">禁用初次用户体验 (FTU)</h3> -<pre class="brush: bash">NOFTU=1 -</pre> -<p>使用这个环境变量可以禁用 FTU。</p> -<h3 id="禁用锁屏">禁用锁屏</h3> -<p>您可以使用 NO_LOCK_SCREEN 选项禁用 Firefox OS 的锁屏功能，例如：</p> -<pre class="brush: bash">NO_LOCK_SCREEN=1 make</pre> -<h3 id="参考工作负载_Reference_Workloads">参考工作负载 Reference Workloads</h3> -<p>参考工作负载（Reference workloads）能够使开发者在一些应用中快速装载大量的数据，尤其是对新烧的机器。 </p> -<p>在 Gaia 目录下可执行下面命令：</p> -<pre class="brush: bash">make reference-workload-light</pre> -<ul> - <li>200 contacts</li> - <li>200 sms messages</li> - <li>50 dialer history entries</li> - <li>20 gallery images</li> - <li>20 songs</li> - <li>5 videos</li> -</ul> -<pre class="brush: bash">make reference-workload-medium</pre> -<ul> - <li>500 contacts</li> - <li>500 sms messages</li> - <li>100 dialer history entries</li> - <li>50 gallery images</li> - <li>50 songs</li> - <li>10 videos</li> -</ul> -<pre class="brush: bash">make reference-workload-heavy</pre> -<ul> - <li>1000 contacts</li> - <li>1000 sms messages</li> - <li>200 dialer history entries</li> - <li>100 gallery images</li> - <li>100 songs</li> - <li>20 videos</li> -</ul> -<pre class="brush: bash">make reference-workload-x-heavy</pre> -<ul> - <li>2000 contacts</li> - <li>2000 sms messages</li> - <li>500 dialer history entries</li> - <li>250 gallery images</li> - <li>250 songs</li> - <li>50 videos</li> -</ul> -<p>这些命令可以接受 <code>APP</code> 环境变量或者是 <code>APPS</code> 环境变量（需要使用空格将各 app 名称分开）。例如：</p> -<pre class="brush: bash">APP=sms make reference-workload-light -APPS="sms communications/contacts" make reference-workload-heavy -</pre> -<p>The apps available are:</p> -<pre class="brush: bash">APPS="gallery music video communications/contacts sms communications/dialer"</pre> -<p>为了能够使用参考工作负载 （reference workloads）， 必须安装 mid3v2 工具。 这个工具可以使用下面命令安装： </p> -<pre class="brush: bash">sudo apt-get install python-mutagen</pre> -<p>如果您使用的是 Fedora 或 RHEL 操作系统，请使用下面命令：</p> -<pre class="brush: bash">sudo yum install python-mutagen</pre> -<h3 id="make_文档">make 文档</h3> -<p>Gaia 文档可以通过 jsdoc3 进行编译。要产生文档，可以使用下面的命令：</p> -<pre class="brush: bash">make docs</pre> -<h3 id="启用_IME_布局和词典">启用 IME 布局和词典</h3> -<p>要启用键盘 IME 布局和词典, 请使用下面的命令结构:</p> -<pre class="brush: bash">GAIA_KEYBOARD_LAYOUTS=en,zh-Hant-Zhuyin,el,de,fr,zh-Hans-Pinyin make</pre> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/making_gaia_code_changes/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/making_gaia_code_changes/index.html deleted file mode 100644 index 48f28d2bb8..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/making_gaia_code_changes/index.html +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: 修改 Gaia 代码 -slug: Archive/B2G_OS/Developing_Gaia/Making_Gaia_code_changes -translation_of: Archive/B2G_OS/Developing_Gaia/Making_Gaia_code_changes ---- -<div class="summary"> - <p><span class="seoSummary">现在您已经在桌面上运行 Gaia， 并且对源代码的工作方式有了一定程度的理解，下一步就应该准备好为项目做贡献了。本文则描述了如何修改代码以及如何在代码中找到 bug 出现的位置。 </span></p> -</div> -<h2 id="Git_最佳实践">Git 最佳实践</h2> -<ol> - <li>当对 Gaia 修改时， 首先需要从 master 上获取最新的代码： - <pre class="brush: bash">cd path/to/gaia -git checkout master -git pull </pre> - </li> - <li>下面切换到您解决问题的分支： - <pre class="brush: bash">git checkout -b my-code-fix</pre> - </li> - <li>最后，到 <code>gaia/apps</code> 目录下，可以修改对应的文件了。</li> -</ol> -<div class="note"> - <p><b>注意</b>: 在 <code>gaia/profile-debug/</code> 目录下，您会找到 <code>webapps/</code>， 但其中只包含需要运行的 app 的manifest 文件，而 app 是存在于 <code>gaia/apps/</code> 目录下的。</p> -</div> -<h2 id="简单的代码修改示例">简单的代码修改示例</h2> -<p>您可以按照需求对代码作出修改，保存修改，在 Firefox 桌面中运行 Gaia 并刷新 tab 页以查看效果。 Let's do something simple like change the text colour of the clock on the lock screen:</p> -<p><img alt="Gaia lockscreen showing the clock display in white text" src="https://mdn.mozillademos.org/files/7929/gaia-lockscreen-clock.png" style="width: 369px; height: 623px; margin: 0px auto; display: block;"></p> -<ol> - <li>The best way to find how this style is set is to use the developer tools. Ctrl/right + click on the clock in Firefox Desktop and select <em>Inspect Element</em> from the context menu.</li> - <li>You can then work out which CSS file to edit — <code>gaia/apps/system/style/lockscreen.css</code> in this case — and then make your changes in the CSS styles on the right hand side of the display to get it to the state you want.</li> - <li>When you are happy with the change, go and make the change in the file directly.</li> - <li>Next, refresh the tab (or use the Reload application button) and the HTTP server serves the changes instantly:</li> -</ol> -<p><img alt="Gaia lockscreen showing the clock display modified from white to red text" src="https://mdn.mozillademos.org/files/7931/gaia-lockscreen-clock-modified.png" style="width: 366px; height: 622px; margin: 0px auto; display: block;"><br> - <br> - <br> - Limitations of Gaia Desktop Firefox rendering:</p> -<ul> - <li>In the Desktop Firefox rendering, the apps are fairly accurate compared to how they work on a real phone, but you may notice some differences here and there.</li> - <li>Not all device APIs are supported in desktop Firefox; you can find a list of the ones that are enabled in <a href="https://github.com/mozilla-b2g/gaia/blob/master/build/preferences.js#L106">preferences.js</a>.</li> -</ul> -<h2 id="发现_bug_出现的地方">发现 bug 出现的地方</h2> -<p>The best way to find Firefox OS bugs to work on is to consult <a href="http://www.joshmatthews.net/bugsahoy/?b2g=1">Josh Matthews' Bugs Ahoy app</a> — this pulls in bugs directly from Mozilla's Bugzilla and displays them in an easy to search and browse way. One you have found a bug that you want to work on, go to its Bugzilla page, enter yourself in the "assigned to" field, and start work, as indicated above.</p> -<h3 id="有用的提示">有用的提示</h3> -<ul> - <li>When you work on mentored bugs, one of the Gaia core team will monitor your progress and provide help with the code and process. If you are a beginner to the Firefox OS contribution process, signing up for one of these can be helpful. These are indicated in Firefox OS Bugzilla pages by an entry in the "Mentors" field. Buys Ahoy lists mentored bugs.</li> - <li>If you are a completely new Bugzilla user, you may not be able to assign yourself to work on a bug. If you can’t, ask the mentor assigned to that bug to assign you if it has one, or just ask in the bug comments otherwise.</li> - <li>After you have a bit more experience, you should ask someone to give you permission to assign bugs to yourself.</li> - <li>Another good whiteboard entry to look out for is <code>[good first bug]</code>, if you are a new contributor and want to start with something simple. You can list just good first bugs using <a href="http://www.joshmatthews.net/bugsahoy/?b2g=1&simple=1">http://www.joshmatthews.net/bugsahoy/?b2g=1&simple=1</a>.</li> - <li>You should save a search for projects you want to contribute to. For example, the following would give you a Gaia Clock app bug search:</li> -</ul> -<p><a href="https://bugzilla.mozilla.org/buglist.cgi?columnlist=product%2Ccf_blocking_b2g%2Cbug_status%2Cresolution%2Cshort_desc&resolution=---&query_based_on=CLOCK&query_format=advanced&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=Gaia%3A%3AClock&product=Boot2Gecko&known_name=CLOCK&list_id=10497922">https://bugzilla.mozilla.org/buglist.cgi?columnlist=product%2Ccf_blocking_b2g%2Cbug_status%2Cresolution%2Cshort_desc&resolution=---&query_based_on=CLOCK&query_format=advanced&bug_status=UNCONFIRMED&bug_status=NEW&bug_status=ASSIGNED&bug_status=REOPENED&component=Gaia%3A%3AClock&product=Boot2Gecko&known_name=CLOCK&list_id=9776392</a></p> -<h2 id="参考">参考</h2> -<ul> - <li><a href="https://mozilla.app.box.com/s/wzgsb3lkqglv0dnfdgzs">Gaia powerpoints for visual/interaction specifications</a></li> - <li><a href="https://etherpad.mozilla.org/gaia-meeting-notes">Weekly Gaia meeting Etherpad</a></li> - <li><a href="https://datazilla.mozilla.org/">Datazilla</a>: Mozilla's performance test utility<br> - </li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/running_the_gaia_codebase/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/running_the_gaia_codebase/index.html deleted file mode 100644 index 30fc71b5f9..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/running_the_gaia_codebase/index.html +++ /dev/null @@ -1,81 +0,0 @@ ---- -title: 运行 Gaia 代码 -slug: Archive/B2G_OS/Developing_Gaia/Running_the_Gaia_codebase -translation_of: Archive/B2G_OS/Developing_Gaia/Running_the_Gaia_codebase ---- -<div class="summary"> -<p><span class="seoSummary">本文对如何在本地运行 Gaia 代码以及在设置过程中的有效工具进行了深入讲解。</span></p> -</div> - -<p>首先，我们应该指出，在操作Gaia 时，您并不需要编译 Gecko 或 B2G。您只需要将 Gaia 源代码下载到本地，以一定的方式运行和编辑它。</p> - -<p><br> - 共有下面几种方式来运行 Gaia：</p> - -<ul> - <li>使用带有更新的 Gaia 版本来烧写手机</li> - <li>在 B2G 桌面版本中启动 Gaia </li> - <li>在 WebIDE 中运行 Gaia</li> - <li>在 Firefox桌面版 中启动 Gaia </li> -</ul> - -<p>你能在我们的 <a href="/en-US/Firefox_OS/Developing_Gaia/Different_ways_to_run_Gaia">用多种方法运行Gaia</a> 页面找到关于以多种方法运行Gaia的简略信息以及到更详细信息的链接。一般来说，这些信息是由从复杂问题(最常需要的信息)到简单问题(最少需要的信息)排序的。</p> - -<p>在这篇文章里，我们会使用Firefox Mulet或WebIDE来运行Gaia -- 对于大部分你想对于Gaia代码库进行的更改，它们提供了最快捷的调试你的更新的方式。但显然，为了使用一些功能(如调试设备API或者与手机硬件进行交互等)，你需要一个真正的设备。</p> - -<div class="note"> -<p><strong>注意</strong>: 如需得到更深入的帮助, 最好的地方就是 #gaia IRC 频道 (参见 <a href="https://wiki.mozilla.org/IRC">Mozilla IRC</a> 以获取更多信息) 以及 <a href="https://lists.mozilla.org/listinfo/dev-gaia">Gaia开发邮件单</a>。</p> -</div> - -<h2 id="运行_Gaia">运行 Gaia </h2> - -<ol> - <li>首先，fork我们在Github上的主项目存档库 <a href="https://github.com/mozilla-b2g/gaia">Gaia</a>.</li> - <li>然后，在本地clone它： - <pre class="brush: bash">git clone https://github.com/your-username/gaia.git</pre> - </li> - <li>之后，再加入一个像这样的upstream： - <pre class="brush: bash">cd gaia -git remote add upstream https://github.com/mozilla-b2g/gaia</pre> - </li> - <li>最后, 在你的系统上安装 <a href="http://www.fontsquirrel.com/fonts/fira-sans">Fira Sans 字体</a>：这是在真实设备上Gaia使用的字体， 所以在桌面上运行 Gaia 时也使用它是十分有用的，尤其是当你测试有关重叠或字体大小的功能时。</li> - <li> - <p>现在你需要为Gaia创建一个调试档案。 在你的Gaia存档库文件夹内运行<strong><code>DEBUG=1 make</code></strong><code>指令就会在</code><strong><code>profile-debug</code></strong><code>目录下创建一个档案</code>(profile)，这个档案是为了做到最优调试而创建的。它会创建未压缩(即主机调试版本)的Gaia应用，可以通过Firefox桌面版内置的扩展HTTPD服务器直接进行调试。当你对你的应用做了一个改变时，你只需要刷新你的浏览器窗口就可以看到结果，而不用再进行重新编译文件、重新推送到设备等等繁杂的过程。这对于快速的CSS/JS/HTMl修改尤其有用。</p> - </li> - <li>With your debug profile built, run it in your desktop Firefox build (we'd recommend you use <a href="http://nightly.mozilla.org/">Firefox Nightly</a>) from the command line, using a command with the following structure: - <pre class="brush: bash">/path/to/firefoxnightly -profile /path/to/B2G/gaia/profile-debug -no-remote</pre> - For example, on Mac OS X, we ran the following command: - - <pre class="brush: bash">/Applications/FirefoxNightly.app/Contents/MacOS/firefox -profile /Users/bob/git/gaia/profile-debug -no-remote</pre> - </li> -</ol> - -<p>This should load up your Gaia profile running in a desktop Firefox tab, like so (you'll notice that the URL is <code>http://system.gaiamobile.org:8080/</code>):</p> - -<p><img alt="A screenshot of Firefox OS Gaia being run inside a desktop Firefox nightly build." src="https://mdn.mozillademos.org/files/7925/gaia-desktop-smaller.png" style="width: 640px; height: 495px; margin: 0px auto; display: block;"></p> - -<div class="note"> -<p><strong>Note</strong>: If you open a tab in the Firefox desktop window Gaia is running in, enter <code>about:config</code>, and search for "gaia", you'll find a number of <code>extensions.gaia.*</code> prefs — which the <code>httpd.js</code> extension is using. You'll also be able to find the <code>network.dns.localDomains</code> pref, which is the trick that makes <code>http://system.gaiamobile.org:8080</code> connect on your localhost.</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: The <code>make</code> command is run inside the Gaia directory to create a profile (including apps, setting, etc.) that can be loaded on a phone, run inside an emulator, etc. The <code>make</code> command has a <a href="/en-US/Firefox_OS/Developing_Gaia/make_options_reference">number of options</a> to create different kinds of build. Just running <code>make</code> creates a standard production profile inside gaia/make, with packaged apps, which is not set up for optimum modification and debugging.</p> -</div> - -<h2 id="有效的工具">有效的工具</h2> - -<p>You'll see that this view has a number of different tools available, including:</p> - -<ul> - <li>Responsive design view in the top left corner.</li> - <li>All the standard Firefox Toolbox debugging tools available to the right of the screen (by default; this can be moved to the bottom of the screen if you like, but on the right makes more sense when debugging the small screen display on the left.)</li> - <li>A special Firefox OS tools tab on the toolbox that provides some specific tools for debugging Firefox OS in this mode: - <ul> - <li><strong>Notification</strong>: fire a test system notification.</li> - <li><strong>Reload application</strong>: reload the current application.</li> - <li><strong>Take screenshot</strong>: take a screenshot and save it in a screenshots directory in your default image location, for example <code>[HOME-FOLDER]/Pictures/screenshots</code> on a Mac.</li> - <li><strong>Import workload</strong>: pushes large workloads to certain apps, for stress testing, for example sending 2000 contacts to the contacts app, or sending 2000 messages to the email app.<br> - </li> - </ul> - </li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/testing_gaia_code_changes/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/testing_gaia_code_changes/index.html deleted file mode 100644 index 3f2aa1a408..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/testing_gaia_code_changes/index.html +++ /dev/null @@ -1,119 +0,0 @@ ---- -title: 测试 Gaia 代码修改 -slug: Archive/B2G_OS/Developing_Gaia/Testing_Gaia_code_changes -tags: - - B2G - - Firefox OS - - Gaia - - UI - - 'l10n:priority' - - 指南 - - 测试 - - 贡献 - - 集成 -translation_of: Archive/B2G_OS/Developing_Gaia/Testing_Gaia_code_changes ---- -<div class="summary"> - <p><span class="seoSummary">当您完成对 Gaia 代码库的修改并且结果看起来正常时， 下面的步骤就是通过测试程序的验证，从而确保在将 patch 提交到工程之前，您的修改可以真正的工作— 也就是对其他的 Gaia 代码也是有效的。本文所讲的就是这些内容。</span></p> -</div> -<p>测试步骤一般包括：</p> -<ul> - <li>标准调试程序</li> - <li>运行自动化测试</li> -</ul> -<p>下面让我们来对这两部分进行分析：</p> -<h2 id="标准调试">标准调试</h2> -<p>如果您是一位有经验的 web 开发者，那么对调试 Gaia 代码的步骤也不会陌生。 我们已经讨论了如何<a href="/en-US/Firefox_OS/Developing_Gaia/Running_the_Gaia_codebase#Running_Gaia_in_Desktop_Firefox">在桌面 Firefox 中运行Gaia</a>，以及如何做 <a href="/en-US/Firefox_OS/Developing_Gaia/Making_Gaia_code_changes#Simple_code_change_example">基本的修改</a>。要获取更复杂的代码库添加的知识，则需要在桌面 Firefox 中对 Firefox 调试工具多多使用才好。</p> -<div class="note"> - <p><b>注意</b>: 要获取更多使用工具方面的指令，请参考我们的 <a href="/en-US/docs/Tools">Tools zone</a>.</p> -</div> -<h2 id="自动化测试">自动化测试</h2> -<p>在提交 patch 前，您同样应该在 Gaia 中运行标准测试套件，以保证您的代码更改不会对现有的手机功能造成影响。需要运行的测试包括：</p> -<ul> - <li>单元测试</li> - <li>性能测试</li> - <li>UI 测试</li> -</ul> -<p>在提交 patch 前，我们一般会要求运行测试；如果这是您第一次为 gaia 做贡献，可以在提交前不经过测试的环节，但后续则必须要进行测试。在运行测试前，为保证您的代码是最新的，需要更新 Gaia 仓库。 </p> -<div class="note"> - <p><b>注意</b>: 要获取更多有关测试的内容，请参考 <a href="/en-US/Firefox_OS/Platform/Automated_testing">Firefox OS 自动化测试页面</a>。</p> -</div> -<div class="note"> - <p><b>注意</b>: 如果可能的话，您需要考虑下运行在真实设备上运行每一项测试 （一些功能/硬件在仿真器上并不支持），否则就在 B2G 桌面仿真器或 Firefox Nightly 中运行。</p> -</div> -<h3 id="单元测试">单元测试</h3> -<p>单元测试是指在大型应用中测试对每个独立的代码单元进行测试 — 对 Gaia 而言，就是指单独的 app。Gaia 使用:</p> -<ul> - <li><a href="http://visionmedia.github.io/mocha/">mocha</a> 来测试框架</li> - <li><a href="http://chaijs.com/api/assert/">chai</a> 作为 assert 库</li> - <li><a href="http://sinonjs.org/">sinon.js</a> 作为一个 mock & stub 库</li> - <li><a href="http://blanketjs.org/">blanket.js</a> 作为测试工具</li> -</ul> -<p>您可以运行下面的命令来下载，安装和作为一个单元测试服务器（运行该命令需要一些时间，不妨先喝杯茶休息一下）：</p> -<pre class="brush: bash">make test-agent-server</pre> -<p>下面，打开一个新的终端窗口，在 Nightly 中将 <code>test-agent</code> app 装载进去</p> -<ol> - <li>运行下面命令：<br> - <pre class="brush: bash">make DEBUG=1 -/Applications/FirefoxNightly.app/Contents/MacOS/firefox -profile /Users/bob/git/gaia/profile-debug -no-remote</pre> - </li> - <li>点击 homescreen 上的 Test Aagent app</li> -</ol> -<p>使用下面命令来运行所有测试</p> -<pre class="brush: bash">make test-agent-test</pre> -<div class="note"> - <p><b>注意</b>: 由于要运行很多测试，可能要花费一个小时或更多的时间，因此您可能只想要对您所修改的 app 进行测试。此时，就可以将 <code>APP=<app folder name></code> 添加在命令后面来实现，如 <code>APP=settings</code>.</p> -</div> -<div class="note"> - <p><b>注意</b>: 您也可以阅读 <a href="/en-US/Firefox_OS/Platform/Automated_testing/Gaia_unit_tests">Gaia Unit Tests</a> 获取更多单元测试的信息。</p> -</div> -<h3 id="集成测试">集成测试</h3> -<p>Integration testing involves testing different units of code together in a group to see how well they work together, and is the logical next step after unit testing. Gaia Integration tests are driven by a marionette script written in JavaScript and a python-based server. It can communicate with Gecko so it’s possible to control both the browser and Firefox OS device, and get them interacting with each other.</p> -<p>You can run the following command to trigger the integration tests:</p> -<pre class="brush: bash">make test-integration</pre> -<div class="note"> - <p><strong>Note</strong>: As with the unit tests, running the whole integration test suite can be very time consuming, so you can append <code>APP=<app folder name></code> onto the above command to test a single app, for example <code>APP=calendar</code>.</p> -</div> -<h3 id="性能测试">性能测试</h3> -<p>Gaia 性能测试会触发 B2G 桌面，多次启动 apps， 并且计算平均 app 装载时间。在运行测试后，性能框架会也会收集 app 和 系统进程（b2g) 的内存使用情况。</p> -<p>要运行这个测试，需要安装上 B2G Desktop, 并运行下面命令</p> -<pre class="brush: bash">make test-perf</pre> -<div class="note"> - <p><strong>注意</strong>: 当涉及到其他的测试类型时，你可以在上面命令后添加 <code>APP=<app folder name></code> 来测试单个 app， 例如 <code>APP=settings</code>.</p> -</div> -<p>整体的平均值会在 <code>mozPerfDurationsAverage</code> 中表示:</p> -<pre class="brush: json">"mozPerfDurationsAverage": 225.5</pre> -<p>这是以毫秒为单位的平均 app 装载时间。为了优化用户体验，你应该将目标设为 1 s 一下。 性能测试同样会返回一些详细的内存使用值：</p> -<pre class="brush: json">{ - "app": { - "name": "Settings", - "uss": 16.6, - "pss": 19.5, - "rss": 32.9, - "vsize": 73.3 - }, - "system": { - "name": "b2g", - "uss": 50.1, - "pss": 53.2, - "rss": 67, - "vsize": 148.1 - } -},</pre> -<p>test-pref 的整体原则是 ”数值越低越好“， 上面的这些值分别表示：</p> -<ul> - <li><code>uss</code>: unique set size</li> - <li><code>pss</code>: proportional set size</li> - <li><code>rss</code>: resident set size</li> - <li><code>vsize</code>: virtual set size</li> -</ul> -<p>Generally <code>vsize</code> >= <code>rss</code> >= <code>pss</code> >= <code>uss</code> . <code>vsize</code> and <code>rss</code> don’t accurately reflect a process’s usage of pages shared with other processes. So the two numbers you want to watch are the <code>pss</code> and <code>uss</code>.<br> - <br> - <code>uss</code> 是指进程所独自完整占用的内存。如果应用程序当前终止的话，这些内存都可以被释放掉。这是用来评价的关键指标。<br> - <br> - <code>pss</code> 是进程共享库按比例所分享的大小。如果进程终止，这些内存也不能释放。<br> - </p> -<div class="note"> - <p><strong>注意</strong>: 要获取更多性能测试的信息，请参考 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Automated_testing/Gaia_performance_tests">Gaia performance tests</a>.</p> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/developing_gaia/understanding_the_gaia_codebase/index.html b/files/zh-cn/archive/b2g_os/developing_gaia/understanding_the_gaia_codebase/index.html deleted file mode 100644 index 8a0695b970..0000000000 --- a/files/zh-cn/archive/b2g_os/developing_gaia/understanding_the_gaia_codebase/index.html +++ /dev/null @@ -1,105 +0,0 @@ ---- -title: 理解 Gaia 代码库 -slug: Archive/B2G_OS/Developing_Gaia/Understanding_the_Gaia_codebase -tags: - - B2G - - Code - - Firefox OS - - Gaia - - Guide - - JavaScript - - contribution -translation_of: Archive/B2G_OS/Developing_Gaia/Understanding_the_Gaia_codebase ---- -<div class="summary"> - <p><span class="seoSummary">在对 </span><span class="seoSummary"><a href="https://github.com/mozilla-b2g/gaia/">Gaia codebase</a></span><span class="seoSummary">作出您自己的修改之前，您需要理解下Gaia 的基本构成以及使用的编码规则。本文则涵盖了这些这些方面。</span></p> -</div> -<h2 id="Gaia_代码库结构">Gaia 代码库结构</h2> -<p>下面的部分则概述了 Gaia 代码库最重要的部分。</p> -<h3 id="apps">apps/</h3> -<p>此目录包括所有的主 Gaia apps， 在 homescreen 中显示的 app（如 calendar 和 camera）和底层 app（如 system, homescreen 和 keyboard ) 。<br> - <br> - app 工作方式略有不同，但有许多公共的特点，包括：</p> -<ul> - <li><code>index.html</code>: 每个 app的中心文件</li> - <li><code>manifest.webapp</code>: 定义 app 的清单文件</li> - <li><code>locales</code>: app 的本地化字符串</li> - <li><code>test</code>: 针对 app 的 单元和集成测试</li> - <li><code>js</code>, <code>style</code>: app 的 脚本和样式</li> - <li><code>resources</code>: 图片，声音以及其他的资源文件</li> -</ul> -<div class="note"> - <p><strong>注意</strong>: 在 <a href="/zh-CN/Firefox_OS/Platform/Gaia/Gaia_apps">Gaia 应用指南</a> 一文中可获得更多关于 app 工作的内容。</p> -</div> -<h3 id="build">build/</h3> -<p>包含编译脚本。</p> -<h3 id="dev_apps">dev_apps/</h3> -<p>文件夹中包含自定义的一些应用。例如，您可以包含一些自定义的 app。</p> -<div class="note"> - <p><strong>注意</strong>: 要获取更多关于 Gaia 自定义项的知识，请参考 <a href="/en-US/Firefox_OS/Developing_Firefox_OS/Market_customizations_guide">Market customizations guide</a>.</p> -</div> -<h3 id="keyboard">keyboard/</h3> -<p> keyboard 文件夹包含了 keyboard 词典以及不同语言的布局。</p> -<h3 id="locales">locales/</h3> -<p>包含一个 JSON 文件，<code>languages_all.json</code>, 该文件定义了 Gaia 所支持的语言。要更深入的了解 apps 是如何本地化的，请参考 <a href="/en-US/Apps/Build/Localization/Getting_started_with_app_localization">Getting started with app localization</a>.</p> -<h3 id="shared">shared/</h3> -<p>此目录包含了多个应用使用的大量的资源文件；其中最重要的部分为：</p> -<ul> - <li><code>gaia/shared/js</code>: 执行常用功能的 JavaScript 库</li> - <li><code>l10n.js</code>: 是一个本地化库，它会检测您的设备的本地化，使用 app locales 文件夹下的字符串替换掉您app中的本地化字符串 (Localisable strings)。元素中需替换的本地字符串（Localisable strings）都带有 <code>data-l10n-id</code> 属性.</li> - <li><code>gaia/shared/locales</code>: 不同地域的本地化资源</li> - <li><code>gaia/shared/resources</code>: 常用资源，如图标，铃声和闹钟声音等。</li> - <li><code>gaia/shared/style</code>: 公共控件（如 按钮，进度条，工具栏，表格等）的样式表和其他样式资源。</li> - <li><code>gaia/shared/style_unstable</code>: 不稳定或正在测试的样式资源。</li> - <li><code>gaia/shared/test</code>: 定义集成和单元测试的 JavaScript 代码。</li> -</ul> -<h3 id="tools">tools/</h3> -<p>tools 目录包含编译脚本和测试的工具。</p> -<h2 id="Gaia_编码风格">Gaia 编码风格</h2> -<p>Gaia 遵循 <a href="http://google-styleguide.googlecode.com/svn/trunk/javascriptguide.xml">Google JavaScript coding style</a>.</p> -<p>背景知识：</p> -<ul> - <li>编码风格: <a href="/en-US/docs/Mozilla/Developer_guide/Coding_Style#General_practices">General practices</a></li> - <li>编码风格: <a href="/en-US/docs/Mozilla/Developer_guide/Coding_Style#JavaScript_practices">JavaScript practices</a></li> - <li>编码风格: <a href="/en-US/docs/Mozilla/Developer_guide/Coding_Style#Naming_and_Formatting_code">Naming and formatting code</a></li> -</ul> -<h3 id="具体规则">具体规则</h3> -<ol> - <li>确保 HTML 文件都带有 <code><!DOCTYPE html></code> 声明（也就是 HTML5 文档）。如果您不这么做， Internet Explorer 9 以及后续的版本会以兼容模式来装载它们。</li> - <li>包含 <code>"use strict";</code> 这个语句（就像刚才写的一样，包含双引号）放在 Js 文件头部，会使 js 进入 strict 模式。</li> - <li>使用两个空格来缩进，而不是使用 tabs。</li> - <li>请使用换行符来分隔代码逻辑！</li> - <li>多单词的文件名称应该使用下划线字符来分隔单词，如<code>like_this.js</code>。</li> - <li>使用单引号而不是双引号来表示字符串。</li> - <li>使用扩展的条件结构: - <pre class="brush: js">Bad -if (expression) doSomething(); - -Correct -if (expression) { - doSomething(); -}</pre> - </li> - <li>如果您修改 <a href="/en-US/Firefox_OS/Platform/Gaia/Gaia_apps/System">System app</a>，请阅读 <a href="https://groups.google.com/forum/#!msg/mozilla.dev.gaia/rEhSrw6XmT4/UNvE7qW9pgYJ">guidance listed here</a>.</li> -</ol> -<h3 id="每笔提交编码风格检查">每笔提交编码风格检查</h3> -<p>在每个 commit 之前，通过调用 git pre-commit hook， Gaia 会使用 <a href="http://www.jshint.com/">jshint</a> 工具会自动对JS 编码风格进行检查。一旦您提交了对 Gaia 仓库的 Pull Request， Travis (Github Continuous Integration) 服务器会运行这个工具来重复检查样式是否正确。</p> -<p> precommit hook 脚本在<a href="https://github.com/mozilla-b2g/gaia/blob/master/tools/pre-commit">gaia/tools/pre-commit</a> 下，一旦 <code>make</code> 命令执行就会复制到 <code>.git/hooks</code> 文件夹 下。</p> -<div class="note"> - <p><strong>注意</strong>: 我们以前会使用 <a href="https://developers.google.com/closure/utilities/docs/linter_howto">gjslint</a> 来检查编码风格，但已将其弃用；而是使用 jshint 来产生更严格和更好的效果。从 Firefox OS 1.4 开始就一直使用 JSHint, gjslint 只被用来检查一些还没有使用 JSHint 的旧文件。</p> -</div> -<h3 id="通过_Gaia_来手动运行_linting_检查">通过 Gaia 来手动运行 linting 检查</h3> -<p>在提交 path 前我们推荐您在 patch 上手动运行 JSHint 来检查是否有任何样式上的错误。<br> - <br> - 您应该在 <a href="https://github.com/mozilla-b2g/gaia/tree/master/build/jshint">gaia/build/jshint</a> 目录下获取更多关于 Gaia 中 jshint 的细节；Gaia 为您提供了一个构建脚本，您可运行：</p> -<pre class="brush: bash">$ make lint</pre> -<p>来自动进行 gjshint 和 jshint 样式的检查。 或者您运行</p> -<pre class="brush: bash">$ make hint</pre> -<p>只运行 jshint 样式检查。</p> -<div class="note"> - <p><strong>注意</strong>: 如果您想要在不是用 Gaia 的情况下，自己安装 Jshint，可运行如下命令：</p> - <pre class="brush: bash">npm install jshint -g -jshint myfile.js -</pre> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/events/disabled/index.html b/files/zh-cn/archive/b2g_os/events/disabled/index.html deleted file mode 100644 index 0a6370bcfb..0000000000 --- a/files/zh-cn/archive/b2g_os/events/disabled/index.html +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: disabled -slug: Archive/B2G_OS/Events/disabled -translation_of: Archive/B2G_OS/Events/disabled ---- -<p>在<strong>禁用</strong>时，无线网络连接的设备上禁用事件引发的。</p> - -<h2 id="基本信息">基本信息</h2> - -<dl> - <dt>规范</dt> - <dd><a class="external" href="https://dxr.mozilla.org/mozilla-central/source/dom/webidl/MozWifiManager.webidl">Wifi（特定于Firefox OS）</a>和<a class="external" href="https://dxr.mozilla.org/mozilla-central/source/dom/webidl/MozWifiP2pManager.webidl">WifiDirect（特定于Firefox OS）</a></dd> - <dt>接口</dt> - <dd>事件</dd> - <dt>泡泡</dt> - <dd>没有</dd> - <dt>可取消</dt> - <dd>没有</dd> - <dt>目标</dt> - <dd>WifiManager和MozWifiP2pManager</dd> - <dt>默认动作</dt> - <dd>没有</dd> -</dl> - -<h2 id="物产">物产</h2> - -<p><em>未知</em></p> - -<h2 id="例">例</h2> - -<pre class="brush:js; notranslate">navigator.mozWifiManager.ondisabled = function(){ - console.log("Wifi已被禁用"); -}; -</pre> - -<h2 id="相关活动">相关活动</h2> - -<ul> - <li>状态改变</li> - <li>connectionInfoUpdate</li> - <li>已启用</li> - <li>残障人士</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/events/index.html b/files/zh-cn/archive/b2g_os/events/index.html deleted file mode 100644 index 6805ee5749..0000000000 --- a/files/zh-cn/archive/b2g_os/events/index.html +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: B2G OS events -slug: Archive/B2G_OS/Events -tags: - - Archive - - B2G - - NeedsTranslation - - TopicStub - - events -translation_of: Archive/B2G_OS/Events ---- -<p>Archived event pages related to B2G OS.</p> - -<dl><dt class="landingPageList"><a href="/en-US/docs/Archive/B2G_OS/Events/connected">connected</a></dt><dd class="landingPageList">The <strong><code>connected</code></strong> event callback is executed when a call has been connected.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/B2G_OS/Events/connectioninfoupdate">connectioninfoupdate</a></dt><dd class="landingPageList">The <strong>connectionInfoUpdate</strong> handler is executed when information about the signal strength and the link speed have been updated.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/B2G_OS/Events/contactchange">contactchange</a></dt><dd class="landingPageList">The <strong><code>contactchange</code></strong> event is fired each time a contact is added, updated or removed from the device's contact database.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/B2G_OS/Events/disabled">disabled</a></dt><dd class="landingPageList">The <strong>disabled</strong> event is raised when WiFi is disabled on the device.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/B2G_OS/Events/enabled">enabled</a></dt><dd class="landingPageList">The <code>enabled</code> handler is executed when Wifi is enabled on the device.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/B2G_OS/Events/localized">localized</a></dt><dd class="landingPageList">The <code>localized</code> event is triggered after the <a href="https://github.com/fabi1cazenave/webL10n">webL10n</a> library has finished localizing the document and detecting language.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/B2G_OS/Events/message">message</a></dt><dd class="landingPageList">The <code>message</code> handler is executed when data is received from a child (i)frame or parent window.</dd></dl> diff --git a/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/1.x/index.html b/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/1.x/index.html deleted file mode 100644 index e872f21b11..0000000000 --- a/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/1.x/index.html +++ /dev/null @@ -1,534 +0,0 @@ ---- -title: Firefox OS 1.x building blocks -slug: Archive/B2G_OS/Firefox_OS_apps/Building_blocks/1.x -tags: - - Apps - - B2G - - Firefox OS - - Firefox OS UX - - NeedsTranslation - - TopicStub - - UX -translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_blocks/1.x ---- -<div class="warning"> -<p><strong>Important</strong>: The descriptions on this page and its subpages are old descriptions written around the first few versions of Firefox OS (1.0.1–1.3), so are out of date. You'll only find these useful if you are writing an app specifically aimed at an old version of Firefox OS, or fixing a bug on an old branch of Gaia. If you want to find more up to date building block information, go to our main <a href="/en-US/Apps/Design/Firefox_OS_building_blocks">Firefox OS building blocks</a> landing page.</p> -</div> - -<div class="summary"> -<p>This page provides links to the Firefox OS 1.x building blocks.</p> -</div> - -<table class="withoutBorder"> - <tbody> - <tr> - <td colspan="2"> - <h2 id="Action_menu">Action menu</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top; width: 180px;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4635/action-menu.png" style="height: 240px; width: 160px;"><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Action_menu">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Action_menu/Coding">Coding guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>An action menu presents a list of actions, related to the app's content, from which the user may make a selection. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Action_menu/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Action_menu/Coding">Coding guide</a> for details on how to implement an action menu in your app.</p> - - <p> </p> - - <h3 id="Characteristics">Characteristics</h3> - - <ul> - <li>Opened from buttons within app content; these buttons are often inside toolbars (for example, the Browser app's "Share" button).</li> - <li>Action menus contain one or more items.</li> - <li>These menus expand in height to accomodate their items, to a maximum of the screen's height. Once that maximum height is reached, the content becomes scrollable vertically. Generally, the best practice is to try to include no more than five items plus a menu title.</li> - <li>The title string is optional.</li> - <li>The menu is closed by one of: - <ul> - <li>Selecting one of the actions.</li> - <li>Tapping the "Cancel" button.</li> - </ul> - </li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Button">Button</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4639/secondary-buttons.png" style="height: 139px; width: 140px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Button">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Button/Coding">Coding guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>Performs an action when tapped by the user. These are highly flexible user interface objects that have a wide variety of styles. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Button/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Button/Coding">Coding guide</a> for information on how to implement buttons that look like those described here.</p> - - <p> </p> - - <h3 id="Characteristics_2">Characteristics</h3> - - <ul> - <li>Buttons have two components: a visual target and a hit target. The hit target is always larger, in order to reduce targeting errors by making the button easier to tap.</li> - <li>Buttons have two states: normal and pressed.</li> - <li>Buttons can also be <strong>disabled</strong>, which means they can't be activated by the user, and are displayed dimmed to indicate that they're disabled.</li> - </ul> - - <p>There are several types of buttons:</p> - - <dl> - <dt>Action buttons</dt> - <dd>Used when there are only a few actions and a list isn't needed. The main action button uses a special highlight color to indicate that it's the primary option.</dd> - <dt>List buttons</dt> - <dd>Used when displaying a list of actions, or to trigger the display of a value selector.</dd> - <dt>Input field buttons</dt> - <dd>Used to perform actions with input fields.</dd> - <dt>Special/custom buttons</dt> - <dd>These are used to provide specific actions including recording, dialing, and the like.</dd> - </dl> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Confirmation">Confirmation</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p><img alt="" src="https://mdn.mozillademos.org/files/4803/confirmation-example.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Confirmation">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Confirmation/Coding">Coding guide</a><br> - </p> - </td> - <td style="vertical-align: top;"> - <p>A confirmation prompt asks the user to take or confirm an action, such as responding to a system event such as asking the user to restart the device after swapping SIM cards, or to ask the user to grant or deny permission to perform a task. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Confirmation/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Confirmation/Coding">Coding guide</a> for information about how to implement these prompts in your app.</p> - - <p> </p> - - <h3 id="Characteristics_3">Characteristics</h3> - - <ul> - <li>Confirmation prompts are modal; they occupy the entire screen, and require user input to close them.</li> - <li>Confirmation prompts consist of: - <ul> - <li>Title (optional)</li> - <li>Body</li> - <li>Icon (optional)</li> - <li>A Confirmation input button, whose label can be customized</li> - <li>An optional Cancel input button, whose label can be customized</li> - </ul> - </li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Filter">Filter</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4825/filter-visual-bottom" style="height: 241px; width: 161px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Filter">Details</a></p> - </td> - <td style="vertical-align: top;"> - <p>Filters can be used for two purposes: data filtering, in which the user can view a single set of data in different ways (for example, the Calendar app uses filters to select the time scale to use when viewing data (that is, by day, week, or month); and secondary navigation (presenting a second set of tabs when tabs are already present in your user interface).</p> - - <p> </p> - - <h3 id="Characteristics_4">Characteristics</h3> - - <ul> - <li>Filters are presented as a horizontal sequence of buttons.</li> - <li>Only one button is focused at a time.</li> - <li>The best practice is to place filters within <a href="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Toolbar" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Toolbar">toolbars</a>, so that they don't flow with content.</li> - <li>Left, middle, and right buttons can be styled uniquely. This lets you make, for example, the left and right ends of your bar take on a "sheen," or to make the bar rounded on the ends.</li> - <li>Filter buttons' widths vary depending on the number of filters in a single set.</li> - <li>You must have at least two and no more than five filters in a set.</li> - <li>A given set of filters may be labeled with either text or icons, but not both. Because filters' heights are relatively small compared to tabs, text is typically the best practice.</li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Header">Header</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4845/header-default.png" style="height: 27px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Header">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Header/Coding">Coding guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>A header labels the active view. In addition, it can contain top-level navigation and inputs for the active view. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Header/Coding" title="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Header/Coding">Coding guide</a> for information on implementing headers in your apps.</p> - - <p> </p> - - <h3 id="Characteristics_5">Characteristics</h3> - - <ul> - <li>A header is a horizontal bar the full width of the screen, which appears at the top of the screen in most apps.</li> - <li>Headers float above content, with the option of flowing with content in special instances, such as in the Browser app.</li> - <li>The heading's text provides the name of the current view.</li> - <li>The heading may optionally include additional text; for example, in an email app, the number of unread messages may be displayed.</li> - <li>Headers may include inputs for navigating and manipulating the current view.</li> - <li>Most apps (full-screen games being an obvious exception) have a header.</li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Input_area">Input area</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4859/sample-sms-bottom-input.png" style="height: 241px; width: 161px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Input_area">Details</a></p> - </td> - <td style="vertical-align: top;"> - <p>An input area is a data entry field. There are many variations on what an input area can look like; they can be as simple as a text entry field, and as complex as a multi-part entry field with text entry, value selectors, and buttons.</p> - - <p><strong>Details coming soon.</strong></p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="List">List</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4889/list-example" style="height: 119px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/List">Details</a></p> - </td> - <td style="vertical-align: top;"> - <p>Lists are used to display a set of consecutive items, such as a list of contacts or a list of messages.</p> - - <p> </p> - - <h3 id="Characteristics_6">Characteristics</h3> - - <ul> - <li>List items may vary in height (from one to three rows in a single item).</li> - <li>List items may be as simple as just a text string, to including images, text, and buttons.</li> - <li>Lists are comprised of rows, with optional section headers.</li> - </ul> - - <p>There are several types of list rows:</p> - - <dl> - <dt>Action row</dt> - <dd>An action row is one in which a tap anywhere in the row triggers the row.</dd> - <dt>Status indicator row</dt> - <dd><span style="color: #ffff00;"><span style="background-color: #ff0000;">Need details.</span></span></dd> - <dt>Button row</dt> - <dd><span style="color: #ffff00;"><span style="background-color: #ff0000;">Need details.</span></span></dd> - <dt>Link row</dt> - <dd><span style="color: #ffff00;"><span style="background-color: #ff0000;">Need details.</span></span></dd> - </dl> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Object_menu">Object menu</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4891/object-menu-idle.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Object_menu">Details</a></p> - </td> - <td style="vertical-align: top;"> - <p> </p> - - <p>An object menu is a menu that lets the user directly manipulate objects without having to open them and navigate deeper into a view hierarchy.</p> - - <ul> - <li>Deleting a photo by selecting its thumbnail, instead of by opening the full image first.</li> - <li>Flagging an email by selecting its preview instead of by first opening the email.</li> - <li>Calling a contact by selecting their name, instead of by opening their detailed contact information then pressing a "Call" button.</li> - </ul> - - <p>Object menus are currently implemented as a special case of action menu; this will evolve over time. For now, see the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Action_menu/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Action_menu/Coding">action menu coding guide</a> for information on how to implement an object menu.</p> - - <p> </p> - - <h3 id="Characteristics_7">Characteristics</h3> - - <ul> - <li>Object menus are accessed using a "press-and-hold" gesture on a selectable object, such as a list row, phone number, URL, or the like.</li> - <li>An object menu contains one or more items.</li> - <li>Object menus expand in height to accomodate their contents, to a maximum of the height of the screen; at that point, the contents of the menu scroll. As a rule of thumb, you should try to avoid having more than five items in the menu.</li> - <li>Unlike <a href="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Action_menu" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Action_menu">action menus</a>, object menus do not have titles.</li> - <li>You implement object menus using the same <a href="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Action_menu/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Action_menu/Coding">code and style as for action menus</a>.</li> - </ul> - - <p> </p> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Progress_and_activity_indicator">Progress and activity indicator</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4897/progress-bar-example.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Progress_and_activity">Details</a></p> - </td> - <td style="vertical-align: top;"> - <p>Progress and activity indicators are used to provide visual feedback that a process is active.</p> - - <p> </p> - - <h3 id="Characteristics_8">Characteristics</h3> - - <ul> - <li>May include an animated visual element, a text label, or both.</li> - <li>Progress and activity indicators may be used in modal windows, or inline either with content or adjacent to content.</li> - <li>An activity indicator is used to show that an activity is ongoing without indicating how long the task is expected to take; these can be "barberpole" style indicators, or spinners.</li> - <li>A progress indicator is used to show how much out of 100% of an activity has been completed.</li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Scrolling">Scrolling</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4917/scrolling-index-scroll-dark.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Scrolling">Details</a></p> - </td> - <td style="vertical-align: top;"> - <p>Scrolling areas are used to let the user move text and/or images across the device's display.</p> - - <p> </p> - - <h3 id="Characteristics_9">Characteristics</h3> - - <p>There are two types of scrolling areas: scrollbars and index scrolling.</p> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Seek_bar">Seek bar</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4923/seekbar-sample.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Seek_bar">Details</a></p> - </td> - <td style="vertical-align: top;"> - <p>Seek bars have a draggable thumb the user can touch and drag back and forth to scroll through content (such as to set playback position in a media file) or to set a new value for a given control, such as sound volume or display brightness.</p> - - <p> </p> - - <h3 id="Characteristics_10">Characteristics</h3> - - <ul> - <li>A seek bar consists of a track with a knob that indicates the current playback position.</li> - <li>The knob has both normal and "pressed" states.</li> - <li>The values for the ends of the seek bar can be specified as either text or images.</li> - <li>Seek bars may be oriented either horizontally or vertically.</li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2"> - <h2 id="Status">Status</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4637/banner.png" style="height: 240px; width: 160px;"><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Status">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Status/Coding">Coding guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>Relays information to the user in a transitory fashion, typically to confirm a user action or to alert the user to a system event. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Status/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Banner/Coding">Coding guide</a> for details on how to implement a status bar. Sometimes status bars are referred to as "banners."</p> - - <p> </p> - - <h3 id="Characteristics_11">Characteristics</h3> - - <ul> - <li>Examples include deleting multiple photos in Gallery, or deleting or moving multiple emails.</li> - <li>Positioned at the bottom of the screen, covering underlying content.</li> - <li>Closing: Status bars automatically disappear, typically after a few seconds for short messages. This can be longer, though, depending on the message and context.</li> - <li>Can include an input, such as an "Undo" option; this is optional.</li> - <li>Can optionally include an image.</li> - <li>Can either be part of an app (such as a "Photos deleted" banner in the Gallery app) or in the System (such as a "Low battery" alert).</li> - <li>Avoid displaying more than one status bar at the same time. If two status bars appear at the same time, the newer status bar replaces the older one.</li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Switch">Switch</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4925/switch-settings-sample.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Switch">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Switch/Coding">Coding guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>A switch is any control which presents two mutually exclusive options or states. Switches are also used to select items within <a href="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/List" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/List">lists</a>. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Switch/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Switch/Coding">Coding guide</a> for details on implementing switches in your apps.</p> - - <p> </p> - - <h3 id="Characteristics_12">Characteristics</h3> - - <ul> - <li>A switch presents two mutually exclusive choices or states.</li> - <li>There are three types of switch: - <ul> - <li>On/Off toggle switches</li> - <li>Checkboxes</li> - <li>Radio buttons</li> - </ul> - </li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Tabs">Tabs</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4955/tab-screenshot.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Tabs">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Tabs/Coding">Coding guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>Tabs are used as a navigational widget that let the user switch among sets of views. This way, a window may contain multiple views. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Tabs/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Tabs/Coding">Coding guide</a> for details on how to implement tabs in your apps.</p> - - <p> </p> - - <h3 id="Characteristics_13">Characteristics</h3> - - <ul> - <li>Tab bars always fill the full horizontal width of the screen.</li> - <li>You may have up to (but no more than) five tabs in a tab bar.</li> - <li>Tab bars should be positioned at the very bottom of the screen, unless doing so would result in excessive clutter due to multiple bars of controls at the bottom of the screen.</li> - <li>Tabs can contain a variety of elements, such as buttons, filters, indicators, and the like.</li> - <li>Tabs' labels may be text, text with an icon, or just an icon.</li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Toolbar">Toolbar</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4967/toolbar-sample.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Toolbar">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Toolbar/Coding">Coding guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>Toolbars contain actions, indicators, and navigation elements associated with the current view. These may include things such as buttons to delete the currently selected items, a filter to enter edit mode, or a filter to show only "favorite" contacts. See the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Toolbar/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Toolbar/Coding">Coding guide</a> for details on how to implement toolbars in your apps.</p> - - <p> </p> - - <h3 id="Characteristics_14">Characteristics</h3> - - <ul> - <li>Toolbars are always the full width of the screen, and are always the same height.</li> - <li>Toolbars never scroll with content; instead, they float above content.</li> - <li>Toolbars should always be positioned at the very bottom edge of the screen <strong>unless</strong> tabs are also present, in which case the toolbar is positioned at the top of the screen instead.</li> - <li>Toolbars may contain a wide variety of elements, including buttons, filters, progress/activity indicators, and so forth.</li> - </ul> - - <p> </p> - </td> - </tr> - <tr> - <td colspan="2" style="vertical-align: top;"> - <h2 id="Value_selector">Value selector</h2> - </td> - </tr> - <tr> - <td style="vertical-align: top;"> - <p style="text-align: center;"><img alt="" src="https://mdn.mozillademos.org/files/4975/selector-nested.png" style="height: 240px; width: 160px;"></p> - - <p style="text-align: center;"><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Value_selector">Details</a><br> - <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Value_selector/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Value_selector/Coding">Coding Guide</a></p> - </td> - <td style="vertical-align: top;"> - <p>Value selectors let the user choose one of a number of possible values, and are typically used from a form interface. For example, value selectors could be used to choose the month or day for a calendar event. These are presented automatically for the values of the <a href="/en-US/docs/Web/HTML/Element/input" title="The HTML <input> element is used to create interactive controls for web-based forms in order to accept data from the user."><code><input></code></a> element's <code><a href="/en-US/docs/Web/HTML/Element/input#attr-type">type</a></code> attribute.</p> - - <p> </p> - - <h3 id="Characteristics_15">Characteristics</h3> - - <ul> - <li>Value selectors may have an optional title.</li> - <li>The following types of value selectors are provided: - <ul> - <li>Date</li> - <li>Time</li> - <li>SIngle-select list</li> - <li>Multiple-select list</li> - </ul> - </li> - </ul> - - <p> </p> - </td> - </tr> - </tbody> -</table> - -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/1.x/按钮/index.html b/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/1.x/按钮/index.html deleted file mode 100644 index 76a4f69227..0000000000 --- a/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/1.x/按钮/index.html +++ /dev/null @@ -1,256 +0,0 @@ ---- -title: 按钮 -slug: Archive/B2G_OS/Firefox_OS_apps/Building_blocks/1.x/按钮 -translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_blocks/1.x/Button ---- -<p>当用户点击时执行操作。这些是高度灵活的用户界面对象，具有多种样式。有关如何实现类似于此处描述的按钮的信息，请参见<a href="https://wiki.developer.mozilla.org/en-US/docs/Archive/B2G_OS/Firefox_OS_apps/Building_blocks/1.x/Button/Coding">编码指南</a>。</p> - -<h2 id="特点">特点</h2> - -<ul> - <li>按钮具有两个组成部分：视觉目标和命中目标。命中目标始终较大，以通过使按钮更易于点按来减少定位错误。</li> - <li>按钮有两种状态：正常和按下状态。</li> - <li>还可以<strong>禁用</strong>按钮，这意味着它们不能被用户激活，并且显示为灰色以指示它们已被禁用。</li> -</ul> - -<p>有几种类型的按钮：</p> - -<dl> - <dt>动作按钮</dt> - <dd>仅在执行少量操作且不需要列表时使用。主操作按钮使用特殊的突出显示颜色来指示它是主要选项。</dd> - <dt>列表按钮</dt> - <dd>在显示操作列表或触发值选择器显示时使用。</dd> - <dt>输入栏按钮</dt> - <dd>用于对输入字段执行操作。</dd> - <dt>特殊/自定义按钮</dt> - <dd>这些用于提供特定的操作，包括记录、拨号等。</dd> -</dl> - -<h2 id="Visuals">Visuals</h2> - -<p>Here are some visual examples of what buttons should look like. Don't forget that you can use the style sheet and image resources provided in the <a href="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Button/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Button/Coding">Coding guide</a> to implement these.</p> - -<h3 id="Action_buttons">Action buttons</h3> - -<p>Action buttons are used when there are only a few actions and you don't need a full list. The main action button uses a special highlight color to indicate that it's the primary action.</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="row"></th> - <th scope="col">Primary action</th> - <th scope="col">Secondary action</th> - <th scope="col">Delete</th> - </tr> - </thead> - <tbody> - <tr> - <th scope="row">Normal</th> - <td><img alt="" src="https://mdn.mozillademos.org/files/4693/btn-main-normal.jpg" style="height: 40px; width: 140px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4699/btn-secondary-normal.jpg" style="height: 40px; width: 140px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4687/btn-delete-normal.jpg" style="height: 40px; width: 140px;"></td> - </tr> - <tr> - <th scope="row">Pressed</th> - <td><img alt="" src="https://mdn.mozillademos.org/files/4691/btn-main-lit.jpg" style="height: 40px; width: 140px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4697/btn-secondary-lit.jpg" style="height: 40px; width: 140px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4685/btn-delete-lit.jpg" style="height: 40px; width: 140px;"></td> - </tr> - <tr> - <th scope="row">Disabled</th> - <td><img alt="" src="https://mdn.mozillademos.org/files/4689/btn-main-disabled.jpg" style="height: 40px; width: 140px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4695/btn-secondary-disabled.jpg" style="height: 40px; width: 140px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4683/btn-delete-disabled.jpg" style="height: 40px; width: 140px;"></td> - </tr> - </tbody> -</table> - -<p>On a dark background, disabled buttons have a special appearance, as seen below.</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="row"></th> - <th scope="col">Primary action</th> - <th scope="col">Secondary action</th> - </tr> - </thead> - <tbody> - <tr> - <th scope="row">Disabled</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4701/btn-primary-disabled-dark.jpg" style="height: 40px; width: 140px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4703/btn-secondary-disabled-dark.jpg" style="height: 40px; width: 140px;"></td> - </tr> - </tbody> -</table> - -<h3 id="List_buttons">List buttons</h3> - -<p>List buttons are used to display a list of actions, to trigger the display of a value selector.</p> - -<h4 id="Triggering_actions">Triggering actions</h4> - -<table class="standard-table"> - <thead> - <tr> - <th scope="row"></th> - <th scope="col">Trigger an action in the current view</th> - <th scope="col">Trigger an action in a new view</th> - <th scope="col">Display a value selector</th> - </tr> - </thead> - <tbody> - <tr> - <th scope="row">Normal</th> - <td><img alt="" src="https://mdn.mozillademos.org/files/4725/btn-trigger-current-normal.png" style="height: 40px; width: 291px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4731/btn-trigger-new-normal.png" style="height: 40px; width: 290px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4743/btn-trigger-selector-normal.png" style="height: 40px; width: 291px;"></td> - </tr> - <tr> - <th scope="row">Pressed</th> - <td><img alt="" src="https://mdn.mozillademos.org/files/4727/btn-trigger-current-pressed.png" style="height: 40px; width: 291px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4733/btn-trigger-new-pressed.png" style="height: 39px; width: 289px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4745/btn-trigger-selector-pressed.png" style="height: 40px; width: 291px;"></td> - </tr> - <tr> - <th scope="row">Disabled</th> - <td><img alt="" src="https://mdn.mozillademos.org/files/4723/btn-trigger-current-disabled.png" style="height: 40px; width: 290px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4729/btn-trigger-new-disabled.png" style="height: 40px; width: 290px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4741/btn-trigger-selector-disabled.png" style="height: 40px; width: 291px;"></td> - </tr> - </tbody> -</table> - -<h4 id="Value_selectors">Value selectors</h4> - -<p>Once a value selector has been opened, you will need at least one button on the value selector panel to dismiss the value selector. These buttons should look like the following:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Normal</th> - <th scope="col">Pressed</th> - <th scope="col">Disabled</th> - </tr> - </thead> - <tbody> - <tr> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4755/btn-selector-normal.png" style="height: 39px; width: 269px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4757/btn-selector-pressed.png" style="height: 39px; width: 269px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4753/btn-selector-disabled.png" style="height: 39px; width: 269px;"></td> - </tr> - </tbody> -</table> - -<h3 id="Input_field_buttons">Input field buttons</h3> - -<p>Input field buttons are buttons associated with an input field, which when pressed perform an action related to that input field.</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Normal</th> - <th scope="col">Pressed</th> - <th scope="col">Disabled</th> - </tr> - </thead> - <tbody> - <tr> - <td><img alt="" src="https://mdn.mozillademos.org/files/4761/input-field-normal.png" style="height: 40px; width: 320px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4763/input-field-pressed.png" style="height: 40px; width: 320px;"></td> - <td><img alt="" src="https://mdn.mozillademos.org/files/4759/input-field-disabled.png" style="height: 40px; width: 320px;"></td> - </tr> - </tbody> -</table> - -<h3 id="Special_buttons">Special buttons</h3> - -<p>The special buttons are visual icon-style buttons used for special purposes, such as operating the device's camera, answering and hanging up the phone, and activating the keypad dialer. You may of course find other uses for this style of button.</p> - -<h4 id="Camera_buttons">Camera buttons</h4> - -<p>These buttons don't have a disabled state; you simply don't display them if the ability to take photos isn't available.</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="row"></th> - <th scope="col">Record video</th> - <th scope="col">Stop recording video</th> - <th scope="col">Capture photo</th> - </tr> - </thead> - <tbody> - <tr> - <th scope="row">Normal</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4771/video-record-normal.png" style="height: 45px; width: 100px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4775/video-stop-normal.png" style="height: 45px; width: 100px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4767/camera-normal.png" style="height: 45px; width: 100px;"></td> - </tr> - <tr> - <th scope="row">Pressed</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4773/video-record-pressed.png" style="height: 45px; width: 100px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4777/video-stop-pressed.png" style="height: 45px; width: 100px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4769/camera-pressed.png" style="height: 45px; width: 100px;"></td> - </tr> - </tbody> -</table> - -<h4 id="Phone_buttons">Phone buttons</h4> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="row"></th> - <th scope="col">Pick up</th> - <th scope="col">Hang up</th> - <th scope="col">Hide keypad</th> - </tr> - <tr> - <th scope="row">Normal</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4781/phone-answer-normal.png" style="height: 40px; width: 130px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4787/phone-hangup-normal.png" style="height: 40px; width: 130px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4793/hide-dialer-normal.png" style="height: 40px; width: 130px;"></td> - </tr> - <tr> - <th scope="row">Pressed</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4783/phone-answer-pressed.png" style="height: 40px; width: 130px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4789/phone-hangup-pressed.png" style="height: 40px; width: 130px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4795/hide-dialer-pressed.png" style="height: 40px; width: 130px;"></td> - </tr> - <tr> - <th scope="row">Disabled</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4779/phone-answer-disabled.png" style="height: 40px; width: 130px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4785/phone-hangup-disabled.png" style="height: 40px; width: 130px;"></td> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4791/hide-dialer-disabled.png" style="height: 40px; width: 130px;"></td> - </tr> - </tbody> -</table> - -<h4 id="Custom_buttons">Custom buttons</h4> - -<p>These are examples of custom buttons; in this case, for adding a contact.</p> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="row">Normal</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4799/generic-normal.png" style="height: 40px; width: 90px;"></td> - </tr> - <tr> - <th scope="row">Pressed</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4801/generic-pressed.png" style="height: 40px; width: 90px;"></td> - </tr> - <tr> - <th scope="row">Disabled</th> - <td style="background-color: black;"><img alt="" src="https://mdn.mozillademos.org/files/4797/generic-disabled.png" style="height: 40px; width: 90px;"></td> - </tr> - </tbody> -</table> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/UX" title="/en-US/docs/Mozilla/Firefox_OS/UX">Firefox OS user experience</a></li> - <li><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x/Button/Coding" title="/en-US/docs/Mozilla/Firefox_OS/UX/Building_blocks/Button/Coding">Button coding guide</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/index.html b/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/index.html deleted file mode 100644 index 0b20e0c329..0000000000 --- a/files/zh-cn/archive/b2g_os/firefox_os_apps/building_blocks/index.html +++ /dev/null @@ -1,187 +0,0 @@ ---- -title: Firefox OS Building Blocks -slug: Archive/B2G_OS/Firefox_OS_apps/Building_blocks -tags: - - Design - - Design patterns - - Firefox OS - - NeedsTranslation - - TopicStub - - UI - - building blocks -translation_of: Archive/B2G_OS/Firefox_OS_apps/Building_blocks ---- -<section class="Quick_links" id="Quick_Links"> - -<ol> - <li data-default-state="closed"><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS">Build and install</a> - <ol> - <li><strong><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS">Build and install overview</a></strong></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS/B2G_OS_build_process_summary">B2G OS build process summary</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/B2G_OS_build_prerequisites">Build prerequisites</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Preparing_for_your_first_B2G_build">Preparing for your first build</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building">Building B2G OS</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS/B2G_installer_add-on">B2G installer add-on</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS/Building_for_Flame_on_OS_X">Building B2G OS for Flame on Mac OS X</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Choosing_how_to_run_Gaia_or_B2G">Choosing how to run Gaia or B2G OS</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS/Compatible_Devices">Compatible Devices</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Installing_on_a_mobile_device">Installing B2G OS on a mobile device</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS/B2G_OS_update_packages">Creating and applying B2G OS update packages</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building/FOTA_community_builds">Building and installing FOTA community builds</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Building_and_installing_B2G_OS/B2G_Build_Variables_Reference_Sheet">B2G build variables reference sheet</a></li> - </ol> - </li> - <li data-default-state="closed"><a href="/en-US/docs/Mozilla/B2G_OS/Porting_B2G_OS">Porting B2G OS</a> - <ol> - <li><strong><a href="/en-US/docs/Mozilla/B2G_OS/Porting_B2G_OS">Porting overview</a></strong></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Porting_B2G_OS/basics">Porting basics</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Porting_B2G_OS/Porting_on_CyanogenMod">Porting on CyanogenMod</a></li> - </ol> - </li> - <li data-default-state="closed"><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia">Developing Gaia</a> - <ol> - <li><strong><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia">Developing Gaia overview</a></strong></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Running_the_Gaia_codebase">Running the Gaia codebase</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Mulet">Run Gaia on desktop using Mulet</a></li> - - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Understanding_the_Gaia_codebase">Understanding the Gaia codebase</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Making_Gaia_code_changes">Making Gaia code changes</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Testing_Gaia_code_changes">Testing Gaia code changes</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Submitting_a_Gaia_patch">Submitting a Gaia patch</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Build_System_Primer">Gaia build system primer</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Different_ways_to_run_Gaia">Different ways to run Gaia</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/make_options_reference">Make options reference</a></li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/Developing_Gaia/Gaia_tools_reference">Gaia tools reference</a></li> - </ol> - </li> - <li><a href="/en-US/docs/Mozilla/B2G_OS/API">B2G OS APIs</a></li> -</ol> -</section> - -<div class="summary"> -<p>The Firefox OS Building Blocks are reusable UI components (also called 'common controls') that reflect OS-wide design patterns. Building Blocks are used to create the interfaces of all <a href="/en-US/Firefox_OS/Platform/Gaia">Gaia</a> default apps. You are free to make use of these components in your own Firefox OS apps, or general Web apps.</p> -</div> - -<h2 id="Using_the_Firefox_OS_Building_Blocks">Using the Firefox OS Building Blocks</h2> - -<p>The code for the Firefox OS Building Blocks can be found in the <a href="https://github.com/mozilla-b2g/gaia">Gaia Github repo</a> under <a href="https://github.com/mozilla-b2g/gaia/tree/master/shared/style">shared/style</a>. Here, you can find a CSS file that contains the CSS for that particular Building Block, and a sub directory containing the HTML fragments and image assets. If you are creating your own standalone Web app, you can simply copy the CSS, HTML and image asset files across into your own project; if your app is intended to be installed on Firefox OS only (or you want to use these features only when the app is being used on Firefox OS), then you can link to the versions available inside Gaia.</p> - -<p>The pages for the individual Building Block implementations can be found under the pages for each building block — see next section. These contain instructions on how to implement each one.</p> - -<div class="note"> -<p><strong>Note</strong>: The version 2.0 building block code is used in Firefox OS releases 2.0 through 2.2. Version 2.3 sees an update, with the building blocks being reimplemented using <a href="/en-US/docs/Web/Web_Components">Web components</a> — these provide the same functionality, but implemented in a much more powerful, flexible way. You'll see 2.3 pages appear underneath the main building block pages covering these Web components as soon as the information is available.</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: We also have an old guide covering the <a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x">v1.x building blocks</a> used in older versions of Firefox OS. This is mainly for legacy information.</p> -</div> - -<h2 id="Web_components_preliminary_setup">Web components preliminary setup</h2> - -<p>This section details the preliminary setup needed to use Gaia Web components.</p> - -<h3 id="Web_components_browser_support">Web components browser support</h3> - -<p>To use <a href="https://github.com/gaia-components">Gaia Web components</a> at all, you need to run them using a browser that supports Web components. The state of support is as follows:</p> - -<ul> - <li>Firefox: Supported since Firefox 23 (33 on Android), but preffed off. To enable Web components, go to <code>about:config</code> and enable the <code>dom.webcomponents.enabled</code> pref.</li> - <li>Chrome: Supported since Chrome 33 (39 on Android).</li> - <li>Opera: Supported since Opera 20 (24 on Android).</li> - <li>Android browser: Supported since 4.4.4.</li> - <li>Safari/iOS Mobile and IE/IE mobile: Nope.</li> -</ul> - -<p>Web components are supported in Firefox OS from v2.1 onwards, although most of them weren't actually implemented until v2.3. Be aware also that currently Web components won't work for Firefox OS apps below internal (certified) level. This restriction should be lessened in the future.</p> - -<div class="note"> -<p><strong>Note</strong>: If your app is certified, the components will just work. You don't need to set a specific manifest permission.</p> -</div> - -<h3 id="Web_components_installation_notes">Web components installation notes</h3> - -<p>Gaia Web components are installed in your app using the <a href="http://bower.io/">Bower</a> package manager. To install this, you first need <a href="http://nodejs.org/">Node.js/npm</a> and <a href="http://www.git-scm.com/">Git</a> installed. Once they are installed you can install Bower with</p> - -<pre class="brush: bash notranslate">npm install -g bower</pre> - -<p>At this point you could also install the Gaia Fira Sans font that Firefox OS uses in your app , with the following command:</p> - -<pre class="brush: bash notranslate">bower install gaia-components/gaia-fonts</pre> - -<p>You can then make use of the font by including the following in your head (along with a <code>font-family</code> of <code>FiraSans</code>):</p> - -<pre class="brush: html notranslate"><link rel="stylesheet" type="text/css" href="bower_components/gaia-fonts/style.css"></link></pre> - -<h2 id="Firefox_OS_Building_Blocks">Firefox OS Building Blocks</h2> - -<div class="column-container"> -<div class="column-half"> -<dl> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Action_menu">Action menu</a></dt> - <dd>An action menu presents a list of actions, related to the app's content, from which the user may make a selection.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Banners">Banners</a></dt> - <dd>Banners (Status, in older versions of Firefox OS) provide information to the user in a transitory fashion, typically to confirm an action or to alert the user to a system event.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Buttons">Buttons</a></dt> - <dd>Buttons are used to perform explicit actions. Buttons may be text or images.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Context_menu">Context menu</a></dt> - <dd>Accessed via a tap and hold gesture (sometimes called a <em>long press</em>), the Context Menu (called the Object Menu in older versions of Firefox OS) allows users to perform actions on objects without having to leave their current view.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Dialog">Dialog</a></dt> - <dd>A Dialog (Confirm, in older versions of Firefox OS) provides the user with some important information, asks the user to take or confirm an action, or allows the user to make a choice or enter some information.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Drawer">Drawer</a></dt> - <dd>The drawer is a scalable way for users to navigate between views or filter views. The drawer can also include links to app settings or other tools.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Header">Header</a></dt> - <dd>A header is a dedicated space at the top of the screen, most often used to display the view title. It can also include navigation, action buttons and other controls.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Input_area">Input area</a></dt> - <dd>An input area is a data entry field, and can be as simple as a text only entry field, or as complex as a multipart entry field with text entry, value selections, and buttons.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Layout">Layout</a></dt> - <dd>The Layout utility will help you to create common layout structures for your Firefox OS apps. Note that Layout is only available in Firefox OS 2.1 and above.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/List_items">List items</a></dt> - <dd>List items are typically used to navigate to a new screen, or to display information or controls.</dd> -</dl> -</div> - -<div class="column-half"> -<dl> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Picker">Picker</a></dt> - <dd>The Picker is designed to select a group of items as attachments for messaging and email.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Progress_and_activity">Progress and activity</a></dt> - <dd>Progress and activity indicators provide the user with visual feedback that a process (such as a resource loading) is active.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Scrolling">Scrolling</a></dt> - <dd>Scrolling areas allow the user to move text and/or images across the device's display.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Search">Search</a></dt> - <dd>Search is used to filter a list or find context-specific content.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Slider">Slider</a></dt> - <dd>A Slider (which was called Seekbar in older Firefox OS versions) is used to select a value from a continuous or discrete range of values by dragging the handle.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Select_mode">Select mode</a></dt> - <dd>Select Mode (which was called Edit Mode in older Firefox OS versions) is designed to select and perform actions on items.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Subheader">Subheader</a></dt> - <dd>Subheaders are used to describe a subsection of content.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Switches">Switches</a></dt> - <dd>Switches (such as checkboxes, etc.) allow users to activate and deactivate items. Switches are also used to select items within a list.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Tab_Filter">Tab/Filter</a></dt> - <dd>A Tab/Filter gives the user a way to easily switch between views or to filter a set of data.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Toolbars">Toolbars</a></dt> - <dd>Toolbars contain actions, indicators and navigation elements associated with the current view.</dd> - <dt><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/Value_selector">Value selector</a></dt> - <dd>Value Selectors let the user choose from among a list of possible values.</dd> -</dl> -</div> -</div> - -<div class="note"> -<p><strong>Note</strong>: For a detailed guide to the design pattern followed by the building blocks when the Arabic locale (bidirectional) is selected, read <a href="/en-US/Apps/Design/Firefox_OS_in_Arabic">Firefox OS in Arabic</a>.</p> -</div> - -<h2 id="Cross_browser_CSS">Cross browser CSS</h2> - -<p>Arnau March wrote a CSS file called <a href="https://github.com/mdn/gaia-2.0-bb/blob/gh-pages/cross_browser_css/cross_browser.css">cross browser CSS</a>, containing rules to allow Firefox 2.0 building blocks to render properly across different browsers (ie 9, Firefox 18, Chrome 24, Safari 5.1.) If you want to write hosted apps that look ok across different browsers, include this CSS in your project.</p> - -<h2 id="Browse_Firefox_OS_Building_Block_implementations_by_version">Browse Firefox OS Building Block implementations by version</h2> - -<p>The pages below list links to pages covering the Firefox OS Building Block implementations as they appear in different versions of Firefox OS.</p> - -<ul> - <li><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/2.3">Firefox OS 2.3 Web components</a></li> - <li><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/2.0">Firefox OS 2.0 building blocks</a> (covers Firefox OS 2.0–2.2.)</li> - <li><a href="/en-US/Apps/Design/Firefox_OS_building_blocks/1.x">Firefox OS 1.x building blocks</a> (covers older versions of Firefox OS.)</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/firefox_os_apps/index.html b/files/zh-cn/archive/b2g_os/firefox_os_apps/index.html deleted file mode 100644 index 370236dd14..0000000000 --- a/files/zh-cn/archive/b2g_os/firefox_os_apps/index.html +++ /dev/null @@ -1,85 +0,0 @@ ---- -title: Firefox OS apps -slug: Archive/B2G_OS/Firefox_OS_apps -tags: - - Apps - - Building - - Components - - Firefox OS - - Installing - - NeedsTranslation - - TopicStub - - device APIs -translation_of: Archive/B2G_OS/Firefox_OS_apps ---- -<p class="summary">This section of the Firefox OS docs covers the specific techniques required — and available tools — for building Firefox OS apps. You'll find a number of details below, from Firefox OS building blocks/web components, to device APIs and App installation.</p> - -<h2 id="Building_Firefox_OS_apps">Building Firefox OS apps</h2> - -<dl> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Building_apps_for_Firefox_OS">Building apps for Firefox OS</a></dt> - <dd>Firefox OS/Firefox platform app specifics, including App installation and management APIs, manifest files, packaged and hosted apps, handling API permissions.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Localization">Localization</a></dt> - <dd>This set of articles provides information for developers wishing to provide localized versions of their apps.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Performance">Performance</a></dt> - <dd>This page lists performance-related topics specific to Firefox OS.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Firefox_Accounts_on_Firefox_OS">Firefox Accounts on Firefox OS</a></dt> - <dd>This article provides an overview of using <a href="/en-US/docs/Mozilla/Tech/Firefox_Accounts">Firefox Accounts</a> in Firefox OS.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Reference_apps">Reference apps</a></dt> - <dd>This page lists a number of sample apps we've put together for you to download, install, play with and learn from. Have fun!</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Screencast_series:_App_Basics_for_Firefox_OS">Screencast series: App Basics for Firefox OS</a></dt> - <dd>In this collection of short videos, developers from Mozilla and Telenor explain in a few steps how you can get started with building applications for Firefox OS.</dd> -</dl> - -<h2 id="Building_blocks">Building blocks</h2> - -<dl> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Building_blocks">Building Blocks</a></dt> - <dd>The Firefox OS Building Blocks are reusable UI components (also called 'common controls') that reflect OS-wide design patterns. Building Blocks are used to create the interfaces of all <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Gaia">Gaia</a> default apps. You are free to make use of these components in your own Firefox OS apps, or general Web apps.</dd> -</dl> - -<h2 id="Styleguides">Styleguides</h2> - -<dl> - <dt><a href="http://www.mozilla.org/en-US/styleguide/products/firefox-os/">Firefox OS Visual styleguide</a></dt> - <dd>Our style guide for Firefox OS visual design, covering colours, typeface, backgrounds, app icons, and the design of specific UI elements.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Copy_styleguide">Firefox OS Copy styleguide</a></dt> - <dd>This guide outlines the rules we follow for writing Firefox OS app copy, but can be used as a general guide to writing good copy for any app interfaces.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Firefox_OS_in_Arabic">Firefox OS in Arabic</a></dt> - <dd>A guide to the specific UX design implementation Firefox OS has in place for dealing with Arabic (and other RTL languages.)</dd> -</dl> - -<h2 id="Assets">Assets</h2> - -<dl> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Design_asset_library">Firefox OS design asset library</a></dt> - <dd>In this section you'll find design assets, artwork, graphic templates, fonts and other materials that will be helpful as you design Firefox OS/Gaia apps.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Icon_font">Firefox OS icon font</a></dt> - <dd>Firefox OS has its own icon font set available: this article explains how to use it in your own apps.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Transitions">Firefox OS transitions</a></dt> - <dd>A reference to some of the transitions used in Firefox OS to move between different states in apps, including animated GIFs demonstrating the animations used, plus code samples to show the CSS animation code needed to implement these animations.</dd> -</dl> - -<h2 id="References">References</h2> - -<dl> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Firefox_OS_device_APIs">Firefox OS device APIs</a></dt> - <dd>This article provides a list of pages covering those APIs, as well as the <a href="https://developer.mozilla.org/en-US/Apps/Build/Manifest">app manifest</a> permissions for each one.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Firefox_OS_app_tools">Firefox OS app tools</a></dt> - <dd>This page provides a list of useful tools, libraries, examples, etc. that are useful for Firefox OS app developers, whether you want a code template to copy, or need help with adding a specific feature to your Firefox OS app.</dd> -</dl> - -<h2 id="Other_app_topics">Other app topics</h2> - -<dl> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/Porting_Chrome_apps">Porting Chrome apps to Firefox OS Apps</a></dt> - <dd>This article discusses the differences between Chrome apps and Firefox OS Apps, and how you can convert between the two.</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_apps/App_development_FAQ">App development FAQ</a></dt> - <dd>This FAQ is a compilation of answers to common app development questions.</dd> -</dl> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Mozilla/Marketplace">Firefox Marketplace</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/firefox_os_build_prerequisites/index.html b/files/zh-cn/archive/b2g_os/firefox_os_build_prerequisites/index.html deleted file mode 100644 index 8cca33fd04..0000000000 --- a/files/zh-cn/archive/b2g_os/firefox_os_build_prerequisites/index.html +++ /dev/null @@ -1,267 +0,0 @@ ---- -title: 编译Firefox OS的系统需求 -slug: Archive/B2G_OS/Firefox_OS_build_prerequisites -translation_of: Archive/B2G_OS/B2G_OS_build_prerequisites ---- -<p style="">在获取用于编译Firefox OS的代码之前，你需要设置好所需的<a href="https://developer.mozilla.org/en-US/docs/Developer_Guide/Build_Instructions" title="https://developer.mozilla.org/en-US/docs/Developer_Guide/Build_Instructions">编译环境</a>。目前可在64位Linux或Mac OS X下编译Firefox OS。</p> -<p style=""><span style="background-color: #daa520;">注意：要构建firefox OS到手机上，开始时不要把你的手机连接到电脑上，当需要连接的时候我们会告诉你把手机插入到电脑上。</span></p> -<h2 id="使用兼容的硬件或使用模拟器" style="">使用兼容的硬件或使用模拟器</h2> -<p><span id="answer_long0" style="display: block;">尽管我们支持一些手机，其中一些还有多种变体产品，但我们当前支持一些特定的产品而且有些设备比其他的有更好的支持：</span></p> -<h3 id="等级_1">等级 1</h3> -<p>等级1设备表示用于开发的主要设备，而且常常会是最先收到漏洞修复和功能更新。</p> -<dl> - <dt> - Unagi</dt> - <dd> - Unagi是被用来作为中低端智能手机测试和开发平台的一个手机，许多核心Firefox OS开发者都使用Unagi。</dd> - <dt> - Otoro</dt> - <dd> - Otoro是被用来作为中低端智能手机测试和开发平台的一个手机，许多核心Firefox OS开发者都使用Otoro。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Pandaboard" title="/en-US/docs/Mozilla/Boot_to_Gecko/Pandaboard">开发平台Pandaboard</a></dt> - <dd> - Pandaboard是一个基于OMAP（开放式多媒体应用平台，Open Multimedia Application Platform）4架构的开发用电路板，用于移动平台上的开发工作。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_emulators" title="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_emulators">模拟器（ARM和x86）Emulator (ARM and x86)</a></dt> - <dd> - 有两种可用的模拟器：一个模拟ARM代码（指令集），而另一个运行在x86代码（指令集）上。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client" title="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client">桌面</a></dt> - <dd> - 你也可以构建Firefox OS的桌面版本；这种方式在<a href="/en-US/docs/XULRunner" title="/en-US/docs/XULRunner">XULRunner</a>应用中运行<a href="/en-US/docs/Gecko" title="/en-US/docs/Gecko">Gecko</a>，接着你就可以在其中使用<a href="/en-US/docs/Mozilla/Boot_to_Gecko/Introduction_to_Gaia" title="/en-US/docs/Mozilla/Boot_to_Gecko/Introduction_to_Gaia">Gaia</a>用户界面了。</dd> -</dl> -<p>当然，你也可以构建<a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client" title="en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client">桌面客户端</a>或者使用<a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_emulators" title="en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_emulators">模拟器</a>。</p> -<h3 id="等级2">等级2</h3> -<p><span id="answer_long1" style="display: block;">等级2设备为一般功能性设备，许多开发者（特别是应用开发者）都是用这样的设备，所以他们往往在之后选择更新。</span></p> -<dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Samsung_Nexus_S" title="/en-US/docs/Mozilla/Firefox_OS/Samsung_Nexus_S"><span class="link-https">Samsung Nexus S</span></a></dt> - <dd> - 已知的Nexus S设备中可用的产品型号为GT-I9020A和GT-I9023，其他型号也许可以用。</dd> - <dt> - Samsung Nexus S 4G</dt> - <dd> - SPH-D720作为等级2设备支持。</dd> -</dl> -<h3 id="等级3">等级3</h3> -<p><span id="answer_long1" style="display: block;">Firefox OS可以在这些设备上构建，但是他们并不是核心开发者积极工作的基础设备。他们的可靠性和功能设置可能会明显的落后于等级1设备甚至于等级2设备。</span></p> -<dl> - <dt> - Samsung Galaxy S2</dt> - <dd> - 唯一可用的产品型号是i9100；没有其他的同类型变体具有官方兼容性。（i9100P可能可用，因为它唯一的改变是增加了一个NFC芯片）</dd> - <dt> - Samsung Galaxy Nexus</dt> - <dd> - 现在所知的没有任何变体产品可以兼容。</dd> -</dl> -<div class="warning"> - <strong>重点：</strong> 仅支持至少运行<strong>Android 4</strong>（又称<strong>Ice Cream Sandwich</strong>）的设备，如果你的设备在上面列出来了，但是运行的是低版本的安卓系统，请先升级在进行操作。</div> -<h2 id="Linux系统需求" style="">Linux系统需求</h2> -<p>在Linux系统下构建Firefox OS，要求如下：</p> -<p>To build on Linux, you'll need to have a system configured with:</p> -<ul> - <li>An installed <strong>64 bit GNU/Linux</strong> distribution (we recommend Ubuntu 12.04).安装64位GNU/Linux发行版（我们推荐Ubuntu12.04）</li> - <li>At least <strong>4 GB</strong> of RAM/swap space.(至少有4GB内存或交换分区空间)</li> - <li>At least <strong>20 GB</strong> of available hard disk space.（至少有20GB的空白硬盘空间）</li> -</ul> -<p>This is more than the bare minimum, but sometimes building fails just because it's missing resources.【这已经超过最低限度，但是有时构建失败只是因为缺少资源】</p> -<p>It's possible to use other distributions, but we recommend Ubuntu 12.04 since it's the most common system people use successfully. Distributions that <strong>might not work</strong>: <strong>32 bit</strong> distros and recent distros ( <strong>Ubuntu 12.10, Fedora 17/18, Arch Linux</strong> because of <strong>gcc 4.7</strong>).【可以使用其他发行版本，但是我们建议使用Ubuntu 12.04，因为他是人们成功使用最常用的。可能无法正常工作的发行版有：32位和最近发型版本(Ubuntu 12.10，Fedora 17/18，因为linux分支gcc 4.7-可能版本过高吧)】</p> -<p>You will also need the following tools installed:</p> -<p>【你还需要安装一下工具：】</p> -<ul> - <li><strong>autoconf 2.13</strong></li> - <li><strong>bison</strong></li> - <li><strong>bzip2</strong></li> - <li><strong>ccache</strong></li> - <li><strong>curl</strong></li> - <li><strong>flex</strong></li> - <li><strong>gawk</strong></li> - <li><strong>git</strong></li> - <li><strong>gcc / g++ / g++-multilib</strong> <strong>(4.6.3 or older)</strong></li> - <li><strong>make</strong></li> - <li><strong>OpenGL headers</strong></li> - <li><strong>X11 headers</strong></li> - <li><strong>32-bit ncurses</strong></li> - <li><strong>32-bit zlib</strong></li> -</ul> -<h3 id="64_bit_install_examples"><strong>64 bit install examples:</strong></h3> -<p><strong>Ubuntu 12.04 / Linux Mint 13 / Debian 6</strong></p> -<pre>$ sudo apt-get install autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib git ia32-libs lib32ncurses5-dev lib32z1-dev libgl1-mesa-dev libx11-dev make zip</pre> -<p class="note">When building on 64-bit Ubuntu, you may find that you need to add symlinks for the 32-bit versions of <code>libX11.so</code> and <code>libGL.so</code>:</p> -<pre class="note">$ sudo ln -s /usr/lib/i386-linux-gnu/libX11.so.6 /usr/lib/i386-linux-gnu/libX11.so -$ sudo ln -s /usr/lib/i386-linux-gnu/mesa/libGL.so.1 /usr/lib/i386-linux-gnu/libGL.so</pre> -<p><strong>Ubuntu 12.10</strong></p> -<pre>$ sudo apt-get install autoconf2.13 bison bzip2 ccache curl flex gawk gcc g++ g++-multilib gcc-4.6 g++-4.6 g++-4.6-multilib git ia32-libs lib32ncurses5-dev lib32z1-dev libgl1-mesa-dev libx11-dev make zip</pre> -<p class="note">In addition to the steps above needed to fix issues with the 32-bit versions of the <code>libX11.so</code> and <code>libGL.so</code> libraries, you will need to specify GCC 4.6 as the default host compiler before building. After having retrieved the sources, see <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file#Changing_the_default_host_compiler" title="en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file#Changing_the_default_host_compiler">here</a> how to do it.</p> -<p class="note">In a fresh Ubuntu 12.10 install, you'll get an error about unmet dependenceis for ia32-libs. The following steps fix it.</p> -<pre>sudo dpkg --add-architecture i386 -sudo apt-get update -sudo apt-get install ia32-libs</pre> -<p><strong>Fedora 16:</strong></p> -<pre class="note">$ sudo yum install autoconf213 bison bzip2 ccache curl flex gawk gcc-c++ git glibc-devel glibc-static libstdc++-static libX11-devel make mesa-libGL-devel ncurses-devel patch zlib-devel ncurses-devel.i686 readline-devel.i686 zlib-devel.i686 libX11-devel.i686 mesa-libGL-devel.i686 glibc-devel.i686 libstdc++.i686 libXrandr.i686 zip</pre> -<p><strong>Fedora 17/18:</strong></p> -<pre class="note">$ sudo yum install autoconf213 bison bzip2 ccache curl flex gawk gcc-c++ git glibc-devel glibc-static libstdc++-static libX11-devel make mesa-libGL-devel ncurses-devel patch zlib-devel ncurses-devel.i686 readline-devel.i686 zlib-devel.i686 libX11-devel.i686 mesa-libGL-devel.i686 glibc-devel.i686 libstdc++.i686 libXrandr.i686 zip perl-Digest-SHA</pre> -<p>In addition to the above you will need GCC 4.4 in order to compile the project. You can find a pre-compiled version <a href="http://people.mozilla.org/~gsvelto/gcc-4.4.7-bin.tar.xz">here</a>. Download it and install it to <code>/opt</code> with the following command:</p> -<pre class="note">$ wget http://people.mozilla.org/~gsvelto/gcc-4.4.7-bin.tar.xz -$ sudo tar -x -a -C /opt -f gcc-4.4.7-bin.tar.xz -</pre> -<p>You will need to specify this compiler as the default host compiler before building. After having retrieved the sources, see <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file#Changing_the_default_host_compiler" title="en-US/docs/Mozilla/Boot_to_Gecko/Customization_with_the_.userconfig_file#Changing_the_default_host_compiler">here</a> how to do it.</p> -<p> </p> -<p><strong>Arch Linux (not functional yet):</strong></p> -<pre class="note">$ sudo <span style=""><span style="">pacman -S --needed </span></span><span style=""><span style="">alsa-lib </span></span><span style=""><span style="">autoconf2.13</span></span><span style=""><span style=""> bison</span></span><span style=""><span style=""> ccache</span></span><span style=""><span style=""> </span></span><span style=""><span style="">curl firefox </span></span><span style=""><span style="">flex </span></span><span style=""><span style="">gcc-multilib </span></span><span style=""><span style="">git </span></span><span style=""><span style="">gperf </span></span><span style=""><span style="">libnotify </span></span><span style=""><span style="">libxt </span></span><span style=""><span style="">libx11 mesa multilib-devel </span></span><span style=""><span style="">wireless_tools </span></span><span style=""><span style="">yasm</span></span><span style=""><span style=""> </span></span><span style=""><span style="">lib32-mesa </span></span><span style=""><span style="">lib32-ncurses lib32-readline</span></span><span style=""><span style=""> </span></span><span style=""><span style="">lib32-zlib</span></span></pre> -<p>By default, Arch Linux uses Python3. You'll have to force it to use the old python2:</p> -<pre><span style=""><span style="">$ cd /usr/bin</span></span> - -<span style=""><span style="">$ sudo ln -fs python2 python</span></span></pre> -<h2 id="Mac_OS_X系统需求" style="">Mac OS X系统需求</h2> -<p>To build Firefox OS on Mac OS X, you need to install Xcode's Command Line Utilities.</p> -<p>You can download <em>just</em> the Command Line Utilities from <a href="https://developer.apple.com/downloads/" title="https://developer.apple.com/downloads/">Apple's developer downloads page</a> for your particular version of OS X.</p> -<p>However, if you would like the entire Xcode suite of applications, you can <a class="external" href="http://itunes.apple.com/us/app/xcode/id497799835?mt=12" style="line-height: 1.572;" title="http://itunes.apple.com/us/app/xcode/id497799835?mt=12">install Xcode</a><span style="line-height: 1.572;"> through the Mac App Store. </span></p> -<p><strong>Install Command Line Utilities via XCode 4.3.1 and newer</strong></p> -<p>Xcode 4.3.1 (OS X 10.7 "Lion") and other newer versions such as 4.4.1+ (that is, Mac OS X10.8 "Mountain Lion"), won't necessarily include the required Command Line Utilities. When you install Xcode, make sure to go into Preferences, then the Downloads panel, and install the Command Line Utilities. In addition, make sure you have at least 20 GB of free disk space.</p> -<p><img alt="Screenshot of Xcode Downloads Command Line Tools" src="/files/4557/xcode_downloads_command_line_tools.png" style="width: 750px; height: 528px;"></p> -<div class="note"> - <strong>Note:</strong> The Firefox OS emulator requires a Core 2 Duo processor or later; that is, a system that is compatible with Mac OS X 10.7 "Lion." You do not actually have to be running Lion, you just have to be compatible with it. You can, however, build any Firefox OS build on many older Macs.</div> -<p><font face="Georgia, Times, Times New Roman, serif"><span style="font-size: 20px; line-height: 31px;"><b>Firefox OS Mac Bootstrap</b></span></font></p> -<p>Open a terminal and run the following command:</p> -<pre class="brush: bash">curl -fsSL https://raw.github.com/mozilla-b2g/B2G/master/scripts/bootstrap-mac.sh | bash</pre> -<p>It will pull and run a bootstrap script that makes sure you have all the prerequisites met to build the emulator. It will also prompt you for permission to install anything you're missing. The script will check for and install the following items:</p> -<ul> - <li><code>git</code></li> - <li><code>gpg</code></li> - <li><code>ccache</code></li> - <li><code>yasm</code></li> - <li><code>autoconf-213</code></li> - <li><code>gcc-4.6</code></li> - <li><code>homebrew</code></li> -</ul> -<div> - <p>Xcode</p> - <p>If you have already upgraded to Xcode 4.4+ and get the message that Xcode is outdated, check the Xcode path with:</p> - <pre>xcode-select -print-path</pre> - If it still points to <code>/Developer</code> you can update the path with: - <pre>sudo xcode-select -switch /Applications/Xcode.app</pre> - Next to that be sure that you have the Mac OS X 10.6 SDK available at: - <pre>/Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/</pre> - <p>If it cannot be found there you will need to extract and copy it from the Xcode 4.3 DMG file which is available at the <a class="external" href="https://developer.apple.com/downloads/index.action">Apple Developer</a> portal. You can use the utility Pacifist to extract the 10.6 SDK. Be sure to add a symlink to it to the <code>/Applications/Xcode.app/Contents/Developer/Platforms/MacOSX.platform/Developer/SDKs/</code> directory. (We can drop the 10.6 SDK requirement after <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=784227" title="https://bugzilla.mozilla.org/show_bug.cgi?id=784227">bug 784227</a> has been fixed, and our version of <a href="https://github.com/mozilla-b2g/B2G/issues/189" title="https://github.com/mozilla-b2g/B2G/issues/189">platform_build has been updated</a>.)</p> - <h3 id="Mountain_Lion">Mountain Lion</h3> - <div> - <p>If you are building on OS X 10.8 "Mountain Lion" (Xcode 4.4.1 or later) and encounter the following error:</p> - <pre style="font-size: 14px;">external/qemu/android/skin/trackball.c:130:25: error: 'M_PI' undeclared (first use in this function)</pre> - Edit the file: <code style="font-size: 14px;">B2G/external/qemu/Makefile.android</code> and add in line 78:<br> - <pre style="font-size: 14px;">MY_CFLAGS += -DM_PI=3.14159265358979323846264338327950288 #/* B2G_fix: not finding M_PI constant */ -</pre> - <div> - If you are on Mountain Lion and you receive an error during the installation of the dependencies via homebrew, such as:</div> - </div> -</div> -<div> - <pre>clang: error: unable to execute command: Segmentation fault: 11</pre> - ... try reinstalling the dependency manually adding the --use-gcc flag, for example: - <pre>brew install mpfr --use-gcc</pre> -</div> -<h3 id="Samsung_Galaxy_S2">Samsung Galaxy S2</h3> -<p>If you plan to build for the Samsung Galaxy S2, you will also need to install heimdall. See <a href="#Installing_heimdall">Installing heimdall</a> for details. This is <strong>not</strong> done for you by the bootstrap script!</p> -<div class="note"> - <strong>Note:</strong> If you have installed the <a class="external" href="http://www.samsung.com/us/kies/" title="http://www.samsung.com/us/kies/">Samsung Kies</a> tool, which is used to manage the contents of many Samsung phones, you will have to remove it before you can flash Firefox OS onto your device. You can use the standard application removal process on Windows; on Mac, the Kies install disk image has a utility to fully remove Kies from your system. Flashing <strong>will not work</strong> if you have Kies installed. If you forget to remove Kies, the build system will detect it and remind you to uninstall it. Note also that the uninstall tool does not correctly remove the folder <code>~/Library/Application Support/.FUS</code>, and leaves a reference to a utility there in your user startup items list. You will want to remove these manually.</div> -<div class="note"> - <strong>Note:</strong> Mac OS X uses a case insensitive filesystem by default, which will prevent you from building Firefox OS down the road (<strong>EDITOR'S NOTE: I have never had a problem with this)</strong>. You should create a case sensitive sparse disk image work from within that directory. To buld the case sensitive disk image:</div> -<pre>hdiutil create -type SPARSE -fs 'Case-sensitive Journaled HFS+' -size 40g ~/firefoxos.dmg</pre> -<p>Mount the drive with:</p> -<pre>open ~/firefoxos.dmg</pre> -<p>Change into the mouted drive with:</p> -<pre>cd /Volumes/untitled/</pre> -<h3 class="note" id="Fix_libmpc_dependency_if_broken">Fix libmpc dependency if broken</h3> -<p>gcc 4.6 was built with libmpc 0.9; if you then use homebrew to update packages, libmpc gets updated to version 1.0, but homebrew doesn't rebuild gcc 4.6 after the library version changes. So you need to create a symlink to make things work again, like this:</p> -<pre>cd /usr/local/lib/ -ln -s libmpc.3.dylib libmpc.2.dylib</pre> -<h3 id="Optional_Install_HAX">Optional: Install HAX</h3> -<p>Intel provides a special driver that lets the B2G emulator run its code natively on your Mac instead of being emulated, when you're using the x86 emulator. If you wish to use this, you can <a class="external" href="http://software.intel.com/en-us/articles/intel-hardware-accelerated-execution-manager/" title="http://software.intel.com/en-us/articles/intel-hardware-accelerated-execution-manager/">download and install</a> it. It's not required, but it can improve emulation performance and stability.</p> -<h2 class="note" id="安装adb">安装adb</h2> -<p>在构建B2G之前，需要从手机的安卓安装上拷贝下来二进制对象（当然，除非你要构建模拟器）。为此，你需要安装adb，安卓调试桥（Android Debug Bridge）。<a href="https://developer.mozilla.org/en-US/Firefox_OS/Debugging/Installing_ADB">安装adb</a>这篇文件中讲解了如何安装adb。</p> -<div class="warning"> - <p>在你将来使用adb时请注意：为了调试你的手机，adb需要手机的锁屏处于解锁状态（至少在最新的Firefox OS中是这样的）。你最好禁用锁屏（我们在以后的构建指导中说明如何来做）。</p> -</div> -<h2 class="note" id="安装heimdall">安装heimdall</h2> -<p>Heimdall is a utility for flashing the Samsung Galaxy S2. It's used by the Boot to Gecko flash utility to replace the contents of the phone with Firefox OS, as well as to flash updated versions of B2G and Gaia onto the device. You'll need it if you want to install Firefox OS on a Galaxy S2; it is <strong>not</strong> needed for any other device. For other devices, we build and use the fastboot utility instead.</p> -<div class="note"> - <strong>Note:</strong> Again, it's important to note that this is <strong>only required for installing Firefox OS on the Samsung Galaxy S2</strong>.</div> -<p>There are two ways to install heimdall:</p> -<ul> - <li>You can <a class="link-https" href="https://github.com/Benjamin-Dobell/Heimdall" title="https://github.com/Benjamin-Dobell/Heimdall">download the code</a> GitHub and build it yourself.</li> - <li>Use a package manager to install it. - <ul> - <li>On Linux: <code>sudo apt-get install libusb-1.0-0 libusb-1.0-0-dev</code></li> - <li>On Mac, you can <a class="link-https" href="https://github.com/downloads/Benjamin-Dobell/Heimdall/heimdall-suite-1.3.2-mac.dmg" title="https://github.com/downloads/Benjamin-Dobell/Heimdall/heimdall-suite-1.3.2-mac.dmg">download an installer package</a> and use that.</li> - </ul> - </li> -</ul> -<div class="note"> - <p><strong>Note</strong>: Building the latest Heimdall from source currently produces errors. It is better to instead use the 64bit packaged version from the Ubuntu 14.04 repos. i.e. don't use heimdall-flash:i386 if you can avoid it.</p> -</div> -<h2 id="配置_ccache">配置 ccache</h2> -<p>B2G构建过程使用ccache，ccache的默认缓存大小是1GB，但是B2G构建很容易就会占满这个缓存；建议把缓存调整到10G左右。你可以通过在终端中运行下面这个命令来配置你的缓存:</p> -<pre class="language-html"><code class="language-html">ccache --max-size 10GB</code></pre> -<h2 id="针对Linux：为你的手机配置udev_规则">针对Linux：为你的手机配置udev 规则</h2> -<div class="note"> - <p><strong>注意</strong>: 这一节是针对Linux用户；OS X用户已经安装了必要的设备权限。</p> -</div> -<p>接下来，你需要为你的手机配置udev规则。</p> -<p>你可以通过运行<code>lsusb来获得你插入的手机的</code> <a href="https://developer.android.com/tools/device.html#VendorIds">USB供应商编号（USB vendor ID）</a> ，通常是Google <code>18d1,</code> Samsung <code>04e8</code>, ZTE <code>19d2</code>, Geeksphone/Qualcomm <code>05c6。</code></p> -<p>在文件<code>/etc/udev/rules.d/android.rules中加上这一行（使用你的设备供应商ID替换XXXX）：</code></p> -<pre class="language-html"><code class="language-html">SUBSYSTEM=="usb", ATTR{idVendor}=="XXXX", MODE="0666", GROUP="plugdev"</code></pre> -<p>以中兴手机作为例子，android.rules的内容如下：</p> -<pre class="language-html" style="font-size: 14px;"><code class="language-html">SUBSYSTEM=="usb", ATTR{idVendor}=="19d2", MODE="0666", GROUP="plugdev"</code></pre> -<p>对于Firefox Flame，内容如下：</p> -<pre class="language-html" style="font-size: 14px;"><code class="language-html">SUBSYSTEM=="usb", ATTR{idVendor}=="05c6", MODE="0666", GROUP="plugdev"</code></pre> -<p>请注意fastboot设备（flash时使用）可能有一个不同的供应商ID（vendor ID），故你需要为它添加一条规则。例如Firefox Flame也需要谷歌的供应商ID</p> -<pre class="language-html" style="font-size: 14px;"><code class="language-html">SUBSYSTEM=="usb", ATTR{idVendor}=="18d1", MODE="0666", GROUP="plugdev"</code></pre> -<div class="note"> - <p><span style="line-height: 1.572;">如果文件不存在则创建，<span style="line-height: 1.572;"><code>通常，rules.d目录默认为只读，所以你可能要使用<span style="line-height: 1.572;"><code>chmod来使目录、文件或两者可写。</code></span></code></span></span></p> -</div> -<p><span style="line-height: 1.572;">一旦你保存了文件就关闭它，让文件可读：</span></p> -<pre class="language-html"><code class="language-html">sudo chmod a+r /etc/udev/rules.d/android.rules</code></pre> -<p>由于udev规则更新了，重启udev守护进程。</p> -<p><strong>Ubuntu</strong></p> -<pre class="language-html"><code class="language-html">sudo service udev restart</code></pre> -<p><strong>Fedora 20</strong></p> -<pre class="language-html"><code class="language-html">sudo systemctl restart systemd-udevd.service</code></pre> -<p><strong>ARCH</strong></p> -<pre class="language-html"><code class="language-html">sudo udevadm control --reload-rules</code></pre> -<div class="note"> - <p><strong>注意</strong>: 这也许需要稍长的时间，取决于你的发行版本，类似于：<br> - <br> - <code>sudo vi /etc/udev/rules.d/android.rules<br> - sudo service udev restart<br> - sudo /etc/init.d/udev restart<br> - sudo reload udev<br> - sudo udevadm trigger</code></p> -</div> -<p>最后，拔掉USB接口但是不要重新插上，因为我们要先启动手机上的远程调试。</p> -<h2 id="启动远程调试">启动远程调试</h2> -<p>在你把你的手机插回USB端口上之前，让其处于USB开发者模式，这允许你调试并更新（flash）你的手机，在你的手机上启动<a href="https://developer.mozilla.org/en-US/Firefox_OS/Debugging/Developer_settings">开发者设置</a> 中的 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Debugging/Developer_settings#Remote_debugging">远程调试</a>（在老版本中称为开发者模式）来启动开发者模式。一旦勾选了这个选项，远程调试即启动，然后你就可以继续了。</p> -<p>现在，通过USB连接你的手机和电脑（如果你在之前创建了一个udev规则，这将会触发udev检测你的手机并创建相应权限的设备节点）。现在你可以检查你是否可以通过<code>adb devices命令来列出你的设备（谨记adb只可以在你的手机处于解锁时看到它）。如果一切OK，你应该可以看到类似于下面的输出（下面这个是对于一个极客手机Keon来说）：</code></p> -<pre class="language-html" style="font-size: 14px;"><code class="language-html">$ adb devices -List of devices attached -full_keon device</code></pre> -<p>如果设备没有列出来，检查文件名称和脚本是否正确（详见之前的小节），然后重启电脑并重新输入命令，还要注意你的设备是否使用fastboot，引导程序可能会识别为一个不同的供应商ID而不是你正常用设备引导看到的那个。</p> -<h2 id="备份手机system分区">备份手机system分区</h2> -<div class="note"> - <p><strong>注意</strong>: 如果你没有已存在的系统备份，在构建系统之前你必须做这一步，因为在构建期间有许多库会被引用，这些库可能是专有的以至于我们不能在基础代码中提供他们。</p> -</div> -<p>建议你备份手机上的整个安卓系统分区。</p> -<p>你可以使用这份安卓二进制对象副本，以防后面你会删除你的B2G树，运行：</p> -<pre class="language-html"><code class="language-html">adb pull /system <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>backup</span> <span class="token attr-name">target</span> <span class="token attr-name">dir</span><span class="token punctuation">></span></span>/system</code></pre> -<p> 你可能还需要拷贝出<code>/data</code> 和/或 <code>/vendor</code>目录，不过这取决于手机：</p> -<pre class="language-html"><code class="language-html">adb pull /data <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>backup</span> <span class="token attr-name">target</span> <span class="token attr-name">dir</span><span class="token punctuation">></span></span>/data -adb pull /vendor <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>backup</span> <span class="token attr-name">target</span> <span class="token attr-name">dir</span><span class="token punctuation">></span></span>/vendor</code></pre> -<p>如果pull命令因“权限不足”而失败，尝试下面的步骤：</p> -<ul> - <li>停止并重启adb服务器</li> - <li>确保在你自定义的ROM中你有<code>adb工具的root权限（比如：在桌面时钟（CyanogenMod）下，改变</code><em>设置 > 系统 > 开发者选项 > 赋予应用和ADB root权限</em> or 仅仅是ADB）</li> - <li>确定你已经正确设置了udev规则</li> -</ul> -<h2 id="On_to_the_next_step">On to the next step</h2> -<p>At this point, you should be ready to <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Preparing_for_your_first_B2G_build" title="en-US/docs/Mozilla/Boot_to_Gecko/Preparing_for_your_first_B2G_build">fetch the Firefox OS code</a>!</p> diff --git a/files/zh-cn/archive/b2g_os/firefox_os_faq/index.html b/files/zh-cn/archive/b2g_os/firefox_os_faq/index.html deleted file mode 100644 index 079c31f3fa..0000000000 --- a/files/zh-cn/archive/b2g_os/firefox_os_faq/index.html +++ /dev/null @@ -1,43 +0,0 @@ ---- -title: Firefox OS FAQ -slug: Archive/B2G_OS/Firefox_OS_FAQ -tags: - - B2G - - FAQ - - Firefox OS -translation_of: Archive/B2G_OS/Introduction ---- -<dl> - <dt> - 我如何能获取到一个<span class="st"><b>开发者预览版的Firefox OS手机</b></span>?</dt> - <dd> - 它们即将在<a href="http://www.geeksphone.com/">Geeksphone</a>网站上首发。</dd> - <dt> - 如果我不想买一个新的手机,我还能为Firefox OS手机开发一个App吗?</dt> - <dd> - 当然可以!你可以在你的Android手机上测试你的App(配合<a href="https://hacks.mozilla.org/2012/10/firefox-marketplace-aurora/">Marketplace for Firefox</a>)或者在电脑上使用<a href="https://hacks.mozilla.org/2012/12/firefox-os-simulator-1-0-is-here/">Firefox OS模拟器</a>.</dd> - <dt> - 预览版和最终版的手机会有什么区别?</dt> - <dd> - 关于该手机何时进入普通消费市场,我们正在和其他几个合作伙伴进行沟通.这些手机的硬件配置如何,我们到时候再讨论.</dd> - <dt> - 我从哪里可以下载到Firefox OS?</dt> - <dd> - <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS">https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS</a></dd> - <dt> - 如何测试我的Firefox OS App?</dt> - <dd> - 使用Android或Firefox OS模拟器.</dd> - <dt> - 什么是Firefox OS?</dt> - <dd> - 它是一个全新的手机操作系统,采用了完全开放的Web标准实现.即使是用HTML5开发的Web App,页能使用到设备的每个基础功能(比如打电话,发短信,浏览本地文件等),而其他手机操作系统下,只有原生App能实现这些需求.</dd> - <dt> - 哪里有一个完整的Web API列表?准备把这些API进行标准化吗?</dt> - <dd> - Firefox OS的最初版本将会实现大量的Web API.完成的列表可以在这里找到:<a href="https://wiki.mozilla.org/WebAPI#APIs">https://wiki.mozilla.org/WebAPI#APIs</a>.<a href="https://hacks.mozilla.org/2012/01/mozilla-joins-the-w3c-dap-webapi-progress/">标准化工作也正在进行中</a>.</dd> - <dt> - 这些Web API标准化之后可以跨平台使用吗?</dt> - <dd> - 是的,这些API是在我们和其他几个合作伙伴以及经销商的共同合作下产生的,其中一些API已经应用在了其他的平台上.如何能让Web App访问到最终用户的硬件,这几乎是所有的技术公司都在面临的问题,我们正是做了一个好的开始.</dd> -</dl> diff --git a/files/zh-cn/archive/b2g_os/index.html b/files/zh-cn/archive/b2g_os/index.html deleted file mode 100644 index 850f1933e0..0000000000 --- a/files/zh-cn/archive/b2g_os/index.html +++ /dev/null @@ -1,243 +0,0 @@ ---- -title: B2G OS -slug: Archive/B2G_OS -tags: - - B2G - - Firefox OS - - Gaia - - NeedsTranslation - - TopicStub - - 火狐OS -translation_of: Archive/B2G_OS ---- -<div class="summary"> -<p><span class="seoSummary">Firefox OS 是由 Mozilla 打造的全新移动操作系统，基于 Linux 系统和驱动火狐浏览器的强大 Gecko 渲染引擎开发。</span></p> -</div> - -<div class="column-container zone-callout"> -<p><strong>Firefox OS</strong> 是完全开源的，因而避免了专有技术。她能为应用开发人员提供有力的支持以创造优秀的产品。此外，这款灵活的操作系统能够创造优异的用户体验。</p> - -<p>对 web 开发者而言，最重要的部分莫过于理解 <strong>Firefox OS 的整个用户界面就是一个 web 应用</strong>，而且这个 web 应用具有启动并展现其他 web 应用的能力。尽管提高了对移动设备硬件和服务的访问，但是您对用户界面的改动和您开发的任何在 Firefox OS 上运行的 web 应用使用的都是 HTML、CSS 和 JavaScript。</p> - -<p>从产品的角度看，Firefox OS 是 Mozilla 公司（以及其 OEM 合作伙伴）的品牌，它基于 <strong>Boot to Gecko</strong> (<strong>B2G</strong>)，Boot to Gecko 是 Firefox OS 操作系统的工程代号，它是由 Mozilla 内部的一组工程师团队和 Mozilla 开源社区的众多外部贡献人员共同开发的。</p> -</div> - -<section class="outer-apps-box" id="sect1"> -<h2 id="开发_Firefox_OS_应用"><a href="/Apps/Build/installable_apps_for_Firefox_OS">开发 Firefox OS 应用</a></h2> - -<p>访问我们的应用中心，获取开发 Firefox OS 应用所需要的各种信息！</p> -</section> - -<div class="column-container"> -<div class="column-third"> -<h2 id="平台指南"><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform">平台指南</a></h2> - -<p>为平台开发者提供的指南，主要讲述了FIrefox OS 平台的不同组件是如何组合在一起并工作的。</p> - -<ul> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gaia" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gaia">Gaia</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gonk" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gonk">Gonk</a></li> - <li><a href="/zh-CN/docs/Mozilla/Gecko" title="/zh-CN/docs/Mozilla/Gecko">Gecko</a></li> -</ul> -</div> - -<div class="column-third"> -<h2 id="构建与安装"><a href="/Firefox_OS/Building_and_installing_Firefox_OS">构建与安装</a></h2> - -<p>在模拟器，兼容设备或桌面模拟器上编译及安装 Firefox OS 的指南。</p> - -<ul> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites" title="Mozilla/Firefox_OS/Firefox OS build prerequisites">Firefox OS 构建依赖</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Preparing_for_your_first_B2G_build" title="Mozilla/Firefox_OS/Preparing for your first B2G build">首次构建前的准备</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Building" title="Mozilla/Firefox_OS/Building">构建 Firefox OS</a></li> -</ul> -</div> - -<div class="column-third"> -<h2 id="开发者手机"><a href="/zh-CN/docs/Mozilla/Firefox_OS/Developer_phone_guide">开发者手机</a></h2> - -<p>针对开发者手机的相关信息，如微调、更新、恢复和购买。</p> - -<ul> - <li><a href="/Firefox_OS/Developer_phone_guide/Flame">Flame</a></li> - <li><a href="/docs/Mozilla/Firefox_OS/Developer_phone_guide/Updating_and_Tweaking_Geeksphone">Geeksphone</a></li> - <li><a href="/docs/Mozilla/Firefox_OS/Developer_phone_guide/ZTE_OPEN">中兴 Open</a></li> - <li><a href="/Firefox_OS/Developer_phone_guide/ZTE_OPEN_C">中兴 Open C</a></li> - <li><a href="/docs/Mozilla/Firefox_OS/Troubleshooting">故障排除</a></li> - <li><a href="/Firefox_OS/Developer_phone_guide/Phone_specs">设备参数</a></li> -</ul> -</div> -</div> - -<div class="column-container equalColumnHeights"> -<div class="zone-callout"> -<h2 id="Firefox_OS_书籍"><strong>Firefox OS 书籍</strong></h2> -有若干涵盖 Firefox 开发各方面的书籍已经出版或正在编写中。要想详细了解，请访问 <a href="http://firefoxosbooks.org/">Firefox OS Books</a>。</div> - -<div class="zone-callout"> -<h2 id="其他有用的页面"><strong>其他有用的页面</strong></h2> - -<ul> - <li><a href="http://www.mozilla.org/zh-CN/styleguide/products/firefox-os/">Firefox OS 风格指南</a></li> - <li><a class="link-https" href="https://wiki.mozilla.org/B2G/FAQ" title="B2G/FAQ">Mozilla wiki FAQ</a></li> - <li><a href="/Firefox_OS/Platform/Feature_support_chart" title="/zh-CN/docs/Mozilla/Firefox_OS/Feature_support_chart">特性支持统计表</a></li> - <li><a href="/Firefox_OS/Developer_phone_guide/Geeksphone/Geeksphone_FAQ" title="/zh-CN/docs/Mozilla/Firefox_OS/Geeksphone_FAQ">Geeksphone FAQ</a></li> -</ul> -</div> -</div> - -<div class="note"> -<p><strong>注：</strong>如果您想要为 Firefox OS 中文文档做贡献，请查看 <a href="/zh-CN/docs/MDN/Doc_status/Firefox_OS">Firefox OS 文档翻译进度</a>！</p> -</div> - -<p></p><div class="overheadIndicator communitybox"> - - <div class="column-container"> - <h2 id="加入_Firefox_OS_社区">加入 Firefox OS 社区</h2> - <div class="column-half"> - <div class="communitysubhead">请选择你喜欢的方式加入我们：</div> - <ul class="communitymailinglist"> - <li><a href="https://lists.mozilla.org/listinfo/dev-b2g"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.b2g"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.b2g/feeds"> Web feed</a></li> -</ul> - </div> - <div class="column-half"> - <ul class="communitycontact"><li><strong>IRC: </strong><a href="irc://irc.mozilla.org/b2g">#b2g</a> <span class="smaller">(<a href="https://wiki.mozilla.org/IRC">了解 IRC</a>)</span></li><li><strong>其他 IRC 频道: </strong><a href="irc://irc.mozilla.org/gaia" title="Discuss Gaia, the Firefox OS user experience">#gaia</a>, <a href="irc://irc.mozilla.org/openwebapps" title="Talk with Web app developers">#openwebapps</a>, <a href="irc://irc.mozilla.org/webapi" title="Discuss Web APIs used to create powerful Web apps">#webapi</a></li></ul> - </div> - </div> -</div><p></p> - -<h2 id="Subnav">Subnav</h2> - -<ol> - <li><a href="/zh-CN/Firefox_OS/Introduction">介绍</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform" title="Firefox OS 平台相关的文档，包括 Gonk、Gaia 等等。">平台指南</a> - <ol> - <li><strong><a href="/zh-CN/Firefox_OS/Platform">平台指南概述</a></strong></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Architecture" title="简述 Firefox OS 内部架构，主要为平台开发者以及进行 Firefox OS 移植的开发者所看。">架构概述</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Apps_architecture" title="简述 Firefox OS 上的应用模型">应用架构</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Gonk" title="Gonk 文档，Gonk 是处于 Gaia 下层的操作系统层，由一个 linux 内核和一个硬件抽象层组成。">Gonk</a></li> - <li><a href="/zh-CN/Gecko" title="这里的 Gecko 也同样应用在 Firefox 以及 Thunderbird 中，它实现了所有的 Web 标准和 Web API。">Gecko</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Gaia" title="Gaia 文档， Gaia 是 Firefox OS 的用户界面层，它也是一个 Firefox OS 应用。">Gaia</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Gaia/Gaia_apps">Gaia 应用指南</a></li> - <li><a href="/zh-CN/Firefox_OS/Security" title="Firefox OS 安全相关的文档">安全</a> - <ol> - <li><a href="/Firefox_OS/Security/Security_model">Firefox OS 安全模型</a></li> - <li><a href="/Firefox_OS/Security/System_security">系统安全</a></li> - <li><a href="/Firefox_OS/Security/Application_security">Firefox OS 中的应用程序安全</a></li> - <li><a href="/Firefox_OS/Security/Installing_and_updating_applications">安全地安装和更新应用程序</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Platform/Out_of_memory_management_on_Firefox_OS">Firefox OS 上的内存溢出管理</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Feature_support_chart" title="Firefox OS builds.">特性支持统计表</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Settings_list" title="可以通过设置 API 设置的选项列表">设置列表</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Building_and_installing_Firefox_OS" title="如何在设备上构建和安装 Firefox OS，以及如何构建模拟器和仿真器。">构建和安装</a> - <ol> - <li><strong><a href="/zh-CN/Firefox_OS/Building_and_installing_Firefox_OS">构建和安装概述</a></strong></li> - <li><a href="/zh-CN/Firefox_OS/Building_and_installing_Firefox_OS/Firefox_OS_build_overview">Firefox OS 构建概述</a></li> - <li><a href="/zh-CN/Firefox_OS/Firefox_OS_build_prerequisites" title="在你首次构建 Firefox OS 之前需要做的事情">构建依赖</a></li> - <li><a href="/zh-CN/Firefox_OS/Preparing_for_your_first_B2G_build" title="在构建 Firefox OS之前，你需要做代码仓库克隆等事">首次构建前的准备</a></li> - <li><a href="/zh-CN/Firefox_OS/Building" title="如何构建 Firefox OS。">构建 Firefox OS</a></li> - <li><a href="/zh-CN/Firefox_OS/Porting" title="如何移植 Firefox OS 到新设备上。">移植 Firefox OS</a></li> - <li><a href="/zh-CN/Firefox_OS/Choosing_how_to_run_Gaia_or_B2G" title="在真实设备上还是在模拟器中运行 Firefox OS，哪种好？">用哪种方式运行 Gaia 和 Firefox OS</a></li> - <li><a href="/zh-CN/Firefox_OS/Using_the_B2G_desktop_client" title="在电脑上模拟 Gaia，也就是在 Firefox 中运行 Gaia。">使用 Firefox OS 桌面客户端</a></li> - <li><a href="/zh-CN/Firefox_OS/Using_the_B2G_emulators" title="如何使用 Firefox OS 模拟器，以及何时使用。">使用 Firefox OS 模拟器</a></li> - <li><a href="/zh-CN/Firefox_OS/Installing_on_a_mobile_device" title="如何将 Firefox OS 安装到设备上？">安装 Firefox OS 到移动设备端</a></li> - <li><a href="/zh-CN/Firefox_OS/Building_and_installing_Firefox_OS/Firefox_OS_update_packages">创建和应用 Firefox OS 更新包</a></li> - <li><a href="/zh-CN/Firefox_OS/Runtime_tools">运行时工具</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Developing_Firefox_OS" title="Hack the OS, customize your builds, get things the way you think they should be!">Firefox OS 开发</a> - <ol> - <li><strong><a href="/zh-CN/Firefox_OS/Developing_Firefox_OS">Firefox OS 开发概述</a></strong></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Firefox_OS/Filing_bugs_against_Firefox_OS">提交 Firefox OS 相关 bug</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Firefox_OS/modifying_hosts_file" title="通过修改 Firefox OS 中的 hosts 文件，可以做哪些事情。">修改 hosts 文件</a></li> - <li><a href="/zh-CN/Firefox_OS/Customization_with_the_.userconfig_file" title="通过修改 .userconfig 文件来定制 Firefox OS">定制 .userconfig 文件</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Firefox_OS/Customizing_the_b2g.sh_script">定制 b2g.sh 脚本</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia">Gaia 开发</a> - <ol> - <li><strong><a href="/zh-CN/Firefox_OS/Developing_Gaia">Gaia 开发概述</a></strong></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Running_the_Gaia_codebase">运行 Gaia 代码库</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Understanding_the_Gaia_codebase">理解 Gaia 代码库</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Making_Gaia_code_changes">修改 Gaia 代码</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Testing_Gaia_code_changes">测试 Gaia 代码修改</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Submitting_a_Gaia_patch">为 Gaia 提交 patch</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Gaia/Build_System_Primer">Gaia 构建系统入门</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Customizing_build-time_apps">定制 build-time 应用</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Developing_Firefox_OS/Market_customizations_guide">市场定制指南 </a></li> - <li><a href="/Firefox_OS/Developing_Gaia/Customizing_the_keyboard">在 Firefox OS 应用中定制键盘</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Localizing_Firefox_OS">Firefox OS 本地化</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/make_options_reference">Make 选项参考文档</a></li> - <li><a href="/zh-CN/Firefox_OS/Developing_Gaia/Gaia_tools_reference">Gaia 工具参考</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide" title="目前已有的多款 Firefox OS 手机介绍">Firefox OS 设备指南</a> - <ol> - <li><strong><a href="/zh-CN/Firefox_OS/Developer_phone_guide">开发者手机指南概述</a></strong></li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide/Phone_specs">手机和设备规格</a></li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide/Geeksphone">Geeksphone</a></li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide/ZTE_OPEN">ZTE OPEN</a></li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide/ZTE_OPEN_C">ZTE OPEN C</a></li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide/Flame">Flame</a></li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide/Firefox_OS_device_features">一般设备特性</a></li> - <li><a href="/zh-CN/Firefox_OS/Troubleshooting" title="A guide to resolving common problems with Firefox OS.">疑难解答</a></li> - <li><a href="/zh-CN/Firefox_OS/Developer_phone_guide/Best_practices_open_reference_devices">开放参考设备最佳实践</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Releases" title="记录了每个新版本的 Gaia 和 Gecko on Firefox OS 都增加和改动了哪些特性。">Firefox OS 发行记录</a> - <ol> - <li><a href="/Firefox_OS/Releases">Firefox OS 发行记录概览</a></li> - <li><a href="/Firefox_OS/Releases/2.1">Firefox OS 2.1 for developers</a></li> - <li><a href="/zh-CN/Firefox_OS/Releases/Firefox_OS_2.0_for_developers">Firefox OS 2.0 for developers</a></li> - <li><a href="/zh-CN/Firefox_OS/Releases/1.4">Firefox OS 1.4 for developers</a></li> - <li><a href="/zh-CN/Firefox_OS/Releases/1.3">Firefox OS 1.3 for developers</a></li> - <li><a href="/zh-CN/Firefox_OS/Releases/1.2">Firefox OS 1.2 for developers</a></li> - <li><a href="/zh-CN/Firefox_OS/Releases/1.1">Firefox OS 1.1 for developers</a></li> - <li><a href="/zh-CN/Firefox_OS/Releases/1.0.1">Firefox OS 1.0.1 for developers</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Platform/Automated_testing">自动化测试</a> - <ol> - <li><strong><a href="/zh-CN/Firefox_OS/Platform/Automated_testing">Firefox OS 测试概述</a></strong></li> - <li><a href="/zh-CN/Firefox_OS/Running_Tests_on_Firefox_OS_for_Developers">在 Firefox OS 上进行测试：开发者指南</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/gaia-ui-tests" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/gaia-ui-tests">Gaia UI 测试</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Gaia_integration_tests">Gaia 集成测试</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Gaia_unit_tests" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests">Gaia 单元测试</a></li> - <li><a href="/zh-CN/Firefox_OS/Platform/Automated_testing/Gaia_performance_tests">Gaia 性能测试</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Mochitests" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/Mochitests">Mochitests</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Reftests" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/Reftests">Reftests</a></li> - <li><a href="/zh-CN/docs/Marionette/Marionette_JavaScript_Tests" title="/zh-CN/docs/Marionette/Marionette_JavaScript_Tests">WebAPI 测试</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/XPCShell" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/XPCShell">xpcshell 测试</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/endurance_tests" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/endurance_tests">耐久性测试</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Automated_testing/MTBF_tests">MTBF 测试</a></li> - <li><a href="/zh-CN/docs/Marionette" title="/zh-CN/docs/Marionette">Marionette</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/TBPL">TBPL</a></li> - <li><a class="external external-icon" href="https://wiki.mozilla.org/QA/Execution/Web_Testing/Automation/Jenkins">Jenkins</a></li> - </ol> - </li> - <li><a href="/zh-CN/Firefox_OS/Debugging" title="教你如何调试 Firefox OS 应用和 Firefox OS 本身。">调试</a> - <ol> - <li><strong><a href="/zh-CN/Firefox_OS/Debugging">Firefox OS 调试概述</a></strong></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/Developer_settings">Firefox OS 开发相关设置</a></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop">连接 Firefox OS 设备到电脑</a></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/Setting_up">使用 Firefox 开发者工具调试 Firefox OS</a></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/On-device_console_logging">如何在移动设备上打印日志</a></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/Installing_ADB">安装和使用 ADB</a></li> - <li><a href="/zh-CN/Firefox_OS/Firefox_OS_usage_tips/taking_screenshots">截屏</a></li> - <li><a href="https://developer.mozilla.org/docs/Tools/WebIDE" title="A tool that allows you to install open web apps from your computer to a device capable of installing them (such as Firefox OS) - and debug any running app.">使用 WebIDE</a></li> - <li><a href="/zh-CN/Firefox_OS/Using_the_App_Manager" title="一款开发工具，可以让你在电脑上对自己的移动设备（比如 Firefox OS）进行远程开发和调试。">使用 Firefox OS 应用管理器</a></li> - <li><a href="/Firefox_OS/Debugging/Firefox_OS_crash_reporting">Firefox OS 崩溃报告</a></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/Debugging_OOMs">调试 Firefox OS 的内存错误</a></li> - <li><a href="/Firefox_OS/Debugging/Debugging_and_security_testing">调试并对 Firefox OS 进行安全性测试</a></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/Debugging_B2G_using_gdb">使用 gdb 调试 B2G</a></li> - <li><a href="/zh-CN/Firefox_OS/Debugging/Debugging_B2G_using_valgrind">使用 Valgrind 调试 B2G</a></li> - </ol> - </li> -</ol> diff --git a/files/zh-cn/archive/b2g_os/installing_on_a_mobile_device/index.html b/files/zh-cn/archive/b2g_os/installing_on_a_mobile_device/index.html deleted file mode 100644 index 390c5e9e73..0000000000 --- a/files/zh-cn/archive/b2g_os/installing_on_a_mobile_device/index.html +++ /dev/null @@ -1,111 +0,0 @@ ---- -title: 在移动设备上安装 Firefox OS -slug: Archive/B2G_OS/Installing_on_a_mobile_device -tags: - - Ch -translation_of: Archive/B2G_OS/Installing_on_a_mobile_device ---- -<p></p> - -<p>Once you've built Boot to Gecko for a <a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites#Have_a_compatible_device_or_use_an_emulator">supported mobile device</a>, you can install it. This article will guide you through the process.</p> - -<div class="note"><strong>Note:</strong> The first time you flash your phone, it <strong>must</strong> have Android 4 (Ice Cream Sandwich) installed. The process will not work correctly otherwise. Once you've done your first install of B2G, however, you can simply update on top of it.</div> - -<h2 id="刷机">刷机</h2> - -<p>To flash everything to your phone, simply connect your phone and type:</p> - -<pre>./flash.sh -</pre> - -<p>That's it. The B2G you've currently got built will flash onto your device.</p> - -<h3 id="Configuring_the_udev_rule_for_your_device">Configuring the udev rule for your device</h3> - -<p>On Linux, if you get this,</p> - -<pre>< waiting for device ></pre> - -<p>that probably means that you haven't added a udev rule for the fastboot device, which is not the same as the one for adb. You can get the USB vendor ID by running <code>lsusb</code> now, but typically it's Google's: 18d1, so adding this line in your <code>/etc/udev/rules.d/51-android.rules</code> would work:</p> - -<pre>SUBSYSTEM=="usb", ATTR{idVendor}=="18d1", MODE="0666", GROUP="plugdev"</pre> - -<div class="note"><strong>Note:</strong> If you get a very helpful <code>libusb</code> error "-3" on Linux, it means you need to be root to have the needed access to the USB device. Run the script again using <code>sudo</code>.</div> - -<div class="note"><strong>Note 2</strong>: If you have an Unagi or a Geeksphone Keon phone, you need two lines like this - one for the original phone vendor's ID, and one for Google's.</div> - -<h3 id="Special_notes_for_Hamachi_Helix_and_Leo_devices">Special notes for Hamachi, Helix, and Leo devices</h3> - -<p>If your phone is a hamachi, helix or leo device, the ./flash.sh script will now default to flashing only gecko and gaia. It is recommended that you flash with the OEM as a base build to get the firmware and the gonk layers and then flash the gecko and gaia on top. If you want to flash using the images, there is an override flash where you can ./flash.sh -f and it will use the image files to flash your device.</p> - -<h3 id="Special_notes_for_the_Samsung_Galaxy_S2">Special notes for the Samsung Galaxy S2</h3> - -<p>If your phone is a Galaxy S2 and you are using heimdall 1.3.2 (the latest version; use <code>heimdall version</code> to check), you may see an alarming error "FACTORYFS upload failed!" followed by "Heimdall flashing failed" and some additional information. This is actually a success condition, and you can ignore the advice.</p> - -<p>To get rid of this strange behavior, grab a <a class="link-https" href="https://github.com/Benjamin-Dobell/Heimdall" title="https://github.com/Benjamin-Dobell/Heimdall">source copy</a> of heimdall, downgrading to the 1.3.1 release ("<code>git checkout fbbed42c1e5719cc7a4dceeba098981f19f37c06</code>"), then compile it according to the <code>README</code>, then install that to make the error go away. However, this isn't strictly necessary.</p> - -<p>All versions of heimdall are unable to flash a system.img larger than 100MB. Do:</p> - -<pre>ls -l ./out/target/product/galaxys2/system.img -</pre> - -<p>to see how big yours is. If it's too large, ask in IRC for advice; there are ways to do it in two stages.</p> - -<h2 id="Added_step_for_the_Samsung_Galaxy_S2">Added step for the Samsung Galaxy S2</h2> - -<p>If you're flashing onto the Galaxy S2, there is an additional step to follow. Gaia does not get flashed automatically by the <code>flash.sh</code> script; you'll need to also do:</p> - -<pre>./flash.sh gaia -</pre> - -<h2 id="Flashing_specific_partitions_to_fastboot_phones">Flashing specific partitions to fastboot phones</h2> - -<p>You can flash specific partitions to fastboot phones (that is, any phone other than the Samsung Galaxy S2). For example:</p> - -<pre>./flash.sh system -./flash.sh boot -./flash.sh user -</pre> - -<h2 id="Updating_specific_modules">Updating specific modules</h2> - -<p>You can update specific components of B2G by specifying their names when flashing. For example:</p> - -<pre>./flash.sh gaia -./flash.sh gecko -</pre> - -<p>In order to update only one application you can use BUILD_APP_NAME environment variable:</p> - -<pre>BUILD_APP_NAME=calendar ./flash.sh gaia</pre> - -<p>If your phone is not for developer (you aren't interested on test apps and/or require optimization), you can update gaia using:</p> - -<pre>VARIANT=user ./flash.sh gaia</pre> - -<h2 id="Next_steps">Next steps</h2> - -<p>At this point, your phone should be running Boot to Gecko! It's time to experiment, <a href="/en-US/docs/Mozilla/Firefox_OS/Application_development" title="en-US/docs/Mozilla/Firefox_OS/Application_development">write some code</a>, <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing" title="en-US/docs/Mozilla/Firefox_OS/Platform/Testing">test</a>, or <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging" title="en-US/docs/Mozilla/Firefox_OS/Debugging">do some debugging</a>!</p> - -<div class="note"><strong>Note:</strong> A helpful usage tip: if your build of B2G starts up with the lock screen requesting a pass code to unlock the phone, the default code is 0000.</div> - -<h2 class="note" id="Troubleshooting">Troubleshooting</h2> - -<p>Here are a some tips for what to do if your device doesn't work right after installing B2G, or updating it to a new version</p> - -<h3 class="note" id="If_the_UI_doesn't_start_up">If the UI doesn't start up</h3> - -<p>If you update your phone and the user interface doesn't start up, you can reset it to clear out out-of-date configuration and the like. This may bring it back to life. Here's how:</p> - -<pre>cd gaia -make reset-gaia -</pre> - -<h3 class="note" id="If_you_want_change_from_developer_to_production_mode">If you want change from developer to production mode</h3> - -<pre>cd gaia -make reset-gaia PRODUCTION=1</pre> - -<h3 class="note" id="image_is_too_large_error_message_on_.flash.sh_execution">"image is too large" error message on ./flash.sh execution</h3> - -<p>It might mean that you phone needs to be rooted first before flashing it. As b2g needs to be written on root partition, your phone needs to be rooted in order to install it.</p> diff --git a/files/zh-cn/archive/b2g_os/introduction/index.html b/files/zh-cn/archive/b2g_os/introduction/index.html deleted file mode 100644 index 5652a42443..0000000000 --- a/files/zh-cn/archive/b2g_os/introduction/index.html +++ /dev/null @@ -1,110 +0,0 @@ ---- -title: Firefox OS简介 -slug: Archive/B2G_OS/Introduction -tags: - - B2G - - Firefox OS - - Gaia - - 介绍 - - 社区 -translation_of: Archive/B2G_OS/Introduction ---- -<p> </p> - -<div class="summary"> -<p><span style="font-weight: bold; background-color: rgb(244, 247, 248);">Firefox OS 致力于推进关于手机完全运行web的可能性和允许新的手机使用用户完全的在线使用他们的首部智能手机的范围. 它是一个开放源码的基于Linux的移动操作系统, 开放的Web标准和Mozilla的Gecko引擎科技提供的关于对手机移动平台的重新定义. 通过关于WebAPI对硬件调用的能力的介绍和提供用户一个直观的, 简洁并且优雅的智能手机体验, Mozilla相信对开发者来讲Web将会提供巨大的机遇去得到用户的青睐用优秀的Web软件.</span></p> -</div> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="目标读者">目标读者</h2> - -<p>这套文档是针对于那些想要学习知道Firefox OS的工作机制，怎样去开发项目，怎样去编译和安装他们自己开发的软件的web和平台开发者们. 对那些想要创建和发布他们的web应用的开发者来说, <a href="https://developer.mozilla.org/en-US/Apps">App Center</a>和<a href="https://developer.mozilla.org/en-US/Marketplace">Marketplace Zone</a>是理想的去处. </p> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="Firefox_OS_的基本承诺">Firefox OS 的基本承诺</h2> - -<p>对于Web/平台开发者来讲, 最重要的部分是理解整个用户调用接口层其实就是一个能够显示和发布其他Web应用的Web应用. 即使对移动设备的硬件和服务可访问性增强了, 但是任何对于用户接口的修改和你在Firfox OS上新建的应用都还是将会引用标准的web技术. 从一个产品的远景来看, Firefox OS是支持用Gecko(操作系统的产品工程研发代号)去启动系统后运行服务的Mozilla平台品牌. Firefox OS的用户接口层叫做Gaia, 其中包含了系统的默认的应用和系统函数. 想要发现更多关于平台的架构, 请访问 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform">平台指南</a>. </p> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="当前和未来的计划">当前和未来的计划</h2> - -<p>Firefox 0S 2.0正在开发中, 将要出来1.3/1.4 稳定的编译版本. 在开发者和消费者中有很多各种型号不同的手机. 可以知道的更多通过阅读下面的几点:</p> - -<ul> - <li>Firefox OS <a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases">developer release notes</a>: What's newly supported in each release.</li> - <li><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide">Phone guide</a>: What phones are available.</li> - <li><a href="https://wiki.mozilla.org/B2G/Roadmap">B2G roadmap</a>: See where Firefox OS is headed, and when.</li> -</ul> - -<h3 style="line-height: 24px; letter-spacing: normal;" id="发布周期">发布周期</h3> - -<p>Since Firefox OS 1.2, the Firefox OS release cycle has been aligned as closely as possible with the Gecko and Firefox desktop version release cycle (6 weeks). A new Firefox OS version is released new every three months, so there will be a Firefox OS release for every two Gecko (Firefox browser core) releases.</p> - -<p>For example. Gecko 30 is bundled with Firefox 1.4, bypassing Gecko 29, and Gecko 32 is bundled with Firefox 2.0 (was 1.5), bypassing Gecko 31.</p> - -<div class="note"> -<p><strong>Note</strong>: Check out our <a href="https://wiki.mozilla.org/RapidRelease/Calendar">rapid release calendar</a> to check the corresponding versions between Firefox OS and Gecko / Desktop Firefox, and read <a href="https://wiki.mozilla.org/Release_Management/FirefoxOS/Release_Milestones">Firefox OS Release Milestones</a> for more information on how our releases are managed.</p> -</div> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="社区">社区</h2> - -<p>Boot to Gecko and Gaia are developed by teams of engineers inside Mozilla, plus, many external contributors from the wider Mozilla/open source community. If you want to talk to the community about any aspect of Firefox OS or Gaia development, a good place to start is our mailing lists and IRC channels, detailed in the below info box.</p> - -<p></p><div class="overheadIndicator communitybox"> - - <div class="column-container"> - <h2 id="加入_Firefox_OS_社区">加入 Firefox OS 社区</h2> - <div class="column-half"> - <div class="communitysubhead">请选择你喜欢的方式加入我们：</div> - <ul class="communitymailinglist"> - <li><a href="https://lists.mozilla.org/listinfo/dev-b2g"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.b2g"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.b2g/feeds"> Web feed</a></li> -</ul> - </div> - <div class="column-half"> - <ul class="communitycontact"><li><strong>IRC: </strong><a href="irc://irc.mozilla.org/b2g">#b2g</a> <span class="smaller">(<a href="https://wiki.mozilla.org/IRC">了解 IRC</a>)</span></li><li><strong>Other IRC channels: </strong><a href="irc://irc.mozilla.org/gaia" title="Discuss Gaia, the Firefox OS user experience">#gaia</a>, <a href="irc://irc.mozilla.org/openwebapps" title="Talk with Web app developers">#openwebapps</a>, <a href="irc://irc.mozilla.org/webapi" title="Discuss Web APIs used to create powerful Web apps">#webapi</a></li></ul> - </div> - </div> -</div><p></p> - -<p>To file bugs, use our Bugzilla system, and file bugs against the <a href="https://bugzilla.mozilla.org/describecomponents.cgi?product=Firefox%20OS">Firefox OS components</a>. If you are not sure what component to file a bug against, feel free to ask.</p> - -<div class="note"> -<p><strong>Note</strong>: If you have a question or a point to raise about a specific part of the B2G/Gaia source code (for example, a specific Gaia app), you can find more specific contact details on our<a href="https://wiki.mozilla.org/Modules/FirefoxOS">Firefox Modules page</a>.</p> -</div> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="构建一个操作系统">构建一个操作系统</h2> - -<p>The B2G operating system is based on Mozilla's <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Gecko">Gecko</a> rendering engine, and sits on top of a Linux kernel and userspace hardware abstraction layer (HAL) called <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Platform/Gonk">Gonk</a>. The Gecko talked about here is basically the same Gecko used in Firefox for Android, or Windows, or Mac OS X, etc. Gonk is basically another porting target of Gecko.</p> - -<p>To learn how to build and install Firefox OS, consult our guide to <a href="https://developer.mozilla.org/en-US/Firefox_OS/Building_and_installing_Firefox_OS">Building and installing Firefox OS</a>. You can find the <a href="https://github.com/mozilla-b2g/B2G">B2G source code on Github</a>.</p> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="为_Gaia_做贡献">为 Gaia 做贡献</h2> - -<p>To contribute to Gaia, you don't need much more than a solid knowledge of web development. To learn about getting Gaia up and running, consult our <a href="https://developer.mozilla.org/en-US/Firefox_OS/Hacking_Firefox_OS/Quickstart_guide_to_Gaia_development">Quickstart guide to Gaia development</a>.</p> - -<p>There are a number of useful tools available to you for debugging Gaia and other web apps running on Firefox OS. To learn about these and much more, consult our guide to <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Gaia/Hacking">Hacking Gaia</a>.</p> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="为_Firefox_OS_开发_app">为 Firefox OS 开发 app</h2> - -<p>Firefox OS apps are built using standard web technologies — HTML, CSS, JavaScript, etc. — so if you are a web developer you will also have most of what you need. There are a few special JavaScript APIs to know about, which allow you to access device hardware and key features (for example camera, gyroscope, light sensor, contacts, system alarms and notifications...), but these are all well documented on our <a href="https://developer.mozilla.org/en-US/Apps">App Center</a> and <a href="https://developer.mozilla.org/en-US/docs/Web">Web Platform</a> pages.</p> - -<div class="note"> -<p><strong>Note</strong>: If you are a beginner to building open web/Firefox OS apps, or if you want a concise account of the differences between web apps and traditional web pages, the best place to start is our <a href="https://developer.mozilla.org/en-US/Apps/Quickstart">apps Quickstart guide</a>.</p> -</div> - -<h3 style="line-height: 24px; letter-spacing: normal;" id="支持跨_Firefox_OS_版本的应用">支持跨 Firefox OS 版本的应用</h3> - -<p>Note that when developing apps for Firefox OS, you need to bear in mind what platform versions will be available on the devices your customers will have (see our <a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/Phone_specs#Firefox_OS_phones_available">available phones table</a> for a list.) Remember that it is not as simple to update phone platform software as it is desktop software — users tend to be at the mercy of the network providers. You therefore need to develop apps to support these versions. As an example, multiline Flexbox doesn't work on Firefox OS versions below 1.3, so you may need to use a simpler layout method or provide a fallback for older versions.</p> - -<p>This issue should go away soon, as more consumer Firefox OS devices appear, equipped with newer versions of Firefox OS out of the box.</p> - -<div style="background-color: rgba(193, 56, 50, 0.839844); font-size: 14px;" class="warning"> -<p>The current baseline platform we recommended developing for is <a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases/1.1">Firefox 1.1</a>.</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: MDN's <a href="https://developer.mozilla.org/en-US/docs/Web">web platform reference pages</a> include browser/platform support information, plus you can find support information for more App-specific technologies on our <a href="https://developer.mozilla.org/en-US/Apps/Reference">Apps API Reference</a>.</p> -</div> - -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/phone_guide/best_practices_open_reference_devices/index.html b/files/zh-cn/archive/b2g_os/phone_guide/best_practices_open_reference_devices/index.html deleted file mode 100644 index 3e92766166..0000000000 --- a/files/zh-cn/archive/b2g_os/phone_guide/best_practices_open_reference_devices/index.html +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: 开放参考设备最佳实践 -slug: Archive/B2G_OS/Phone_guide/Best_practices_open_reference_devices -translation_of: Archive/B2G_OS/Phone_guide/Best_practices_open_reference_devices ---- -<div class="summary"> - <p><span class="seoSummary">The following article aims to provide a set of best practices that we believe should come highly recommended for any widely available open reference devices. All of the recent Firefox OS reference devices have followed these practices, including the forthcoming Flame.</span></p> -</div> -<p>Devices should have:</p> -<ul> - <li>Easily accessible and installable builds</li> - <li>Completely unlocked operating system</li> - <li>Worldwide availability</li> - <li>Feature support equivalent to consumer phones</li> - <li>Availability of replacement batteries</li> - <li>Easily enabled language choices</li> -</ul> -<h2 id="Easily_accessible_and_installable_builds">Easily accessible and installable builds</h2> -<p>Reference devices are largely aimed at developers and other groups with a greater degree of technical knowledge than average device consumers. But even so, we shouldn't expect users of these devices to compile their own builds if they don't wish to — for many of them this is a complete waste of time.</p> -<p>Open reference devices should have a maintained set of unlocked builds for current and future releases that are easy to access and install. This means having multiple tiers of builds available, at least:</p> -<ul> - <li>Release/Current</li> - <li>Stable/Beta</li> - <li>Nightly</li> -</ul> -<p>They should be made easily available on a dedicated download page, and updated regularly and often. Devices should also have OTA updates made available to them.</p> -<p>The OEMs should be responsible for providing these builds since they are the only ones who can legally distribute all the required binaries, etc.</p> -<p>It may make sense to follow a similar model to the Firefox browser, where each of the release, stable and nightly channels are based on subsequent versions of the source code.</p> -<h2 id="Completely_unlocked_operating_system">Completely unlocked operating system</h2> -<p>The device operating system platform should be completely unlocked, so that app and platform developers can have the necessary freedom of control available over their devices to perform any desired tests and development work. This includes:</p> -<ul> - <li>SIM unlocked</li> - <li>Bootloader unlocked</li> - <li>Root access</li> -</ul> -<h2 id="Worldwide_availability">Worldwide availability</h2> -<p>If you want your reference devices to be a universal standard, then it follows that you should make them available worldwide. If this is not the case, people in different locales will have to make do with different devices, which may carry different behaviours.</p> -<h2 id="Feature_support_equivalent_to_consumer_phones">Feature support equivalent to consumer phones</h2> -<p>There is no point in creating a reference device that does not have support for the same technologies and associated features as the consumer devices you will ultimately be distributing Firefox OS builds and open web apps on.</p> -<p>These include:</p> -<ul> - <li>AGPS/other associated geolocation hardware</li> - <li>Phone compass/gyroscope/accelerometer</li> - <li>Phone camera(s) with image and video capabilities</li> - <li>Vibration hardware</li> - <li>SDCard storage</li> - <li>Phone ringer</li> - <li>Appropriate hardware buttons</li> - <li>3G or better connectivity</li> -</ul> -<h2 id="Availability_of_replacement_batteries">Availability of replacement batteries</h2> -<p>Replacement batteries can often be really hard to obtain for different devices, and can lead to otherwise useful devices being rendered useless. It is therefore a good idea to make replacement batteries as available as possible.</p> -<h2 id="Easily_enabled_language_choices">Easily enabled language choices</h2> -<p>Since these device will be distributed worldwide, it is important to make localised builds available for as many languages as possible, taking into account availability of resources and most popular target market locales.</p> -<p>The most likely solution to this is localised Gaia builds or language packs that can be flashed onto the device separately, and Mozilla is working on a solution to make creation and installation of these as easy as possible.</p> diff --git a/files/zh-cn/archive/b2g_os/phone_guide/flame/index.html b/files/zh-cn/archive/b2g_os/phone_guide/flame/index.html deleted file mode 100644 index 91947e54fd..0000000000 --- a/files/zh-cn/archive/b2g_os/phone_guide/flame/index.html +++ /dev/null @@ -1,258 +0,0 @@ ---- -title: Flame -slug: Archive/B2G_OS/Phone_guide/Flame -translation_of: Archive/B2G_OS/Phone_guide/Flame ---- -<p><img alt="A picture of the Flame device, showing the Firefox OS homescreen containing several app icons." src="https://mdn.mozillademos.org/files/8373/flame-dev-hud.png" style="float: left; margin-bottom: 20px; margin-right: 50px; width: 25%;"></p> - -<h2 id="Available_to_order" style="text-indent: 100%; white-space: nowrap; overflow: hidden; margin: 0; height: 0;">Available to order</h2> - -<p><span class="seoSummary">The Flame developer reference phone is a milestone in Firefox OS device releases. The Flame hardware offers a representative set of specs — including FWVGA display and dual-core processor — to help developers build great content and experiences. A single hardware platform is also good for testers, making it easier to test and address specific software issues without having to worry about device model-specific bugs, etc.</span></p> - -<p style="">If you have your phone in hand and want to start playing with it, developing and distributing apps, or contributing to the Firefox platform, the following links will get you where you need to go:</p> - -<ul> - <li><a href="/en-US/Firefox_OS">Firefox OS zone</a>: For creating your own Firefox OS builds and contributing to the B2G and Gaia projects.</li> - <li><a href="/en-US/Apps">App Center zone</a>: For building open web apps compatible with Firefox OS.</li> - <li><a href="/en-US/Marketplace">Marketplace zone</a>: For information on publishing and distributing apps.</li> - <li><a href="https://marketplace.firefox.com/">Firefox Marketplace</a>: The best source to find and publish new Firefox OS apps.</li> -</ul> - -<p style="">If you’d like to find out more about updating the operating system, recovering it, pushing apps to it, or phone specs, you’ll find the information you need below.</p> - -<h2 id="Purchasing_a_device">Purchasing a device</h2> - -<p>Our device manufacturer partner has made the device <a href="http://www.everbuying.com/product549652.html">available to order</a> on everbuying.com, for US$170 including global shipping (device cost is $145, shipping is $25 and custom fees may still apply, depending on the destination country). The device is bootloader and carrier unlocked, and it utilizes a quad-band GSM+UMTS radio so that it can work with a wide variety of operators/carriers.</p> - -<div class="note"> -<p><strong>Note</strong>: Another option for getting hold of a Flame is to participate in our <a href="https://hacks.mozilla.org/2014/05/build-your-next-app-with-a-flame/">Flames for Apps scheme</a>, aimed at experienced HTML5 app developers wishing to port their highly-rated apps onto Firefox OS.</p> -</div> - -<h2 id="Updating_your_Flame's_software">Updating your Flame's software</h2> - -<p>We will have two main "channels" of Firefox OS software version releases for the Flame phone:</p> - -<ul> - <li>The first channel is our release channel. Flames ship with this channel and will receive over-the-air updates for future major versions, that is, Flames will update from 1.3 to 1.4, 2.0 to 2.1, etc.</li> - <li>The second channel is our nightly channel. Flames can be flashed to this channel, and after the initial flashing will get over the air updates on a daily or nearly daily basis.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: Windows users will need to install a driver to enable USB communication with their phones. See how to do this in the <a href="#Windows">Windows</a> section below. Linux users may need to add a udev rule; see the <a href="#Linux_and_Mac">Linux and Mac</a> section.</p> -</div> - -<p>While our partners are working out a final storage solution for the software builds, you can get recovery files and tools at the following Onedrive storage locations:</p> - -<ul> - <li><a href="http://1drv.ms/1tn3pWD">Base image v123.zip</a>: An archive containing the Flame's base image of Firefox OS 1.3. To install this, simply unzip the file, and run the script (./flash.sh).</li> - <li><a href="http://1drv.ms/1rCASz2">Base image v123.exe</a>: A Windows executable containing the Flame's base image of Firefox OS 1.3. To install this, simply run the executable on a Window system.</li> - <li>links above point to Microsoft OneDrive and are not working. Alternatives, powered by baidu: <a href="http://pan.baidu.com/s/1sj7BcQh">v123.zip</a>, <a href="http://pan.baidu.com/s/1hqxdXY0">v123.exe</a></li> -</ul> - -<p>To install the base image on your device:</p> - -<ol> - <li><a href="/en-US/Firefox_OS/Debugging/Installing_ADB">Install ADB</a> on your computer.</li> - <li>If you are on Windows, install the driver, as explained in the <a href="#Windows">Windows</a> section below.</li> - <li>Make sure remote debugging is enabled on your Flame, using the <em>Remote debugging/Debugging via USB</em> option in the device's <a href="/en-US/Firefox_OS/Debugging/Developer_settings">Developer settings</a> (the option is different, depending on whether you have Firefox 1.3 and under, or Firefox 1.4+ installed).</li> - <li>Connect your Flame to your computer via a USB cable. Verify that the computer is connected to the device by running the <code>adb devices</code> command in a terminal.</li> - <li>Download and Extract the software appropriate for your system listed above (the <code>.zip</code> in the case of Mac / Linux, the <code>.exe</code> in the case of Windows)</li> - <li>Go into the directory you extracted the software into and run it: - <ul> - <li>On Windows, simply run the executable.</li> - <li>On Linux / OSX, use the terminal to enter the directory, then run the flash.sh script using <code>sudo ./flash.sh</code> (if you don't run it using <code>sudo</code>, the flash script may fail to see your device, and it won't work).</li> - </ul> - </li> -</ol> - -<div class="note"> -<p><strong>Note</strong>: You are also welcome to build your own builds to install on the Flame: see <a href="/en-US/Firefox_OS/Building_and_installing_Firefox_OS">Building and installing Firefox OS</a>.</p> -</div> - -<h3 id="Updating_your_Flame_to_a_nightly_build">Updating your Flame to a nightly build</h3> - -<div class="note"> -<p><strong>Note</strong>: For this current build, Nightly development builds of Firefox OS do not support A-GPS, which may lead to slow performance of GPS functionality. We plan to resolve this in an updated future Nightly channel.</p> -</div> - -<ol> - <li>Before updating your phone to a nightly build you should flash the latest base image to make sure the underlying systems are up to date. Download a base image and use it to update your device's software, as explained above.</li> - <li>Because the above step installs a fresh operating system on your device, you'll need to enable remote debugging on your Flame again, using the <em>Remote debugging </em>option in the device's <a href="/en-US/Firefox_OS/Debugging/Developer_settings">Developer settings</a>.</li> - <li>Next, choose a Nightly build to install. You can find nightly builds on <a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/">http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/</a>. You'll want one of the following: - <ul style="margin-left: 40px;"> - <li>Production builds (including locales) - <ul> - <li><a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central-flame/">Latest master builds</a> (currently 2.1)</li> - <li><a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-b2g32_v2_0-flame/">Latest v2.0</a></li> - <li><a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-b2g30_v1_4-flame/">Latest v1.4</a></li> - </ul> - </li> - <li>Engineering builds (with test apps and only pseudo-locales) - <ul> - <li><a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-central-flame-eng/">Latest master builds</a> (currently 2.1)</li> - <li><a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-b2g32_v2_0-flame-eng/">Latest v2.0</a></li> - <li><a href="http://ftp.mozilla.org/pub/mozilla.org/b2g/nightly/latest-mozilla-b2g30_v1_4-flame-eng/">Latest v1.4</a></li> - </ul> - </li> - </ul> - </li> - <li>Pick a version and download both the <code>b2g-XX.XX.en-US.android-arm.tar.gz</code> and <code>gaia.zip</code> files.</li> - <li>Download the <a href="https://github.com/Mozilla-TWQA/B2G-flash-tool/blob/master/shallow_flash.sh">shallow flash script</a> and save it in a sensible place (such as the same directory as the above two files.)</li> - <li>Flash the builds to your phone using the following command: - <h4 id="Mac" style="line-height: 24px;">Mac</h4> - - <pre class="brush: bash">./shallow_flash.sh -g /path/to/gaia.zip -G /path/to/b2g-XX.XX.en-US.android-arm.tar.gz</pre> - - <h4 id="Linux" style="line-height: 24px;">Linux</h4> - - <pre class="brush: bash">./shallow_flash.sh -g/path/to/gaia.zip -G/path/to/b2g-XX.XX.en-US.android-arm.tar.gz</pre> - </li> -</ol> - -<div class="note"> -<p><strong>Note</strong>: If you get a "permission denied" error when running the above command, your shell script probably doesn't have the right permissions. Running <code>chmod +x shallow_flash.sh</code> on it should solve this problem.</p> -</div> - -<div class="note"> -<p><strong>Note</strong>: A "shallow flash" only updates <a href="/en-US/docs/Mozilla/Gecko">Gecko</a> and <a href="/en-US/Firefox_OS/Platform/Gaia">Gaia</a>, as opposed to a full flash, which updates Gecko/Gaia, but also the underlying <a href="/en-US/Firefox_OS/Platform/Gonk">Gonk</a> layer and associated binaries particular to that device type. This is why it is a good idea to update to the official base image first, as suggested above, then to shallow flash over the top of that, once you've got the Gonk/binary layer right.</p> -</div> - -<div class="warning"> -<p id="Shallow_flash_flashes_more_than_just_Gecko_and_Gaia_so_all_the_data_on_the_device_is_lost!">Shallow flash flashes more than just Gecko and Gaia so all the data on the device is lost!</p> -</div> - -<p>Once the install procedure finishes the phone should reboot into the updated build and the first time user workflow.</p> - -<h4 id="Font_fix">Font fix</h4> - -<p>After updating Gecko and Gaia to nightly with the v123 base image, there will be a mismatch between the fonts that Gecko and Gaia expects and what the base image provides. To fix this, download our <a href="https://people.mozilla.org/~mwu/fira-font-update.zip">font update package</a>, extract it, navigate into the directory created by extracting, and run the supplied <code>flash.sh</code> script.</p> - -<h3 id="Fastboot_mode">Fastboot mode</h3> - -<p>If flashing a new build to your phone fails to work, your phone may becomes unresponsive, and the phone may always reboot in recovery mode. The recovery mode allows you a few actions (reboot, update from adb, wipe data, wipe cache, update from sdcard). Unfortunately, selecting update from adb triggers a sideload mode and you cannot use the other adb commands, only <code>adb sideload</code> would work but the various flash scripts rely on other adb commands.</p> - -<p>In this case, you can probably force fastboot mode as follows:</p> - -<ol> - <li>power off the phone (which may involve removing the battery in extreme cases...),</li> - <li>plug in the USB cable</li> - <li>power the phone up again by pressing the Volume Down and Power buttons together.</li> -</ol> - -<p>The phone should only display the very first static logo and stay there, without displaying the boot animation. It seems stuck but is not really: it is in fastboot mode and is waiting for something on the USB cable. At this step, a computer on the other side of the USB cable should see the phone when running <code>fastboot devices</code> to list the connected devices. Note that regular adb would not see the device, only fastboot sees it. In this mode, you can use the flash script to install v123 as explained above. As the script does use both adb and fastboot commands, you may see some initial error and warnings from adb, but eventually the device should be flashed properly at the end.</p> - -<h3 id="Emergency_download_mode">Emergency download mode</h3> - -<p>If flashing a new build to your phone fails to work, your phone becomes unresponsive, and the phone cannot enter fastboot mode, you can use emergency mode for recovery. A USB cable and the <a href="http://1drv.ms/1rCAQHk">Emergency Download Tool</a> are required to enter emergency download mode. Install this tool and follow the instructions.</p> - -<h3 id="Recovery_mode">Recovery mode</h3> - -<p>You can enter recovery mode to clear your phone data or manually update the firmware. There are two ways to enter this mode:</p> - -<ul> - <li>If <a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB</a> tools are available, make sure Remote debugging is turned on in the phone's <a href="/en-US/Firefox_OS/Debugging/Developer_settings#Remote_debugging">Developer settings</a>, connect your phone to your computer via USB and enter <code>adb reboot recovery</code> on the command line.</li> - <li>If your phone is powered off, press the Volume Up + Power buttons together.</li> -</ul> - -<p>When in recovery mode, press the Volume up/down keys to move the selection highlight, and the Power key to select. Make sure you have your phone data (Contacts, SMS, etc.) backed up before clearing data, and your upgrade packages downloaded before updating.</p> - -<h2 id="Pushing_apps_to_your_Flame">Pushing apps to your Flame</h2> - -<p>The App Manager tool makes it easy to push apps to your phone, for testing, etc. Full instructions are available in the article <a href="/en-US/Firefox_OS/Using_the_App_Manager">Using the App Manager</a>.</p> - -<div class="warning"> -<p><strong>Important</strong>: Additional platform-specific instructions are available below. Follow these first before attempting to use the App Manager.</p> -</div> - -<h3 id="Linux_and_Mac">Linux and Mac</h3> - -<p>No additional steps should be required if you are using a Linux or Mac system, although depending on your Linux distro, you might need to <a href="https://developer.mozilla.org/en-US/Firefox_OS/Firefox_OS_build_prerequisites#For_Linux.3A_configure_the_udev_rule_for_your_phone">add a udev rule</a> for your phone, which will look something like the following:</p> - -<pre>SUBSYSTEM=="usb", ATTRS{idVendor}=="05c6", ATTRS{idProduct}=="9025", GROUP="users", MODE="0666"</pre> - -<p>Make sure to <code>--reload-rules</code>, then unplug and replug and your device before continuing.</p> - -<h3 id="Windows">Windows</h3> - -<p>To access the Flame device with the <a href="/en-US/Firefox_OS/Using_the_App_Manager">App Manager</a>/<a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB</a>, a USB driver is required. Follow the steps outlined in the below sections to install it.</p> - -<h4 id="Downloading_the_driver">Downloading the driver</h4> - -<p><a href="http://1drv.ms/1rCAUqu">Download the Windows driver from this location</a>. Once downloaded, extract the contents of the ZIP file to a suitable place on your hard drive.</p> - -<div class="note"> -<p><strong>Note</strong>: The Android Debug Bridge (<a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB</a>) must be already installed.</p> -</div> - -<h4 id="Installing_the_USB_Driver">Installing the USB Driver</h4> - -<p>At this point, connect your Flame device to your computer using a USB cable.</p> - -<p>To install the driver, open the <code>Alcatel_USB_Driver_Q_4.0.0_2013_11_11_noinstall</code> directory within the extracted ZIP file and double click on the <code>DriverInstaller.exe</code> executable. You may receive a warning at this point that the executable is from an unknown publisher. If so, select the <em>Yes</em> button and the executable will be launched.</p> - -<p><img alt="Simple dialog box showing a picture of a phone along with install and uninstall buttons." src="https://mdn.mozillademos.org/files/8079/driver-install.png" style="display: block; height: 523px; margin: 0px auto; width: 358px;"></p> - -<p>Click on the <em>Install</em> button to install the driver.</p> - -<p>After the driver installs, you can check that it is working by opening a command line window and typing <code>adb devices</code>. This should list the connected device with an output something like:</p> - -<pre>List of devices attached -3561d02a device</pre> - -<p>If your device is not showing up here, check in the Windows Device Manager. Your Flame may be showing up as "ACER ADB Interface". You can confirm this by unplugging the device and seeing if it disappears from the device manager. Uninstall the driver software by right-clicking on "ACER ADB Interface" and clicking uninstall. Be sure to check the box in the dialog to delete the driver software. Now re-run the installer above. It is advisable to set the screen timeout on your Flame to something high (Settings > Display > Screen timeout) as Windows sometimes appears to reinstall the default drivers when the screen turns off.</p> - -<h2 id="RAM_adjustment">RAM adjustment</h2> - -<p>You can adjust the available RAM capacity to see how apps perform on Firefox OS phones with lower memory footprints.</p> - -<p>This is accomplished by entering fastboot mode (install fastboot first, which is available on the same SDK page as <a href="/en-US/Firefox_OS/Debugging/Installing_ADB">ADB</a>) and typing:</p> - -<pre class="brush: bash">adb reboot bootloader -fastboot oem mem [0|256-1024]</pre> - -<p>“0” is the memory automatically detected and “256-1024” is the number of megabytes. For example, if you want to adjust device RAM capacity to 512M, enter <code>fastboot oem mem 512</code>.</p> - -<p>You'll need to then reboot your device for the settings to take effect. This can be done using:</p> - -<pre class="brush: bash">fastboot reboot</pre> - -<p>The current memory size can be returned by entering fastboot mode and typing:</p> - -<pre class="brush: bash">fastboot getvar mem -</pre> - -<h2 id="Network_and_Device_specs">Network and Device specs</h2> - -<p><strong>Network</strong>:</p> - -<ul> - <li>802.11b/g/n wireless internet</li> - <li>GSM 850/900/1800/1900MHz</li> - <li>UMTS 850/900/1900/2100MHz</li> -</ul> - -<p><strong>Hardware</strong>: You can find more of the hardware features listed on our <a href="/en-US/Firefox_OS/Developer_phone_guide/Phone_specs">Phone and device specs page</a>.</p> - -<p>Additional features include:</p> - -<ul> - <li>NFC</li> - <li>Bluetooth 3.0</li> - <li>Accelerometer</li> - <li>FM radio</li> - <li>Proximity Sensor</li> - <li>GPS W / A-GPS support</li> - <li>Ambient Light Sensor</li> -</ul> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="https://hacks.mozilla.org/2014/08/videos-getting-started-with-your-flame-device/">Getting started with your Flame</a>: How-to videos by Chris Heilmann</li> -</ul> - -<div id="HUABAN_WIDGETS"> -<div class="HUABAN-f-button" style="display: none;">采集</div> -</div> - -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/phone_guide/index.html b/files/zh-cn/archive/b2g_os/phone_guide/index.html deleted file mode 100644 index ff0395cc14..0000000000 --- a/files/zh-cn/archive/b2g_os/phone_guide/index.html +++ /dev/null @@ -1,35 +0,0 @@ ---- -title: Firefox OS 开发者手机指南 -slug: Archive/B2G_OS/Phone_guide -translation_of: Archive/B2G_OS/Phone_guide ---- -<div class="summary"> -<p>本节包含了运行Firefox OS 的指定手机相关的开发者信息。我们已经有关于 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS" title="Building and installing Firefox OS">Building and installing Firefox OS</a> 和 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Hacking_Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS/Hacking_Firefox_OS">Hacking Firefox OS</a> 的文章，因此请到那里获取关于编译和安装的信息。 但与特定手机相关的开发人员会发现下面的文档是非常有用的。</p> -</div> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="特定的设备信息">特定的设备信息</h2> - -<dl> - <dt><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Phones">Firefox OS phone data</a></dt> - <dd>在这篇文章中我们列举出了能够得到的Firefox OS手机的信息。比如型号，什么时候能够得到还有一些硬件特性之类的信息都能在这里找到。</dd> - <dt><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/Flame">Flame</a></dt> - <dd>Information on Mozilla's high-end Firefox OS reference phone, codenamed the Flame, and produced in partnership with T<sup>2</sup>Mobile.</dd> - <dt><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/Geeksphone">Geeksphone</a></dt> - <dd>In this article we cover some basic tips on how to keep your Geeksphone up-to-date and how to tweak the system Gaia applications.</dd> - <dt><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Developer_phone_guide/ZTE_OPEN">ZTE OPEN</a></dt> - <dd>This article contains information on the ZTE OPEN Firefox OS device.</dd> - <dt><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/ZTE_OPEN_C">ZTE OPEN C</a></dt> - <dd>The ZTE Open C is an updated ZTE-produced Firefox OS device, with higher end hardware and newer software.</dd> - <dd> </dd> -</dl> - -<h2 style="margin-bottom: 20px; line-height: 30px;" id="一般的_Firefox_OS_信息">一般的 Firefox OS 信息</h2> - -<dl> - <dt><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/Firefox_OS_device_features">General device features</a></dt> - <dd>This page lists typical Firefox OS hardware features and minimum hardware requirements.</dd> - <dt><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Troubleshooting">Troubleshooting</a></dt> - <dd>This article provides tips for resolving common problems you may have while using Firefox OS.</dd> - <dt><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/Best_practices_open_reference_devices">Best practices for open reference devices</a></dt> - <dd>A set of best practices that we believe should come highly recommended for any widely available open reference devices. All of the recent Firefox OS reference devices have followed these practices.</dd> -</dl> diff --git a/files/zh-cn/archive/b2g_os/phone_guide/phone_specs/index.html b/files/zh-cn/archive/b2g_os/phone_guide/phone_specs/index.html deleted file mode 100644 index 04faf7017e..0000000000 --- a/files/zh-cn/archive/b2g_os/phone_guide/phone_specs/index.html +++ /dev/null @@ -1,439 +0,0 @@ ---- -title: Phone and device data -slug: Archive/B2G_OS/Phone_guide/Phone_specs -translation_of: Archive/B2G_OS/Phone_guide/Phone_specs ---- -<div class="summary"> -<p>这篇文章提供有关Firefox OS设备的信息，包括特定的硬件规格，代号，默认安装Firefox OS的版本等等。</p> -</div> - -<h2 id="可使用的Firefox_OS手机">可使用的Firefox OS手机</h2> - -<p>下面的表格列举了可使用的或已经可用的Firefox OS设备模型。</p> - -<div class="note"> -<p>注意：关于可使用的商业手机的信息，包括可得到手机的国家和经营者，请查阅我们的<a href="http://www.mozilla.org/en-US/firefox/os/devices/">发现你附近的Firefox OS</a>网页。</p> -</div> - -<table class="standard-table" dir="ltr"> - <thead> - <tr> - <th scope="col">名称／代号</th> - <th scope="col">释放日期</th> - <th scope="col">最初版本</th> - <th scope="col">可否获得</th> - <th scope="col">备注</th> - </tr> - </thead> - <tbody> - <tr> - <td> - <p>Alcatel One Touch Fire</p> - - <p><em>hamachi, buri</em></p> - </td> - <td>2013年7月12日</td> - <td>1.0.1</td> - <td>在售</td> - <td> - <p>在巴西、乌拉圭、意大利、德国、希腊、塞尔维亚、匈牙利和波兰公开发售。</p> - - <p>可由eBay上的经销商获得。</p> - </td> - </tr> - <tr> - <td>Alcatel One Touch Fire E</td> - <td>2014年7月18日</td> - <td>1.3.0</td> - <td>在售</td> - <td>在捷克、德国、匈牙利、波兰、俄罗斯公开发售。</td> - </tr> - <tr> - <td><em>otoro, unagi, inari</em></td> - <td> </td> - <td> </td> - <td> </td> - <td>在ZTE Open之前的用于开发的ZTE非定制机。</td> - </tr> - <tr> - <td> - <p><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Developer_phone_guide/ZTE_OPEN">ZTE Open</a></p> - - <p><em>ikura</em></p> - </td> - <td>2013年7月2日</td> - <td>1.0.1</td> - <td>在售</td> - <td>和inari相似，在eBay公开发售。</td> - </tr> - <tr> - <td> - <p>LG Fireweb</p> - - <p><em>leo</em></p> - </td> - <td>2013年10月24日</td> - <td>1.1</td> - <td>在售</td> - <td>在巴西公开发售。</td> - </tr> - <tr> - <td> - <p><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Developer_phone_guide/Updating_and_Tweaking_Geeksphone">Geeksphone Keon</a></p> - - <p><em>keon</em></p> - </td> - <td>2013年4月24日</td> - <td>1.0.1</td> - <td>已脱销</td> - <td>专为开发者提供的设备。</td> - </tr> - <tr> - <td> - <p><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Developer_phone_guide/Updating_and_Tweaking_Geeksphone">Geeksphone Peak</a></p> - - <p><em>peak</em></p> - </td> - <td>2013年4月24日</td> - <td>1.0.1</td> - <td>已脱销</td> - <td>过去一段时间的代号为“twist"，专为开发者提供的设备。</td> - </tr> - <tr> - <td><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Developer_phone_guide/Updating_and_Tweaking_Geeksphone">Geeksphone Peak+</a></td> - <td> </td> - <td> </td> - <td>不再发售</td> - <td><a href="http://www.geeksphone.com/?wysija-page=1&controller=email&action=view&email_id=15">已被取消</a></td> - </tr> - <tr> - <td>Geeksphone Revolution</td> - <td>2014年3月4日</td> - <td>1.3pre</td> - <td>在售</td> - <td><a href="http://shop.geeksphone.com/moviles/9-revolution.html">在线发售</a></td> - </tr> - <tr> - <td> - <p>LG Google Nexus 4</p> - - <p><em>nexus-4</em></p> - </td> - <td> </td> - <td> </td> - <td> </td> - <td>实验性,不再被Google和LG支持,硬件停止开发</td> - </tr> - <tr> - <td> - <p><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/Flame">Flame</a></p> - - <p><em>"the reference device"</em></p> - </td> - <td>2014年4月晚些时候</td> - <td>1.3</td> - <td> </td> - <td> - <p><a href="http://www.everbuying.com/product549652.html">可以预订</a></p> - - <p>在2014年12月售完</p> - </td> - </tr> - <tr> - <td> - <p>Spreadtrum</p> - - <p><em>tarako</em></p> - </td> - <td>2014年第二季度末期</td> - <td> </td> - <td>马上销售</td> - <td> </td> - </tr> - <tr> - <td> - <p><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/ZTE_OPEN_C">ZTE Open C</a></p> - </td> - <td>2014年5月13日</td> - <td>1.3</td> - <td>在售</td> - <td><a href="http://www.ebay.co.uk/itm/eBay-exclusive-ZTE-OPEN-C-Latest-Firefox-OS-Dual-Core-3G-Unlocked-Smartphone-/171301269724?pt=UK_Mobile_Phones&hash=item27e259f0dc">在线发售</a></td> - </tr> - <tr> - <td><a href="https://developer.mozilla.org/en-US/Firefox_OS/Developer_phone_guide/Symphony_GoFox_F15">Symphony GoFox F15</a></td> - <td>2014年9月16日</td> - <td>1.4</td> - <td>在售</td> - <td>仅可通过孟加拉国格莱珉电话公司（Grameenphone）的通道获得。</td> - </tr> - <tr> - <td>Intex Cloud Fx</td> - <td> </td> - <td>1.3</td> - <td>在售</td> - <td>仅可由印度的<a href="http://www.snapdeal.com/product/intex-cloud-fx/1356760619?utm_source=earth_mobile&utm_campaign=mobiles_new_sku&utm_medium=Intex_cloud_FX&utm_content=SKU">Snapdeal公司</a>获得</td> - </tr> - <tr> - <td>Spice Fire One (Mi-FX1)</td> - <td> </td> - <td>1.3</td> - <td>在售</td> - <td>仅可由印度的<a href="http://www.snapdeal.com/product/intex-cloud-fx/1356760619?utm_source=earth_mobile&utm_campaign=mobiles_new_sku&utm_medium=Intex_cloud_FX&utm_content=SKU">Snapdeal公司</a>获得</td> - </tr> - <tr> - <td>Alcatel OneTouch FireC 4020D</td> - <td>2014年10月1日</td> - <td>1.3</td> - <td>在售</td> - <td>由<a href="http://www.flipkart.com/mobiles/alcatel~brand/pr?p%5B%5D=facets.price_range%255B%255D%3DRs.%2B2000%2Band%2BBelow&p%5B%5D=sort%3Dfeatured&sid=tyy%2C4io&ref=b23d5a52-3b84-4fe6-80a9-99f451be31aa#jumpTo=106|2">Filpkart</a>销售</td> - </tr> - <tr> - <td>Zen Fire 105</td> - <td>2014年10月16日</td> - <td>1.3</td> - <td>在售</td> - <td>由<a href="http://www.homeshop18.com/zen-fire-fox-phone-u105/mobiles/mobile-phones/product:32873765/cid:3027/">Homeshop18</a>销售</td> - </tr> - <tr> - <td>Cherry Mobile Ace</td> - <td>2014年11月</td> - <td>1.3T</td> - <td>在售</td> - <td>在菲律宾公开发售</td> - </tr> - <tr> - <td>Fx0</td> - <td>2014年12月</td> - <td>2.0</td> - <td>在售</td> - <td>消费者电话，在日本(KDDI.)公开发售</td> - </tr> - </tbody> -</table> - -<h2 id="Firefox_OS版本">Firefox OS版本</h2> - -<table class="standard-table" dir="ltr"> - <thead> - <tr> - <th scope="col">版本</th> - <th scope="col"><b>特性完成(FC)日期</b></th> - <th scope="col">合作伙伴释放日期</th> - <th scope="col">代号</th> - <th scope="col">Gecko版本</th> - <th scope="col">包括的安全补丁</th> - <th scope="col">释放版标记</th> - </tr> - </thead> - <tbody> - <tr> - <td>1.0</td> - <td>2012年12月22日</td> - <td>2013年2月21日</td> - <td>TEF</td> - <td>Gecko 18</td> - <td>Gecko 18</td> - <td> </td> - </tr> - <tr> - <td>1.0.1</td> - <td>2013年1月15日</td> - <td>2013年9月6日</td> - <td>Shira</td> - <td>Gecko 18</td> - <td>Gecko 20</td> - <td><a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases/1.0.1">Developer</a><br> - <a href="https://support.mozilla.org/en-US/kb/whats-new-firefox-os-v11">Consumer</a></td> - </tr> - <tr> - <td>1.1</td> - <td>2013年3月29日</td> - <td>2013年10月9日</td> - <td>Leo</td> - <td>Gecko 18+ (new <a href="http://en.wikipedia.org/wiki/Application_programming_interface" title="Application programming interface">APIs</a>)</td> - <td>Gecko 23</td> - <td><a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases/1.1">Developer</a><br> - <a href="http://www.mozilla.org/en-US/firefox/os/notes/1.1/">Consumer</a></td> - </tr> - <tr> - <td>1.1.1</td> - <td> </td> - <td>TBD</td> - <td>HD</td> - <td>Same as 1.1.0 with WVGA</td> - <td>Gecko 23</td> - <td> </td> - </tr> - <tr> - <td>1.2</td> - <td>2013年9月15日</td> - <td>2013年12月9日</td> - <td>Koi</td> - <td>Gecko 26</td> - <td>Gecko 26</td> - <td><a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases/1.2">Developer</a><br> - <a href="http://www.mozilla.org/en-US/firefox/os/notes/1.2/">Consumer</a></td> - </tr> - <tr> - <td>1.3</td> - <td>2013年12月9日</td> - <td>TBD</td> - <td> </td> - <td>Gecko 28</td> - <td>Gecko 28</td> - <td><a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases/1.3">Developer</a><br> - <a href="http://www.mozilla.org/en-US/firefox/os/notes/1.3/">Consumer</a></td> - </tr> - <tr> - <td>1.4</td> - <td>2014年3月17日</td> - <td>TBD</td> - <td> </td> - <td>Gecko 30</td> - <td>Gecko 30</td> - <td><a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases/1.4">Developer</a><br> - Consumer (TBD)</td> - </tr> - <tr> - <td>2.0</td> - <td>2014年11月</td> - <td>TBD</td> - <td> </td> - <td>Gecko 32</td> - <td>Gecko 32</td> - <td><a href="https://developer.mozilla.org/en-US/Firefox_OS/Releases/2.0">Developer</a><br> - Consumer (TBD)</td> - </tr> - </tbody> -</table> - -<h2 id="设备规格">设备规格</h2> - -<p>注意：由于某些原因，有一款即将出现的设备没有被说明，但是我们将分享这些设备的代号和一些性能。不要放额外的设备信息，除非Andreas Gal或者其他同样可以公开说明已公开的信息的人的同意。</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Name</th> - <th scope="col">Codename</th> - <th scope="col">Versions</th> - <th scope="col">Resolution</th> - <th scope="col">RAM</th> - <th scope="col">Storage</th> - </tr> - </thead> - <tbody> - <tr> - <td>Alcatel One Touch Fire</td> - <td>hamachi, buri</td> - <td>v1.0.1/v1.1</td> - <td> - <p>320 x 480<br> - PX=1</p> - </td> - <td>256M</td> - <td>/data: probably the same as inari; <a href="http://www.alcatelonetouch.com/global-en/products/smartphones/one_touch_fire.html#.Unyg5UOVt1M">specs say</a> 160MB "end user memory"<br> - Probably no built-in DeviceStorage, MicroSD card (up to 32GB) required<br> - </td> - </tr> - <tr> - <td>ZTE Open / variants</td> - <td>ikura</td> - <td>v1.0.1 (as shipped)</td> - <td>320 x 480<br> - PX=1</td> - <td>256M</td> - <td> - <p>/data: 152M<br> - No built-in DeviceStorage, MicroSD card required</p> - </td> - </tr> - <tr> - <td>LG Fireweb</td> - <td>leo</td> - <td>v1.1</td> - <td>320 x 480<br> - PX=1</td> - <td> </td> - <td> - <p>/data: 1007.90M<br> - built-in DeviceStorage: yes, size unsure. possibly 3.7G, but that might be bad math. (On an unhapy device /sys/devices/platform/msm_sdcc.3/mmc_host/mmc0/mmc0:0001/block/mmcblk0/block is 7733248, and then assuming a 512 byte block size, we get 3.7G)</p> - </td> - </tr> - <tr> - <td><a href="/en-US/docs/Mozilla/Firefox_OS/Developer_phone_guide/Updating_and_Tweaking_Geeksphone">Geeksphone Keon</a></td> - <td>keon</td> - <td> - <p>v1.0.1 - nightly<br> - <a href="/en-US/docs/">downloads here</a></p> - </td> - <td>320 x 480<br> - PX=1</td> - <td>512M</td> - <td> - <p>/data: 1.5G<br> - built-in DeviceStorage: 1023.4M</p> - </td> - </tr> - <tr> - <td><a href="/en-US/docs/Mozilla/Firefox_OS/Developer_phone_guide/Updating_and_Tweaking_Geeksphone">Geeksphone Peak</a></td> - <td>peak</td> - <td>v1.0.1 - nightly<br> - <a href="/en-US/docs/">downloads here</a></td> - <td>540 x 960<br> - PX=1.5</td> - <td>512M</td> - <td>probably the same as the keon based on specs.</td> - </tr> - <tr> - <td>Nexus 4</td> - <td>nexus-4</td> - <td>v1.3 - nightly</td> - <td>768 x 1280</td> - <td>2GB</td> - <td>everything exists in one big soup, there is no external (MicroSD) storage. The size of the soup varies based on what model Nexus 4 you got.</td> - </tr> - <tr> - <td><a href="https://wiki.mozilla.org/Platform/2013-11-05">some tablet thing</a></td> - <td>flatfish</td> - <td> </td> - <td> </td> - <td> </td> - <td> </td> - </tr> - <tr> - <td><a href="https://wiki.mozilla.org/Platform/2013-11-05">some phone thing</a></td> - <td>fugu</td> - <td>v1.2f (branch) <a href="https://groups.google.com/d/msg/mozilla.dev.b2g/JKAu9UNjBf8/9zj5Y3m6518J">per</a></td> - <td>320 x 480</td> - <td>256MB</td> - <td> </td> - </tr> - <tr> - <td><a href="https://wiki.mozilla.org/FirefoxOS/Tarako">some 128MB platform thing</a></td> - <td>tarako</td> - <td>v1.3 <a href="https://wiki.mozilla.org/FirefoxOS/Tarako">per</a></td> - <td>320 x 480</td> - <td>128MB (zram)</td> - <td> </td> - </tr> - </tbody> -</table> - -<p>列行解释：</p> - -<ul> - <li>分辨率: - <ul> - <li>水平 X 垂直</li> - <li>PX=1, PX=1.5, 或 PX=2 是 GAIA_DEV_PIXELS_PER_PX 应当被设备使用的设置。</li> - </ul> - </li> - <li>储存器: - <ul> - <li>"/data" 是内置储存器. 这个是 IndexedDB 和其他数据存放处. Storage is segregated on a per-app basis and is not USB storage accessible. Data is potentially accessible via adb depending on privileges.</li> - <li>DeviceStorage are the places where the <a href="/en-US/docs/WebAPI/Device_Storage">DeviceStorage API</a> can store things. Some devices may have internal storage (ex: leo), some devices may have external storage on MicroSD cards, some devices may support both (ex: leo). This storage is potentially accessible by all apps as well as the user via USB.</li> - <li>Values that don't look nice and round are as reported by "adb shell df" in the "size" column.</li> - </ul> - </li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/platform/apps_architecture/index.html b/files/zh-cn/archive/b2g_os/platform/apps_architecture/index.html deleted file mode 100644 index 0960f1d970..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/apps_architecture/index.html +++ /dev/null @@ -1,24 +0,0 @@ ---- -title: Firefox OS apps 架构 -slug: Archive/B2G_OS/Platform/Apps_architecture -translation_of: Archive/B2G_OS/Platform/Apps_architecture ---- -<div class="summary"> - <p>本文讲述了Firefox OS 应用启动和管理的内部原理。对 Firefox OS 平台开发者和将操作系统移植到硬件的团队是有用的。如果您仅仅是一个应用开发者，则不用了解这些细节，但又何妨一读，因为它是十分有趣的过程。</p> -</div> -<h2 id="app启动过程">app启动过程</h2> -<p>当用户选择他们想要启动或需要启动的应用时， home screen app会通过<a href="/zh-CN/docs/Web/API/App" title="此页面仍未被本地化, 期待您的翻译!"><code>App</code></a> API,获取到一个app的引用，之后会调用 <a href="/zh-CN/docs/Web/API/App/launch" title="此页面仍未被本地化, 期待您的翻译!"><code>App.launch()</code></a> 方法启动这个应用。 </p> -<p>Gecko 接收到请求后会向携带着 app 详情 向System app发送 <a href="/zh-CN/docs/Web/API/MozChromeEvent" title="此页面仍未被本地化, 期待您的翻译!"><code>mozChromeEvent</code></a> 事件。 System app 对事件进行处理：向 DOM tree中插入一个新的 <a href="/zh-CN/docs/Web/HTML/Element/iframe" title="HTML内联框架元素 <iframe> 表示嵌套的浏览上下文，有效地将另一个HTML页面嵌入到当前页面中。在HTML 4.01中，文档可能包含头部和正文，或头部和框架集，但不能包含正文和框架集。但是，<iframe>可以在正常的文档主体中使用。每个浏览上下文都有自己的会话历史记录和活动文档。包含嵌入内容的浏览上下文称为父浏览上下文。顶级浏览上下文（没有父级）通常是浏览器窗口。"><code><iframe></code></a> ，并且在这个新的 <a href="/zh-CN/docs/Web/HTML/Element/iframe" title="HTML内联框架元素 <iframe> 表示嵌套的浏览上下文，有效地将另一个HTML页面嵌入到当前页面中。在HTML 4.01中，文档可能包含头部和正文，或头部和框架集，但不能包含正文和框架集。但是，<iframe>可以在正常的文档主体中使用。每个浏览上下文都有自己的会话历史记录和活动文档。包含嵌入内容的浏览上下文称为父浏览上下文。顶级浏览上下文（没有父级）通常是浏览器窗口。"><code><iframe></code></a> 中装载 app。 此后 frame 就会是 app 的 home 了，直到 app终止。</p> -<p>每个 app都需要一个 manifest文件来对 app进行描述，并且在它的包中有一个特定的文件结构。要了解更多详情，请参阅文章 <a href="/en-US/docs/Web/Apps/App_Manifest">App manifest</a>。</p> -<h2 id="与_Gecko_通信">与 Gecko 通信</h2> -<p>Gecko 和 Gaia 系统应用之间的通信是通过 <a href="/zh-CN/docs/Web/API/MozChromeEvent" title="此页面仍未被本地化, 期待您的翻译!"><code>mozChromeEvent</code></a> 和<a href="/zh-CN/docs/Web/API/MozContentEvent" title="此页面仍未被本地化, 期待您的翻译!"><code>mozContentEvent</code></a> 完成的。<code>mozChromeEvent </code>是从 chrome 到 content 的广播；<code>而 </code> <code>mozContentEvent</code>s 是从 content 到 chrome 的广播。 这种通信过程用来控制可信任UI 的创建和关闭，以及为通知和其他工作注入需要的功能，如告诉System app 启动一个 app 。</p> -<div class="note"> - <p><strong>注意:</strong> 通过阅读 <a href="/en-US/Firefox_OS/Platform/Gaia/Gaia_apps/System">System app documentation</a> 您可以获取到关于这些事件工作的更多的内容。 通过阅读 <code><a href="https://dxr.mozilla.org/mozilla-central/source/b2g/chrome/content/shell.js" rel="custom">b2g/chrome/content/shell.js</a></code> 您也可已获取到更多使用的细节。 </p> -</div> -<h2 id="参见">参见</h2> -<ul> - <li><a href="/en-US/docs/Web/Apps">Apps</a></li> - <li><a href="/zh-CN/docs/Web/API/App" title="此页面仍未被本地化, 期待您的翻译!"><code>App</code></a></li> - <li><a href="/en-US/Firefox_OS/Platform/Gaia/Gaia_apps/System">System app</a></li> - <li><a href="/en-US/Firefox_OS/Platform/Architecture">Firefox OS architecture</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/platform/architecture/index.html b/files/zh-cn/archive/b2g_os/platform/architecture/index.html deleted file mode 100644 index 4b57f44ada..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/architecture/index.html +++ /dev/null @@ -1,1024 +0,0 @@ ---- -title: Firefox OS架构 -slug: Archive/B2G_OS/Platform/Architecture -tags: - - Architecture - - B2G - - Firefox OS - - Guide - - IPC - - IPDL -translation_of: Archive/B2G_OS/Architecture ---- -<p> </p> - -<div class="overheadIndicator draft"> -<p><strong>草案</strong><br> - 本页尚未完工.</p> -</div> - -<p> </p> - -<p>这篇文章是对Firefox OS平台的高度概览，介绍了一些关键的概念以及组件如何交互的过程。</p> - -<div class="note"> -<p><strong>Note:</strong> Firefox OS 仍然是未发布的产品，这里描述的架构并不是最终版本。</p> -</div> - -<h2 id="Firefox_OS_术语">Firefox OS 术语</h2> - -<p>在进一步学习 Firefox OS 文档前，请先了解下面的术语。</p> - -<h2 id="架构框图" style="margin-bottom: 20px; line-height: 30px;">架构框图</h2> - -<dl> - <dt>B2G</dt> - <dd>Boot to Gecko 的简称。</dd> - <dt>Boot to Gecko</dt> - <dd>Firefox OS 操作系统的工程代号。 因为在该项目拥有官方名称之前B2G已经使用了很久的原因，它经常用于指代 Firefox OS。</dd> - <dt>Firefox OS</dt> - <dd>FIrefox OS 基本上是指 Mozilla及合作伙伴应用在 B2G上的品牌和服务支持， 最终将创建一个发布的产品。</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Gaia" title="/en-US/docs/Mozilla/Firefox_OS/Gaia">Gaia</a></dt> - <dd>Firefox OS 平台的用户接口层。屏幕启动时渲染到屏幕上的一切都是Gaia层的产物。Gaia 实现了 lock screen, home screen, 和所有你所期待在智能手机上看到的标准应用。Gaia 完全使用 HTML, CSS, 和 JavaScript实现。Web APIs 是Gaia层到底层系统的唯一入口，Web APIs 是由Gecko 层实现的。第三方应用可以安装在Gaia层。</dd> - <dt><a href="/en-US/docs/Gecko" title="/en-US/docs/Accessibility/AT-APIs/Gecko">Gecko</a></dt> - <dd>Firefox OS 应用的运行环境；该层提供了对： HTML, CSS, and JavaScript三个标准的支持，它能确保APIs能够在gecko支持的系统上良好工作。也就是说，它包括了网络栈，图形栈，布局引擎，js虚拟机和端口层。</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Gonk" title="/en-US/docs/Mozilla/Firefox_OS/Gonk">Gonk</a></dt> - <dd>Gonk 是Firefox OS平台更低层的系统，包括了 Linux kernel （基于 AOSP）和用户空间硬件抽象层 (HAL)。内核和一些用户空间库都是公共的开源项目：linux, libusb, bluez等。其他的一些硬件抽象层部分是与android项目共享的：GPS, camera等。你可以认为 Gonk 是一个非常简单的 Linux 版本。Gonk 是 Gecko 层的端口目标；也就是说 Gecko 层有到 Gonk 的端口，就像Gecko 到 Mac OS X, Windows, 和 Android 一样。因为Firefox OS 对 Gonk 拥有完全的控制权，相比其他操作系统，我们可以释放更多的接口到 Gecko。例如，Gecko 拥有到 Gonk 电话栈和帧缓冲区的直接入口，但在其他操作系统却没有。</dd> - <dt>Jank</dt> - <dd>这个术语经常用在移动app空间的讨论中，主要是指在app中缓慢/低效的代码操作会导致 block UI的更新甚至出现无响应状态。我们的gaia工程师会不惜一切代价使用各种优化技术来避免这一问题。</dd> - <dt> </dt> - <dt> </dt> - <dt><img alt="Firefox OS Architecture" src="/files/4605/FirefoxOS.png" style="height: 915px; width: 754px;"></dt> -</dl> - -<p> </p> - -<h2 id="Firefox_OS_启动步骤" style="margin-bottom: 20px; line-height: 30px;">Firefox OS 启动步骤</h2> - -<p>本节主要描述了FIrefox OS 设备启动以及各模块交互的过程。简而言之，整个系统的启动流程是从内核空间的bootloaders开始，继而对native code初始化，到B2G至用户空间的Gecko，最后会到 Gaia 层 system app，window manager,homescreen app。而其他应用都是在它们上面执行的。</p> - -<p><img alt="Firefox os bootup " src="/files/7491/bootup.png"></p> - -<h2 id="自启动过程">自启动过程</h2> - -<p>当Firefox OS 设备启动时，执行过程从主要的引导装载程序（primary bootloader）开始。此时，会以常用的方式装载主操作系统。在这个链条中，一级级的装载会触发更高层次的迭代。这个过程最终是交由 Linux 内核处理。</p> - -<p>关于启动过程，这里有几点需要注意的地方：</p> - -<ul> - <li>在设备启动时，装载程序会显示第一个 splash 界面给用户。界面通常是一个厂商的logo。</li> - <li>装载程序会为设备实现一个图片的动画。不同的设备使用的协议是有差别的，绝大多数手机会使用 <a href="http://android-dls.com/wiki/index.php?title=Fastboot" title="http://android-dls.com/wiki/index.php?title=Fastboot">fastboot protocol</a>, 但是Samsung Galaxy S II 使用的是 odin 协议。</li> - <li>在启动过程结束时， modem image 通常会被装载并运行在 modem 处理器上。然而这些过程都是由设备不同而区分的，有的甚至是独有的。</li> -</ul> - -<h2 id="Linux_内核">Linux 内核</h2> - -<p>Gonk使用的 Linux内核与原生Linux派生出的AOSP是非常相似的。与AOSP （<a href="http://source.android.com/" style="text-decoration: underline;" title="http://source.android.com/">Android Open Source Project</a> ）相比，它还有一些小的变化。另外，厂商还可能会对内核进行修改，并将这些变化按照自身的要求来设定。 一般而言， Linux内核是非常相近的。</p> - -<p>网络上对 <a href="http://en.wikipedia.org/wiki/Linux_startup_process" title="http://en.wikipedia.org/wiki/Linux_startup_process">startup process for Linux</a> 有许多详细的介绍，此处不会再赘述。</p> - -<p>Linux内核会带动设备的启动并且运行基本的过程。它会先执行 <code>init.rc </code> 中的步骤，继而运行 <code>init.b2g.rc</code> 来启动必须的步骤， 如包含的Gecko内的Firefox OS 基本过程以及 rild (电话相关由不同芯片组相关的进程）— 下面会有更详细的说明。 在过程结束时，正如绝大多数 UNIX-like 操作系统一样， 用户空间 <code style="font-style: normal;">init 进程会被启动。</code></p> - -<p>当 <code>init</code> 进程启动完成时，Linux内核会处理来自用户空间的系统请求，来自硬件的中断等。许多硬件特性会通过 <code><a href="http://en.wikipedia.org/wiki/Sysfs" title="http://en.wikipedia.org/wiki/Sysfs">sysfs</a> 暴露给用户空间</code>。例如这里的 <a href="https://github.com/cgjones/mozilla-central/blob/master/hal/gonk/GonkHal.cpp#L277">代码片段</a> 就在Gecko中读取电池的状态。</p> - -<pre class="brush:cpp;">FILE *capacityFile = fopen("/sys/class/power_supply/battery/capacity", "r"); -double capacity = dom::battery::kDefaultLevel * 100; -if (capacityFile) { - fscanf(capacityFile, "%lf", &capacity); - fclose(capacityFile); -}</pre> - -<h2 id="init_进程">init 进程</h2> - -<p>在Gonk中的 <code>init</code> 进程会处理文件系统的加载请求以及派生的系统服务。在此之后，它会作为进程的管理器而存在。这与其他的 UNIX-like操作系统是非常类似的。它会 将<span style="font-family: 'Courier New','Andale Mono',monospace;">init*.rc </span>脚本文件解释成包含启动各种服务的命令的集合。Firefox OS <code>init.b2g.rc</code> 其实就是在 Android <code>init.rc</code> 文件的基础上添加一些关于启动Firefox OS的命令的文件。</p> - -<p><code>init</code> 进程启动过程中一个关键任务就是启动 <code>b2g</code> 进程，它是 Firefox OS 操作系统的核心所在。</p> - -<p><code>init.b2g.rc</code> 文件中启动b2g进程的命令如下所示：</p> - -<pre>service b2g /system/bin/b2g.sh - class main - onrestart restart media</pre> - -<p>您也可以查看下 <code><a href="https://github.com/mozilla-b2g/gonk-misc/blob/master/init.b2g.rc" title="https://github.com/mozilla-b2g/gonk-misc/blob/master/init.b2g.rc">init.b2g.rc</a> </code>文件内容，它是添加在 Android init.rc 文件后用来启动b2g进程的。<font face="'Courier New', 'Andale Mono', monospace"> </font></p> - -<div class="note"> -<p><strong>注意： </strong>对\不同的设备而言<strong>，</strong><code>init.rc</code> 与 Android 的 对应文件间的差别也是不同的。,<code>init.b2g.rc</code> 只是简单的附加在文件后面的，有时候 patch 文件显得会更重要些。</p> -</div> - -<h2 id="userspace_进程架构">userspace 进程架构</h2> - -<p>现在如果概览一下Firefox OS的不同组件是如何组合在一起并与其他组件交互的过程是非常有用的。下图则包含了 Firefox OS 主要的 usersapce 进程。</p> - -<p><a href="/files/3849/B2G userspace architecture.svg"><img alt="Userspace diagram" src="/files/3849/B2G%20userspace%20architecture.svg" style="float: right; height: 491px; position: relative; width: 520px;"></a></p> - -<div class="note"> -<p><strong>注意: 我们应当知道，由于 FIrefox OS 正处在活跃开发阶段，这个框图可能会发生变化，不会那么准确。</strong></p> -</div> - -<p><code>b2g</code> 进程是主要的系统进程。它会以非常高的优先级运行，并且会访问绝大多数的硬件设备。<span style="font-family: 'Courier New','Andale Mono',monospace;">b2g</span> 会和 modem 进行通信， 会在 display framerbuffer上绘图， 与 GPS， Camera 以及其他硬件交互。 <code style="font-style: normal;">b2g </code>内部运行在Gecko层（由 <code style="font-style: normal;">libxul.so</code> 实现）。查看 <a href="#Gecko">Gecko</a> 可以获得 Gecko层如何工作， <code style="font-style: normal;">b2g</code> 与Gecko如何通信的细节。</p> - -<h3 id="b2g">b2g</h3> - -<p><code>b2g</code> 进程可能会反过来孵化一些低优先级的 <strong>content processes。 </strong>这些进程都是关于 web 应用或其他的 web 内容装载的过程。这些进程会和Gecko server主进程通过 <a href="/en-US/docs/IPDL" style="text-decoration: underline;" title="/en-US/docs/IPDL">IPDL</a> 消息传送系统进行通信。</p> - -<h3 id="rild">rild</h3> - -<p><code>rild</code> 进程是 modem 处理器的接口。 <code>rild</code> 是实现 <strong>Radio Interface Layer</strong> (RIL) 的守护进程。 它是一个专有的代码，由硬件供应商与自己的modem 硬件实现。<code>rild</code> 使客户端代码连接它所绑定的 UNIX域的 socket成为可能。它会由 <code>init</code> 脚本中的如下代码启动：</p> - -<pre>service ril-daemon /system/bin/rild - socket rild stream 660 root radio</pre> - -<h3 id="rilproxy">rilproxy</h3> - -<p>在Firefox OS 中， <code>rild</code> 客户端就是 <code>rilproxy</code> 进程。它在 <code style="font-style: normal;">rild</code> 和 <span style="font-family: 'Courier New','Andale Mono',monospace;">b2g </span>扮演着简单的转发代理服务器的角色。这个代理需要的是实现的细节，可以说，这确实是非常必要的。<a href="https://github.com/mozilla-b2g/rilproxy"><code>riproxy</code> 代码</a>可以在Github上找到。</p> - -<h3 id="mediaserver">mediaserver</h3> - -<p><a href="https://github.com/android/platform_frameworks_base/tree/ics-mr0-release/media/libmediaplayerservice"><code>mediaserver</code> 进程</a>控制着音频和视频的播放。Gecko会通过 Android远程过程调用机制（RPC）与 其通信。Gecko可以播放的多媒体（OGG Vorbis 音频， OGG Theora 视频，以及 <a href="http://www.webmproject.org/about/" title="http://www.google.com/url?sa=t&rct=j&q=&esrc=s&source=web&cd=1&cad=rja&ved=0CDUQFjAA&url=http%3A%2F%2Fwww.webmproject.org%2F&ei=8Q84UOnoMoHH6wHZ44DwBA&usg=AFQjCNHK9j6wyhUful5RmKCpU6b8GDfpYQ&sig2=tCl8VxL3mCvrH86EyOwO_A">WebM</a> 视频）都是由 Gecko解码并直接发送给 <code>mediaserver</code> 进程。其他的多媒体文件是由 <code>libstagefright 解码的，它能够访问专用编码器和硬件编码器。</code></p> - -<div class="note"> -<p><strong>注意：</strong> <code>mediaserver</code> 进程时一个临时的Firefox OS组件， 对我们初始的开发会有帮助，但最终会离开。然而在 Firefox OS 2.0 之前，可能不会发生。</p> -</div> - -<h3 id="netd">netd</h3> - -<p><code>netd</code> 进程用来对网络接口进行配置。</p> - -<h3 id="wpa_supplicant">wpa_supplicant</h3> - -<p><code>wpa_supplicant</code> 进程是标准的 UNIX样式的守护进程，会处理 WIFI 的连接。</p> - -<h3 id="dbus-daemon">dbus-daemon</h3> - -<p>dbus-daemon 实现了 <a href="http://www.freedesktop.org/wiki/Software/dbus" title="http://www.freedesktop.org/wiki/Software/dbus">D-Bus</a>( DBus 是指Firefox OS 用于蓝牙通信的一种消息总线系统）。</p> - -<p> </p> - -<h2 id="Gecko" style="margin-bottom: 20px; line-height: 30px;">Gecko</h2> - -<p><a href="https://developer.mozilla.org/en-US/docs/Gecko" title="/en-US/docs/Gecko">Gecko</a>，正如之前提到的，是对 web标准（ <a href="https://developer.mozilla.org/en-US/docs/HTML" style="text-decoration: underline;" title="/en-US/docs/HTML">HTML</a>, <a href="https://developer.mozilla.org/en-US/docs/CSS" title="/en-US/docs/CSS">CSS</a>, and<a href="https://developer.mozilla.org/en-US/docs/JavaScript" title="/en-US/docs/JavaScript">JavaScript</a>）的实现，用于实现用户在Firefox OS 上看到的一切界面。</p> - -<div class="note"> -<p><strong>注意：</strong> 您可以使用 <a href="http://dxr.mozilla.org/" style="text-decoration: underline;">http://dxr.mozilla.org</a> 来查找Gecko代码库。这个网站非常有趣，并且提供了较好的参照特性，但是代码库的数量有限。或者您可以尝试下传统的 <a href="http://mxr.mozilla.org/">http://mxr.mozilla.org</a> ，其中会包括更多的Mozilla 项目。</p> -</div> - -<h3 id="与Firefox_OS_相关的_Gecko_文件" style="line-height: 24px; letter-spacing: normal;">与Firefox OS 相关的 Gecko 文件</h3> - -<h4 id="b2g_2" style="line-height: 18px; letter-spacing: normal;">b2g/</h4> - -<p>b2g 文件夹会包含了一些主要的Firefox OS 相关的功能。.</p> - -<h5 id="b2gchromecontent">b2g/chrome/content</h5> - -<p>包含了在system app 之上运行的 Javascript 文件。</p> - -<h5 id="b2gchromecontentshell.html">b2g/chrome/content/shell.html</h5> - -<p>Gaia的入口 — system app的html。 <code>shell.html</code> 会加载 <code>settings.js 和</code> <code>shell.js</code>:</p> - -<pre class="brush: html language-html" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-html" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="script token"><span class="tag token" style="color: #990055;"><span class="tag token"><span class="punctuation token" style="color: #999999;"><</span>script</span> <span class="attr-name token" style="color: #669900;">type</span><span class="attr-value token" style="color: #0077aa;"><span class="punctuation token" style="color: #999999;">=</span><span class="punctuation token" style="color: #999999;">"</span>application/javascript;version<span class="punctuation token" style="color: #999999;">=</span>1.8<span class="punctuation token" style="color: #999999;">"</span></span> <span class="attr-name token" style="color: #669900;">src</span><span class="attr-value token" style="color: #0077aa;"><span class="punctuation token" style="color: #999999;">=</span><span class="punctuation token" style="color: #999999;">"</span>chrome://browser/content/settings.js<span class="punctuation token" style="color: #999999;">"</span></span><span class="punctuation token" style="color: #999999;">></span></span> <span class="tag token" style="color: #990055;"><span class="tag token"><span class="punctuation token" style="color: #999999;"></</span>script</span><span class="punctuation token" style="color: #999999;">></span></span></span> -<span class="script token"><span class="tag token" style="color: #990055;"><span class="tag token"><span class="punctuation token" style="color: #999999;"><</span>script</span> <span class="attr-name token" style="color: #669900;">type</span><span class="attr-value token" style="color: #0077aa;"><span class="punctuation token" style="color: #999999;">=</span><span class="punctuation token" style="color: #999999;">"</span>application/javascript;version<span class="punctuation token" style="color: #999999;">=</span>1.8<span class="punctuation token" style="color: #999999;">"</span></span> <span class="attr-name token" style="color: #669900;">src</span><span class="attr-value token" style="color: #0077aa;"><span class="punctuation token" style="color: #999999;">=</span><span class="punctuation token" style="color: #999999;">"</span>chrome://browser/content/shell.js<span class="punctuation token" style="color: #999999;">"</span></span><span class="punctuation token" style="color: #999999;">></span></span> <span class="tag token" style="color: #990055;"><span class="tag token"><span class="punctuation token" style="color: #999999;"></</span>script</span><span class="punctuation token" style="color: #999999;">></span></span></span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<p><code>settings.js</code> 包含了系统设置的默认参数。</p> - -<h5 id="b2gchromecontentshell.js">b2g/chrome/content/shell.js</h5> - -<p><code>shell.js</code> 是在 Gaia <code>system</code> app中装载的第一个脚本文件。.</p> - -<p><code>shell.js</code> 导入了所有需要的模块，注册键值监听，定义了 <code style="font-style: normal;">sendCustomEvent </code>和<code style="font-style: normal;">sendChromeEvent</code> 与Gaia 通信，并且提供了 webapp 的安装助手： indexedDB quota, RemoteDebugger, keyboard helper, 和screenshot 工具。</p> - -<p>但是<code>shell.js</code> 最重要的功能就是启动了 Gaia <code>system</code> app， 之后又将整个系统相关的管理工作移交给了 Gaia <code>system</code> app。</p> - -<pre class="brush: js language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">let</span> systemAppFrame <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> - document<span class="punctuation token" style="color: #999999;">.</span><span class="function token">createElementNS<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">'http://www.w3.org/1999/xhtml'</span><span class="punctuation token" style="color: #999999;">,</span> <span class="string token" style="color: #669900;">'html:iframe'</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">.</span><span class="punctuation token" style="color: #999999;">.</span><span class="punctuation token" style="color: #999999;">.</span> - container<span class="punctuation token" style="color: #999999;">.</span><span class="function token">appendChild<span class="punctuation token" style="color: #999999;">(</span></span>systemAppFrame<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<h5 id="b2gappb2g.js">b2g/app/b2g.js</h5> - -<p>这个脚本中包含了预定义的配置信息，如浏览器中的 about:config， 文件与 Gaia 中的 pref.js 类似。这些配置可以在 Settings app中更改，可以使用Gaia 构建脚本文件 Gaia user.js文件覆写。</p> - -<h4 id="domAPI" style="line-height: 18px; letter-spacing: normal;">dom/{API}</h4> - -<p>新的 API 实现（post-b2g）放置在 <code>dom/ 文件夹中；而旧的API 的 dom/base 文件夹中，如 </code> <code>navigator.cpp。</code></p> - -<h5 id="domapps">dom/apps</h5> - -<p><code>.jsm</code> 文件会被加载，是对<code>.js</code> API 的实现，如 <code>webapp.js</code> <font face="'Courier New', 'Andale Mono', monospace">等。</font></p> - -<h5 id="domappssrc">dom/apps/src/</h5> - -<p>所有的权限信息都在 <a href="http://mxr.mozilla.org/mozilla-central/source/dom/apps/src/PermissionsTable.jsm">PermissionsTable.jsm</a> 文件中定义。</p> - -<h4 id="domwebidl" style="line-height: 18px; letter-spacing: normal;">dom/webidl</h4> - -<p>WebIDL 是一种用来定义 web APIs 的语言。可查看 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/WebIDL_bindings" style="text-decoration: underline;">WebIDL_bindings</a> 文件来获取它所支持的特性。</p> - -<h4 id="halgonk" style="line-height: 18px; letter-spacing: normal;">hal/gonk</h4> - -<p>这个文件夹包含了 gonk 接口层的相关文件。</p> - -<h4 id="Generated_files" style="line-height: 18px; letter-spacing: normal;">Generated files</h4> - -<h5 id="modulelibprefsrcinitall.js">module/libpref/src/init/all.js</h5> - -<p>包含所有的配置文件。</p> - -<h5 id="systemb2g_omni.ja_and_omni.js">/system/b2g/ omni.ja and omni.js</h5> - -<p>包含了设备中的资源样式包。</p> - -<h3 id="输入事件处理" style="line-height: 24px; letter-spacing: normal;">输入事件处理</h3> - -<p>在Gekco层绝大多数动作都是由用户行为触发的。这些动作是由输入事件所表示的（如按钮点击，触屏设备的触控，等等）。这些事件是通过 <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIAppShell" title="">nsIAppShell</a></code> 的 <a href="https://dxr.mozilla.org/mozilla-central/source/widget/gonk/nsAppShell.cpp" rel="custom">Gonk implementation</a> 传入的，这个接口用来表示Gecko 应用的最初入口点。也就是说， 输入设备会调用 nspAppShell对象的方法，来表示 Gecko子系统想要发送事件到用户界面。</p> - -<p>例如:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">void GeckoInputDispatcher<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">notifyKey<span class="punctuation token" style="color: #999999;">(</span></span>nsecs_t eventTime<span class="punctuation token" style="color: #999999;">,</span> - int32_t deviceId<span class="punctuation token" style="color: #999999;">,</span> - int32_t source<span class="punctuation token" style="color: #999999;">,</span> - uint32_t policyFlags<span class="punctuation token" style="color: #999999;">,</span> - int32_t action<span class="punctuation token" style="color: #999999;">,</span> - int32_t flags<span class="punctuation token" style="color: #999999;">,</span> - int32_t keyCode<span class="punctuation token" style="color: #999999;">,</span> - int32_t scanCode<span class="punctuation token" style="color: #999999;">,</span> - int32_t metaState<span class="punctuation token" style="color: #999999;">,</span> - nsecs_t downTime<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - UserInputData data<span class="punctuation token" style="color: #999999;">;</span> - data<span class="punctuation token" style="color: #999999;">.</span>timeMs <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> <span class="function token">nanosecsToMillisecs<span class="punctuation token" style="color: #999999;">(</span></span>eventTime<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - data<span class="punctuation token" style="color: #999999;">.</span>type <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> UserInputData<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span>KEY_DATA<span class="punctuation token" style="color: #999999;">;</span> - data<span class="punctuation token" style="color: #999999;">.</span>action <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> action<span class="punctuation token" style="color: #999999;">;</span> - data<span class="punctuation token" style="color: #999999;">.</span>flags <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> flags<span class="punctuation token" style="color: #999999;">;</span> - data<span class="punctuation token" style="color: #999999;">.</span>metaState <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> metaState<span class="punctuation token" style="color: #999999;">;</span> - data<span class="punctuation token" style="color: #999999;">.</span>key<span class="punctuation token" style="color: #999999;">.</span>keyCode <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> keyCode<span class="punctuation token" style="color: #999999;">;</span> - data<span class="punctuation token" style="color: #999999;">.</span>key<span class="punctuation token" style="color: #999999;">.</span>scanCode <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> scanCode<span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">{</span> - MutexAutoLock <span class="function token">lock<span class="punctuation token" style="color: #999999;">(</span></span>mQueueLock<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - mEventQueue<span class="punctuation token" style="color: #999999;">.</span><span class="function token">push<span class="punctuation token" style="color: #999999;">(</span></span>data<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> - gAppShell<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>><span class="function token">NotifyNativeEvent<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 133px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 152px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 171px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 190px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 209px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 228px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 247px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 266px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 285px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 304px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 323px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 342px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 361px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 380px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 399px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 418px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 437px;"> </div> - -<p>这些事件都来自于标准的Linux <span style="font-family: 'Courier New','Andale Mono',monospace;">input_event </span>系统。Firefox OS 使用了 <a href="https://dxr.mozilla.org/mozilla-central/source/widget/gonk/libui/InputReader.cpp" rel="custom">light abstraction layer</a> 来覆写它；它也提供了较好的特性如事件过滤机制。 您可以在 <a href="https://dxr.mozilla.org/mozilla-central/source/widget/gonk/libui/EventHub.cpp" rel="custom">widget/gonk/libui/EventHub.cpp</a> 文件的 <code style="font-style: normal;">EventHub::getEvents()</code> 的方法中找到创建输入事件的代码。</p> - -<p>当Gecko层接收到事件时，就会通过<code style="font-style: normal;"><a href="https://dxr.mozilla.org/mozilla-central/source/widget/gonk/nsAppShell.cpp" rel="custom">nsAppShell</a> </code>分发到DOM中。</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">static nsEventStatus <span class="function token">sendKeyEventWithMsg<span class="punctuation token" style="color: #999999;">(</span></span>uint32_t keyCode<span class="punctuation token" style="color: #999999;">,</span> - uint32_t msg<span class="punctuation token" style="color: #999999;">,</span> - uint64_t timeMs<span class="punctuation token" style="color: #999999;">,</span> - uint32_t flags<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - nsKeyEvent <span class="function token">event<span class="punctuation token" style="color: #999999;">(</span></span><span class="boolean token" style="color: #990055;">true</span><span class="punctuation token" style="color: #999999;">,</span> msg<span class="punctuation token" style="color: #999999;">,</span> NULL<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - event<span class="punctuation token" style="color: #999999;">.</span>keyCode <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> keyCode<span class="punctuation token" style="color: #999999;">;</span> - event<span class="punctuation token" style="color: #999999;">.</span>location <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> nsIDOMKeyEvent<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span>DOM_KEY_LOCATION_MOBILE<span class="punctuation token" style="color: #999999;">;</span> - event<span class="punctuation token" style="color: #999999;">.</span>time <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> timeMs<span class="punctuation token" style="color: #999999;">;</span> - event<span class="punctuation token" style="color: #999999;">.</span>flags <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">|</span><span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> flags<span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">return</span> nsWindow<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">DispatchInputEvent<span class="punctuation token" style="color: #999999;">(</span></span>event<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 133px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 152px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 171px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 190px;"> </div> - -<p>此后，事件就会由Gecko本身处理或作为 <a href="https://developer.mozilla.org/en-US/docs/DOM_Client_Object_Cross-Reference/DOM_Events" style="text-decoration: underline;" title="/en-US/docs/DOM_Client_Object_Cross-Reference/DOM_Events">DOM events</a> 分发到web 应用中进一步处理</p> - -<h3 id="图像" style="line-height: 24px; letter-spacing: normal;">图像</h3> - -<p>在底层, Gecko 会使用 <a href="http://www.khronos.org/opengles/2_X/" title="http://www.khronos.org/opengles/2_X/">OpenGL ES 2.0</a> to draw to a GL context that wraps the hardware frame buffers. 这是由 Gonk 层<span style="font-family: 'Courier New','Andale Mono',monospace;"><a href="https://dxr.mozilla.org/mozilla-central/source/widget/gonk/nsWindow.cpp" rel="custom">nsWindow</a> 实现的，代码如下：</span></p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">gNativeWindow <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">android</span><span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">FramebufferNativeWindow<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -sGLContext <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> GLContextProvider<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">CreateForWindow<span class="punctuation token" style="color: #999999;">(</span></span>this<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<p><code>FramebufferNativeWindow</code> 类是直接 从Android拿过来的，可参考 <a href="https://github.com/android/platform_frameworks_base/blob/ics-mr1-release/libs/ui/FramebufferNativeWindow.cpp" title="https://github.com/android/platform_frameworks_base/blob/ics-mr1-release/libs/ui/FramebufferNativeWindow.cpp"><code>FramebufferNativeWindow.cpp</code></a>。为了能够将缓存从帧缓存设备映射到内存中，它使用了 <strong>gralloc</strong> API 来访问图像驱动。</p> - -<p>Gecko 使用了 <a href="https://developer.mozilla.org/en-US/docs/Gecko/Layers" title="/en-US/docs/Gecko/Layers">Layers</a> 系统来将复合后的内容画在屏幕上。总结一些，基本步骤是：</p> - -<ol> - <li>Gecko draws separate regions of pages into memory buffers. Sometimes these buffers are in system memory; other times, they're textures mapped into Gecko's address space, which means that Gecko is drawing directly into video memory. This is typically done in the method <a href="http://mxr.mozilla.org/mozilla-central/source/gfx/layers/basic/BasicThebesLayer.cpp#83" title="http://mxr.mozilla.org/mozilla-central/source/gfx/layers/basic/BasicThebesLayer.cpp#201"><code>BasicThebesLayer::PaintThebes()</code></a>.</li> - <li>Gecko then composites all of these textures to the screen using OpenGL commands. This composition occurs in <a href="http://mxr.mozilla.org/mozilla-central/source/gfx/layers/opengl/ThebesLayerOGL.cpp#124" title="http://mxr.mozilla.org/mozilla-central/source/gfx/layers/basic/BasicThebesLayer.cpp#201"><code>ThebesLayerOGL::RenderTo()</code></a>.</li> -</ol> - -<p>The details of how Gecko handles the rendering of web content is outside the scope of this document.</p> - -<h3 id="硬件抽象层_(HAL)" style="line-height: 24px; letter-spacing: normal;">硬件抽象层 (HAL)</h3> - -<p>The Gecko hardware abstraction layer is one of the porting layers of Gecko. It handles low-level access to system interfaces across multiple platforms using a C++ API that's accessible to the higher levels of Gecko. These APIs are implemented on a per-platform basis inside the Gecko HAL itself. This hardware abstraction layer is not exposed directly to JavaScript code in Gecko.</p> - -<h4 id="How_the_HAL_works" style="line-height: 18px; letter-spacing: normal;">How the HAL works</h4> - -<p>Let's consider the <a href="/zh-CN/docs/Web/API/Window/navigator/vibrate" title="此页面仍未被本地化, 期待您的翻译!"><code>Vibration</code></a> API as an example. The Gecko HAL for this API is defined in <a href="https://dxr.mozilla.org/mozilla-central/source/hal/Hal.h" rel="custom">hal/Hal.h</a>. In essence (simplifying the method signature for clarity's sake), you have this function:</p> - -<pre class="language-html" style="padding-top: 1em; padding-right: 1em; padding-bottom: 1em; padding-left: 1em; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;">void Vibrate(const nsTArray<uint32> &pattern);</pre> - -<p>This is the function called by Gecko code to turn on vibration of the device according to the specified pattern; a corresponding function exists to cancel any ongoing vibration. The Gonk implementation of this method is in <a href="https://dxr.mozilla.org/mozilla-central/source/hal/gonk/GonkHal.cpp" rel="custom">hal/gonk/GonkHal.cpp</a>:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">void <span class="function token">Vibrate<span class="punctuation token" style="color: #999999;">(</span></span>const nsTArray<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>uint32_t> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span>pattern<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="function token">EnsureVibratorThreadInitialized<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - sVibratorRunnable<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>><span class="function token">Vibrate<span class="punctuation token" style="color: #999999;">(</span></span>pattern<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<p>This code sends the request to start vibrating the device to another thread, which is implemented in <code>VibratorRunnable::Run()</code>. This thread's main loop looks like this:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"><span class="keyword token" style="color: #0077aa;">while</span> <span class="punctuation token" style="color: #999999;">(</span><span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">!</span>mShuttingDown<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span>mIndex <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span> mPattern<span class="punctuation token" style="color: #999999;">.</span><span class="function token">Length<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - uint32_t duration <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> mPattern<span class="punctuation token" style="color: #999999;">[</span>mIndex<span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span>mIndex <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">%</span> <span class="number token" style="color: #990055;">2</span> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">==</span> <span class="number token" style="color: #990055;">0</span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="function token">vibrator_on<span class="punctuation token" style="color: #999999;">(</span></span>duration<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> - mIndex<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">++</span><span class="punctuation token" style="color: #999999;">;</span> - mMonitor<span class="punctuation token" style="color: #999999;">.</span><span class="function token">Wait<span class="punctuation token" style="color: #999999;">(</span></span><span class="function token">PR_MillisecondsToInterval<span class="punctuation token" style="color: #999999;">(</span></span>duration<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> - <span class="keyword token" style="color: #0077aa;">else</span> <span class="punctuation token" style="color: #999999;">{</span> - mMonitor<span class="punctuation token" style="color: #999999;">.</span><span class="function token">Wait<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 133px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 152px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 171px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 190px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 209px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 228px;"> </div> - -<p><code>vibrator_on()</code> is the Gonk HAL API that turns on the vibrator motor. Internally, this method sends a message to the kernel driver by writing a value to a kernel object using<code>sysfs</code>.</p> - -<h4 id="Fallback_HAL_API_implementations" style="line-height: 18px; letter-spacing: normal;">Fallback HAL API implementations</h4> - -<p>The Gecko HAL APIs are supported across all platforms. When Gecko is built for a platform that doesn't expose an interface to vibration motors (such as a desktop computer), then a fallback implementation of the HAL API is used. For vibration, this is implemented in <a href="https://dxr.mozilla.org/mozilla-central/source/hal/fallback/FallbackVibration.cpp" rel="custom">hal/fallback/FallbackVibration.cpp</a>.</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">void <span class="function token">Vibrate<span class="punctuation token" style="color: #999999;">(</span></span>const nsTArray<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>uint32_t> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span>pattern<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<h4 id="Sandbox_implementations" style="line-height: 18px; letter-spacing: normal;">Sandbox implementations</h4> - -<p>Because most web content runs in content processes with low privileges, we can't assume those processes have the privileges needed to be able to (for example), turn on and off the vibration motor. In addition, we want to have a central location for handling potential race conditions. In the Gecko HAL, this is done through a "sandbox" implementation of the HAL. This sandbox implementation simply proxies requests made by content processes and forwards them to the "Gecko server" process. The proxy requests are sent using IPDL.</p> - -<p>For vibration, this is handled by the <code>Vibrate()</code> function implemented in <a href="https://dxr.mozilla.org/mozilla-central/source/hal/sandbox/SandboxHal.cpp" rel="custom">hal/sandbox/SandboxHal.cpp</a>:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">void <span class="function token">Vibrate<span class="punctuation token" style="color: #999999;">(</span></span>const nsTArray<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>uint32_t><span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span> pattern<span class="punctuation token" style="color: #999999;">,</span> const WindowIdentifier <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span>id<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - AutoInfallibleTArray<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>uint32_t<span class="punctuation token" style="color: #999999;">,</span> <span class="number token" style="color: #990055;">8</span>> <span class="function token">p<span class="punctuation token" style="color: #999999;">(</span></span>pattern<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - - WindowIdentifier <span class="function token">newID<span class="punctuation token" style="color: #999999;">(</span></span>id<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - newID<span class="punctuation token" style="color: #999999;">.</span><span class="function token">AppendProcessID<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="function token">Hal<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>><span class="function token">SendVibrate<span class="punctuation token" style="color: #999999;">(</span></span>p<span class="punctuation token" style="color: #999999;">,</span> newID<span class="punctuation token" style="color: #999999;">.</span><span class="function token">AsArray<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">,</span> <span class="function token">GetTabChildFrom<span class="punctuation token" style="color: #999999;">(</span></span>newID<span class="punctuation token" style="color: #999999;">.</span><span class="function token">GetWindow<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<p>This sends a message defined by the <code>PHal</code> interface, described by IPDL in <a href="https://dxr.mozilla.org/mozilla-central/source/hal/sandbox/PHal.ipdl" rel="custom">hal/sandbox/PHal.ipdl</a>. This method is described more or less as follows:</p> - -<pre class="language-html" style="padding-top: 1em; padding-right: 1em; padding-bottom: 1em; padding-left: 1em; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;">Vibrate(uint32_t[] pattern);</pre> - -<p>The receiver of this message is the <code>HalParent::RecvVibrate()</code> method in <a href="https://dxr.mozilla.org/mozilla-central/source/hal/sandbox/SandboxHal.cpp" rel="custom">hal/sandbox/SandboxHal.cpp</a>, which looks like this:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">virtual bool <span class="function token">RecvVibrate<span class="punctuation token" style="color: #999999;">(</span></span>const InfallibleTArray<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>unsigned int><span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span> pattern<span class="punctuation token" style="color: #999999;">,</span> - const InfallibleTArray<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>uint64_t> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span>id<span class="punctuation token" style="color: #999999;">,</span> - PBrowserParent <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">*</span>browserParent<span class="punctuation token" style="color: #999999;">)</span> MOZ_OVERRIDE <span class="punctuation token" style="color: #999999;">{</span> - - hal<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">Vibrate<span class="punctuation token" style="color: #999999;">(</span></span>pattern<span class="punctuation token" style="color: #999999;">,</span> newID<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">return</span> <span class="boolean token" style="color: #990055;">true</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<p>This omits some details that aren't relevant to this discussion; however, it shows how the message progresses from a content process through Gecko to Gonk, then to the Gonk HAL implementation of <code>Vibrate()</code>, and eventually to the Vibration driver.</p> - -<h3 id="DOM_APIs" style="line-height: 24px; letter-spacing: normal;">DOM APIs</h3> - -<p><strong>DOM interfaces</strong> 从本质上说，是指web内容与Gecko的如何通信的。当然此处会涉及到更多的内容，如果您对更多的细节感兴趣，可以参考 <a href="https://developer.mozilla.org/en-US/docs/DOM/About_the_Document_Object_Model" title="/en-US/docs/DOM/About_the_Document_Object_Model">about the DOM</a> 。. DOM 接口是使用 <a href="https://developer.mozilla.org/en-US/docs/XPIDL" style="text-decoration: underline;" title="/en-US/docs/XPIDL">IDL</a> 定义的，包括外部功能接口(FFI) 和使用JavaScript 和 C++ 的对象模型（OM）。</p> - -<p>震动API是通过IDL接口暴露给web内容的，IDL接口定义在<code><a href="https://dxr.mozilla.org/mozilla-central/source/dom/interfaces/base/nsIDOMNavigator.idl" rel="custom">nsIDOMNavigator.idl</a>:</code></p> - -<pre class="language-html" style="padding-top: 1em; padding-right: 1em; padding-bottom: 1em; padding-left: 1em; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;">[implicit_jscontext] void mozVibrate(in jsval aPattern);</pre> - -<p><a href="https://developer.mozilla.org/en-US/docs/SpiderMonkey/JSAPI_Reference/Jsval" title="/en-US/docs/SpiderMonkey/JSAPI_Reference/JSVAL_IS_OBJECT"><code>jsval</code></a> 参数表示 <code>mozVibrate()</code> (这个未定版的震动规范是以我们的厂商作为前缀实现的)会接受任何输入的JavaScript值。 IDL编译器 <code><a href="https://developer.mozilla.org/en-US/docs/XPIDL/xpidl" title="/en-US/docs/XPIDL/xpidl">xpidl</a> </code>会产生一个C++接口，这个接口由 定义在 <span style="font-family: 'Courier New','Andale Mono',monospace;"><a href="https://dxr.mozilla.org/mozilla-central/source/dom/base/Navigator.cpp" rel="custom">Navigator.cpp</a> 文件中的</span> <code>Navigator</code> 类 <code>实现。</code></p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">NS_IMETHODIMP Navigator<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">MozVibrate<span class="punctuation token" style="color: #999999;">(</span></span>const jsval<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span> aPattern<span class="punctuation token" style="color: #999999;">,</span> JSContext<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">*</span> cx<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="comment token" style="color: #708090; display: inherit;"> // ... -</span> hal<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">Vibrate<span class="punctuation token" style="color: #999999;">(</span></span>pattern<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">return</span> NS_OK<span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<p>您在这个方法中看到的源码要比这里要多，但这并非我们此次讨论的目的。关键点在于此处会调用 <code>hal::Vibrate()</code> 将控制行为从DOM层传送到GECKO HAL层。 在那里，我们会进入 在之前一节HAL 实现的讨论，并会一直走到图形驱动层。最重要的是，DOM的实现并不会关心它运行在那个平台 (Gonk, Windows, Mac OS X, 或者其他)。、它也不会关心这些代码时运行在 content 进程或者是 Gecko 服务器进程。这些细节都会由系统底层处理。</p> - -<p>震动 API 非常简单， 可以作为一个好的例子来讲解。 <a href="https://developer.mozilla.org/en-US/docs/API/WebSMS" title="/en-US/docs/API/WebSMS">SMS API</a> 则比较复杂会使用到自身的“远程”层级连接content 进程到服务器。</p> - -<h2 id="Radio_Interface_Layer_(RIL)" style="margin-bottom: 20px; line-height: 30px;">Radio Interface Layer (RIL)</h2> - -<p>The RIL was mentioned in the section <a href="#The_userspace_process_architecture">The userspace process architecture</a>. This section will examine how the various pieces of this layer interact in a bit more detail.</p> - -<p>The main components involved in the RIL are:</p> - -<dl> - <dt><code>rild</code></dt> - <dd>The daemon that talks to the proprietary modem firmware.</dd> - <dt><code>rilproxy</code></dt> - <dd>The daemon that proxies messages between <code>rild</code> and Gecko (which is implemented in the <code>b2g</code> process). This overcomes the permission problem that arises when trying to talk to <code>rild</code> directly, since <code>rild</code> can only be communicated with from within the <code>radio</code>group.</dd> - <dt><code>b2g</code></dt> - <dd>This process, also known as the <strong>chrome process</strong>, implements Gecko. The portions of it that relate to the Radio Interface Layer are <a href="https://dxr.mozilla.org/mozilla-central/source/dom/system/gonk/ril_worker.js" rel="custom">dom/system/gonk/ril_worker.js</a> (which implements a worker thread that talks to <code>rild</code> through <code>rilproxy</code> and implements the radio state machine; and the <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIRadioInterfaceLayer" title="">nsIRadioInterfaceLayer</a></code> interface, which is the main thread's <a href="https://developer.mozilla.org/en-US/docs/XPCOM" title="/en-US/docs/XPCOM">XPCOM</a>service that acts primarily as a message exchange between the <code>ril_worker.js</code> thread and various other Gecko components, including the Gecko content process.</dd> - <dt>Gecko's content process</dt> - <dd>Within Gecko's content process, the <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIRILContentHelper" title="">nsIRILContentHelper</a></code> interface provides an XPCOM service that lets code implementing parts of the DOM, such as the<a href="https://developer.mozilla.org/en-US/docs/API/WebTelephony" title="/en-US/docs/API/WebTelephony">Telephony</a> and <a href="https://developer.mozilla.org/en-US/docs/API/WebSMS" title="/en-US/docs/API/WebSMS">SMS</a> APIs talk to the radio interface, which is in the chrome process.</dd> -</dl> - -<h3 id="Example_Communicating_from_rild_to_the_DOM" style="line-height: 24px; letter-spacing: normal;">Example: Communicating from rild to the DOM</h3> - -<p>Let's take a look at an example of how the lower level parts of the system communicate with DOM code. When the modem receives an incoming call, it notifies <code>rild</code> using a proprietary mechanism. <code>rild</code> then prepares a message for its client according to the "open" protocol, which is described in <a href="https://github.com/mozilla-b2g/android-hardware-ril/blob/master/include/telephony/ril.h" title="https://github.com/mozilla-b2g/android-hardware-ril/blob/master/include/telephony/ril.h"><code>ril.h</code></a>. In the case of an incoming call, a<code>RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED</code> message is generated and sent by <code>rild</code> to<code>rilproxy</code>.</p> - -<p><code>rilproxy</code>, implemented in <a href="https://github.com/mozilla-b2g/rilproxy/blob/master/src/rilproxy.c" title="https://github.com/mozilla-b2g/rilproxy/blob/master/src/rilproxy.c"><code>rilproxy.c</code></a>, receives this message in its main loop, which polls its connection to <code>rild</code> using code like this:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">ret <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> <span class="function token">read<span class="punctuation token" style="color: #999999;">(</span></span>rilproxy_rw<span class="punctuation token" style="color: #999999;">,</span> data<span class="punctuation token" style="color: #999999;">,</span> <span class="number token" style="color: #990055;">1024</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - -<span class="keyword token" style="color: #0077aa;">if</span><span class="punctuation token" style="color: #999999;">(</span>ret > <span class="number token" style="color: #990055;">0</span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="function token">writeToSocket<span class="punctuation token" style="color: #999999;">(</span></span>rild_rw<span class="punctuation token" style="color: #999999;">,</span> data<span class="punctuation token" style="color: #999999;">,</span> ret<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<p>Once the message is received from <code>rild</code>, it's then forwarded along to Gecko on the socket that connects <code>rilproxy</code> to Gecko. Gecko receives the forwarded message on its <a href="https://dxr.mozilla.org/mozilla-central/source/ipc/ril/Ril.cpp" rel="custom">IPC thread</a>:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">int ret <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> <span class="function token">read<span class="punctuation token" style="color: #999999;">(</span></span>fd<span class="punctuation token" style="color: #999999;">,</span> mIncoming<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>>Data<span class="punctuation token" style="color: #999999;">,</span> <span class="number token" style="color: #990055;">1024</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span><span class="comment token" style="color: #708090; display: inherit;"> -// ... handle errors ... -</span>mIncoming<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>>mSize <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> ret<span class="punctuation token" style="color: #999999;">;</span> -sConsumer<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>><span class="function token">MessageReceived<span class="punctuation token" style="color: #999999;">(</span></span>mIncoming<span class="punctuation token" style="color: #999999;">.</span><span class="function token">forget<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<p>The consumer of these messages is <a href="https://dxr.mozilla.org/mozilla-central/source/dom/system/gonk/SystemWorkerManager.cpp" rel="custom">SystemWorkerManager</a>, which repackages the messages and dispatches them to the<code><a href="https://dxr.mozilla.org/mozilla-central/source/dom/system/gonk/ril_worker.js" rel="custom">ril_worker.js</a></code> thread that implements the RIL state machine; this is done in the<code>RILReceiver::MessageReceived()</code> method:</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">virtual void <span class="function token">MessageReceived<span class="punctuation token" style="color: #999999;">(</span></span>RilRawData <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">*</span>aMessage<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - nsRefPtr<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>DispatchRILEvent> <span class="function token">dre<span class="punctuation token" style="color: #999999;">(</span></span><span class="keyword token" style="color: #0077aa;">new</span> <span class="class-name token">DispatchRILEvent</span><span class="punctuation token" style="color: #999999;">(</span>aMessage<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - mDispatcher<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>><span class="function token">PostTask<span class="punctuation token" style="color: #999999;">(</span></span>dre<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<p>The task posted to that thread in turn calls the <code>onRILMessage()</code> function, which is implemented in JavaScript. This is done using the JavaScript API function<code><a href="https://developer.mozilla.org/en-US/docs/SpiderMonkey/JSAPI_Reference/JS_CallFunctionName" title="/en-US/docs/SpiderMonkey/JSAPI_Reference/JS_CallFunctionName">JS_CallFunctionName</a>()</code>:</p> - -<pre class="language-html" style="padding-top: 1em; padding-right: 1em; padding-bottom: 1em; padding-left: 1em; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;">return JS_CallFunctionName(aCx, obj, "onRILMessage", NS_ARRAY_LENGTH(argv), argv, argv);</pre> - -<p><code>onRILMessage()</code> is implemented in <a href="https://dxr.mozilla.org/mozilla-central/source/dom/system/gonk/ril_worker.js" rel="custom">dom/system/gonk/ril_worker.js</a>, which processes the message bytes and chops them into parcels. Each complete parcel is then dispatched to individual handler methods as appropriate:</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">handleParcel<span class="punctuation token" style="color: #999999;">:</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">handleParcel<span class="punctuation token" style="color: #999999;">(</span></span>request_type<span class="punctuation token" style="color: #999999;">,</span> length<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="keyword token" style="color: #0077aa;">let</span> method <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> this<span class="punctuation token" style="color: #999999;">[</span>request_type<span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span><span class="keyword token" style="color: #0077aa;">typeof</span> method <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">==</span> <span class="string token" style="color: #669900;">"function"</span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span>DEBUG<span class="punctuation token" style="color: #999999;">)</span> <span class="function token">debug<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">"Handling parcel as "</span> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">+</span> method<span class="punctuation token" style="color: #999999;">.</span>name<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - method<span class="punctuation token" style="color: #999999;">.</span><span class="function token">call<span class="punctuation token" style="color: #999999;">(</span></span>this<span class="punctuation token" style="color: #999999;">,</span> length<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<p>This code works by getting the request type from the object, making sure it's defined as a function in the JavaScript code, then calling the method. Since ril_worker.js implements each request type in a method given the same name as the request type, this is very simple.</p> - -<p>In our example, <code>RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED</code>, the following handler is called:</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">RIL<span class="punctuation token" style="color: #999999;">[</span>UNSOLICITED_RESPONSE_CALL_STATE_CHANGED<span class="punctuation token" style="color: #999999;">]</span> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">UNSOLICITED_RESPONSE_CALL_STATE_CHANGED<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - this<span class="punctuation token" style="color: #999999;">.</span><span class="function token">getCurrentCalls<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<p>As you see in the code above, when notification is received that the call state has changed, the state machine simply fetches the current call state by calling the<code>getCurrentCall()</code> method:</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">getCurrentCalls<span class="punctuation token" style="color: #999999;">:</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">getCurrentCalls<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - Buf<span class="punctuation token" style="color: #999999;">.</span><span class="function token">simpleRequest<span class="punctuation token" style="color: #999999;">(</span></span>REQUEST_GET_CURRENT_CALLS<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<p>This sends a request back to <code>rild</code> to request the state of all currently active calls. The request flows back along a similar path the <code>RIL_UNSOL_RESPONSE_CALL_STATE_CHANGED</code>message followed, but in the opposite direction (that is, from <code>ril_worker.js</code> to<code>SystemWorkerManager</code> to <code>Ril.cpp</code>, then <code>rilproxy</code> and finally to the <code>rild</code> socket). <code>rild</code>then responds in kind, back along the same path, eventually arriving in <code>ril_worker.js</code>'s handler for the <code>REQUEST_GET_CURRENT_CALLS</code> message. And thus bidirectional communication occurs.</p> - -<p>The call state is then processed and compared to the previous state; if there's a change of state, ril_worker.js notifies the <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIRadioInterfaceLayer" title="">nsIRadioInterfaceLayer</a></code> service on the main thread:</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">_handleChangedCallState<span class="punctuation token" style="color: #999999;">:</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">_handleChangedCallState<span class="punctuation token" style="color: #999999;">(</span></span>changedCall<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="keyword token" style="color: #0077aa;">let</span> message <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> <span class="punctuation token" style="color: #999999;">{</span>type<span class="punctuation token" style="color: #999999;">:</span> <span class="string token" style="color: #669900;">"callStateChange"</span><span class="punctuation token" style="color: #999999;">,</span> - call<span class="punctuation token" style="color: #999999;">:</span> changedCall<span class="punctuation token" style="color: #999999;">}</span><span class="punctuation token" style="color: #999999;">;</span> - this<span class="punctuation token" style="color: #999999;">.</span><span class="function token">sendDOMMessage<span class="punctuation token" style="color: #999999;">(</span></span>message<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<p><code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIRadioInterfaceLayer" title="">nsIRadioInterfaceLayer</a></code> is implemented in <a href="https://dxr.mozilla.org/mozilla-central/source/dom/system/gonk/RadioInterfaceLayer.js" rel="custom">dom/system/gonk/RadioInterfaceLayer.js</a>; the message is received by its<code>onmessage()</code> method:</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;"> onmessage<span class="punctuation token" style="color: #999999;">:</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">onmessage<span class="punctuation token" style="color: #999999;">(</span></span>event<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="keyword token" style="color: #0077aa;">let</span> message <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> event<span class="punctuation token" style="color: #999999;">.</span>data<span class="punctuation token" style="color: #999999;">;</span> - <span class="function token">debug<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">"Received message from worker: "</span> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">+</span> JSON<span class="punctuation token" style="color: #999999;">.</span><span class="function token">stringify<span class="punctuation token" style="color: #999999;">(</span></span>message<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - switch <span class="punctuation token" style="color: #999999;">(</span>message<span class="punctuation token" style="color: #999999;">.</span>type<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - case <span class="string token" style="color: #669900;">"callStateChange"</span><span class="punctuation token" style="color: #999999;">:</span> - <span class="comment token" style="color: #708090; display: inherit;"> // This one will handle its own notifications. -</span> this<span class="punctuation token" style="color: #999999;">.</span><span class="function token">handleCallStateChange<span class="punctuation token" style="color: #999999;">(</span></span>message<span class="punctuation token" style="color: #999999;">.</span>call<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">break</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">.</span><span class="punctuation token" style="color: #999999;">.</span><span class="punctuation token" style="color: #999999;">.</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 133px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 152px;"> </div> - -<p>All this really does is dispatch the message to the content process using the Parent Process Message Manager (PPMM):</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">handleCallStateChange<span class="punctuation token" style="color: #999999;">:</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">handleCallStateChange<span class="punctuation token" style="color: #999999;">(</span></span>call<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="punctuation token" style="color: #999999;">[</span>some internal state updating<span class="punctuation token" style="color: #999999;">]</span> - ppmm<span class="punctuation token" style="color: #999999;">.</span><span class="function token">sendAsyncMessage<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">"RIL:CallStateChanged"</span><span class="punctuation token" style="color: #999999;">,</span> call<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<p>In the content process, the message is received by <code>receiveMessage()</code> method in the <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIRILContentHelper" title="">nsIRILContentHelper</a></code> service, from the Child Process Message Manager (CPMM):</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">receiveMessage<span class="punctuation token" style="color: #999999;">:</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">receiveMessage<span class="punctuation token" style="color: #999999;">(</span></span>msg<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="keyword token" style="color: #0077aa;">let</span> request<span class="punctuation token" style="color: #999999;">;</span> - <span class="function token">debug<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">"Received message '"</span> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">+</span> msg<span class="punctuation token" style="color: #999999;">.</span>name <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">+</span> <span class="string token" style="color: #669900;">"': "</span> <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">+</span> JSON<span class="punctuation token" style="color: #999999;">.</span><span class="function token">stringify<span class="punctuation token" style="color: #999999;">(</span></span>msg<span class="punctuation token" style="color: #999999;">.</span>json<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - switch <span class="punctuation token" style="color: #999999;">(</span>msg<span class="punctuation token" style="color: #999999;">.</span>name<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - case <span class="string token" style="color: #669900;">"RIL:CallStateChanged"</span><span class="punctuation token" style="color: #999999;">:</span> - this<span class="punctuation token" style="color: #999999;">.</span><span class="function token">_deliverTelephonyCallback<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">"callStateChanged"</span><span class="punctuation token" style="color: #999999;">,</span> - <span class="punctuation token" style="color: #999999;">[</span>msg<span class="punctuation token" style="color: #999999;">.</span>json<span class="punctuation token" style="color: #999999;">.</span>callIndex<span class="punctuation token" style="color: #999999;">,</span> msg<span class="punctuation token" style="color: #999999;">.</span>json<span class="punctuation token" style="color: #999999;">.</span>state<span class="punctuation token" style="color: #999999;">,</span> - msg<span class="punctuation token" style="color: #999999;">.</span>json<span class="punctuation token" style="color: #999999;">.</span>number<span class="punctuation token" style="color: #999999;">,</span> msg<span class="punctuation token" style="color: #999999;">.</span>json<span class="punctuation token" style="color: #999999;">.</span>isActive<span class="punctuation token" style="color: #999999;">]</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">break</span><span class="punctuation token" style="color: #999999;">;</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 133px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 152px;"> </div> - -<p>This, in turn, calls the <code><a href="https://developer.mozilla.org/zh-CN/docs/XPCOM_Interface_Reference/nsIRILTelephonyCallback#callStateChanged()">nsIRILTelephonyCallback.callStateChanged()</a></code> methods on every registered telephony callback object. Every web application that accesses the <a href="/zh-CN/docs/Web/API/Window/navigator/mozTelephony" title="此页面仍未被本地化, 期待您的翻译!"><code>window.navigator.mozTelephony</code></a> API has registered one such callback object that dispatches events to the JavaScript code in the web application, either as a state change of an existing call object or a new <code>incoming</code> call event.</p> - -<pre class="brush:cpp; language-cpp" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-cpp" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">NS_IMETHODIMP Telephony<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">CallStateChanged<span class="punctuation token" style="color: #999999;">(</span></span>PRUint32 aCallIndex<span class="punctuation token" style="color: #999999;">,</span> PRUint16 aCallState<span class="punctuation token" style="color: #999999;">,</span> - const nsAString<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">&</span> aNumber<span class="punctuation token" style="color: #999999;">,</span> bool aIsActive<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="punctuation token" style="color: #999999;">[</span><span class="punctuation token" style="color: #999999;">.</span><span class="punctuation token" style="color: #999999;">.</span><span class="punctuation token" style="color: #999999;">.</span><span class="punctuation token" style="color: #999999;">]</span> - - <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span>modifiedCall<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - <span class="comment token" style="color: #708090; display: inherit;"> // Change state. -</span> modifiedCall<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>><span class="function token">ChangeState<span class="punctuation token" style="color: #999999;">(</span></span>aCallState<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - - <span class="comment token" style="color: #708090; display: inherit;"> // See if this should replace our current active call. -</span> <span class="keyword token" style="color: #0077aa;">if</span> <span class="punctuation token" style="color: #999999;">(</span>aIsActive<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - mActiveCall <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> modifiedCall<span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> - - <span class="keyword token" style="color: #0077aa;">return</span> NS_OK<span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> - - nsRefPtr<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>TelephonyCall> call <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> - TelephonyCall<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">Create<span class="punctuation token" style="color: #999999;">(</span></span>this<span class="punctuation token" style="color: #999999;">,</span> aNumber<span class="punctuation token" style="color: #999999;">,</span> aCallState<span class="punctuation token" style="color: #999999;">,</span> aCallIndex<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - nsRefPtr<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;"><</span>CallEvent> event <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> CallEvent<span class="punctuation token" style="color: #999999;">:</span><span class="punctuation token" style="color: #999999;">:</span><span class="function token">Create<span class="punctuation token" style="color: #999999;">(</span></span>call<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - nsresult rv <span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">=</span> event<span class="operator token" style="background-clip: initial; background-color: rgba(255, 255, 255, 0.496094); color: #a67f59;">-</span>><span class="function token">Dispatch<span class="punctuation token" style="color: #999999;">(</span></span><span class="function token">ToIDOMEventTarget<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">,</span> <span class="function token">NS_LITERAL_STRING<span class="punctuation token" style="color: #999999;">(</span></span><span class="string token" style="color: #669900;">"incoming"</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="function token">NS_ENSURE_SUCCESS<span class="punctuation token" style="color: #999999;">(</span></span>rv<span class="punctuation token" style="color: #999999;">,</span> rv<span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">return</span> NS_OK<span class="punctuation token" style="color: #999999;">;</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 133px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 152px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 171px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 190px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 209px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 228px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 247px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 266px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 285px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 304px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 323px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 342px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 361px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 380px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 399px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 418px;"> </div> - -<p>Applications can receive these events and update their user interface and so forth:</p> - -<pre class="brush:js; language-js" style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;"><code class="language-js" style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;">handleEvent<span class="punctuation token" style="color: #999999;">:</span> <span class="keyword token" style="color: #0077aa;">function</span> <span class="function token">fm_handleEvent<span class="punctuation token" style="color: #999999;">(</span></span>evt<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - switch <span class="punctuation token" style="color: #999999;">(</span>evt<span class="punctuation token" style="color: #999999;">.</span>call<span class="punctuation token" style="color: #999999;">.</span>state<span class="punctuation token" style="color: #999999;">)</span> <span class="punctuation token" style="color: #999999;">{</span> - case <span class="string token" style="color: #669900;">'connected'</span><span class="punctuation token" style="color: #999999;">:</span> - this<span class="punctuation token" style="color: #999999;">.</span><span class="function token">connected<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">break</span><span class="punctuation token" style="color: #999999;">;</span> - case <span class="string token" style="color: #669900;">'disconnected'</span><span class="punctuation token" style="color: #999999;">:</span> - this<span class="punctuation token" style="color: #999999;">.</span><span class="function token">disconnected<span class="punctuation token" style="color: #999999;">(</span></span><span class="punctuation token" style="color: #999999;">)</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="keyword token" style="color: #0077aa;">break</span><span class="punctuation token" style="color: #999999;">;</span> - default<span class="punctuation token" style="color: #999999;">:</span> - <span class="keyword token" style="color: #0077aa;">break</span><span class="punctuation token" style="color: #999999;">;</span> - <span class="punctuation token" style="color: #999999;">}</span> -<span class="punctuation token" style="color: #999999;">}</span></code></pre> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 38px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 57px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 76px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 95px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 114px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 133px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 152px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 171px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 190px;"> </div> - -<div class="line-number" style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 209px;"> </div> - -<p>Take a look at the implementation of <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/communications/dialer/js/dialer.js" title="https://github.com/mozilla-b2g/gaia/blob/master/apps/communications/dialer/js/dialer.js"><code>handleEvent()</code> in the Dialer application</a> as an extended example.</p> - -<h3 id="3G_data" style="line-height: 24px; letter-spacing: normal;">3G data</h3> - -<p>There is a RIL message that initiates a "data call" to the cellular service; this enables data transfer mode in the modem. This data call ends up creating and activating a <a href="https://zh.wikipedia.org/wiki/Point-to-Point Protocol" title="Point-to-Point Protocol">Point-to-Point Protocol</a> (PPP) interface device in the Linux kernel that can be configured using the usual interfaces.</p> - -<div class="note"> -<p><strong>Note:</strong> This section needs to be written.</p> -</div> - -<h3 id="Related_DOM_APIs" style="line-height: 24px; letter-spacing: normal;">Related DOM APIs</h3> - -<p>This section lists DOM APIs that are related to RIL communications:</p> - -<ul> - <li><a href="https://developer.mozilla.org/en-US/docs/API/WebTelephony/Introduction_to_WebTelephony" title="/en-US/docs/API/WebTelephony/Introduction_to_WebTelephony">Telephony API</a></li> - <li><a href="https://developer.mozilla.org/en-US/docs/API/WebSMS/Introduction_to_WebSMS" title="/en-US/docs/API/WebSMS/Introduction_to_WebSMS">SMS API</a></li> - <li>Mobile Connection API</li> -</ul> - -<h2 id="WiFi" style="margin-bottom: 20px; line-height: 30px;">WiFi</h2> - -<p>Firefox OS 的WIFI后台只是简单的借助 <code>wpa_supplicant</code> 来完成绝大部分工作。也就是说，后台的主要工作就是对 supplicant 的简单管理以及一些初始化的工作，如装载WiFi 驱动和使能或禁止网络接口。后台本质上只是一个跟随supplicant 状态而变化的状态机。</p> - -<div class="note"> -<p><strong>注意:</strong> 在WIFI中发生的绝大部分事情会取决于 <code>wpa_supplicant</code> 进程状态的变化。</p> -</div> - -<p>WIFI组件的实现可以分成两个文件：</p> - -<dl> - <dt><a href="https://dxr.mozilla.org/mozilla-central/source/dom/wifi/DOMWifiManager.js" rel="custom">dom/wifi/DOMWifiManager.js</a></dt> - <dd>实现了暴露给web 内容的API，这些API是定义在 <code><a href="/zh-CN/docs/Mozilla/Tech/XPCOM/Reference/Interface/nsIWifi.idl" title="">nsIWifi.idl</a></code>中的。</dd> - <dt><a href="https://dxr.mozilla.org/mozilla-central/source/dom/wifi/WifiWorker.js" rel="custom">dom/wifi/WifiWorker.js</a></dt> - <dd>实现了关于 supplicant 的状态机和驱动代码。</dd> -</dl> - -<p>这两个文件之间使用 <a href="https://developer.mozilla.org/en-US/docs/The_message_manager" title="/en-US/docs/The_message_manager">message manager</a> 通信。消息的后台监听需要特定的动作触发，如 "associate"， 当动作执行完成时也会返回一个消息。</p> - -<p>对响应方法的DOM侧监听与一些事件消息一样，都表示状态的变化和信息的更新。</p> - -<div class="note"> -<p><strong>Note:</strong> 任何同步的 DOM APIs 都是通过管道一侧的缓存数据实现的。如果可能的话，要尽量避免使用同步消息。</p> -</div> - -<h3 id="WifiWorker.js" style="line-height: 24px; letter-spacing: normal;">WifiWorker.js</h3> - -<p>This file implements the main logic behind the WiFi interface. It runs in the chrome process (in multi-process builds) and is instantiated by the SystemWorkerManager. The file is generally broken into two sections: a giant anonymous function and <code>WifiWorker</code>(and its prototype). The anonymous function ends up being the <code>WifiManager</code> by providing a local API, including notifications for events such as connection to the supplicant and scan results being available. In general, it contains little logic and lets its sole consumer control its actions while it simply responds with the requested information and controls the details of the connection with the supplicant.</p> - -<p>The <code>WifiWorker</code> object sits between the <code>WifiManager</code> and the DOM. It reacts to events and forwards them to the DOM; in turn, it receives requests from the DOM and performs the appropriate actions on the supplicant. It also maintains state information about the supplicant and what it needs to do next.</p> - -<h3 id="DOMWifiManager.js" style="line-height: 24px; letter-spacing: normal;">DOMWifiManager.js</h3> - -<p>This implements the DOM API, transmitting messages back and forth between callers and the actual WiFi worker. There's very little logic involved.</p> - -<div class="note"> -<p><strong>Note:</strong> In order to avoid synchronous messages to the chrome process, the WiFi Manager does need to cache the state based on the received event.</p> -</div> - -<p>There's a single synchronous message, which is sent at the time the DOM API is instantiated, in order to get the current state of the supplicant.</p> - -<h3 id="DHCP" style="line-height: 24px; letter-spacing: normal;">DHCP</h3> - -<p>DHCP and DNS are handled by <code>dhcpcd</code>, the standard Linux DHCP client. However, it's not able to react when the network connection is lost. Because of this, Firefox OS kills and restarts <code>dhcpcd</code> each time it connects to a given wireless network.</p> - -<p><code>dhcpcd</code> is also responsible for setting the default route; we call into the network manager to tell the kernel about DNS servers.</p> - -<h2 id="网络管理器" style="margin-bottom: 20px; line-height: 30px;">网络管理器</h2> - -<p>网络管理器会对由3G数据和WIFI组件打开的网络接口进行配置。</p> - -<div class="note"> -<p><strong>注意:</strong> 这部分内容需要完善。</p> -</div> - -<h2 id="进程和线程" style="margin-bottom: 20px; line-height: 30px;">进程和线程</h2> - -<p>Firefox OS 操作系统使用 POSIX 线程机制实现所有的应用线程，包括每个应用的主线程，Web workers和辅助线程。优先值是由标准的Linux内核调度程序决定用来表示进程和线程执行时的优先级。根据进程的状态不同，我们设定了不同的优先值。当前共有7个等级：</p> - -<p>进程优先级等级</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Priority</th> - <th scope="col">Nice</th> - <th scope="col">Used for</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>MASTER</code></td> - <td>0</td> - <td>b2g 主进程</td> - </tr> - <tr> - <td><code>FOREGROUND_HIGH</code></td> - <td>0</td> - <td>持有 CPU wakelock 的应用</td> - </tr> - <tr> - </tr> - <tr> - <td><code>FOREGROUND</code></td> - <td>1</td> - <td>前台应用</td> - </tr> - <tr> - <td><code>FOREGROUND_KEYBOARD</code></td> - <td>1</td> - <td>键盘应用</td> - </tr> - <tr> - <td><code>BACKGROUND_PERCEIVABLE</code></td> - <td>7</td> - <td>播放音乐的后台应用</td> - </tr> - <tr> - <td><code>BACKGROUND_HOMESCREEN</code></td> - <td>18</td> - <td>homescreen 应用</td> - </tr> - <tr> - <td><code>BACKGROUND</code></td> - <td>18</td> - <td>运行在后台的所有其他应用</td> - </tr> - </tbody> -</table> - -<p>有些等级优先值是相同的，这是因为这些等级是低内存查杀机制处理的方式是不同的。所有的优先级都可以在构建时通过参数配置进行调整。您可以在 <code><a href="http://hg.mozilla.org/mozilla-central/file/54e8c6492dc4/b2g/app/b2g.js#l610">b2g/app/b2g.js</a>文件中找到相关实体。</code></p> - -<div class="note"> -<p><strong>注意</strong>: 要获取更多关于内存溢出（out-of-memory killer）以及 Firefoex OS 是如何管理低内存状态的内容，可以参阅 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Out_of_memory_management_on_Firefox_OS">Out of memory management on Firefox OS</a>.</p> -</div> - -<p>在一个进程内部，主线程继承了进程的优先值，同时则给定了web worker线程比主线程高一个值的优先值。因此web worker 线程优先级与主线程相比要低一些。之所以这么做是为了避免 CPU密集性的工作降低主线程的处理速度。当比较重要的事件（如一个应用转到前台或后台，启动一个新的应用或一个已存在的应用获得 CPU wakelock）发生时，进程优先级就会发生变化。当一个进程优先级发生变化时，其中所有的线程优先级就会对应的作出调整。</p> - -<div class="note"> -<p><strong>注意:</strong> cgroups 当前并没有用于资源的管理，它们在特定的设备及内核中显得并不可靠。</p> -</div> - -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/platform/feature_support_chart/index.html b/files/zh-cn/archive/b2g_os/platform/feature_support_chart/index.html deleted file mode 100644 index 591d5e7bb6..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/feature_support_chart/index.html +++ /dev/null @@ -1,158 +0,0 @@ ---- -title: 功能支持图表 -slug: Archive/B2G_OS/Platform/Feature_support_chart -tags: - - B2G - - QA - - Testing -translation_of: Archive/B2G_OS/Platform/Feature_support_chart ---- -<p></p> -<div class="summary"> - <p><span class="seoSummary">这里有许多不同的 Firefox OS 编译版本，您可以选择下载或者由自己编译，在每个设备上所支持的功能都会有所区别。下面的图表则可以帮助我们理解在不同设备上所支持或不支持的功能。</span></p> -</div> -<table class="standard-table"> - <thead> - <tr> - <th scope="row">功能</th> - <th scope="col">设备</th> - <th scope="col">模拟器</th> - <th scope="col">桌面版本</th> - </tr> - </thead> - <tbody> - <tr> - <th scope="row">Dialer</th> - <td>All</td> - <td>UI only, no network</td> - <td>UI only, no network</td> - </tr> - <tr> - <th scope="row">Contacts</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">SMS</th> - <td>All</td> - <td>UI only, no network</td> - <td>UI only, no network</td> - </tr> - <tr> - <th scope="row">Camera</th> - <td>All</td> - <td>UI only, no camera support</td> - <td>UI only, unsure about desktop camera support at this time</td> - </tr> - <tr> - <th scope="row">Gallery</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Video</th> - <td>All</td> - <td>UI only</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Music</th> - <td>All</td> - <td> </td> - <td>All</td> - </tr> - <tr> - <th scope="row">FM Radio</th> - <td>All</td> - <td>All</td> - <td>UI only</td> - </tr> - <tr> - <th scope="row">Email</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Calculator</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Browser</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Marketplace</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Clock</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Calendar</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Home Screen</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Lock Screen</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Keyboard</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Task Manager</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">First-Run</th> - <td>All</td> - <td>?</td> - <td>?</td> - </tr> - <tr> - <th scope="row">Notification</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - <tr> - <th scope="row">Status Bar</th> - <td>All</td> - <td>一些网络状态不能被测试</td> - <td>一些网络状态不能被测试</td> - </tr> - <tr> - <th scope="row">Settings</th> - <td>All</td> - <td>All</td> - <td>All</td> - </tr> - </tbody> -</table> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/build_system_primer/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/build_system_primer/index.html deleted file mode 100644 index 85d101cf3a..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/build_system_primer/index.html +++ /dev/null @@ -1,68 +0,0 @@ ---- -title: 构建系统入门 -slug: Archive/B2G_OS/Platform/Gaia/Build_System_Primer -translation_of: Archive/B2G_OS/Developing_Gaia/Build_System_Primer ---- -<p><span style="font-weight: bold; background-color: rgb(244, 247, 248);">本文介绍了Gaia构建系统是如何工作的，包括</span><span style="padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; border-top-width: 0px; border-right-width: 0px; border-bottom-width: 0px; border-left-width: 0px; font-weight: bold; background-color: rgb(244, 247, 248);" class="seoSummary"> makefile, 构建过程，环境变量及潜在定制。 </span></p> -<p>在构建步骤中绝大多数有意义的工作都是由存放在Gaia子文件夹 <code>build/</code> 下的脚本执行的，它们主要是使用make, node.js ， <a href="https://developer.mozilla.org/en-US/docs/XPConnect/xpcshell" title="https://developer.mozilla.org/en-US/docs/XPConnect/xpcshell">XPCShell</a> (也称作JS Shell)以及 <a href="/zh-CN/docs/XULRunner">XULRunner [zh-CN]</a>执行的。Gaia构建系统中包含许多帮助工具，可以将webapp安装，测试，定位和打包到实际设备上。它同样允许开发者通过诸如更改默认壁纸，铃声，应用和设置的方式来对Gaia自定义。</p> -<h2 id="Makefile文件">Makefile文件</h2> -<p> Makefile文件中包含许多有用的命令，本节会对最有用的一些命令进行解释： </p> -<h4 id="install-gaia">install-gaia</h4> -<p>该命令会将Gaia层所有的应用推送到设备端。如果想要推送特定的应用，可以使用APP 标志位：</p> -<pre class="brush: bash">APP=calendar make install-gaia</pre> -<p>运行上面命令时所在的位置必须是Gaia apps 下的文件夹（例如 <code>apps</code>).</p> -<h4 id="reset-gaia">reset-gaia</h4> -<p>该命令会对设备中的应用进行清理并且在安装完成应用后会设置权限的默认值，除此之外与 <code>install-gaia 命令作用是相同的</code>. 在构建工程时，应用会存放在 <code>/data/local类似的目录</code>. 它同样也会将测试和调试的应用推送到手机中。</p> -<div class="warning"> - <p>注意: 如果在使用 <code>reset-gaia</code> 时加入 <code>APP</code> 环境变量，会使您的手机不可用（此时可以通过再次执行不带 <code>APP</code> 变量的命令恢复）. 因此请不要这样做.</p> -</div> -<h4 id="production">production</h4> -<p>该命令会将web应用安装在<span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">/system/b2g 下，而不是</span><span style="font-family: 'Courier New', 'Andale Mono', monospace; line-height: normal;">/data/local，除此之外与</span> <code>reset-gaia </code>作用是相同的。这个命令能够使您对user版本进行仿真，这个命令同样会将一系列的应用安装在user版本上<code>。</code></p> -<h4 id="sect1"> </h4> -<h3 style="line-height: 24px; letter-spacing: normal;" id="参考工作负载">参考工作负载</h3> -<p>These goals push variously sized workloads to the device, helping us with debugging and fixing the performance and scalability issues we might have. These goals accept the APP environment variable, or an APPS environment variable that should contain the app names separated by a space, e.g.,</p> -<pre style="padding-top: 1em; padding-right: 0px; padding-bottom: 1em; padding-left: 30px; border-left-width: 6px; font-family: Consolas, Monaco, 'Andale Mono', monospace; font-size: 14px; background-color: rgba(234, 239, 242, 0.246094); text-shadow: none; direction: ltr; text-align: left; white-space: normal;" class="brush: bash language-html"><code style="font-family: Consolas, Monaco, 'Andale Mono', monospace; color: inherit; text-shadow: none; direction: ltr; white-space: pre;" class="language-html">APP=sms make reference-workload-light -APPS="sms communications/contacts" make reference-workload-heavy</code></pre> -<div style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 0px;" class="line-number"> - </div> -<div style="margin-top: 1em; position: absolute; left: 0px; right: 0px; background-clip: initial; background-color: transparent; line-height: inherit; top: 19px;" class="line-number"> - </div> -<div class="note"> - <p><strong>注意：</strong> For more information, read <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Gaia/Hacking#Reference_Workloads">Hacking Gaia: Reference workloads</a>.</p> -</div> -<h3 id="环境变量">环境变量</h3> -<p>一些环境变量能够让你控制在设备上的构建与安装的一些方面：</p> -<h4 id="B2G_SYSTEM_APPS1">B2G_SYSTEM_APPS=1</h4> -<p>这个环境变量能够让你把应用推送到 <code>/system/b2g 而不是 /data/local</code>。 You should use that when you work with a user build. This variable is automatically set when running <code>make production</code>. This can be used for <code>install-gaia</code> or <code>reset-gaia</code> too.</p> -<h4 id="GAIA_OPTIMIZE1">GAIA_OPTIMIZE=1</h4> -<p>This triggers an optimization pass on the JavaScript files. This is automatically set when running <code>make production</code>. This can be used for <code>install-gaia</code> or <code>reset-gaia</code> too.</p> -<h4 id="PRODUCTION1">PRODUCTION=1</h4> -<p>This is basically an alias for <code>make production</code> (or is it the other way around ?).</p> -<h4 id="DEBUG1">DEBUG=1</h4> -<p>This lets you generate a debug profile to use with the <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests" title="/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests">unit tests</a> or to develop your Firefox OS app in Firefox. You must delete the existing profile directory before trying to generate a new one.</p> -<h4 id="GAIA_DEV_PIXELS_PER_PX1.5">GAIA_DEV_PIXELS_PER_PX=1.5</h4> -<p>This generates a profile suitable for running on WVGA devices.</p> -<h2 id="Customizing_the_preferences">Customizing the preferences</h2> -<p>If you find that you have a set of custom preferences you need to set each time you flash your device, create a file called <code>custom-prefs.js</code> inside the <code>build</code> directory and store them in there. This keeps them from being overwritten and out of source control.</p> -<p>Here are some useful preferences:</p> -<pre class="brush: js">// this enables marionette which lets you run performance tests -// see https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_performance_tests -user_pref("marionette.defaultPrefs.enabled", true); - -// this sets the port for remote debugging your application on the device -user_pref("devtools.debugger.remote-port", 60000); - -// this enables the remote debugger -user_pref("devtools.debugger.remote-enabled", true); - -// this outputs debug information about the Radio Interface Layer in logcat -user_pref("ril.debugging.enabled", true); -</pre> -<p>This file is read each time you generate a profile. The safest way to be sure that everything is generated is to delete your profile first:</p> -<pre class="brush: bash">rm -rf profile && make profile</pre> -<p>Then you can safely use the <code>install-gaia</code> goal.</p> -<h2 id="FAQ">FAQ</h2> -<h3 id="1)_The_device_remains_black_after_a_flash">1) The device remains black after a flash</h3> -<p>This can sometimes happen if you flash the device while it is idle. To remedy this just restart B2G by issuing the following command from the command line:</p> -<p>adb shell stop b2g && adb shell start b2g</p> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/browser/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/browser/index.html deleted file mode 100644 index 856090aaca..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/browser/index.html +++ /dev/null @@ -1,107 +0,0 @@ ---- -title: Browser -slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Browser -tags: - - Apps - - B2G - - Firefox OS - - Gaia - - 指南 - - 浏览器 -translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Browser ---- -<div class="summary"> - <p><span class="seoSummary"><a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/browser">Browser app</a> (当前是 System 的一部分) 提供了浏览器相关的功能 — 包括页面导航，搜索和书签。本文介绍了 Browser app 的基本工作以及它是如何融合进更大的 System中的。</span></p> -</div> -<p>由于 Gaia 运行 Gecko 的上层， 在基于 Gekco 实例之上，启动一个 Browser app/ System 浏览器进行常规的页面是非常容易做到的。它是由 <a href="https://developer.mozilla.org/en-US/docs/DOM/Using_the_Browser_API">mozBrowser API</a> 实现的。</p> -<div class="note"> - <p><b>注意</b>: Firefox OS 2.1 之后， Browser app 就是 System app 的一部分了。这意味着可以同时通过点击浏览器图标启动 Browser app 或通过全局搜索以及导航的能力来进行 web 浏览。 app 和 浏览器 tab 页此后会有共同的公共体验， 它们会作为 <a href="https://wiki.mozilla.org/FirefoxOS/Haida" style="text-decoration: underline;">Haida 用户体验</a> 的一部分，存在于任务管理器和表视图中（用于边缘手势）。</p> -</div> -<h2 id="System_浏览器_(浏览器框架)">System 浏览器 (浏览器框架)</h2> -<p>当 Firefox OS 用户将一个 web 页面添加为标签时， 它就会显示在 homescreen 上， 这个 web 页面后续就会打开 System 浏览器而不是 Browser app。在页面底部会有一个工具栏， 包括 向前/向后/刷新的功能。在 Gaia 中，它被称之为浏览器框架或包装器( wrapper)。您可以在下面图片的右手侧看到。</p> -<p><img alt="A diagram showing that when a web page is opened in the system browser, it is given a toolbar." src="https://mdn.mozillademos.org/files/7869/browser-app.png" style="width: 738px; height: 500px; display: block; margin: 0px auto;"></p> -<p>如果想要使您的 web 页面仍具有 后退/前进/刷新 的功能， 您可以在 app 表单文件中包含下面声明来使能浏览器框架。</p> -<pre class="brush: json">declare { chrome: { navigation: true } }</pre> -<div class="note"> - <p><b>注意</b>: 浏览器框架工具栏会影响到内容的高度，因此当在设计 web 页面布局时将其考虑进去。</p> -</div> -<h3 id="代码流程">代码流程</h3> -<p>当在 Firefox OS 中打开一个新的 web 页面时，调用流程如下</p> -<pre>Gecko > WrapperFactory > Window Manager > AppWindow > BrowserFrame</pre> -<p>Wrappers inheriting from <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/system/js/wrapper_factory.js">system/js/wrapper_factory</a> will receive the <code>mozbrowseropenwindow</code> event for a bookmarked web page.</p> -<p>In the <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/system/js/wrapper_factory.js#L15">handleEvent</a> section, the handler will check the event to decide whether the web page should be opened as an app or in browser chrome.</p> -<p>Finally, <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/system/js/wrapper_factory.js#L115">launchWrapper</a> is called to launch the corresponding window.</p> -<h2 id="全局搜索_导航">全局搜索 & 导航</h2> -<p>With the new search and navigation bar, users can get to their favorites, type in a URL, or discover a new app, from anywhere in Firefox OS. The search bar lives at the top of the screen, and users can just tap or swipe to open it.</p> -<p>Think of it as a combination of the <a href="https://support.mozilla.org/en-US/kb/awesome-bar-find-your-bookmarks-history-and-tabs">Awesome Bar</a> from the browser and the <a href="https://support.mozilla.org/en-US/kb/use-adaptive-search-discover-personalized-apps">adaptive app search</a> from the homescreen. Because Firefox OS uses web apps, when you find what you want, even if it’s a new app, it opens right away. You don’t need to install anything, because everything is instant and web—like.</p> -<h2 id="Browser_App">Browser App</h2> -<p>The Browser app is a certified webapp that provides a general web browser experience. The main function is located in <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/browser/js/browser.js">apps/browser/js/browser.js</a>:</p> -<pre class="brush: js">var Browser = { - init: function browser_init() { - this.getAllElements(); - ... - BrowserDB.init((function() { - ... - } - } -}; - -window.addEventListener('load', function browserOnLoad(evt) { - window.removeEventListener('load', browserOnLoad); - Browser.init(); -});</pre> -<p>The Browser will call its <code>init()</code> function while the DOM is loaded.</p> -<pre class="brush: js">getAllElements: function browser_getAllElements() { - var elementIDs = [ - 'toolbar—start', ... 'danger—dialog']; - - // Loop and add element with camel style name to Modal Dialog attribute. - elementIDs.forEach(function createElementRef(name) { - this[this.toCamelCase(name)] = document.getElementById(name); - }, this); -},</pre> -<p>The <code>getAllElements</code> function is used to get all camelCase element handlers, after which the <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/browser/js/browser_db.js">apps/browser/js/browser_db.js</a> is called, to prepare for adding the default search engine and bookmarks.</p> -<h2 id="书签">书签</h2> -<p>From Firefox OS 2.0 <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/bookmark">apps/bookmark</a> is used to handle bookmark save/remove activities.</p> -<p>The most interesting parts <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/bookmark/manifest.webapp">apps/bookmark/webapp.manifest</a> looks like so:</p> -<pre class="brush: json">"activities": { - "save—bookmark": { - "filters": { - "type": "url", - "url": { "required":true, "pattern":"https?:.{1,16384}" } - }, - "disposition": "inline", - "href": "/save.html", - "returnValue": true - }, - "remove—bookmark": { - "filters": { - "type": "url", - "url": { "required":true, "pattern":"https?:.{1,16384}" } - }, - "disposition": "inline", - "href": "/remove.html", - "returnValue": true - } -},</pre> -<p>As seen above, the activity is handled by save.html and remove.html. Both operations are delegated to <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/bookmark/js/activity_handler.js">apps/bookmark/js/activity_handler.js</a>:</p> -<pre class="brush: js">var ActivityHandler = { - 'save—bookmark': function ah_save(activity) { - }, - - 'remove—bookmark': function ah_remove(activity) { - } -}; - -navigator.mozSetMessageHandler('activity', function onActivity(activity) { - var name = activity.source.name; - switch (name) { - case 'save—bookmark': - case 'remove—bookmark': - if (activity.source.data.type === 'url') { - ActivityHandler[name](activity); - } - ... - } -}</pre> -<p>When the message handler listener <code>navigator.mozSetMessageHandler('activity')</code> receives the save-bookmark or remove-bookmark activities, the <code>ActivityHandler</code> function is triggered to handle correspondent operations.</p> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/index.html deleted file mode 100644 index c8a36a6477..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/index.html +++ /dev/null @@ -1,90 +0,0 @@ ---- -title: Gaia应用 -slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps -tags: - - Apps - - B2G - - Firefox OS - - Gaia - - 架构 -translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps ---- -<div class="summary"> - <p><span class="seoSummary">Gaia是Firefox OS 的前端， 它包括系统管理的功能以及附带在Firefox OS上的一些内置应用。所有的Gaia源代码(包括system和键盘IMEs)都完全由HTML5 ( HTML + CSS + JavaScript ) & 开放Web API实现的。 本文介绍了在Gaia家族工作的每一个可获得的应用的信息。</span></p> -</div> -<h2 id="Gaia_功能性分类">Gaia 功能性分类</h2> -<p>Gaia中的应用大致可分成下面几类。</p> -<div class="note"> - <p><b>注意：</b> 许多关于解释单个应用如何工作的页面都是链接自 <a href="https://github.com/mozilla-b2g/gaia/">Gaia Github repo</a> 中的README文件。这是因为许多app都处在快速开发周期内，会迅速的变化（通常是每天），因此如果使MDN页面根据这些变化快速的更新是没有什么意义的。工程师维护的README页面则是当前信息最准确的来源。</p> -</div> -<h3 id="平台">平台</h3> -<p>包括系统（System），设置（Settings）,锁屏（Lockscreen）,编译脚本(build scripts) 以及蓝牙(Bluetooth) 应用。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7503/platform_team.png" style="width: 355px; height: 269px; margin: 0px auto; display: block;"></p> -<h4 id="平台应用：进一步讲解">平台应用：进一步讲解</h4> -<dl> - <dt> - <a href="/zh-CN/Firefox_OS/Platform/Gaia/Gaia_apps/System">System</a></dt> - <dd> - System app是在<a href="/en-US/Firefox_OS/Platform/Architecture#Firefox_OS_bootup_procedure">Firefox OS启动过程</a>中由Gecko装载的第一个web应用。它会担负许多责任，一般都是系统运行所需要的，因此不会局限于对某一个web应用。</dd> - <dt> - <a href="/zh-CN/Firefox_OS/Platform/Gaia/Gaia_apps/Browser">Browser</a></dt> - <dd> - Browser app（当前是System 的一部分）会提供一些浏览器类似的功能—包括页面导航，搜索和书签等。</dd> - <dt> - <a href="/zh-CN/Firefox_OS/Platform/Gaia/Gaia_apps/Window_Management">Window Management</a></dt> - <dd> - Firefox OS的窗口管理功能 — 包括应用的生命周期和交互、通知、动画以及其他 — 是由System app的特定部分所处理的。本文会着眼于Firefox OS 窗口管理的细节问题。</dd> - <dt> - <a href="/zh-CN/Firefox_OS/Platform/Gaia/Gaia_apps/Settings">Settings</a></dt> - <dd> - Firefox OS 用户可以通过 Settings 应用来配置设备的设置信息，响应传入的活动（带有config名称的<a href="/en-US/docs/WebAPI/Web_Activities">Web activities</a>)，这种传入的活动可以使其他应用跳转到Settings应用的不同的界面来处理需要的配置（例如，当没有数据链接时，会显示wifi设置界面）。</dd> -</dl> -<dl> - <dt> - </dt> -</dl> -<h3 id="通信">通信</h3> -<p>包括 Dialer, Contact, SMS 以及 FTU应用.</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7499/comms_team.png" style="width: 317px; height: 246px; margin: 0px auto; display: block;"></p> -<h4 id="通信应用：进一步讲解">通信应用：进一步讲解</h4> -<p>TBD(有待讨论）</p> -<h3 id="生产力应用">生产力应用</h3> -<p>包括 Email, Calendar, 以及 Clock 应用。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7505/productivity_team.png" style="width: 303px; height: 178px; margin: 0px auto; display: block;"></p> -<h4 id="生产力应用：进一步讲解">生产力应用：进一步讲解</h4> -<dl> - <dt> - <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/calendar/README.md">Calendar</a></dt> - <dd> - Firefox OS内置的日历应用。</dd> - <dt> - <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/clock/README.md">Clock</a></dt> - <dd> - Firefox OS原生的始终应用，包括闹钟，定时器，跑表功能。</dd> - <dt> - <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/email/README.md">Email</a></dt> - <dd> - Gaia e-mail 应用。</dd> -</dl> -<h3 id="多媒体">多媒体</h3> -<p>包括相机(Camera), 图库(Gallery), 音乐播放器(Music), 视频播放器(Video)应用以及一些多媒体相关的功能比如DRM和壁纸(wallpapers)。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7501/media_team.png" style="width: 386px; height: 250px; margin: 0px auto; display: block;"></p> -<h4 id="多媒体：进一步讲解">多媒体：进一步讲解</h4> -<dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Gaia_apps/Video">Video</a></dt> - <dd> - Video 是视频播放应用，它能够播放在您Firefox OS 设备中存储的多媒体</dd> - <dt> - <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/camera/README.md">Camera</a></dt> - <dd> - 用户可以使用Camera来从设备摄像头中捕捉和管理视频和图片，而且还能够响应其他应用想要使用摄像头功能来获取多媒体时发出的<code>pick</code>类型的 <a href="/en-US/docs/WebAPI/Web_Activities">Web activitie</a>。</dd> -</dl> -<h3 id="其他的Gaia_功能">其他的Gaia 功能</h3> -<p>除了这些功能，还有其他一些主要的功能例如 browser, homescreen, marketplace, test framework, PDF viewer,以及 app manager，这些都是和Gaia一起紧密开发的。</p> -<dl> - <dt> - <a href="https://github.com/mozilla/pdf.js/blob/master/README.md">pdf.js</a></dt> - <dd> - pdf.js 是基于HTML5的PDF阅读器，用于在Gaia内阅读PDF文件。注意 pdf.js是在Gaia外一个独立的仓库维护的。</dd> -</dl> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/settings/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/settings/index.html deleted file mode 100644 index 2d14f5798f..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/settings/index.html +++ /dev/null @@ -1,78 +0,0 @@ ---- -title: 系统设置 (Settings) -slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Settings -translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Settings ---- -<div class="summary"> - <p><span class="seoSummary">Settings app 允许用户来配置设备的系统设置信息，同时会对传入的 activities作出响应，即允许app开发者在app中显示特定的settings 视图（例如， 如果没有有效的数据链接，显示 wifi设置面板）。本文主要讲述了它是如何工作的。</span></p> -</div> -<h2 id="mozSettings_API_和_Data_绑定">mozSettings API 和 Data 绑定</h2> -<p>从技术上讲， Settings app 是一个向用户提供对认证<a href="/en-US/docs/Web/API/Navigator.mozSettings"> window.navigator.mozSettings API</a> 访问的UI界面。</p> -<p> Settings app 会自动的处理基本的系统设置操作，如绑定数据字段和 mozSettings 值 — 所有基本操作，如勾选一项设置或改变输入值将会使相关的 mozSettings 值也会改变。</p> -<p><code>window.navigator.mozSettings</code> API 会从Gecko 中获取系统设置的数据。 使用方式如下所示：</p> -<pre class="brush: js">navigator.mozSettings.createLock().set(values);</pre> -<p>上面是设置数据信息。</p> -<div class="note"> - <p><strong>注意</strong>: 在读或写任何 <code>mozSettings</code>， 我们需要使用 <code>createLock()</code> 方法来锁定settings。</p> -</div> -<p>要检索数据，我们可以使用获取或设置一个回调函数的方式启动对数据的操作：</p> -<pre class="brush: js">var reqTimerGoBack = -window.navigator.mozSettings.createLock().get('icc.goBackTimeout'); -reqTimerGoBack.onsuccess = function icc_getTimerGoBackSuccess() { - goBackTimer.timeout = reqTimerGoBack.result['icc.goBackTimeout']; - ... -};</pre> -<p>数据会存储在一个名为 <code>instance.result</code> 词典下。</p> -<p>Firefox OS 2.0 开始, <code>mozSettings</code> 实例可以通过 <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/settings/js/modules/settings_cache.js">js/modules/settings_cache.js</a> 实例被重复使用：</p> -<pre class="brush: js">var SettingsCache = require('modules/settings_cache'); - -SettingsCache.getSettings(function(result){ - var onlineSupportTitle = result['support.onlinesupport.title']; - ... -});</pre> -<h2 id="导航">导航</h2> -<p>当用户打开 Settings app， 在概览页面会显示多个面板，这个页面则是一个功能性的独立页面。<code>SettingsService.navigate</code> (<a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/settings/js/modules/settings_service.js">js/module/settings_service.js</a>) 则会控制这些页面间的导航。</p> -<div class="note"> - <p><strong>注意</strong>: For legacy panels (which are not yet ported to the new structure), settings.currentPanel is used instead of SettingsService.navigate to navigate<br> - between panels.</p> -</div> -<p>Since Firefox OS will support tablet devices as well as mobiles, the Settings app has two different types of navigation model implemented:</p> -<ul> - <li>一列(手机端)</li> - <li>两列 (平板端)</li> -</ul> -<p>While called, <code>SettingsService.navigate</code> determines what navigation model to use via the following code:</p> -<pre class="brush: js">if (_isTabletAndLandscape()) { - PageTransitions.twoColumn(oldPanel, newPanel, callback); -} else { - PageTransitions.oneColumn(oldPanel, newPanel, callback); -}</pre> -<h2 id="面板">面板</h2> -<p>From Firefox OS 2.0 onwards, the basic panel structure is defined in <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/settings/js/modules/panel.js">js/modules/panel.js</a>. It defines six lifecycle stats:</p> -<ul> - <li><code>init</code></li> - <li><code>beforeShow</code></li> - <li><code>show</code></li> - <li><code>hide</code></li> - <li><code>beforeHide</code></li> - <li><code>uninit</code></li> -</ul> -<p>All new settings panels are inherited from <code>SettingsPanel</code>, which extends <code>Panel</code>’s functionalities. The code is contained in <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/settings/js/modules/settings_panel.js">js/modules/settings_panel.js</a>:</p> -<pre class="brush: js">onInit: function(panel, initOptions) { - ... - - PanelUtils.activate(panel); -}, - -onBeforeShow: function(panel, beforeShowOptions) { - // Preset the panel every time when it is presented. - PanelUtils.preset(panel); - _addListeners(panel); - ... -},</pre> -<p><code>PanelUtils.activate</code> — defined in <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/settings/js/modules/panel_utils.js">js/modules/panel_utils.js</a> — is used to parse all links in the panel and adds corresponding handlers in <code>onInit</code> stat, and <code>PanelUtils.preset</code> is used to preset elements with the settings values in the <code>onBeforeShow</code> stat.</p> -<p>All new settings panels are defined in the <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/settings/js/panels">js/panels</a> folder.</p> -<h2 id="AMD_模块和编译时间优化">AMD 模块和编译时间优化</h2> -<p>From Firefox OS 2.0 onwards, the Settings app uses the <a href="http://en.wikipedia.org/wiki/Asynchronous_module_definition">AMD modules pattern</a> to implement each panel. The AMD modules are loaded via <a href="https://github.com/requirejs/alameda">Alemeda</a> (a lighter version of <a href="http://requirejs.org/">RequireJS</a>) and built/optimized using <code>r.js</code> (the RequireJS optimizer). The Settings app still had dependencies on files (<a href="https://github.com/mozilla-b2g/gaia/tree/master/shared/js">shared/js</a>) which aren’t AMD modules. For those it uses the <code>shim</code> options defined in <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/settings/js/config/require.js">settings/js/config/require.js</a>.</p> -<h2 id="参考">参考</h2> -<p> <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/settings">Settings app has a build-in README</a> ，这个文件可以用来获取 Settings （大部分内容是由 Arthur Chen and Fred Lin 完成的）。</p> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/system/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/system/index.html deleted file mode 100644 index 853dd41fbb..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/system/index.html +++ /dev/null @@ -1,226 +0,0 @@ ---- -title: System -slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/System -translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/System ---- -<div class="summary"> - <p><span class="seoSummary">System app 是在 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Architecture#Firefox_OS_bootup_procedure">Firefox OS 启动过程</a> 中由Gecko装载的第一个 web 应用, 它会处理许多运行系统所需要的任务，因此不会局限于某一个单独的 web 应用。 这篇文档主要是讲解 Sytem如何工作。</span></p> -</div> -<blockquote> - <p>任何一个可以用 JavaScript 编写的应用， 会最终使用 JavaScript 构建的。 -- Atwood's Law</p> -</blockquote> -<div class="note"> - <p><b>注意</b>: 您可以在 Gaia Github 仓库中获取到 <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/system">source code for the System app</a></p> -</div> -<h2 id="system_app_是如何启动的">system app 是如何启动的</h2> -<p>当 Gecko 试图启动System应用时, 它会解析System's manifest.webapp 文件，并根据 <code style="font-style: normal;">launch_path </code>参数（该参数在Gaia应用中一般是 /index.html) 装载 index.html 文件。 要管理整个的移动系统，Sytem app需要装载很多资源文件。 </p> -<p>整个启动过程是从 <code>bootstrap.js </code>中的下面代码开始的： </p> -<pre class="brush: js">window.addEventListener('load', function startup() { -// define safelyLaunchFTU -function safelyLaunchFTU() { - ... -} - -if (Applications.ready) { - safelyLaunchFTU(); -} else { - ... -} - -window.addEventListener('ftudone', function doneWithFTU() { - window.removeEventListener('ftudone', doneWithFTU); - - var lock = window.navigator.mozSettings.createLock(); - lock.set({ - 'gaia.system.checkForUpdates': true - }); -} - - ... - -// With all important event handlers in place, we can now notify -// Gecko that we're ready for certain system services to send us -// messages (e.g. the radio). -var evt = new CustomEvent('mozContentEvent', -{ bubbles: true, cancelable: false, - detail: { type: 'system-message-listener-ready' } }); - window.dispatchEvent(evt); -}</pre> -<p>这段代码是这样工作的:</p> -<ol> - <li>System 是运行在浏览器引擎中真正的web应用， 并需要所有它依赖的资源都装载进去 — 包括 图片(images)和样式(styles)。 因此一旦 <a href="/zh-CN/docs/Web/API/Window/onload" title="此页面仍未被本地化, 期待您的翻译!"><code>window.onload</code></a> 事件触发， 我们就要开始这些工作。</li> - <li>首先，我们要使用 <span style="font-family: 'Courier New', 'Andale Mono', monospace;">safelyLaunchFTU() 函数</span>准备启动首次启动体验(FTU) 。顾名思义， 只有当用户首次启动 Firefox OS 时， FTU才会出现。</li> - <li>当用户在 FTU中点击 “完成” 时， 会启动 <span style="font-family: 'Courier New', 'Andale Mono', monospace;">ftudone </span>自定义事件， <code>bootstrap.js</code> 会监听和处理这个事件。</li> - <li>下一步， 我们会使用 <a href="/zh-CN/docs/Web/API/Settings" title="此页面仍未被本地化, 期待您的翻译!"><code>Settings</code></a> API (<code>navigator.mozSettings</code>) 将 <code>gaia.system.checkForUpdates</code> 设置成 <code>true</code>, 表示系统会检查更新。</li> - <li>最后，我们会通过 <span style="font-family: 'Courier New', 'Andale Mono', monospace;">CustomEvent </span>运行自定义的 <code>window.dispatchEvent</code>。这是Gaia 使用的一个非常重要的设计模式， 用于系统消息的处理以及与Gecko层的通信。上面方法是指 Gaia System app 通知 Gecko层， 它已经准备好监听和处理事件了。 </li> -</ol> -<h2 id="实现模块化">实现模块化</h2> -<p>为了实现更好的模块化和灵活性，system 应用本身也在不断的改进。 从1.4 版本开始， 专门发起了一个关于 <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=912952">refactor the system module as instantiable object</a> 的倡议来讨论该问题。</p> -<p>在所有上述代码运行后，每个对 <code style="font-style: normal;">bootstrap.js</code> 中的系统组件的引用都是是如下的形式：</p> -<pre class="brush: js">window.telephonySettings = new TelephonySettings(); -window.telephonySettings.start();</pre> -<p> <code>TelephonySettings()</code> 的源代码框架如下：</p> -<pre class="brush: js">(function(exports) { - 'use strict'; - function TelephonySettings() { - this.init_param = false; - } - - TelephonySettings.prototype = { - // Initialzes all settings. - start: function() { - ... - }, - - // Clean all settings. - stop: function() { - ... - }, - - 1st_method: function ts_1st_method() { - ... - }, - - 2nd_method: function ts_2nd_method() { - ... - } - }; - - exports.TelephonySettings = TelephonySettings; - -}(window));</pre> -<p>这种模式可以帮助每个系统组件实现模块化，并使它们的可测性更强。</p> -<h2 id="开机和关机动画">开机和关机动画</h2> -<p>本部分会讲解 System app是如何控制开机动画和关机动画的。 <code>init_logo_handler.js</code> 和 <code>sleep_menu.js</code> 文件会对 system 开机动画和关机动画进行处理。</p> -<h3 id="开机动画">开机动画</h3> -<p>开机动画当前并没有包含在主引导程序中，而是要借助于检查 <code style="font-style: normal;">EventListeners。</code></p> -<p>在 <code>init_logo_handler.js</code> 文件中的开机启动代码如下所示：</p> -<p>一旦Gecko准备将一些东西画在屏幕上时， 会选择 logo或者是动画。当DOM装载完成时， 我们会运行合适的系统处理程序来完成log或动画。当 <span style="font-family: 'Courier New', 'Andale Mono', monospace;">ftudone 或者 </span><span style="font-family: 'Courier New', 'Andale Mono', monospace;">ftuskip </span>运行时会将logo隐藏。 包含在 <code>init_logo_handler.js 中的</code> <code style="font-style: normal;">_appendCarrierPowerOn</code> 方法表示了如何通过监听<span style="font-family: 'Courier New', 'Andale Mono', monospace;">DOMContentLoaded</span>事件来启动动画或启动logo。<code>logoLoader</code> 方法则在 <code>logo_loader.js 中定义。</code></p> -<pre class="brush: js">var self = this; -document.addEventListener('DOMContentLoaded', function() { - self.carrierLogo.appendChild(self.logoLoader.element); - self._setReady(); -});</pre> -<p>一旦准备好 logo, 系统会调用 <code>_setReady()</code> 方法, 在方法中会建立一个监听器来监听特殊的 <code>mozChromeEvent事件，这个事件会带有</code> <code>system-first-paint</code> 类型，表示系统系统已经准备好向屏幕绘图。</p> -<pre class="brush: js">var elem = this.logoLoader.element; - ... -window.addEventListener('mozChromeEvent', function startVideo(e) { - if (e.detail.type == 'system-first-paint') { - window.removeEventListener('mozChromeEvent', startVideo); - if (elem &amp;&amp; elem.ended === false) { - elem.play(); - } - } -});</pre> -<p>此时图形元素开始运行。一旦启动 <code>ftuopen</code> 或 <code>ftuskip</code> 事件， <code>init_logo_handler.js</code> 会调用默认的 <code>handleEvent()</code> 方法反过来触发 <code>animate()</code> 方法来以淡出的效果隐藏动画。</p> -<pre class="brush: js">init: function ilh_init(logoLoader) { - window.addEventListener('ftuopen', this); - window.addEventListener('ftuskip', this); - ... -}, - -handleEvent: function ilh_handleEvent() { - this.animate(); -},</pre> -<h3 id="关机动画">关机动画</h3> -<p>当系统准备就绪时，长按电源(power)按键，会触发定义在 <code style="font-style: normal;">hardware_button.js 文件中的 </code><code>holdsleep</code> 事件。 <code style="font-style: normal;">hardware_button.js 文件会处理所有“物理按键点击“的事件，包括电源（休眠）键，home键，音量增/减键等。</code></p> -<pre class="brush: js">HardwareButtonsSleepState.prototype.enter = function() { - this.timer = setTimeout(function() { - / * When the user holds Sleep button more than HOLD_INTERVAL. */ - this.hardwareButtons.publish('holdsleep'); - this.hardwareButtons.setState('base'); - }.bind(this), this.hardwareButtons.HOLD_INTERVAL); -};</pre> -<p>关机动画是由 <code>sleep_menu.js 处理的</code>;这个脚本文件会监听 <code>holdsleep</code> 事件，并且当它触发时会显示菜单对话框。</p> -<pre class="brush: js">init: function sm_init() { - ... - window.addEventListener('holdsleep', this.show.bind(this)); - ... -}</pre> -<p>如果用户通过重启和关机菜单选项选择关机，会触发 <code>startPowerOff()</code> 方法， 它反过来会触发 <code>LogoLoader()</code> 函数来对关机动画进行处理。</p> -<pre class="brush: js">handleEvent: function sm_handleEvent(evt) { - switch (evt.type) { - case 'click': - ... - this.handler(action); - break; - ... - } -} - -handler: function sm_handler(action) { - switch (action) { - ... - case 'restart': - this.startPowerOff(true); - break; - - case 'power': - this.startPowerOff(false); - break; - ... - } -}</pre> -<h2 id="System_的功能">System 的功能</h2> -<p> System app 会负责许多功能和任务, 你可能还会对能在其职权范围内找到而惊讶。系统应用负责的范围包括：状态栏（ statusbar）和 实用工具盘管理（utility tray management）， SIM卡锁（SIM lock）， 更新管理（update manager）， 主屏幕启动（homescreen launcher），webapp 窗口管理（webapp window） 等。 本节会对System 提供的一些最重要的功能进行探究。</p> -<h3 id="状态栏（Statusbar）和实用工具盘（utility_tray）">状态栏（Statusbar）和实用工具盘（utility tray）</h3> -<p>系统状态栏和下拉菜单 (Gaia 通常称之为 <em>utility tray</em>; Android 称之为<em> notification bar</em>) 是由 <code>statusbar.js</code> 和 <code>utility_tray.js </code>来处理的。 在应用的 <code>index.html 中，状态栏条目是在</code> <code><div id="statusbar" data-z-index-level="statusbar"></code> 中定义的，而实用工具盘条目在下面的结构中定义：</p> -<pre class="brush: html"><div id="utility-tray" data-z-index-level="utility-tray"> - <div id="notifications-container"> - ... - </div> -</div></pre> -<p>实用工具盘（utility tray）中会有一些特殊的面板，如更新管理器，紧急回调管理器，存储监视通知，媒体播放通知和控制，蓝牙传输状态，按键输入法(IME)切换。与之相关联的处理程序和样式放置在 <code>js</code>/ 和<code>style/</code> 文件夹中。</p> -<h3 id="特殊的应用launcher">特殊的应用launcher</h3> -<p>System app 有三个特殊的launchers, 在需要时会调用单独的web应用程序。</p> -<ul> - <li>主屏幕启动器 : Homescreen 应用在运行时，当用户按下 Home 按钮，webapp 崩溃或者使用其他方式退出webapp时，都会显示主屏幕。</li> - <li>锁屏启动器: 运行 lockscreen 应用时， 每次当用户打开屏幕时都会显示锁屏界面。</li> - <li> FTU 启动器: 运行FTU 体验应用。这个应用只会在用户使用一个全新的 FirefoxOS设备（或者将设备恢复到出厂模式）时运行一次。而且 FTU webapp不会允许用户点击Home按键退出这个应用。</li> -</ul> -<h3 id="锁屏">锁屏</h3> -<p>Lockscreen app 的主要入口文件是 <code>system/js/lockscreen.js</code>。用户可以在这个界面解锁，启动相机以及音乐播放器。</p> -<h3 id="紧急拨号器">紧急拨号器</h3> -<p>紧急拨号器的代码是在 <code>gaia/apps/system/emergency-call/</code> 文件夹下的。 它是拨号应用的简化版本，允许用户可以访问 <a href="#SIM_PIN_unlock_dialog">SIM PIN unlock dialog</a> 实现紧急拨号服务。</p> -<h2 id="全系统（System-wide）UI">全系统（System-wide）UI</h2> -<p>System应用会处理绝大多数的全系统（system-wide） UI， 其中大部分包括的是一些对话框，如音量警告对话框，SIM PIN解锁对话框，小区广播(cell broadcast)对话框，还包括一些影响窗口行为的UI元素，如 software home按键。</p> -<h3 id="z-index_level">z-index level</h3> -<p>在System 应用的 <code>index.html</code> 文件中,许多组件都带有 <code>data-z-index-level</code> 属性，例如</p> -<pre class="brush: html"><div id="sleep-menu" data-z-index-level="sleep-menu"> - ... -</div></pre> -<p>对应 z-index-levels 定义在 <code>system/style/zindex.css 文件中，如</code></p> -<pre class="brush: css">#screen > [data-z-index-level="sleep-menu"] { - z-index: 65536; -} - -... - -#screen > [data-z-index-level="app"] > .appWindow { - z-index: 3; -}</pre> -<p>z-index 设置是根据元素在屏幕上显示的顺序进行排列的 — 如果元素需要在视觉层次中比较高的元素数值也会较高。这就是System app在基本水平上窗口管理的方式。 </p> -<h3 id="software_home_按键">software home 按键</h3> -<p> software home 按键是 home按键的一种替代，会在缺少物理 home按键的情况下自动启动。例如在 Nexus 4 中。 要控制它的外观，Gecko提供了一个专有的媒体功能称为 <code>-moz-physical-home-button，</code> 它能够在媒体查询时使用基于硬件Home按键的外观。 如果需要，窗口管理会为 <code>software home</code>按键分配一些屏幕的空间。</p> -<p>在 <code>system/style/window.css</code> (以及许多其他的系统样式文件中), 可以看到</p> -<pre class="brush: css">@media not all and (-moz-physical-home-button) { - #screen:not(.software-button-disabled) > #windows > .appWindow { - bottom: 5rem; - } - }</pre> -<h3 id="Home_手势_(从屏幕底部向上滑动)">Home 手势 (从屏幕底部向上滑动)</h3> -<p>home 手势是另外一个硬件home按键的替代；它可以在 <a href="/en-US/Firefox_OS/Debugging/Developer_settings">开发者设置</a> 中使能，而控制代码在 <code>system/js/home_gesture.js 文件中。例如，这个手势涉及到从屏幕底部清扫，可以用来关闭应用。</code></p> -<p>这个手势能够在 Firefox OS 平板设备中自动使能。 而 <code>gaia/shared/js/screen_layout.js</code> 是专门用于检测设备是否是平板的。</p> -<h3 id="音量警告对话框">音量警告对话框</h3> -<p>在 <code>system/js/sound_manager.js</code>. 中包含控制音量警告对话框的代码。如果下面所有条件都满足，则会弹出音量警告对话框：</p> -<ul> - <li>耳机已插入设备</li> - <li>已超过最大音量限值 85dB </li> - <li>声道音频中有内容播放</li> -</ul> -<h3 id="SIM_PIN_解锁对话框">SIM PIN 解锁对话框</h3> -<p>控制SIM PIN 解锁对话框的代码在 <code>system/js/simcard_dialog.js 中</code> — 当Passcode lock选项使能时，对话框会在锁屏界面显示。开放的应用必须要在 <code style="font-style: normal;">manifest.webapp</code> 中包含 telephony 权限中（System app中含有该权限）。</p> -<div class="note"> - <p><b>注意</b>: 当手机在飞行模式时，不会显示SIM PIN 解锁对话框</p> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/window_management/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/window_management/index.html deleted file mode 100644 index c0871e3130..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/gaia_apps/window_management/index.html +++ /dev/null @@ -1,279 +0,0 @@ ---- -title: 窗口管理（Window Management） -slug: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Window_Management -translation_of: Archive/B2G_OS/Platform/Gaia/Gaia_apps/Window_Management ---- -<div class="summary"> - <p><span class="seoSummary">一般来说，window manager 是应用的一部分，会在图形用户界面中控制窗口的放置和外观。本文会对Firefox OS是如何进行窗口管理的内容进行探究。</span></p> -</div> -<p>Firefox OS中， Window Management是System app的一部分，主要负责：</p> -<ul> - <li>App的生命周期以及app之间的交互。 </li> - <li>UI 元素的布局，调整，显示及动画/切换</li> - <li>全系统的UI逻辑，包括 web activities, app 消息, 以及任务管理（task manager）</li> - <li>App-指定的UI特性如弹出框，情景菜单和错误页面。 </li> -</ul> -<p>在深入理解上述条目的细节前，让我们来看下应用是如何在Gaia内部启动的。 </p> -<h2 id="App在Gaia中的启动">App在Gaia中的启动</h2> -<p>app在 Firefox OS 中的启动有几种方式，例如，通过其他app的系统消息，或者在HomeScreen中点击app图标等。 </p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7709/app-launch-flow.png" style="width: 728px; height: 414px; display: block; margin: 0px auto;"></p> -<p>控制app开启的事件是由 Gecko引擎和 System App 处理的，下面会有详细阐述。</p> -<h3 id="App_结构">App 结构</h3> -<p>所有的 Gaia webapps 都是 <a href="/en-US/Marketplace/Publishing/Packaged_apps">packaged apps</a>，它们都是基本的zip文件，其中会包含所有的应用程序文件： HTML, CSS, JavaScript, images, manifest, 等等。每个在 Gaia 中的 web 应用都会以下面 的基本结构进行组织： </p> -<div class="code-block"> - <div class="highlight"> - <pre><code class="brush: bash">apps</code><code class="o">/</code><code class="p">[</code><code class="n">app</code> <code class="n">name</code><code class="p">]</code><code class="o">/</code> - <code class="o">-</code> <code class="n">js</code> - <code class="o">-</code> <code class="n">styles</code> - <code class="o">-</code> <code class="n">locales</code> - <code class="o">-</code> <code class="n">test</code> - <code class="o">-</code> <code class="n">index</code><code class="p">.</code><code class="n">html</code> - <code class="o">-</code> <code class="n">manifest</code><code class="p">.</code><code class="n">webapp</code> -</pre> - </div> -</div> -<p><img alt="" src="https://mdn.mozillademos.org/files/7497/app_load_process.png" style="width: 2262px; height: 1979px; margin: 0px auto; display: block;"></p> -<p>当一个内嵌的Gaia app 从 homescreen 启动时，Gecko 会试图打开 URL 地址 <code>manifest://[app name].gaiamobile.org:8080， 解析对应的</code> <code>manifest.webapp</code> 文件，之后运行文件中 <code>launch_path </code>指定的文件 — 在所有内嵌 webapp中都是 <code>index.html</code> 。<code>index.html</code> 文件会加载所有需要的样式和 JavaScript。</p> -<div class="note"> - <p><b>注意 </b>: 此处有一个非正式的约定，Gaia app的主要 js 入口点一般是 <code>[app name].js</code> 或 <code>main.js</code>.</p> -</div> -<h3 id="App启动次序">App启动次序</h3> -<p>启动事件会发给Gecko。一旦 Gecko 准备就绪， <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/system/js/app_window_factory.js">system/js/app_window_factory.js</a> 文件中的 <code>AppwindowFactory</code> 就会收到一个 app的 <code>webapps-launch</code> 事件或一个用于处理挂起消息的 <code>open-app </code>事件。</p> -<pre class="brush: js">window.addEventListener('applicationready', function appReady(e) { - window.removeEventListener('applicationready', appReady); - window.addEventListener('webapps-launch', self); - window.addEventListener('webapps-close', self); - window.addEventListener('open-app', self); -});</pre> -<p><span style="background-color: #ffff00;">关于 handleEvent 动作的细节， </span><code><span style="background-color: #ffff00;">this.launch(config)</span></code><span style="background-color: #ffff00;"> 会启动一个 app window 或 activity。一旦app关闭， </span><code><span style="background-color: #ffff00;">Appwindow</span></code><span style="background-color: #ffff00;"> 会收到 </span><code><span style="background-color: #ffff00;">webapps-close</span></code><span style="background-color: #ffff00;"> 事件。</span></p> -<p>主进程中的 <code>launch()</code> 方法如下：</p> -<pre class="brush: js">var app = AppWindowManager.getApp(config.origin); -if (app) { - app.reviveBrowser(); -} else if (config.origin !== homescreenLauncher.origin) { - new AppWindow(config); -} else if (config.origin == homescreenLauncher.origin) { - homescreenLauncher.getHomescreen().ensure(); -}</pre> -<p>首先，会检查 app 变量是否存在并试图到Gecko 中恢复app的运行。否则，如果是常规的app，我们会创建一个关于 app 的 <code>AppWindow</code> 实例。另一个特殊的情况是 <code>homescreenLauncher</code> — 此时我们会执行一些必要的操作。</p> -<h3 id="AppWindow">AppWindow</h3> -<p>Firefox OS 会使用专门的 <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Browser">mozBrowser API</a> 使 web 页面看起来像一个 app。 窗口管理的核心只是使用 <code>mozBrowser</code> API 封装来处理 内部的 iFrames (窗口)。之所以创建这个特殊的 <code>moz-browser</code> 类型，主要是为了使iFrame 看起来更像一个真实的浏览器窗口。</p> -<p><code>AppWindow</code> 可以创建，容纳以及管理 <code>mozBrowser</code> iFrame。<code>AppWindow</code> 可以操控所有由 <code>mozBrowser</code> iFrame 本身触发的 <code>mozBrowser</code> 事件并且还可以显示相关的UI特性。</p> -<h2 id="App_生命周期管理">App 生命周期管理</h2> -<p>app整个的生命周期如下：</p> -<ul> - <li>App launch</li> - <li>将 iframe 添加到 System DOM tree中</li> - <li>Start App 开启动画</li> - <li>App opened</li> - <li>App close 动画</li> - <li>App closed</li> - <li>从 DOM tree 中移除 iframe</li> - <li>App terminated</li> -</ul> -<h3 id="启动_app">启动 app</h3> -<p>当用户点击 homescreen 上的应用图标时，homescreen 会使用 <a href="/en-US/docs/Web/API/Navigator.mozApps">mozApps API</a> 来通知 Gecko 引擎打开对应的app。当Gecko 准备就绪时，它会发送一个适当的事件给 system app。</p> -<h3 id="Killing_apps">Killing apps</h3> -<p>在下面情况下，App 将会被 kill 掉：</p> -<ul> - <li>app crashes</li> - <li><a href="https://developer.mozilla.org/en-US/Firefox_OS/Debugging/Debugging_OOMs#Process_priorities">OOM killer</a> kills it</li> - <li>app 由任务管理器关闭</li> - <li><code>window.close()</code> 被调用</li> -</ul> -<p>对于活动的应用程序而言，在关闭动画后，被 kill app 的 iFrame 就会从 DOM tree中移除。 对于不活动的应用程序，在它们被kill 后， 对应的 iframe 就会立刻移除。</p> -<p>在下面情况下，Apps 会被中断：</p> -<ul> - <li>对于web activities来说: 当activity 调用者被打开时</li> - <li>弹出框 (Popups): 当 window.open 调用者被打开时</li> - <li>App: 不做任何事情时</li> -</ul> -<h3 id="重启_app">重启 app</h3> -<p>在下面情况下， Apps 会被重启：</p> -<ul> - <li>homescreen app: 当按下 home 键时</li> - <li>如果是从任务管理器打开或通过边缘手势滑动(正在实验中的功能)，Zombie apps 会通过同样的URL复活，</li> -</ul> -<h2 id="app是如何被渲染的">app是如何被渲染的</h2> -<p>在启动一个app时，屏幕会分为下面几部分：</p> -<ul> - <li>System header</li> - <li>App iframe</li> - <li>底部包装栏 (如果在浏览器框架模式下)</li> -</ul> -<p><img alt="" src="https://mdn.mozillademos.org/files/7711/app-window-layout.png" style="width: 393px; height: 348px; display: block; margin: 0px auto;"></p> -<h3 id="App_布局">App 布局</h3> -<p>应用 iframe 的主要容器如下：</p> -<pre class="brush: html"><iframe id="browser2" mozallowfullscreen="true" mozbrowser="true" remote="true"... -... src="", data-url="" data-frame-type="window" data-frame-origin="..."> -</iframe></pre> -<p>iframe 中包括：</p> -<ul> - <li>启动路径(<code>data-url</code>, <code>data-frame-origin</code>)</li> - <li>mozbrowser iframe 属性 (<code>mozallowfullscreen="true"</code>, <code>mozbrowser="true"</code>)</li> - <li>容器，覆盖视窗，app指定UI</li> -</ul> -<h3 id="调整_AppWindow大小">调整 AppWindow大小</h3> -<p>AppWindow 会在下面几种情况下被调整：</p> -<ul> - <li> system app 只有在转屏时才会调整大小。</li> - <li>对于一般的 app, 在下列情况下会调整大小： - <ul> - <li>system app 调整大小</li> - <li>keyboard 开启/关闭 动画结束时</li> - <li>状态栏变化时</li> - <li><code>window.resizedBy()</code> 或 <code>window.resizeTo()</code> 被调用时</li> - <li>software home 按钮被选中时</li> - </ul> - </li> -</ul> -<p><img alt="" src="https://mdn.mozillademos.org/files/7713/app-area.png" style="width: 715px; height: 305px; margin: 0px auto; display: block;"></p> -<p>总之，屏幕的大小会受到下面要素的影响：</p> -<ul> - <li>Orientation 状态</li> - <li>Keyboard 状态</li> - <li>AttentionScreen 状态 (被呼叫，有短信等)</li> - <li>Chrome 导航状态</li> - <li>全屏状态 <code>manifest.fullscreen</code> / <code>parentWindow</code></li> - <li>Software homebutton 状态</li> -</ul> -<p><img alt="" src="https://mdn.mozillademos.org/files/7715/app-area2.png" style="width: 687px; height: 330px; margin: 0px auto; display: block;"></p> -<h3 id="AppWindow_方向">AppWindow 方向</h3> -<p>app 的方向可以由每个单独的app或由系统全局控制。您可以在 <code>manifest.webapp</code> 中使用 <code>orientation</code> 属性来设置方向。例如</p> -<pre class="brush: json">"orientation": "default",</pre> -<p>您也可以使用orientation API 来锁定和解锁方向：</p> -<pre class="brush: js">screen.mozLockOrientation([‘portrait-primary’]); - -screen.mozUnlockOrientation();</pre> -<p>可以用下面的属性值来强制对方向进行设定：</p> -<ul> - <li><code>default</code>: 系统默认方向</li> - <li><code>portrait</code>: 强制屏幕竖直方向显示</li> - <li><code>landscape</code>: 强制屏幕横向显示</li> -</ul> -<p>要获取更多的细节，请参考 <a href="/en-US/docs/Web/API/Screen.lockOrientation">Screen.lockOrientation</a> , 您也可以在 <a href="https://github.com/mozilla-b2g/gaia/blob/master/test_apps/uitest/js/API/orientation.js">gaia/test_apps/uitest/js/API/orientation.js</a>. 查看设定的实例。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7717/app-orientation.png" style="width: 745px; height: 530px; margin: 0px auto; display: block;"></p> -<h3 id="App_可见性">App 可见性</h3> -<p>只有当关掉屏幕时， System app 才会到后台；而正常的 app 到后台要依赖下面几个因素：</p> -<ul> - <li>Audio competing</li> - <li>Process policy</li> - <li>Rendering</li> -</ul> -<div class="note"> - <p><strong>注意</strong>: 当父 iframe 页面非活动时，页面可见性会被继承。</p> -</div> -<p>在下面情况下，APP通常会在前台运行：</p> -<ul> - <li>启动动画开始时</li> - <li>滑动（Swipe-in）动画结束时</li> - <li>锁屏界面被解锁时</li> -</ul> -<p>下面情况下，App 通常会在后台运行：</p> -<ul> - <li>关闭动画结束时</li> - <li>呼叫屏幕(callscreen)显示3秒之后</li> - <li>屏幕关闭时</li> -</ul> -<p>对上面的规则而言，有一些意外的情况：</p> -<ul> - <li>在正常渠道下，伴有音频播放的Active app</li> - <li>Apps 调用内嵌的 web activities</li> - <li>Apps 打开 <code>window.open('', '', 'dialog')</code></li> -</ul> -<div class="note"> - <p><strong>注意</strong>: 此处的 Active app 是指当前正在前台运行的应用；而 inactive app是指挡在后台运行的应用（界面不可见）。</p> -</div> -<h3 id="AppWindow_动画和过渡">AppWindow 动画和过渡</h3> -<p>为了让用户获得更顺畅的使用体验，Gaia 的窗口管理器(Window Manager)也会提供 app window 动画和过渡效果。</p> -<p> AppWindow 动画和过渡效果是由下面的状态来管理的：</p> -<ul> - <li><code>displayedApp</code> — 当前的 App</li> - <li><code>runningApps</code> / <code>numRunningApps</code> — 运行的app集合</li> - <li><code>openFrame</code> / <code>closeFrame</code> — 打开/关闭动画的过渡框架</li> -</ul> -<p>在调用 <code>setDisplayedApp()</code> 方法时, app 会通过下图中列出的状态来启动。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7719/app-animations-state-manchine.png" style="width: 704px; height: 358px; display: block; margin: 0px auto;"></p> -<p>在控制 Firefox OS app动画流程时，有下面几个技巧：</p> -<ul> - <li>在 app opened 之前，我们要确认它已经从后台状态中恢复。 我们通常会取一个 1 x 1 截屏来进行重绘。</li> - <li>在 app 准备好 opened 时， 我们会同时执行当前 app 关闭的动画和下一个 app 启动的动画。</li> - <li>在 app opening 和 closing 期间，我们会运行代码对转屏进行锁定和解锁。</li> - <li>仅仅当 app resized 一次之后， 在 opening 时，我们才会运行代码执行 app resize 操作；否则，我们会忽略 resizing 步骤。</li> - <li>我们在改变页面的可见性时，会再次使用 1 x 1 截屏（请看上面）。</li> -</ul> -<p><img alt="" src="https://mdn.mozillademos.org/files/7721/app-switching-flow.png" style="width: 530px; height: 258px; display: block; margin: 0px auto;"></p> -<h2 id="AppWindow_特定UI">AppWindow 特定UI</h2> -<p>有一些特定的 UI 元素只和特定的 app 相关，如 Browser chrome, modal dialogs, context menus, popups, 以及 error pages.</p> -<p>下面让我们来讨论下。</p> -<h3 id="弹出框（Modal_dialogs）">弹出框（Modal dialogs）</h3> -<p>在 desktop Firefox 中,，如果您启动了浏览器开发面板， 在其中输入如 <code>alert()</code>, <code>confirm()或</code> <code>prompt()</code> 等命令，就会在屏幕中心弹出一个对话框，并遮盖了下面的内容。Firefox OS 中的 modle dialogs 和这个效果是相同的。<br> - <br> - <img alt="" src="https://mdn.mozillademos.org/files/7723/modal-dialogs.png" style="width: 715px; height: 357px; margin: 0px auto; display: block;"></p> -<h3 id="快捷菜单（Context_menu）对话框">快捷菜单（Context menu）对话框</h3> -<p>移动开发者都会非常熟悉 快捷菜单(或长按菜单)。一般在设计app时，为了使用户能够更简便的使用 app，最常用的用户动作应该是对用户可见的。我们可以将一些无法直接放置在UI上，但又经常使用的动作放在快捷菜单中。<br> - <br> - <img alt="" src="https://mdn.mozillademos.org/files/7725/context-menu-dialogs.png" style="width: 722px; height: 360px; display: block; margin: 0px auto;"></p> -<h3 id="授权（Authentication）_(https)_对话框">授权（Authentication） (https) 对话框</h3> -<p>定义在 <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/system/js/app_authentication_dialog.js">system/js/app_authentication_dialog.js</a> 文件中。</p> -<h3 id="值选择，时间，日期对话框">值选择，时间，日期对话框</h3> -<p>定义在 <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps/system/js/value_selector">system/js/value_selector/</a>.</p> -<h3 id="权限对话框">权限对话框</h3> -<p>定义在 <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/system/js/permission_manager.js">system/js/permission_manager.js</a> 和 <a href="https://github.com/mozilla-b2g/gaia/blob/master/apps/system/js/media_recording.js">system/js/media_recording.js</a> 文件。</p> -<h2 id="特定应用">特定应用</h2> -<p>有些应用需要一个特殊的 <code>appWindow</code> 对象来处理它们包含的特定功能。其中包括：</p> -<ul> - <li>Homescreen</li> - <li>FTU</li> - <li>Keyboard</li> - <li>Cost control</li> - <li>Secure camera</li> - <li>Lockscreen</li> -</ul> -<h2 id="子窗口管理">子窗口管理</h2> -<p>子窗口是由 其他 app/pages 直接或间接打开的。如：</p> -<ul> - <li>Attention window</li> - <li>Popup window</li> - <li>Activity window</li> - <li>Trusted UI / Trusted window</li> -</ul> -<p>当子窗口被正常终止时，它的父窗口应该被重新打开。有些自窗口可会也会包含其他的子窗口。父窗口与子窗口间进程优先级的管理也是一个问题。</p> -<h2 id="视窗(Attention_Window)">视窗(Attention Window)</h2> -<p>Attention Windows 用来获取用户的注意力：</p> -<ul> - <li>拨号界面 — dialer</li> - <li>时钟界面 — clock</li> - <li>权限确认界面</li> -</ul> -<p>当前这些 attention window 都是被强制使用的默认方向(竖向优先)。</p> -<h2 id="委托（Trusted)_UI">委托（Trusted) UI</h2> -<p>Persona 和 mozPay API 使用的时委托 UI。它们使用特定的尺寸sizing: 80% 显示。在 trusted UI 运行时Homescreen是部分显示的。<br> - <br> - <img alt="" src="https://mdn.mozillademos.org/files/7727/trusted-ui.png" style="width: 737px; height: 516px; display: block; margin: 0px auto;"></p> -<h2 id="历史记录管理_（History_Management）">历史记录管理 （History Management）</h2> -<p>本节我们会讲解一些可以在 Firefox 中管理历史记录的组件。</p> -<h3 id="任务管理器">任务管理器</h3> -<p>任务管理器 Task manager (card 视图) 可通过长按 home 按钮触发。它会显示设备上的app历史，此时可以动态的kill一个app。</p> -<h3 id="Web_activity_处理">Web activity 处理</h3> -<p>内嵌 Activities 会创建一个新的引用页面为 activity 提供数据。<br> - <br> - Window Activities 会重复使用已存在的app window 来反映 acitivity 数据。</p> -<h3 id="边缘手势_(测试中)">边缘手势 (测试中)</h3> -<p>这个测试的边缘手势动能在 Firefox 2.0+ 开发模式版本才存在，它会允许您使用手动滑动 设备的 右/左边缘来在app和web页面之间切换。</p> -<h4 id="How_is_the_next_app_to_display_chosen">How is the next app to display chosen?</h4> -<ul> - <li>Child window of the active app</li> - <li>Launch time is newer</li> - <li>Find the head window of the next app stack</li> -</ul> -<h4 id="How_is_the_previous_app_chosen">How is the previous app chosen?</h4> -<ul> - <li>Parent window of the active app</li> - <li>Launch time is older</li> - <li>Find the rear window of the previous app stack</li> -</ul> -<h3 id="截屏管理">截屏管理</h3> -<p>截屏工具会被 任务管理器（卡片视图）所使用，来显示历史记录中的app。当app 关闭动画结束时， 就会获取到一个app的屏幕截图。</p> -<h2 id="参考">参考</h2> -<p><a href="http://alivedise.github.io/blog/2013/02/23/from-browser-to-browser/">From Browser to Browser</a></p> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/hacking/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/hacking/index.html deleted file mode 100644 index 6c3633a7a5..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/hacking/index.html +++ /dev/null @@ -1,542 +0,0 @@ ---- -title: Hacking Gaia -slug: Archive/B2G_OS/Platform/Gaia/Hacking -translation_of: Firefox_OS/Developing_Gaia ---- -<div class="warning"> -<p>该页面是为Gaia开发者写的。如果您在寻找关于如何编译和运行Firefox OS 的信息，可以参考 <a href="/zh-CN/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS" title="/zh-CN/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS">Building and installing Firefox OS page</a> .</p> -</div> - -<div class="summary"> -<p><span class="seoSummary">Gaia 是<a href="https://developer.mozilla.org/apps" rel="nofollow">web apps</a> 的集合，并且由它组合成 <a href="https://developer.mozilla.org/zh-CN/docs/Mozilla/Firefox_OS">Firefox OS</a>的前端. 在Firefox OS 屏幕上看到的都是由Web技术构建的。其中包括主屏幕和所有的原生app。本文则提供了修改Gaia代码的详细说明。</span></p> -</div> - -<h2 id="获取源码">获取源码</h2> - -<p>要获取Gaia的源码, <a href="https://github.com/mozilla-b2g/gaia" title="https://github.com/mozilla-b2g/gaia">fork us on GitHub</a> 并且使用 <a href="http://git-scm.com/" title="http://git-scm.com/">git</a> 将您fork的代码clone到本地。</p> - -<pre>$ git clone https://github.com/mozilla-b2g/gaia.git</pre> - -<h2 id="运行Gaia">运行Gaia</h2> - -<p>有三种方式可以运行Gaia，分别是在桌面，火狐浏览器或者兼容的移动设备。</p> - -<h3 id="B2G_桌面">B2G 桌面</h3> - -<p>B2G 桌面是在Firefox OS设备上运行应用程序的桌面版本，您可以使用它在电脑桌面上运行Gaia。</p> - -<p>您可以从<a href="http://nightly.mozilla.org/">Firefox Nightly站点</a>上下载<a href="http://nightly.mozilla.org/#Desktop%20Boot2Gecko">B2G桌面的nightly版本</a>。其中有关于Linux (32位 and 64 位), Mac OS X 以及 Windows的版本.</p> - -<p>Nightly 版本都会对近期的gaia版本打包。一旦您下载完成压缩包，只需要解压到文件夹中，并从解压到的文件夹中运行b2g二进制文件就可以了。 </p> - -<pre>$ cd b2g -$ ./b2g</pre> - -<p>如果您出于开发的目的来运行带有指定版本Gaia的B2G， 则需要从您clone的代码位置构建一个配置文件：</p> - -<pre>$ cd /path/to/gaia -$ DEBUG=1 DESKTOP=0 make</pre> - -<p>上面的命令会在<code>gaia</code> 生成一个名称为<code>profile</code>的文件夹。 <code>DEBUG选项会将</code> Gaia 作为托管的应用在内置的Web服务器上运行，而不是在每次更改后都需要重新打包的原生应用。在运行上面的命令后，您可以在最后的输出行中找到配置文件夹的路径，大体是 </p> - -<pre>Profile Ready: please run [b2g|firefox] -profile /path/to/gaia/profile</pre> - -<p>之后则可以指定配置文件来运行B2G。</p> - -<pre>$ ./b2g /path/to/gaia/profile</pre> - -<p>您用可以从源码中编译出自身的B2G桌面。</p> - -<div class="note"> -<p><strong>注意 :</strong> 在 Mac OS X, <code>b2g</code> 二进制文件会存在于 B2G.app.您需要运行下面命令:</p> - -<p><code>./B2G.app/Contents/MacOS/b2g /path/to/gaia/profile</code></p> -</div> - -<h3 id="在Firefox中运行Gaia">在Firefox中运行Gaia</h3> - -<p>也可以在Firefox内部运行Gaia。这种方式会让您的开发周期大大缩短，同时也可以使用标准的web开发工具和调试器。 可以参考<a href="/zh-CN/docs/Mozilla/Firefox_OS/Developing_Firefox_OS/Quickstart_guide_to_Gaia_development">Gaia开发快速指南</a> 获取更多的信息.</p> - -<h3 id="在设备上运行Gaia">在设备上运行Gaia</h3> - -<p>如果您有一个兼容的移动设备，也可以使用Firefox OS 烧机来运行Gaia。您可以参考<a href="/zh-CN/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS">编译和安装Firefox OS </a>获取更多信息. 我们也有关于<a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing">如何测试Firefox OS</a>的文章。</p> - -<h2 id="单元测试">单元测试</h2> - -<p>参考<a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests">Gaia单元测试</a> 来获取如何创建和在Gaia层运行单元测试的文章。</p> - -<h2 id="提交bug">提交bug</h2> - -<p>在Bugzilla的 <a href="https://bugzilla.mozilla.org/buglist.cgi?product=Firefox OS&component=Gaia&resolution=---" rel="nofollow">Firefox OS > Gaia</a> 中提交bug。在<a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox_OS">Gaia组件</a> (或者是子组件)中提交bug.</p> - -<h2 id="为_Gaia做贡献">为 Gaia做贡献</h2> - -<p>Mozilla依赖开源社区的贡献，以帮助开发Gaia应用，我们也希望您能参与进来。</p> - -<p>我们可以从一些非常好的网址来发现一些bug：</p> - -<ul> - <li><a href="https://bugzilla.mozilla.org/buglist.cgi?quicksearch=component:gaia%20sw:polish%20@nobody;list_id=4566236" rel="nofollow">Unowned Gaia polish bugs on Bugzilla</a></li> - <li><a href="http://www.joshmatthews.net/bugsahoy/?b2g=1" rel="nofollow">Mentored bugs</a></li> -</ul> - -<h3 id="编码风格基本知识">编码风格基本知识</h3> - -<ul> - <li>背景： - <ul> - <li><a href="/zh-CN/docs/Developer_Guide/Coding_Style#General_practices" title="Developer_Guide/Coding_Style#General_practices">Coding Style: General practices</a></li> - <li><a href="/zh-CN/docs/Developer_Guide/Coding_Style#JavaScript_practices" title="Developer_Guide/Coding_Style#JavaScript_practices">Coding Style: JavaScript practices</a></li> - <li><a href="/zh-CN/docs/Developer_Guide/Coding_Style#Naming_and_formatting_guide" title="Developer_Guide/Coding_Style#Naming_and_formatting_guide">Coding Style: Naming and formatting guide</a></li> - </ul> - </li> - <li>Make sure HTML files are declared <code><!DOCTYPE html></code> (that is, as HTML5 documents). If you don't, Internet Explorer 9 and later will load them in compatibility mode.</li> - <li>Include the <code>"use strict";</code> statement (just like that, including the quotes) to the top of your JavaScript files to put them into strict mode.</li> - <li>Always use two spaces for indentation, rather than tabs.</li> - <li>Please use line breaks to separate logical bits of code!</li> - <li>Multi-word file names should use the "underscore" character to separate words, <code>like_this.js</code>.</li> - <li>Use single quotes instead of double quotes for strings.</li> -</ul> - -<h4 id="Additional_rules">Additional rules</h4> - -<p>Bad:</p> - -<pre>if (expression) doSomething(); -</pre> - -<p>Correct:</p> - -<pre>if (expression) { - doSomething(); -} -</pre> - -<p>If you're working on the system app, check out the guidance listed <a href="https://groups.google.com/d/msg/mozilla.dev.gaia/rEhSrw6XmT4/UNvE7qW9pgYJ" title="See_here_for_some_rules._https://groups.google.com/d/msg/mozilla.dev.gaia/rEhSrw6XmT4/UNvE7qW9pgYJ">here</a>.</p> - -<p>Before submitting a patch we recommend you run <a href="https://developers.google.com/closure/utilities/docs/linter_howto" title="http://closure-linter.googlecode.com/svn/trunk/closure_linter/gjslint.py">gjslint</a> on it to check for any style errors:</p> - -<pre>gjslint --nojsdoc my_file.js</pre> - -<h3 id="提交一个_patch">提交一个 patch</h3> - -<p>First file or assign a bug to yourself on <a href="https://bugzilla.mozilla.org/buglist.cgi?product=Firefox OS&component=Gaia&resolution=---" title="https://bugzilla.mozilla.org/buglist.cgi?product=Firefox OS&component=Gaia&resolution=---">Bugzilla</a>, you'll need a Bugzilla account.</p> - -<p>Then create a branch on your fork of Gaia:</p> - -<pre>$ git branch branchname -$ git checkout branchname</pre> - -<p>Commit your changes:</p> - -<pre>$ git add /file/to/add -$ git commit -m "Bug XXXXX - Fix the broken Gaia and save the world"</pre> - -<p>Push your branch:</p> - -<pre>$ git push origin branchname</pre> - -<p>Send a pull request by navigating to the branch in your fork on GitHub and finding the pull request button.</p> - -<div class="note"> -<p><strong>Note</strong>: Except under unusual circumstances, patches should be landing first on the master branch, not a release branch like v1-train, v1.3, etc. If they need to land on a release branch, they must go through the usual approval process as outlined on the <a href="https://wiki.mozilla.org/Release_Management/B2G_Landing">B2G Landing wiki page</a>.</p> -</div> - -<p>To request a review of your patch, <a href="http://globau.wordpress.com/2013/10/21/github-pull-requests-and-bugzilla/">attach the pull request</a> to the bug in Bugzilla by referencing the URL of the pull request, and set the review ("r") flag to "?" and enter the bugzilla ID of one of the <a href="https://wiki.mozilla.org/Modules/FirefoxOS" title="https://wiki.mozilla.org/Modules/FirefoxOS">module owners and peers</a> (very important - otherwise your bug will not likely be seen by anyone). The <a href="https://addons.mozilla.org/zh-CN/firefox/addon/github-tweaks-for-bugzilla/" title="https://addons.mozilla.org/zh-CN/firefox/addon/github-tweaks-for-bugzilla/">Github tweaks for bugzilla extension on AMO</a> can help automate this process by automatically creating the attachment and adding it to the bug; you will still need to set the review flag on Bugzilla.</p> - -<p>The reviewer may ask you to make some changes; you may need to amend the original commit and force push it to the original branch/pull request. Once they're happy with your patch, they will merge it into the master branch for you. Before they do this they would prefer it if you could squash all your changes into a single commit, so your contribution can be tracked easily.</p> - -<p>The person who merges the commit (usually the reviewer) would add a <code>r=</code> flag in the comment of the merge commit.</p> - -<h2 id="Make_选项">Make 选项</h2> - -<p>you use the <code>make</code> command inside the Gaia repo to create a Gaia profile that can be loaded onto your device or run in a <a href="/zh-CN/Firefox_OS/Using_the_B2G_desktop_client">B2G Desktop</a> build. This section looks in detail at the different make options available.</p> - -<p>There are many environment variables present in the Makefile. Do not depend on them as they may be removed in the future.</p> - -<p>Created profiles are stored in <code>/gaia/profile</code>, and contain the following items:</p> - -<ul> - <li>defaults: Directory containing default settings to be reloaded after you reset the phone.</li> - <li>extensions: Directory containing extensions.</li> - <li>settings.json: Settings file.</li> - <li>user.js: Another file containing more settings/preferences.</li> - <li>webapps: Directory containing all the web apps that are to be installed on the phone.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: When you've already made a profile and you want to build a new one, you must delete the existing profile directory before trying to generate a new one.</p> -</div> - -<h3 id="Default">Default</h3> - -<pre class="brush: bash">make</pre> - -<p>This simply gives you an unbranded, non-debug build. For a branded build build you need to use <a href="#Official_Mozilla_branding_make">Official Mozilla branding make</a>; for a debug build you need <a href="#Debug_make">Debug make</a>.</p> - -<h3 id="推送到设备端">推送到设备端</h3> - -<pre class="brush: bash">make install-gaia - -make reset-gaia -</pre> - -<p>With <a href="/zh-CN/Firefox_OS/Debugging/Installing_ADB">ADB</a> (Android Debug Bridge) setup, these make targets will push Gaia to the device. <code>install-gaia</code> will just push updates of Gaia from your working directory to your device. <code>reset-gaia</code> will purge all existing configuration, profiles, web apps and database entries (a new settings database will be initialized) before pushing Gaia.</p> - -<h3 id="编译特定的应用">编译特定的应用</h3> - -<pre class="brush: bash">APP=system make - -APP=system make install-gaia</pre> - -<p>When a profile already exists, <code>APP</code> allows you to specify which app to re-package, instead of re-packing and re-pushing all the Gaia apps.</p> - -<h3 id="指定自定义的配置文件夹">指定自定义的配置文件夹</h3> - -<p>You can specify a custom directory to build your profile in, using <code>PROFILE_FOLDER</code>, for example:</p> - -<pre class="brush: bash">PROFILE_FOLDER=profile-b2g-desktop make</pre> - -<h3 id="不同设备的编译">不同设备的编译</h3> - -<p>There are a few make options that create builds for different devices, with different purposes.</p> - -<h4 id="Create_a_phone_build_of_Gaia">Create a phone build of Gaia</h4> - -<pre class="brush: bash">GAIA_DEVICE_TYPE=phone make</pre> - -<p>This build gets apps from <code>/gaia/build/config/phone/apps-engineering.list</code>.</p> - -<h4 id="Create_a_tablet_build_of_Gaia">Create a tablet build of Gaia</h4> - -<pre class="brush: bash">GAIA_DEVICE_TYPE=tablet make</pre> - -<p>This build gets apps from <code>/gaia/build/config/phone/apps-engineering.list</code>.</p> - -<h3 id="不同类型的编译">不同类型的编译</h3> - -<p>There are a few make options that create different types of build, with different purposes.</p> - -<h4 id="Production_make">Production make</h4> - -<pre class="brush: bash">PRODUCTION=1 make</pre> - -<p>This creates a production build of Gaia:</p> - -<ul> - <li>Gaia is run as packaged apps, which are harder to debug, but are the best available state for apps in terms of available API permissions, etc.</li> - <li>Test apps are not included in the build</li> - <li>Remote debugging is turned off by default</li> - <li>Lock screen is turned on (which in turn will cut USB connections)</li> - <li>Marionette is turned off</li> - <li>First time user experience is turned on</li> - <li>Offline cache is used.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: You can also use the alias <code>make production</code>.</p> -</div> - -<h4 id="Debug_make">Debug make</h4> - -<pre class="brush: bash">DEBUG=1 make</pre> - -<p>The <code>DEBUG</code> variable runs Gaia as hosted apps on a built-in web server on a specific <code>GAIA_PORT</code>, rather than the default of packaged apps which have to be re-packaged after every change; this makes things easier to test. Launching the profile with the latest Firefox Nightly will also give you nice B2G specific panels on the Firefox Developer Tools.</p> - -<p>In addition:</p> - -<ul> - <li>Test apps are included in the build.</li> - <li>Remote debugging is turned on by default.</li> - <li>Lock screen is turned off (USB connections won't be interrupted.)</li> - <li><a href="/zh-CN/docs/Mozilla/QA/Marionette">Marionette</a> is turned on, which is needed when running Gaia <a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests" title="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Testing/Gaia_unit_tests">unit tests</a>.</li> - <li>First time user experience is turned off.</li> - <li>Offline cache is not used, even if it is generated.</li> -</ul> - -<h4 id="Device_debug_make">Device debug make</h4> - -<pre class="brush: bash">DEVICE_DEBUG=1 make</pre> - -<p>This disables screen lock on the device, and enables debugging with the ADB tool, so is useful for device debugging.</p> - -<p>In Firefox OS version > 1.2, specify this param when you want to debug Firefox OS webapps with the <a href="/zh-CN/Firefox_OS/Using_the_App_Manager">App Manager</a>.</p> - -<h4 id="Debug_desktop_make">Debug desktop make</h4> - -<pre class="brush: bash">DEBUG=1 DESKTOP=0 make</pre> - -<p>This option creates a desktop debug version, for running inside <a href="/zh-CN/Firefox_OS/Using_the_B2G_desktop_client">B2G desktop</a>.</p> - -<h4 id="Official_Mozilla_branding_make">Official Mozilla branding make</h4> - -<pre class="brush: bash">MOZILLA_OFFICIAL=1 make</pre> - -<p>Use this to make an official Mozilla-branded build.</p> - -<h4 id="Dogfood_make">Dogfood make</h4> - -<pre class="brush: bash">DOGFOOD=1 make</pre> - -<p>Dogfooding options and utilities are turned on, for example the Feedback app, which allows doog fooders to easily submit feedback on the OS.</p> - -<h4 id="System_apps_make">System apps make</h4> - -<pre class="brush: bash">B2G_SYSTEM_APPS=1 make</pre> - -<p>This environment variable lets you push an app to <code>/system/b2g</code> instead of <code>/data/local</code>. You should use this when you work with a user build. This variable is automatically set when running <code>make production</code>. This can be used for <code>install-gaia</code> or <code>reset-gaia</code> too.</p> - -<h4 id="Distribution_and_market_customization_build">Distribution and market customization build</h4> - -<pre class="brush: bash">GAIA_DISTRIBUTION_DIR=./dir</pre> - -<div class="note"> -<p><strong>Note</strong>: Read <a href="/zh-CN/Firefox_OS/Hacking_Firefox_OS/Market_customizations_guide">Market Customizations</a> for more details.</p> -</div> - -<h3 id="开发调试选项">开发/调试选项</h3> - -<p>There are also make options for adding/removing features or changing settings, for debugging purposes.</p> - -<h4 id="Enable_remote_debugging">Enable remote debugging</h4> - -<pre class="brush: bash">REMOTE_DEBUGGER=1</pre> - -<p>This enables remote debugging on the device, the same as using the option in the <a href="/zh-CN/Firefox_OS/Debugging/Developer_settings#Remote_debugging">developer settings</a>.</p> - -<h4 id="JavaScript_optimization_make">JavaScript optimization make</h4> - -<pre class="brush: bash">GAIA_OPTIMIZE=1 make</pre> - -<p>This triggers an optimization pass on Gaia's JavaScript, concatenating/compressing the files. This is automatically set when running <code>make production</code>. This can be used for <code>install-gaia</code> or <code>reset-gaia</code> too.</p> - -<h4 id="High_resolution_image_assets">High resolution image assets</h4> - -<pre class="brush: bash">GAIA_DEV_PIXELS_PER_PX=1.5 make</pre> - -<p>When packaging the app, this option replaces images with their <code>*@1.5x.(gif|jpg|png)</code> equivalents if such images exist. You need to use the above option as part of a standard <code>make</code> command, for example:</p> - -<pre class="brush: bash">GAIA_DEV_PIXELS_PER_PX=1.5 make reset-gaia - -GAIA_DEV_PIXELS_PER_PX=1.5 make install-gaia</pre> - -<p>Gaia is currently targetting the following screen resolutions:</p> - -<ul> - <li>qHD: ~540×960; device pixel ratio = 1.6875</li> - <li>WVGA: ~480×800; device pixel ratio = 1.5</li> - <li>HBGA (320x240); device pixel ratio = 1</li> -</ul> - -<p>use <code>GAIA_DEV_PIXELS_PER_PX</code> to make sure the images looks sharp on qHD and WVGA devices. see <a href="https://developer.mozilla.org/zh-CN/docs/Mozilla/Mobile/Viewport_meta_tag#A_pixel_is_not_a_pixel" title="https://developer.mozilla.org/zh-CN/docs/Mozilla/Mobile/Viewport_meta_tag#A_pixel_is_not_a_pixel">A pixel is not a pixel</a> for more information about device pixels per css pixels.</p> - -<h4 id="Haida_features">Haida features</h4> - -<pre class="brush: bash">HAIDA=1 make reset-gaia</pre> - -<p>This build enables the Haida feature set, which is currently limited to <a href="https://wiki.mozilla.org/FirefoxOS/systemsfe/epm#Rocketbar_Results">rocketbar</a> and <a href="https://wiki.mozilla.org/FirefoxOS/Haida#Edge_Gestures_Between_Open_Content">edge</a> gestures, but will likely include other features in the near future.</p> - -<h4 id="Disable_first_time_use_experience_(FTU)">Disable first time use experience (FTU)</h4> - -<pre class="brush: bash">NOFTU=1 -</pre> - -<p>Disable the FTU with this environment variable.</p> - -<h4 id="Disable_lockscreen">Disable lockscreen</h4> - -<p>You can disable the Firefox OS lockscreen using the NO_LOCK_SCREEN option, for example:</p> - -<pre class="brush: bash">NO_LOCK_SCREEN=1 make</pre> - -<h4 id="Reference_Workloads">Reference Workloads</h4> - -<p>Reference workloads allow developers/testers to quickly install a large amount of data in several applications, typically on a newly-flashed phone.</p> - -<p>The commands are (from the gaia directory):</p> - -<pre class="brush: bash">make reference-workload-light</pre> - -<ul> - <li>200 contacts</li> - <li>200 sms messages</li> - <li>50 dialer history entries</li> - <li>20 gallery images</li> - <li>20 songs</li> - <li>5 videos</li> -</ul> - -<pre class="brush: bash">make reference-workload-medium</pre> - -<ul> - <li>500 contacts</li> - <li>500 sms messages</li> - <li>100 dialer history entries</li> - <li>50 gallery images</li> - <li>50 songs</li> - <li>10 videos</li> -</ul> - -<pre class="brush: bash">make reference-workload-heavy</pre> - -<ul> - <li>1000 contacts</li> - <li>1000 sms messages</li> - <li>200 dialer history entries</li> - <li>100 gallery images</li> - <li>100 songs</li> - <li>20 videos</li> -</ul> - -<pre class="brush: bash">make reference-workload-x-heavy</pre> - -<ul> - <li>2000 contacts</li> - <li>2000 sms messages</li> - <li>500 dialer history entries</li> - <li>250 gallery images</li> - <li>250 songs</li> - <li>50 videos</li> -</ul> - -<p>These targets accept the <code>APP</code> environment variable, or an <code>APPS</code> environment variable that should contain the app names separated by a space, e.g.:</p> - -<pre class="brush: bash">APP=sms make reference-workload-light -APPS="sms communications/contacts" make reference-workload-heavy -</pre> - -<p>The apps available are:</p> - -<pre class="brush: bash">APPS="gallery music video communications/contacts sms communications/dialer"</pre> - -<p>In order to install music (songs) with reference workloads, the utility mid3v2 must be installed. This utility can be installed with:</p> - -<pre class="brush: bash">sudo apt-get install python-mutagen</pre> - -<p>If you run Fedora or RHEL instead, use:</p> - -<pre class="brush: bash">sudo yum install python-mutagen</pre> - -<h4 id="Documentation_make">Documentation make</h4> - -<p>Gaia docs can be built, via jsdoc3. To generate these, you can use the following command:</p> - -<pre class="brush: bash">make docs</pre> - -<h4 id="Enabling_IME_layout_and_dictionaries">Enabling IME layout and dictionaries</h4> - -<p>To enable keyboard IME layout and dictionaries enabled, use following command structure:</p> - -<pre class="brush: bash">GAIA_KEYBOARD_LAYOUTS=en,zh-Hant-Zhuyin,el,de,fr,zh-Hans-Pinyin make</pre> - -<h2 id="自定义_build-time_应用">自定义 build-time 应用</h2> - -<p>The apps that run on Firefox OS are all contained within the Gaia source tree, in one of two locations:</p> - -<ul> - <li><code>gaia/apps</code>: This is where the system default apps are found, such as <code>calendar</code>, <code>email</code>, <code>settings</code>, etc.</li> - <li><code>gaia/external-apps</code>: This is where the Firefox Marketplace app is found (<code>marketplace.firefox.com</code>), and where apps subsequently installed by the user are stored.</li> - <li><code>gaia/showcase-apps</code>: This is a container for multiple showcase apps, for example a 3D Crystal Skull to show off WebGL performance on the device.</li> - <li><code>gaia/test-apps</code>: This directory is a repository for simple tests, designed to test simple B2G features.</li> - <li><code>gaia/external-apps</code>: This directory contains more tests.</li> - <li>There may be oters too, depending on the version of Gaia you have cloned.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: If you are building B2G rather than Gaia, the paths will of course have <code>B2G/</code> on the front, e.g. <code>B2G/gaia/apps</code> and <code>B2G/gaia/external-apps</code>.</p> -</div> - -<p>If you want to omit some of these apps from your build of Gaia/B2G, you can do this in a few different ways:</p> - -<ol> - <li> - <p>The "brute force" method is to simply delete the apps you don't want to be present at build time, before building.</p> - </li> - <li> - <p>The more refined method is to edit the <code>gaia/build/config/apps-*.list</code> files to include the paths to the apps you want to include at build time. For example, <code>gaia/build/config/apps-production.list </code>looks something like this:</p> - - <pre class="brush: bash">apps/* -external-apps/* -outoftree_apps/*</pre> - - <p>But you could also include specific apps rather than just picking them all, for example:</p> - - <pre class="brush: bash">apps/clock</pre> - - <p>The mechanism for choosing which <code>apps-*.list</code> file is used during the build to determine the available apps is contained inside <code>gaia/Makefile</code>:</p> - - <pre class="brush: cpp">GAIA_APP_TARGET?=engineering -... -ifeq ($(MAKECMDGOALS), demo) -GAIA_DOMAIN=thisdomaindoesnotexist.org -GAIA_APP_TARGET=demo -else ifeq ($(MAKECMDGOALS), dogfood) -DOGFOOD=1 -else ifeq ($(MAKECMDGOALS), production) -PRODUCTION=1 -endif -... -ifeq ($(PRODUCTION), 1) -GAIA_OPTIMIZE=1 -GAIA_APP_TARGET=production -endif - -ifeq ($(DOGFOOD), 1) -GAIA_APP_TARGET=dogfood -endif -... -ifndef GAIA_APP_CONFIG -GAIA_APP_CONFIG=build$(SEP)config$(SEP)apps-$(GAIA_APP_TARGET).list -endif</pre> - - <p>Initially, the <code>GAIA_APP_TARGET</code> variable is set to <code>engineering</code>, so by default building gaia from source will use <code>app-engineering.list</code> (which includes all the tests, demos, etc.):</p> - - <pre class="brush: bash">make -</pre> - - <p>To specify usage of a different apps list you specify different options when running the make command. To build with <code>apps-production.list</code>, for example, you'd use</p> - - <pre class="brush: bash">PRODUCTION=1 make</pre> - - <ul> - <li>If you specifically build with <code>DEMO=1</code> specified, then it will use <code>apps-demo.list</code>.</li> - <li>If you specifically build with <code>DOGFOOD=1</code> specified, then it will use <code>apps-dogfood.list</code>.</li> - <li>You can completely override the decision by using <code>GAIA_APP_CONFIG</code> and providing your own <code>apps-*.list</code> file.</li> - </ul> - - <p><code>gaia/Android.mk</code> contains these lines:</p> - - <pre class="brush: cpp">ifneq ($(filter user userdebug, $(TARGET_BUILD_VARIANT)),) -GAIA_MAKE_FLAGS += PRODUCTION=1 -B2G_SYSTEM_APPS := 1 -endif</pre> - - <p>When you build, if <code>VARIANT=user</code> or <code>VARIANT=userdebug</code> are set (these wind up getting reflected in the <code>TARGET_BUILD_VARIANT</code> variable), <code>PRODUCTION=1</code> is automatically set when building gaia.</p> - </li> - <li> - <p>The third, and most refined (but most complex) method is to use customizations. These allow you to specify build-time customization instructions in separate difrectories, without modifying the core Gaia repo. You can include your own customizations in distinct directories, or use the preexisting directories that come with the source.</p> - - <p>For example, the basic Firefox tablet customized app list is defined in <code>apps.list</code> under the <a href="https://github.com/mozilla-b2g/gaia/tree/master/distribution_tablet"><code>distribution_tablet</code></a> folder (<code>gaia/distribution_tablet</code>). These customizations can be applied at build time using options like this:</p> - - <pre class="brush: bash">GAIA_DISTRIBUTION_DIR=distribution_tablet make</pre> - - <div class="note"> - <p><strong>Note</strong>: Customizations is its own separate topic entirely. To learn more about it, read <a href="/zh-CN/Firefox_OS/Hacking_Firefox_OS/Market_customizations_guide">Market Customizations</a>.</p> - </div> - - <div class="note"> - <p><strong>Note</strong>: If you want to include custom external apps as part of your Gaia build, you need to build them in a specific way, and then place them into the <code>gaia/external-apps/</code> folder. Read <a href="/zh-CN/Firefox_OS/Hacking_Firefox_OS/Market_customizations_guide#Building_Prebundled_web_apps">Building Prebundled web apps</a> to find out how.</p> - </div> - </li> -</ol> - -<div class="warning"> -<p><strong>Important</strong>: If you are a device vendor creating a custom B2G/Gaia build for distribution, you need to satisfy certain criteria before you are allowed to include the Firefox Marketplace app on your phones/tablets/etc. Contact Mozilla for more details.</p> -</div> - -<h2 id="联系小组">联系小组</h2> - -<ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-gaia" rel="nofollow">Gaia Mailing List</a></li> - <li>#gaia IRC channel on irc.mozilla.org</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/index.html deleted file mode 100644 index 698c63da42..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: Gaia -slug: Archive/B2G_OS/Platform/Gaia -translation_of: Archive/B2G_OS/Platform/Gaia ---- -<p>Gaia是<a href="/zh-CN/docs/Mozilla/Firefox_OS" title="Mozilla/Firefox_OS">Firefox OS</a>的用户界面层.在Firefox OS启动之后,显示在屏幕上的一切东西都是由Gaia绘制出来的,包括锁屏,主屏幕,拨号界面,以及其他的应用程序.Gaia完全是由<a href="/zh-CN/docs/zh-CN/HTML" title="HTML">HTML</a>,<a href="/zh-CN/docs/CSS" title="CSS">CSS</a>,和<a href="/zh-CN/docs/JavaScript" title="JavaScript">JavaScript</a>编写的.它和底层的操作系统以及硬件进行交互是通过标准的Web API来完成的,这些API是由<a href="/zh-CN/docs/Gecko" title="Gecko">Gecko</a>实现的.</p> -<p>正因为这样的设计,Gaia不仅能直接运行在Firefox OS设备上,还能运行在其他的操作系统以及其他的web浏览器中.</p> -<p>和Gaia一起安装在设备上的第三方应用程序也可以由Gaia来启动.</p> -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h2 class="Documentation" id="Documentation" name="Documentation">Gaia的相关文档</h2> - <dl> - <dt> - <a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gaia/Introduction_to_Gaia" title="Mozilla/Boot_to_Gecko/Introduction to Gaia">介绍Gaia</a></dt> - <dd> - Gaia是Firefox OS设备上使用的用户界面应用程序,它仅仅是一个运行在Firefox OS软件栈上的Web应用程序.本指南会详细的介绍Gaia.</dd> - </dl> - <dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Gaia_apps">Gaia应用</a></dt> - <dd> - 对Gaia中可获得的默认应用进行介绍，包括如何使用和修改它们。</dd> - <dt> - <a href="/zh-CN/docs/Mozilla/Firefox_OS/Platform/Gaia/Hacking">Gaia hacking 指南</a></dt> - <dd> - 关于hacking和修改Gaia接口的指南。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Build_System_Primer">Gaia系统构建入门</a></dt> - <dd> - 在Gaia build子文件夹下由脚本执行的绝大多数有意以的构建步骤。</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Gaia/Hacking_Tips_And_FAQ">Gaia Hacking提示和常见问题 </a></dt> - <dd> - 关于hacking Gaia的一些有用的提示以及常见问题。</dd> - </dl> - <p><span class="alllinks"><a href="/zh-CN/docs/tag/Gaia" title="tag/B2G">查看更多...</a></span></p> - </td> - <td> - <h2 class="Community" id="Community" name="Community">到社区寻求帮助</h2> - <p>如果你的工作需要和Gaia打交道,或者正在开发一个Gaia应用程序,有相关的社区资源可以帮助你!</p> - <ul> - <li>咨询Boot to Gecko项目论坛: <ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-gaia"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.gaia"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.gaia/feeds"> Web feed</a></li> -</ul></li> - </ul> - <ul> - <li>在Mozilla的Gaia IRC频道上提出你的问题: <a href="irc://irc.mozilla.org/gaia" title="irc://irc.mozilla.org/gaia">#gaia</a></li> - </ul> - <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">不要忘记"提问的艺术"...</a></span></p> - <br> - <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">相关话题</h2> - <ul> - <li><a href="/zh-CN/docs/Mobile" title="Mobile">Mobile</a></li> - <li><a href="/zh-CN/docs/HTML" title="HTML">HTML</a></li> - <li><a href="/zh-CN/docs/CSS" title="CSS">CSS</a></li> - <li><a href="/zh-CN/docs/JavaScript" title="JavaScript">JavaScript</a></li> - </ul> - <h2 class="Tools" id="Resources" name="Resources">资源</h2> - <ul> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Architecture" title="Mozilla/Firefox_OS/Architecture">Firefox OS体系结构概述</a></li> - </ul> - </td> - </tr> - </tbody> -</table> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/introduction_to_gaia/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/introduction_to_gaia/index.html deleted file mode 100644 index 562cb61765..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/introduction_to_gaia/index.html +++ /dev/null @@ -1,28 +0,0 @@ ---- -title: Gaia简介 -slug: Archive/B2G_OS/Platform/Gaia/Introduction_to_Gaia -tags: - - Apps - - B2G - - Gaia - - Settings -translation_of: Archive/B2G_OS/Platform/Gaia/Introduction_to_Gaia ---- -<div class="summary"> - <br> - Gaia 是Boot to Gecko (B2G) 的用户界面; 它是一个web应用的集合，可以本地运行在B2G设备，仿真器，桌面版本或firefox版本上。添加app或规Gaia更改时使用的web技术都是 <a href="https://developer.mozilla.org/en/JavaScript" title="en/JavaScript">JavaScript</a>, <a href="https://developer.mozilla.org/en/HTML" title="en/HTML">HTML</a>,和 <a href="https://developer.mozilla.org/en/CSS" title="en/CSS">CSS</a>.</div> -<h2 id="Gaia_锁屏界面" style="margin-bottom: 20px; line-height: 30px;"> Gaia 锁屏界面</h2> -<p>锁屏界面会显示网络运营商，当前时间和日期，和一个滑动条可用来解锁手机或直接进入相机拍照。 如果用户有密码锁定设置，锁屏界面会显示一个密码输入窗口。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7611/gaia-lockscreen.png" style="margin-right: auto; margin-left: auto; height: 480px; width: 320px; display: block;"></p> -<p>注意一些设备默认是使能密码锁定的；这种情况下，默认的解锁PIN码是 "0000"。该功能后续可能会有所改变。</p> -<h2 id="默认的Gaia接口" style="margin-bottom: 20px; line-height: 30px;">默认的Gaia接口</h2> -<p>Gaia的默认界面，如下图所示，与您在绝大多数智能手机上看到界面是非常相似的。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/7613/device-2013-01-24-163623.png" style="margin-right: auto; margin-left: auto; height: 480px; width: 320px; display: block;"></p> -<p>这张图片显然是一个预发布版本的操作系统，其中还带有占位符图标和一些测试应用。界面顶端的状态栏放置了一些状态标识，包括当前手机选择的网络运营商（或者没有SIM卡），SIM卡信号强度，WIFI信号强度，电池点亮以及当前时间。</p> -<p>界面中间区域显示了应用的图标，滑动屏幕可查看各界面的图标。您可以在<a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Gaia/Gaia_apps" style="text-decoration: underline;">Gaia apps</a> 一文中获取更多关于 Gaia 默认 app集合的信息。 </p> -<p>屏幕的最下方是是一个快速启动栏，一般会放置一些您最常用到的应用。您也可已从快速启动栏拖动一个app图标到中间的区域。</p> -<h2 id="参考" style="margin-bottom: 20px; line-height: 30px;">参考</h2> -<ul> - <li><a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Gaia/Gaia_apps">Gaia apps</a>: 该页面会对每个app进行介绍，包括如何使用和修改它们。</li> - <li><a href="https://developer.mozilla.org/en-US/Firefox_OS/Debugging/Developer_settings">Developer settings</a>: 对不同的开发者设置进行介绍，而且可以通过Gaia Settings 应用来配置它们。</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/platform/gaia/weinre远程调试工具/index.html b/files/zh-cn/archive/b2g_os/platform/gaia/weinre远程调试工具/index.html deleted file mode 100644 index 213a8defb1..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gaia/weinre远程调试工具/index.html +++ /dev/null @@ -1,105 +0,0 @@ ---- -title: Weinre 远程调试工具 -slug: Archive/B2G_OS/Platform/Gaia/Weinre远程调试工具 -tags: - - weinre -translation_of: Tools/Remote_Debugging ---- -<p>Weinre 是Apache基础工程之一，是 WEb INspector REmote 的缩写。正如其名，它是和 Firebug 或浏览器调试工具类似，但是能够在远程运行调试web页面。所以如果你使用过火狐开发者工具或Chrome的调试工具，那么上手Weinre就会非常容易，非常自然。</p> - -<h2 id="安装_Weinre">安装 Weinre</h2> - -<p>因为 Weinre 运行在 Node.js 的基础上, your first port of call would be to <a href="http://nodejs.org/">安装 Node.js</a>. Node.js comes with NPM (Node Package Manager) bundled nowadays and this is what we are going to use to install Weinre. From a terminal run the following:</p> - -<pre style="font-family: monospace;" class="bash">npm <span style="color: #660033;">-g</span> <strong style="color: #c20cb9; font-weight: bold;">install</strong> weinre</pre> - -<blockquote> -<p>NOTE: The <code>-g</code> flag is used to install Weinre as a <a href="https://npmjs.org/doc/global.html">global Node.js module</a> for command line goodness but, on Linux and Mac, this means you most likely are going to need to run the above by prepending <code>sudo</code> to the above command.</p> -</blockquote> - -<p>Once the installation process is complete, we are ready to use Weinre to debug.</p> - -<h2 id="启动_Weinre_服务">启动 Weinre 服务</h2> - -<p>On the terminal enter the following line to start up the Weinre server:</p> - -<pre style="font-family: monospace;" class="bash">$ weinre <span style="color: #660033;">--boundHost</span> 127.0.0.1 <span style="color: #660033;">--httpPort</span> <span style="color: #000000;">9090</span></pre> - -<p><span style="color: #000000;">The two parameters passed here are the host to bind to and the port the server should listen on. Once the server has started the terminal should display a line similar to the following:</span></p> - -<pre style="font-family: monospace;" class="bash"><span style="color: #000000;">2013</span>-01-28T10:<span style="color: #000000;">42</span>:40.498Z weinre: starting server at http:<strong style="color: #000000; font-weight: bold;">//</strong>127.0.0.1:<span style="color: #000000;">9090</span></pre> - -<p>With that, fire up a browser (<em>NOTE: The UI for Weinre is built specifically for Webkit based browsers so, while it might work to some degree in other browsers, I would suggest you use Chrome</em>) and point it to <a href="http://127.0.0.1:9090">http://127.0.0.1:9090</a>. Once the landing page loads, click on the link to the debug client user interface. From this portion of the UI you can see connected clients, initially one which is the current instance of the web inspector, some general properties of our server, and your targets.</p> - -<h2 id="设置_Weinre_目标页面">设置 Weinre 目标页面</h2> - -<p>In Weinre targets are the web pages or apps that you want to debug, and in order for the target to be able to connect, you need to add a one liner to the relevant file of your app. For example, if you wanted to use Weinre to debug the Calendar app in Gaia you would open gaia -> apps -> calendar -> index.html and right before the clong body tag, add the following:</p> - -<pre style="font-family: monospace;" class="xml"><span style="color: #009900;"><strong style="color: #000000; font-weight: bold;"><script</strong> <span style="color: #000066;">src</span>=<span style="color: #ff0000;">"http://127.0.0.1:9090/target/target-script-min.js#anonymous"</span><strong style="color: #000000; font-weight: bold;">></strong><strong style="color: #000000; font-weight: bold;"></script<strong style="color: #000000; font-weight: bold;">></strong></strong></span></pre> - -<p>Normally that would be all you need to do to set up your target, but for FirefoxOS there is one more step. Gaia uses a <a href="http://www.w3.org/TR/CSP/#introduction">Content Security Policy</a> and as part of that, scripts are said to only be allowed to load if from the same origin as the application. So, if we were to try and load the Calendar now, the script from above would be blocked as it is not being loaded from the specified origin.</p> - -<p>To overcome this, we need to temporarily disable CSP. To do this, open up gaia -> build -> preferences.js and add the following line, around line 24:</p> - -<pre style="font-family: monospace;" class="javascript">prefs.<span style="color: #660066;">push</span><span style="color: #009900;">(</span><span style="color: #009900;">[</span><span style="color: #3366CC;">"security.csp.enable"</span><span style="color: #339933;">,</span> <strong style="color: #003366; font-weight: bold;">false</strong><span style="color: #009900;">]</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span></pre> - -<h2 id="使用_Weinre_和_B2G_Desktop_进行调试">使用 Weinre 和 B2G Desktop 进行调试</h2> - -<p>The first step we need before launching the desktop is to build our Gaia profile:</p> - -<pre style="font-family: monospace;" class="bash"><span style="color: #007800;">DEBUG</span>=<span style="color: #000000;">1</span> <strong style="color: #c20cb9; font-weight: bold;">make</strong></pre> - -<p>Once the profile is built, launch B2G desktop:</p> - -<div class="wp_syntax"> -<pre style="font-family: monospace;" class="bash"><strong style="color: #000000; font-weight: bold;">/</strong>Applications<strong style="color: #000000; font-weight: bold;">/</strong>B2G.app<strong style="color: #000000; font-weight: bold;">/</strong>Contents<strong style="color: #000000; font-weight: bold;">/</strong>MacOS<strong style="color: #000000; font-weight: bold;">/</strong>b2g-bin <span style="color: #660033;">-profile</span> <strong style="color: #000000; font-weight: bold;">/</strong>Users<strong style="color: #000000; font-weight: bold;">/</strong>username<strong style="color: #000000; font-weight: bold;">/</strong>mozilla<strong style="color: #000000; font-weight: bold;">/</strong>projects<strong style="color: #000000; font-weight: bold;">/</strong>gaia<strong style="color: #000000; font-weight: bold;">/</strong>profile</pre> -</div> - -<p>Once B2G launches, unlock the screen and navigate to the Calendar app. Tap the app icon and keep an eye on the Weinre debug client UI. Once the app has launched you should see a target being added. Next we want to start inspecting our code, so click on the 'Elements' tab to open up the HTML and CSS inspector. You can go right ahead and edit either the HTML or the CSS as you normally would and see the changes reflected live. Note that even though the CSS looks grayed out and disabled, it is fully editable. You can also add completely new styles to the current element using the empty element.style block or amending existing rules. You will also notice you have access to the computed styles as well as metrics of the current element.</p> - -<h2 id="使用控制台工作">使用控制台工作</h2> - -<p>The next tab of interest to us is the Console tab. Here you can code away and run any JavaScript you want directly against the current app or execute code exposed by the app. In order to demonstrate the console, we will target the Call Log portion of the dialer and interact with the records stored there. First step then is to move your script src to the Dialer which is located at gaia -> apps – > communication -> dialer -> index.html.</p> - -<p>After it is added, build your profile, launch B2G, and then launch the Dialer. With the Dialer open, click on the call log icon, bottom left. Currently the call log is already populated with some dummy data, but let’s create our own. Click over to the Console tab in Weinre, type the following, and press enter.</p> - -<pre style="font-family: monospace;" class="javascript">RecentsDBManager.<span style="color: #660066;">deleteAll</span><span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span></pre> - -<p>To see that our code was executed and worked, we need to refresh the call log:</p> - -<pre style="font-family: monospace;" class="javascript">Recents.<span style="color: #660066;">refresh</span><span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span></pre> - -<p>As you can see, our call log is empty. Next step then is to add an entry back. To do this, we will create a dummy call entry Object and then pass this to the add function of the RecentsDBManager to store it:</p> - -<pre style="font-family: monospace;" class="javascript"><em>// Dummy entry</em> -<strong style="color: #000066; font-weight: bold;">var</strong> recentCall <span style="color: #339933;">=</span> <span style="color: #009900;">{</span> - type<span style="color: #339933;">:</span> <span style="color: #3366CC;">'incoming-refused'</span><span style="color: #339933;">,</span> - number<span style="color: #339933;">:</span> <span style="color: #3366CC;">'555-6677'</span><span style="color: #339933;">,</span> - date<span style="color: #339933;">:</span> <strong style="color: #000066; font-weight: bold;">new</strong> <span>Date</span><span style="color: #009900;">(</span><span style="color: #009900;">)</span> -<span style="color: #009900;">}</span><span style="color: #339933;">;</span> -RecentsDBManager.<span style="color: #660066;">add</span><span style="color: #009900;">(</span>recentCall<span style="color: #009900;">)</span><span style="color: #339933;">;</span> -Recents.<span style="color: #660066;">refresh</span><span style="color: #009900;">(</span><span style="color: #009900;">)</span><span style="color: #339933;">;</span></pre> - -<p>And as you can see now, the entry we just created has been added to storage, <a href="https://developer.mozilla.org/en-US/docs/IndexedDB/Using_IndexedDB">IndexedDB</a> to be exact, and is visible in the call log view. As you might very well have noticed, another of the great features that comes with the console is auto-complete which will further speed up development.</p> - -<h2 id="在移动设备上调试">在移动设备上调试</h2> - -<p>The above has focused on using Weinre and B2G desktop, but the process to use Weinre to inspect and debug your code running on a device is exactly the same except for the IP address you will be using. When you want to debug on the device you first need to know the IP address of your host computer. Then you need to start up Weinre using this IP as the boundHost and also as the IP when including the script into your target documents.</p> - -<blockquote> -<p>On Mac and Linux you can get this address using <code>ifconfig</code> and on Windows it is <code>ipconfig</code>.</p> -</blockquote> - -<p>Once you have the new IP, just stop the current instance of Weinre and then do the following:</p> - -<pre style="font-family: monospace;" class="bash">weinre <span style="color: #660033;">--boundHost</span> 192.168.1.1 <span style="color: #660033;">--httpPort</span> <span style="color: #000000;">9090</span></pre> - -<p>Then inside your target document add:</p> - -<pre style="font-family: monospace;" class="bash"><strong style="color: #000000; font-weight: bold;"><</strong>script <span style="color: #007800;">src</span>=<span style="color: #ff0000;">"http://192.168.1.1:9090/target/target-script-min.js#anonymous"</span><strong style="color: #000000; font-weight: bold;">></</strong>script<strong style="color: #000000; font-weight: bold;">></strong></pre> - -<p>Make and push your Gaia profile to the device using:</p> - -<pre style="font-family: monospace;" class="bash"><strong style="color: #c20cb9; font-weight: bold;">make</strong> install-gaia</pre> - -<p>Launch your target app and you are in business!</p> diff --git a/files/zh-cn/archive/b2g_os/platform/gonk/index.html b/files/zh-cn/archive/b2g_os/platform/gonk/index.html deleted file mode 100644 index 63d02ef70a..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/gonk/index.html +++ /dev/null @@ -1,98 +0,0 @@ ---- -title: Gonk -slug: Archive/B2G_OS/Platform/Gonk -translation_of: Archive/B2G_OS/Platform/Gonk ---- -<div class="summary"> -<p>Gonk 是 <a href="../../../../en-US/docs/Mozilla/Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> 平台底层的操作系统, 包括基于 <a class="external external-icon" href="http://source.android.com/">Android Open Source Project</a> (AOSP) 的 Linux Kernel 和用户空间硬件抽象层 (HAL) 。本文旨在介绍Gonk的组成；要获取更多有关 Firefox OS 架构和 Gonk 如何在其中适配的知识，请参考 <a href="../../../../en-US/Firefox_OS/Platform/Architecture">Firefox OS architecture</a> 指南。</p> -</div> - -<h2 id="Gonk_overview">Gonk overview</h2> - -<p>Gonk 在 Firefox OS stack 中可看作是 kernel 层级的组件，在 Gecko 和 底层硬件中间充当接口的作用。Gonk 对底层的硬件进行控制，并且将硬件信息及操控接口暴露给 Gecko中的 Web APIs。Gonk 可以看作是一个 黑盒， 在屏幕后面做了所有复杂细节的工作用于在硬件层级上对 mobile device 进行控制。</p> - -<p>Gonk 只是一个简单的 Linux 发行版本，其中包括了 Android 的一些组件（如 GPS 和 Camera）以及由 Mozilla 扩展的常用的开源工程，如 libusb, bluez, 进而将所有的层级集成到 Firefox OS 架构中。这种设计方式对 OEM 将软件组件从其他 Android 实现上移植过来是非常方便的。</p> - -<p>Gonk 是一个设备接口层，可看作是 硬件和 Gecko 之间的适配器。 Gonk is a relatively simple Linux distribution that can be treated as a Gecko Port paired with Gecko porting layers — so Gonk is a <strong>porting target</strong> of <a href="https://developer.mozilla.org/en-US/docs/Gecko">Gecko</a>, just like there's a port of Gecko to OS X, Windows, and Android.</p> - -<div class="note"> -<p><strong>Note</strong>: Since different mobile devices may have different chipsets and other hardware specs, devices may contain different Gonk distributions.</p> -</div> - -<p>由于 Firefox OS 工程对 Gonk 的完整控制，我们可以向 Gecko 中暴露一些在其他操作系统中无法实现的接口。例如， Gecko 已经可以直接对 full telephone stack 直接进行发给男问，并在 Gonk 中显示出 frame buffer。</p> - -<h2 id="Gonk_架构">Gonk 架构</h2> - -<p>Each mobile phone model has a specialized combination of Gonk components based on the system libraries, device drivers, and firmware required to operate the device. These components are determined by the OEM in collaboration with chipset manufacturers and ODMs. The following figure shows an example Gonk implementation:</p> - -<p><img alt="" src="https://mdn.mozillademos.org/files/9489/gonk-architecture.png" style="width: 987px; height: 329px; margin: 0px auto; display: block;"></p> - -<p>This example shows the following main components (which represent only a subset of the possible components in any given Gonk implementation):</p> - -<ul> - <li><strong>Linux Kernel</strong>: Uses libraries from Android (GPS, camera, etc.) and other open source projects (Linux, libusb, bluez, and so on).</li> - <li><strong>Radio Interface Layer (RIL)</strong>: Interacts with the modem hardware (telephony) in the phone. Consists of two components: - <ul> - <li><strong>rild daemon</strong>: Talks to the modem firmware.</li> - <li><strong>rilProxy</strong>: Proxies messages between rild and the b2g process</li> - </ul> - </li> - <li><strong>mediaserver process</strong>: 控制 audio 和 video 的播放。Gecko 与 media server 通过 Android RPC 机制进行通信。</li> - <li><strong>netd process</strong>: 与 network 接口 (Wifi) 硬件直接交互的 Network dameon</li> - <li><strong>Bluetooth, etc.</strong>: Bluetooth and other service-level daemons provide access to hardware capabilities.</li> -</ul> - -<p>Gonk 也会启动，管理以及关闭 b2g process， b2g process 属于 Firefox OS 的 Gecko 层。The b2g process acts as a client to service-level daemons in Gonk that interact directly with the hardware and expose to Gecko the underlying hardware functionality of the phone. Gecko talks with these daemons via inter-process communication (IPC). These components collaboratively exchange commands and protocols to request and provide services.</p> - -<div class="note"> -<p><strong>Note</strong>: For more information on Gonk architecture, see the <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Architecture">Firefox OS architecture guide</a>.</p> -</div> - -<h2 id="Porting_Gonk">Porting Gonk</h2> - -<p>Because Firefox OS is based on the Android kernel, existing device drivers, firmware, service daemons, and other components can be ported to work with Firefox OS, usually with minimal effort. If a custom component (for example, a custom RIL or new daemon) is needed, or if a modification must be made to an ODM’s reference design, then additional integration and testing effort might be required.</p> - -<p>In b2g, clients communicate with service-level daemons via inter-process communication (IPC). The client initiates a socket connection to the service-level daemon, submits the request (using the server’s request protocol) over that connection, receives the response, and closes the connection. OEMs are responsible for designing and implementing this inter-process communication between clients and servers.</p> - -<div class="note"> -<p><strong>Note</strong>: For more information about how the porting process works, see <a href="https://developer.mozilla.org/en-US/Firefox_OS/Developing_Firefox_OS/Porting">Porting Firefox OS</a>.</p> -</div> - -<h3 id="How_Mozilla_works_on_Gonk_ports_with_OEMs_and_phone_manufacturers">How Mozilla works on Gonk ports with OEMs and phone manufacturers</h3> - -<p>Every Gonk implementation is the result of collaboration among Mozilla, OEMs, and associated manufacturers (ODMs, chipset manufacturers).</p> - -<p>Mozilla provides source repositories and support files for Gonk in its Firefox OS distributions. The source repositories include the base Linux kernel (with only slight changes) and hooks into Gecko.</p> - -<p>OEMs are responsible for building, compiling, testing, certifying, and distributing the Firefox OS system image for a given device model. For the Gonk portion of the system image, OEMs are responsible for the bulk of the effort in order to ensure the seamless integration between Web API calls and phone hardware functionality. The type and scope of effort required is highly dependent on the specific chipsets and other hardware components used on the phone.</p> - -<h3 id="Device_components">Device components</h3> - -<p>OEMs collaborate with chipset manufacturers and ODMs to provide all of the device-specific components that are needed to run the mobile device. For example, a manufacturer of the Wi-Fi components would provide the chipset and affiliated software. Components might include:</p> - -<ul> - <li>Drivers — For supported phone functionality, such as modem (data and voice), Wi-fi, Bluetooth, display, camera, audio, and so on.</li> - <li>Firmware — Some hardware (the network interface card, for example) might load firmware off the flash drive.</li> - <li>Service-level daemons — For invoking and managing the operation of various hardware components. This can include support libraries and startup scripts.</li> -</ul> - -<h3 id="Integration_between_Gonk_and_Gecko">Integration between Gonk and Gecko</h3> - -<p>OEMs must ensure that hardware capabilities in the mobile device are correctly and completely exposed to the Web APIs implemented in Gecko. This involves:</p> - -<ul> - <li>building or adapting (in Gonk) service-level daemons, along with any associated drivers or firmware, to manage the hardware functionality</li> - <li>setting up (in b2g) all the methods needed to communicate with the service-level daemons</li> -</ul> - -<h2 id="Gonk_源代码">Gonk 源代码</h2> - -<p>The main <a href="https://github.com/mozilla-b2g/B2G">B2G repo on Github</a> contains officially supported Gonk ports for a variety of devices, so you can treat it as Gonk’s repository. The list of supported devices is available in <code>B2G/config.sh</code>.</p> - -<p>The b2g process (along with other things), defined in Gonk, can be found at <a href="https://github.com/mozilla-b2g/gonk-misc">mozilla-b2g/gonk-misc</a>. Modifications to b2g source code are made here.</p> - -<div class="note"> -<p><strong>Note</strong>: In the <a href="https://github.com/mozilla/gecko-dev">Gecko source</a> there’s a <code>b2g/</code> folder that contains the Gonk Port of Gecko: this consists of a Linux kernel, HAL, and other OEM-specific libraries.</p> -</div> - -<p>Gonk 层每天的工作主要集中在 porting system 到不同的板子上，并且确保 Gecko 在不同的设备上能够正常工作。</p> diff --git a/files/zh-cn/archive/b2g_os/platform/index.html b/files/zh-cn/archive/b2g_os/platform/index.html deleted file mode 100644 index 3f256549c6..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: Firefox OS 平台 -slug: Archive/B2G_OS/Platform -tags: - - B2G - - Firefox OS - - NeedsTranslation - - TopicStub -translation_of: Archive/B2G_OS/Platform ---- -<p>FireFox OS 平台包括很多组件。为了构建能够在FF OS中运行的应用，你不需要理解系统内部架构，如果你将要在该平台构建应用程序或者只是简单的好奇，你可能对以下文档感兴趣。</p> - -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h2 class="Documentation" id="Documentation" name="Documentation">关于Firefox OS 平台的文件</h2> - - <dl> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Introduction" title="en-US/docs/Mozilla/Firefox_OS/Introduction">介绍 Firefox OS</a></dt> - <dd>关于 OS 如何运作</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS" title="en-US/docs/Mozilla/Firefox_OS/Building and installing Boot to Gecko">搭建安装 Firefox OS</a></dt> - <dd>Firefox OS 安装指南。也是在Pc搭建Firefox OS虚拟机指南</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Gaia" title="/en-US/docs/Mozilla/Gaia">Gaia</a></dt> - <dd>FireFox OS 顶层文档</dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Gonk" title="/en-US/docs/Mozilla/Firefox_OS/Gonk">Gonk</a></dt> - <dd>关于Gonk的文档, Gonk比Gaia在操作系统中更加底层, 由Linux内核和Gecko调用的硬件抽象层组成. </dd> - <dt><a href="/en-US/docs/Gecko" title="/en-US/docs/Gecko">Gecko</a></dt> - <dd>Gecko在Firefox OS为提供标准的开放web标准实现, 像被Firefox和Thunderbird等等许多其他的应用运用着. </dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Feature_support_chart">图表支持特性</a> </dt> - <dd>用一张图表就可以把所有Firefox OS编译的类型哪些可用的展现出来. </dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Architecture">Firefox OS 架构概述</a></dt> - <dd>对Firefox OS 架构的概述. </dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Testing_Firefox_OS">Firefox OS 测试</a></dt> - <dd>一个Firefox OS的测试指南, 包含如何创建自动化测试. </dd> - <dt><a href="/en-US/docs/Mozilla/Firefox_OS/Porting">Firefox OS 端口设置</a></dt> - <dd>关于Firefox OS在新设备中的端口设置. </dd> - <dt><a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file">.userconfig 文件的配置</a></dt> - <dd>如何配置Firefox OS的编译和执行通过修改.userconfig文件. </dd> - </dl> - - <p><span class="alllinks"><a href="/en-US/docs/tag/B2G" title="/en-US/docs/tag/B2G">View All...</a></span></p> - </td> - <td> - <h2 class="Community" id="Community" name="Community">从社区获得帮助</h2> - - <p>以下资源助你开发火狐应用</p> - - <ul> - <li>Consult the Boot to Gecko project forum: <ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-b2g"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.b2g"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.b2g/feeds"> Web feed</a></li> -</ul></li> - </ul> - - <ul> - <li>Ask your question on Mozilla's Boot to Gecko IRC channel: <a class="link-irc" href="irc://irc.mozilla.org/b2g" title="irc://irc.mozilla.org/b2g">#b2g</a></li> - </ul> - - <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">Don't forget about the <em>netiquette</em>...</a></span></p> - - - <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">相关要点</h2> - - <ul> - <li><a href="/en-US/docs/Mobile" title="en-US/docs/Mobile">Mobile</a> </li> - <li><a href="/en-US/docs/HTML" title="en-US/docs/HTML">HTML</a></li> - <li><a href="/en-US/docs/CSS" title="en-US/docs/CSS">CSS</a></li> - <li><a href="/en-US/docs/JavaScript" title="en-US/docs/JavaScript">JavaScript</a></li> - </ul> - - <h2 class="Tools" id="Resources">Resources</h2> - - <ul> - <li><a class="link-https" href="https://wiki.mozilla.org/B2G/FAQ" title="B2G/FAQ">Mozilla wiki FAQ</a></li> - <li><a class="link-https" href="https://wiki.mozilla.org/B2G/Schedule_Roadmap" title="https://wiki.mozilla.org/B2G/Schedule_Roadmap">Roadmap</a></li> - <li><a href="/en-US/docs/Mozilla/Firefox_OS/Feature_support_chart" title="/en-US/docs/Mozilla/Firefox_OS/Feature_support_chart">Feature support chart</a></li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/platform/out_of_memory_management_on_firefox_os/index.html b/files/zh-cn/archive/b2g_os/platform/out_of_memory_management_on_firefox_os/index.html deleted file mode 100644 index eda111fbc8..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/out_of_memory_management_on_firefox_os/index.html +++ /dev/null @@ -1,80 +0,0 @@ ---- -title: Firefox OS 中的内存溢出管理 -slug: Archive/B2G_OS/Platform/Out_of_memory_management_on_Firefox_OS -tags: - - B2G - - Firefox OS - - Gaia - - LMK - - OOM - - Out of memory - - oom_adj - - 低内存管理器 - - 低内存通知器 -translation_of: Archive/B2G_OS/Platform/Out_of_memory_management_on_Firefox_OS ---- -<div class="summary"> -<p><span class="seoSummary">Firefox OS 运行在一些严重内存受限的设备上时，</span>就会很容易出现app在运行时将内存耗尽的情况。当一个进程将系统上可用的内存耗尽时， 为了能够释放内存，kernel 层必须要 kill 掉其他的进程。本文则描述了低内存 killer和 低内存通知器是如何工作的 。</p> -</div> - -<p>FxOS 的操作会涉及到多进程问题—一个“主进程”运行基本的系统服务和潜在众多的“子进程”。FxOS 环境下应用很少会由用户主动关闭，因此当新的 app需要空间或已存在的 app需要额外的内存时， system会自动对应用程序的生命周期进行管理。</p> - -<p>有两个子系统负责这方面的管理： 低内存管理器 <strong>Low memory killer (LMK)</strong> 和低内存通知器<strong>Low memory notifications</strong>.</p> - -<h2 id="低内存管理器_Low_memory_killer">低内存管理器 Low memory killer</h2> - -<p><a href="https://android.googlesource.com/kernel/common.git/+/edd540ea92954f896bfb7ee0ebf5dfdde6e6cb41/drivers/staging/android/lowmemorykiller.txt"> LMK</a> 是 Android 内核的子系统，当有获取内存空间的需求时，能够自动的对进程进行查杀。为了能够选择出哪一个进程需要第一个查杀，每个进程都要通过 <a href="https://www.kernel.org/doc/Documentation/filesystems/proc.txt">/proc/<pid>/oom_adj or /proc/<pid>/oom_score_adj files</a> 来设定一个优先级。 每个进程的优先级也可称为调整分数或 <code>oom_adj</code>. <code>oom_adj</code> ，值越小则表示器进程优先级越高。</p> - -<p>一般来说，进程的调整得分越高，越可能被查杀。 LMK 提供了多个等级，每一个都与一定程度的闲置内存和最小调整分数对应。当闲置内存的数量低于某个特定等级时，所有高于该等级指定的最小调整分数的进程都具有被查杀的可能。LMK会开始查杀这些进程，分数高的会被先杀掉，直到闲置内存再次高于临界值为止。</p> - -<p><strong>Note</strong>: When a background app is killed by the LMK, it is made available in the task manager/through edge swipes as a "zombie app": next time you browse to that app, it will be revived. The maximum number of apps that can be kept in this state is currently 10.</p> - -<div class="note"> -<p><b>注意</b>: 当设备存储器不足(oom) 时杀掉的进程并不一定是导致存储器不足(oom)的原因。</p> -</div> - -<h3 id="进程优先级">进程优先级</h3> - -<p>Firefox OS 中的 app 是以下面的优先级次序策略来管理的，这种策略是根据每个应用的优先级等级和这些等级相关的 OOM 调整分数 (<a style="text-decoration: underline;" href="http://hg.mozilla.org/mozilla-central/file/545c35907eff/b2g/app/b2g.js#l661">the current values are set in prefs</a>)而制定的： </p> - -<ol> - <li>后台应用会首先被干掉，先从使用最少的应用开始</li> - <li>之后会干掉 homescreen 应用程序</li> - <li>可由用户感知的后台应用会被干掉 (例如， 在后台播放音频的音乐播放器或者持有 <code>high-priority</code> 或 <code>cpu</code> wakelock，并且注册系统消息的处理程序)</li> - <li>如果 keyboard 应用正在运行，会被干掉</li> - <li>前台应用被干掉</li> - <li>最后，已请求 <code>high-priority</code> 或 <code>cpu</code> wakelocks 的前台应用会最后被干掉</li> -</ol> - -<div class="note"> -<p><b>注意</b>: 当子进程在前台时，会以 <span style="font-family: 'Courier New', 'Andale Mono', monospace;">oom_adj 2 </span>运行。后台的子进程运行时，其 <code>oom_adj</code> 会在 <code>3</code> 和 <code>6</code> (包括6) 之间。后台运行的子进程 <code>oom_adj</code> 数值要取决于许多因素，如是否播放音乐，是否是homescreen 等。</p> -</div> - -<p>也有两个例外的情况：</p> - -<ul> - <li>主进程是不会被 LMK 干掉的，否则就会干掉所有的子进程并且重启操作系统。主进程运行时 <code>oom_adj 0</code>.</li> - <li>我们会保持一个名为 <strong>preallocated process 的进程</strong>以加速新应用的启动<strong>。</strong>这个进程通常需要一直存在，因为它消耗很有限的内存，而且能够明显提高应用程序的启动速度。它只在一种情况下被干掉，就是主线程需要内存保持运行，杀掉其他进程后， 内存空间还不够时。</li> -</ul> - -<h2 id="低内存通知器_Low_memory_notifications">低内存通知器 Low memory notifications</h2> - -<p>释放内存的第二种机制就是低内存通知器。 LMK 提供一个<a href="https://www.codeaurora.org/cgit/quic/la//kernel/msm/commit/?id=b3f986cba580b14438b77b42070ebbc77b69d4c4">特定的门限值</a>，当超出该值时，会通知用户当前系统已运行在低内存状态。system 应用和常规的用户应用都会持续的等待这个条件，并通过 observer service 发送一个 <code style="font-style: normal;">memory-pressure</code> 方法来响应它。 这个事件只对 C++ 和 chrome JS 代码可见，并非由应用直接发送。通过Gecko 代码库，我们使用该事件可以释放尽可能多的内存— 一般会通过清除内部缓存（图片，DNS，数据库等），丢弃可重新创建的资源（例如， WebGL contexts）以及运行垃圾回收器，生命周期回收器等方式实现。</p> - -<p>当低内存情况发生时， 触发的第一个 <code>memory-pressure</code> 事件会有一个<code> low-memory </code>负载。 如果在预订时间(5s) 后， 还处在低内存状态， 会触发另一个 <code>memory-pressure</code> 事件，但此次负载值变为 <code>low-memory-onging</code> 。当一直处在低内存条件下，并且要清除缓存以及做其他简单的内存削减时，该负载会被使用，但应当知道一些繁重的工作，如 GC ， 是不能成功的。（此段翻译可能不是太贴切，要深入理解，还请参考英文原文）</p> - -<h2 id="LMK_和低内存通知器是如何配合工作的"> LMK 和低内存通知器是如何配合工作的</h2> - -<p>当前<a href="http://hg.mozilla.org/mozilla-central/file/545c35907eff/b2g/app/b2g.js#l722">低内存限值设定在后台进程 LMK 等级和 homescreen 之间。</a> 因此当设备在低内存状态下运行时， LMK 和 低内存通知器联合作出的反应如下：</p> - -<ol> - <li>以最不经常使用的次序 kill 掉 后台 app</li> - <li>如果我们没有释放足够的内存, 向所有现存的应用发送 <code>memory-pressure</code> 事件</li> - <li>如果低内存情况还在，每个 5 秒重发一次 <code>memory-pressure</code> 事件，但将它们标记为 ongoing , 使 GC/CC 不会对它们动作。</li> - <li>Kill 掉 homescreen.</li> - <li>Kill 掉可感知的或高优先级的后台应用</li> - <li>如果 keyboard app 正在运行，Kill 掉</li> - <li>Kill 掉前台应用</li> - <li>Kill 掉高优先级的前台应用</li> - <li>Kill 掉 preallocated process</li> -</ol> diff --git a/files/zh-cn/archive/b2g_os/platform/settings_list/index.html b/files/zh-cn/archive/b2g_os/platform/settings_list/index.html deleted file mode 100644 index fc834dc10f..0000000000 --- a/files/zh-cn/archive/b2g_os/platform/settings_list/index.html +++ /dev/null @@ -1,716 +0,0 @@ ---- -title: Firefox OS 设置选项列表 -slug: Archive/B2G_OS/Platform/Settings_list -tags: - - API - - B2G - - Firefox OS - - Settings - - WebAPI - - 参考 -translation_of: Archive/B2G_OS/Platform/Settings_list ---- -<div class="summary"> - <p><span class="seoSummary">Firefox OS 提供了许多设置项，用于配置设备以及内嵌的功能。这些设置项可以由 </span>certified apps 通过使用 <a style="text-decoration: underline;" href="/en-US/docs/WebAPI/Settings" title="/en-US/docs/WebAPI/Settings">Settings API</a> 来访问。</p> -</div> -<div class="note"> - <p><strong>注意:</strong> 由于不同的 Firefox OS 发行版本及设备提供的功能会有所不同，这个列表可能并不会精确的对每个设备进行匹配。</p> -</div> -<table class="standard-table"> - <thead> - <tr> - <th scope="col">设置项名称</th> - <th scope="col">类型</th> - <th scope="col">默认值</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>accessibility.invert</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>accessibility.screenreader</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>alarm.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>app.reportCrashes</code></td> - <td>String</td> - <td><code>ask</code></td> - </tr> - <tr> - <td><code>app.update.interval</code></td> - <td>Number</td> - <td>86400</td> - </tr> - <tr> - <td><code>audio.volume.alarm</code></td> - <td>Number</td> - <td>15</td> - </tr> - <tr> - <td><code>audio.volume.bt_sco</code></td> - <td>Number</td> - <td>15</td> - </tr> - <tr> - <td><code>audio.volume.dtmf</code></td> - <td>Number</td> - <td>15</td> - </tr> - <tr> - <td><code>audio.volume.content</code></td> - <td>Number</td> - <td>15</td> - </tr> - <tr> - <td><code>audio.volume.notification</code></td> - <td>Number</td> - <td>15</td> - </tr> - <tr> - <td><code>audio.volume.tts</code></td> - <td>Number</td> - <td>15</td> - </tr> - <tr> - <td><code>audio.volume.telephony</code></td> - <td>Number</td> - <td>5</td> - </tr> - <tr> - <td><code>bluetooth.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>bluetooth.debugging.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>camera.shutter.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>clear.remote-windows.data</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>debug.grid.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>debug.oop.disabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>debug.fps.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>debug.ttl.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>debug.log-animations.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>debug.paint-flashing.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>debug.peformancedata.shared</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>deviceinfo.firmware_revision</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>deviceinfo.hardware</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>deviceinfo.os</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>deviceinfo.platform_build_id</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>deviceinfo.platform_version</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>deviceinfo.software</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>deviceinfo.update_channel</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>gaia.system.checkForUpdates</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>general.useragent.updates.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>geolocation.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.english</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.dvorak</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.otherlatins</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.cyrillic</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.arabic</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.hebrew</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.zhuyin</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.pinyin</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.greek</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.japanese</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.polish</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.portuguese</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.layouts.spanish</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.vibration</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.clicksound</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>keyboard.autocorrect</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>keyboard.wordsuggestion</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>keyboard.current</code></td> - <td>String</td> - <td><code>en</code></td> - </tr> - <tr> - <td><code>language.current</code></td> - <td>String</td> - <td><code>en-US</code></td> - </tr> - <tr> - <td><code>lockscreen.passcode-lock.code</code></td> - <td>String</td> - <td><code>0000</code></td> - </tr> - <tr> - <td><code>lockscreen.passcode-lock.timeout</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>lockscreen.passcode-lock.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>lockscreen.notifications-preview.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>lockscreen.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>lockscreen.locked</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>lockscreen.unlock-sound.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>mail.sent-sound.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>message.sent-sound.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>operatorvariant.mcc</code></td> - <td>String</td> - <td><code>0</code></td> - </tr> - <tr> - <td><code>operatorvariant.mnc</code></td> - <td>String</td> - <td><code>0</code></td> - </tr> - <tr> - <td><code>ril.iccInfo.mbdn</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.sms.strict7BitEncoding.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ril.cellbroadcast.searchlist</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>debug.console.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>phone.ring.keypad</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>powersave.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>powersave.threshold</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>privacy.donottrackheader.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ril.callwaiting.enabled</code></td> - <td> </td> - <td> </td> - </tr> - <tr> - <td><code>ril.cf.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ril.data.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ril.data.apn</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.data.carrier</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.data.defaultServiceId</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>ril.data.passwd</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.data.httpProxyHost</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.data.httpProxyPort</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>ril.data.mmsc</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.data.mmsproxy</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.data.mmsport</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>ril.data.roaming_enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ril.data.user</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.apn</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.carrier</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.httpProxyHost</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.httpProxyPort</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.mmsc</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.mmsport</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.mmsproxy</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.passwd</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.mms.user</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.radio.preferredNetworkType</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.radio.disabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ril.supl.apn</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.supl.carrier</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.supl.httpProxyHost</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.supl.httpProxyPort</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.supl.passwd</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.supl.user</code></td> - <td>String</td> - <td> </td> - </tr> - <tr> - <td><code>ril.sms.strict7BitEncoding.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ril.sms.</code>defaultServiceId</td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>ril.telephony.</code>defaultServiceId</td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>ring.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>screen.automatic-brightness</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>screen.brightness</code></td> - <td>Number</td> - <td>1</td> - </tr> - <tr> - <td><code>screen.timeout</code></td> - <td>Number</td> - <td>60</td> - </tr> - <tr> - <td><code>tethering.usb.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>tethering.usb.ip</code></td> - <td>String</td> - <td><code>192.168.0.1</code></td> - </tr> - <tr> - <td><code>tethering.usb.prefix</code></td> - <td>String</td> - <td><code>24</code></td> - </tr> - <tr> - <td><code>tethering.usb.dhcpserver.startip</code></td> - <td>String</td> - <td><code>192.168.0.10</code></td> - </tr> - <tr> - <td><code>tethering.usb.dhcpserver.endip</code></td> - <td>String</td> - <td><code>192.168.0.30</code></td> - </tr> - <tr> - <td><code>tethering.wifi.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>tethering.wifi.ip</code></td> - <td>String</td> - <td><code>192.168.1.1</code></td> - </tr> - <tr> - <td><code>tethering.wifi.prefix</code></td> - <td>String</td> - <td><code>24</code></td> - </tr> - <tr> - <td><code>tethering.wifi.dhcpserver.startip</code></td> - <td>String</td> - <td><code>192.168.1.10</code></td> - </tr> - <tr> - <td><code>tethering.wifi.dhcpserver.endip</code></td> - <td>String</td> - <td><code>192.168.1.30</code></td> - </tr> - <tr> - <td><code>tethering.wifi.ssid</code></td> - <td>String</td> - <td><code>FirefoxHotspot</code></td> - </tr> - <tr> - <td><code>tethering.wifi.security.type</code></td> - <td>String</td> - <td><code>open</code></td> - </tr> - <tr> - <td><code>tethering.wifi.security.password</code></td> - <td>String</td> - <td><code>1234567890</code></td> - </tr> - <tr> - <td><code>tethering.wifi.connectedClients</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>tethering.usb.connectedClients</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>time.nitz.automatic-update.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>time.timezone</code></td> - <td> </td> - <td> </td> - </tr> - <tr> - <td><code>ums.enabled</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>ums.mode</code></td> - <td>Number</td> - <td>0</td> - </tr> - <tr> - <td><code>vibration.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>wifi.enabled</code></td> - <td>Boolean</td> - <td><code>true</code></td> - </tr> - <tr> - <td><code>wifi.screen_off_timeout</code></td> - <td>Number</td> - <td>600000</td> - </tr> - <tr> - <td><code>wifi.disabled_by_wakelock</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>wifi.notification</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>wifi.connect_via_settings</code></td> - <td>Boolean</td> - <td><code>false</code></td> - </tr> - <tr> - <td><code>icc.displayTextTimeout</code></td> - <td>Number</td> - <td>40000</td> - </tr> - <tr> - <td><code>icc.inputTextTimeout</code></td> - <td>Number</td> - <td>40000</td> - </tr> - </tbody> -</table> -<h2 id="参考">参考</h2> -<ul> - <li><a href="/en-US/docs/WebAPI/Settings" title="/en-US/docs/WebAPI/Settings">Settings API</a></li> - <li><a href="/zh-CN/docs/Web/API/SettingsManager" title="此页面仍未被本地化, 期待您的翻译!"><code>SettingsManager</code></a></li> - <li><a href="/zh-CN/docs/Web/API/Window/navigator/mozSettings" title="此页面仍未被本地化, 期待您的翻译!"><code>navigator.mozSettings</code></a></li> - <li><a href="https://github.com/mozilla-b2g/gaia/tree/master/build/config">gaia 仓库中的配置文件</a></li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/porting/index.html b/files/zh-cn/archive/b2g_os/porting/index.html deleted file mode 100644 index fb32edac40..0000000000 --- a/files/zh-cn/archive/b2g_os/porting/index.html +++ /dev/null @@ -1,120 +0,0 @@ ---- -title: 将B2G（Firefox OS）移植到你的手机上 -slug: Archive/B2G_OS/Porting -translation_of: Archive/B2G_OS/Porting_B2G_OS/basics ---- -<p>Boot to Gecko (Firefox OS)使用 <a href="http://www.android.com/" title="http://www.android.com/">Android</a>的核心驱动, 在之上加上一个基于 <a href="/en-US/docs/Gecko" title="Gecko">Gecko</a>的用户界面，这篇文章提供了移植操作系统到新设备上的一个基本流程。</p> -<p>这个指南假设你要移植的新设备上运行的是安卓；如果你要移植到其他设备上，会需要做更多的工作。</p> -<h2 id="设置你的编译系统">设置你的编译系统</h2> -<p>第一步是配置你的编译系统；你可以使用这个指南<a href="/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites" title="en-US/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites">Firefox OS build prerequisites</a>。</p> -<h2 id="克隆B2G仓库">克隆B2G仓库</h2> -<p>然后就是克隆B2G仓库</p> -<pre>git clone https://github.com/mozilla-b2g/B2G.git</pre> -<h2 id="创建原安卓系统的本地备份">创建原安卓系统的本地备份</h2> -<p>接下来，在你尝试编译B2G之前，应该备份你的安卓系统，另外，这些东西在编译和安装过程中也能用的到。</p> -<pre>mkdir my_device_backup -cd my_device_backup -adb pull /system system</pre> -<h2 id="在config.sh中添加一个新设备">在config.sh中添加一个新设备</h2> -<p>下一步是向<a href="https://github.com/mozilla-b2g/B2G/blob/master/config.sh" title="https://github.com/mozilla-b2g/B2G/blob/master/config.sh"><code>config.sh</code></a>文件中添加一个新设备；你可以使用已存在的设备作为模板，这仅仅是提供编译时获取正确文件的指南。</p> -<h2 id="为新设备创建清单文件">为新设备创建清单文件</h2> -<p>现在你需要为新设备在称为default.xml的清单文件中添加必须的仓库（repos）；在github上的<a href="https://github.com/mozilla-b2g/b2g-manifest" title="https://github.com/mozilla-b2g/b2g-manifest"><code>b2g-manifest</code></a>文件作为一个模板，每一个设备都有它自己的分支，你可以使用<a href="https://github.com/mozilla-b2g/b2g-manifest/tree/galaxy-s2" title="https://github.com/mozilla-b2g/b2g-manifest/tree/galaxy-s2"><code>galaxy-s2</code></a>作为一个例子。</p> -<h2 id="为新设备创建配置树">为新设备创建配置树</h2> -<p>为新设备创建配置树，这应该在<code>device/<em><manufacturer></em>/<em><device_id></em></code>中，这个树中应该至少包括：</p> -<ul> - <li><code>AndroidBoard.mk</code></li> - <li><code>AndroidProducts.mk</code></li> - <li><code>BoardConfig.mk</code></li> - <li><code>extract-files.sh</code></li> - <li><code>full_<device_id>.mk</code></li> - <li>idc files for touchscreen</li> - <li>init files (<code>init.rc</code>, <code>init.<target>.rc</code>, <code>uevent.rc</code>, ...)</li> -</ul> -<p>不同设备的这些内容可能会有很大的差别。尤其是BoardConfig.mk 和 extract-files.sh，这部分需要大量的研究，测试和调试才能得到哪些二进制对象应该被提取出来。</p> -<div class="note"> - <p><strong>注意:</strong> 如果你可以在 <a href="http://www.cyanogenmod.com/" title="http://www.cyanogenmod.com/">CyanogenMod</a> 上为你的设备找到一个已存在的引用，这些信息会加速你的移植过程， <a href="http://forum.xda-developers.com/" title="http://forum.xda-developers.com/">XDA Forum</a> 是另一个讨论和寻找资源的好地方.</p> -</div> -<h2 id="重新编译_boot.img">重新编译 boot.img</h2> -<p>一旦你完成了上面所有步骤，你需要重新编译引导镜像，通常情况下，内核本身并不需要它，但是为适应init.rc的变化需要重新编译。</p> -<h3 id="init.rc的变化">init.rc的变化</h3> -<p>你使用的 init.rc 并不是B2G提供的；而是从你的设备上拷贝下来的。</p> -<p>你主要需要修改的是：</p> -<h4 id="导入_init.b2g.rc">导入 init.b2g.rc</h4> -<p>加入下面这些行来导入 <code>init.b2g.rc</code>:</p> -<pre>on early-init - start ueventd - import /init.b2g.rc</pre> -<h4 id="解决权限问题">解决权限问题</h4> -<p>更正文件 <code>/system/b2g/b2g</code>, <code>/system/b2g/updater</code>, <code>/system/b2g/plugin-container 的权限</code>；这些行执行后挂载的系统应该可以读写：</p> -<pre>chmod 0755 /system/b2g/b2g -chmod 0755 /system/b2g/updater -chmod 0755 /system/b2g/plugin-container</pre> -<p>你可能想要从修改新设备的<code>init.rc开始，而不是使用编译系统提供的<code>init.rc，如果是这样，你要记得设置</code></code> <code>BoardConfig.mk中的<code>TARGET_PROVIDES_INIT_RC.</code></code></p> -<h3 id="预编译核心_vs._从源代码编译核心">预编译核心 vs. 从源代码编译核心</h3> -<p>你可以使用一个预编译的核心，或者你可以从源代码编译核心，要从源代码编译核心，在设备配置树中添加AndroidKernel.mk和核心配置。</p> -<p>旧编译系统 <a href="https://github.com/andreasgal/B2G/tree/master/glue/gonk/device/toro/maguro" title="https://github.com/andreasgal/B2G/tree/master/glue/gonk/device/toro/maguro">maguro</a> 就是一个从源代码编译系统的例子。</p> -<h3 id="提取并修改现存引导镜像">提取并修改现存引导镜像</h3> -<p>通过转存<code>/dev/mtd/mtd1或</code> <code>/dev/mtd/mtd2设备来恢复手机的引导镜像是可能的，成果镜像文件可以很容易的恢复：</code></p> -<pre>adb shell 'cat /dev/mtd/mtd1 > /sdcard/boot.img' -adb pull /sdcard/boot.img -</pre> -<p> </p> -<p>获得了引导镜像文件之后你就可以通过帮助工具像<a href="http://whiteboard.ping.se/Android/Unmkbootimg" title="Unmkbootimg">unmkbootimg</a>来解压，这个工具会解压出核心镜像（zImage）和虚拟磁盘（initramfs.cpio.gz），而且还会输出一个用于将原镜像带一些参数重新编译的命令，如：</p> -<pre>$ unmkbootimg boot.img -Kernel size 3872576 -Kernel address 0x208000 -Ramdisk size 265102 -Ramdisk address 0x1500000 -Secondary size 0 -Secondary address 0x1100000 -Kernel tags address 0x200100 -Flash page size 2048 -Board name is "" -Command line "androidboot.hardware=aphone" -Extracting kernel to file zImage ... -Extracting root filesystem to file initramfs.cpio.gz ... -All done. ---------------- -To recompile this image, use: - mkbootimg --kernel zImage --ramdisk initramfs.cpio.gz --base 0x200000 --cmdline 'androidboot.hardware=aphone' -o new_boot.img ---------------- -</pre> -<p> </p> -<p>要修改虚拟磁盘文件，创建一个输出文件夹并解压到此：</p> -<pre>mkdir initramfs_dir -cd initramfs_dir -gunzip -c /path/to/your/boot.img | cpio -i -</pre> -<p> </p> -<p>完成所有改变（如修改init.rc）并用<code>mkbootfs重新打包虚拟磁盘，确保使用B2G主机工具的版本：</code></p> -<pre>/path/to/your/B2G/out/host/linux-x86/bin/mkbootfs initramfs_dir | cpio -o -H newc | gzip > ../newinitramfs.cpio.gz -</pre> -<p> </p> -<p>最后使用<code>mkbootimg重新打包引导镜像，也要确保使用的是B2G主机工具的版本：</code></p> -<pre>/path/to/your/B2G/out/host/linux-x86/bin/mkbootimg --kernel zImage --ramdisk newinitramfs.cpio.gz --base 0x200000 --cmdline 'androidboot.hardware=aphone' -o new_boot.img -</pre> -<p> </p> -<p>如果你现在把新的引导镜像拷贝到 <code>out/target/product/$DEVICE/boot.img</code> ($DEVICE 是你的设备名称)下，它将会在调用 <code>flash.sh时自动写入，或者你可以用下面的命令手动写入手机中：</code></p> -<pre>adb reboot bootloader -fastboot flash boot newboot.img -fastboot reboot -</pre> -<p> </p> -<h2 id="在_flash.sh中添加新设备">在 flash.sh中添加新设备</h2> -<p>添加新设备到 <code>flash.sh</code>中，具体细节将取决于写入新设备时所用的工具。</p> -<h2 id="配置、编译和写入设备">配置、编译和写入设备</h2> -<p>现在你可以尝试编译并写入你的新设备了：</p> -<pre>ANDROIDFS_DIR=my_device_backup ./config.sh <device_id> default.xml -./build.sh -./flash.sh</pre> -<h2 id="测试和调试">测试和调试</h2> -<p>待续</p> -<h2 id="FAQ">FAQ</h2> -<p>Forthcoming</p> -<h2 id="See_also">See also</h2> -<ul> - <li><a href="/en-US/docs/Mozilla/Firefox_OS" title="en-US/docs/Mozilla/Firefox_OS">Firefox OS</a></li> - <li><a href="https://github.com/mozilla-b2g/B2G" title="https://github.com/mozilla-b2g/B2G">B2G source code on Github</a></li> - <li><a href="http://www.android.com/" title="http://www.android.com/">Android web site</a></li> - <li><a href="https://autonome.wordpress.com/2013/01/15/firefox-os-devices-and-dark-matter/" title="https://autonome.wordpress.com/2013/01/15/firefox-os-devices-and-dark-matter/">A list of existing projects on Dietrich Ayala's blog</a> to port Firefox OS on some devices</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/preparing_for_your_first_b2g_build/index.html b/files/zh-cn/archive/b2g_os/preparing_for_your_first_b2g_build/index.html deleted file mode 100644 index 405ff0fc23..0000000000 --- a/files/zh-cn/archive/b2g_os/preparing_for_your_first_b2g_build/index.html +++ /dev/null @@ -1,212 +0,0 @@ ---- -title: 准备第一次B2G的构建 -slug: Archive/B2G_OS/Preparing_for_your_first_B2G_build -translation_of: Archive/B2G_OS/Preparing_for_your_first_B2G_build ---- -<p></p> - -<p>在构建B2G之前，你需要下载编译B2G构建的代码库并做配置。本篇就是教你如何完成这一过程。</p> - -<p>配置步骤会需要一些时间来下载构建FirefoxOS的必要文件，时间的长短取决你的网速。（如果网速在150KBps，下载整个Android代码库将要几十个小时）。等待下载是很乏味的过程，如果你读完本页及已经开始配置脚本，可以考虑去配置与试用一下<a href="/zh-CN/docs/Mozilla/Firefox_OS/Using_Firefox_OS_Simulator">Firefox OS 模拟器</a>，或去熟悉一下<a href="/zh-CN/docs/Apps">应用开发文档</a>（像是如何设计与创建一个应用、了解后续步骤的信息等）。</p> - -<div class="note"> -<p>配置和构建 B2G 的可能需要较长的时间，你可以去做一些其他工作或者和朋友去喝杯咖啡。</p> -</div> - -<p>如果你在等待代码下载，或者在开始前想体验一把，你可以看下下面的视频，该视频演示了构建Firefox OS准备工作。（大陆地区无法看到该视频。。。）</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/iVgQfOpCIO8?rel=0&html5=1"></iframe></div></div><p></p> - -<h2 id="克隆B2G代码库">克隆B2G代码库</h2> - -<p>第一步，克隆一份 B2G 远程的Git版本库到本地后，才可以开始你的第一个构建。这一步不会获取所有想要的东西！相反，只会获取B2G构建系统和配置的实用工具。最主要的B2G代码都在 Mozilla <a href="/zh-CN/docs/Mercurial">Mercurial</a> 主仓储中。</p> - -<p>使用 git 来克隆你的版本库：</p> - -<pre>git clone git://github.com/mozilla-b2g/B2G.git</pre> - -<p>克隆之后（应该会花个几分钟），cd 到 B2G 的目录：</p> - -<pre>cd B2G -</pre> - -<h2 id="为你的设备配置专属_B2G">为你的设备配置专属 B2G</h2> - -<div class="warning"><strong>重要：</strong>请注意只支援 <strong>Android 4</strong>（又名：<strong>Ice Cream Sandwich</strong>）的移动设备，或是各种支持的IT平台（目前只有 Firefox OS 设备）。请确认你手机运行的是ICS，否则这个步骤很可能会因为驱动程序在某些非Nexus设备上失败。另外，如果你需要将ICS刷入移动设备，请留意有些USB集线器和刷机工具不兼容，因此可能需要将移动设备连接到内建的USB端口。</div> - -<div class="warning"><strong>重要：</strong>如果你在 Ubuntu 12.10+ 或 Fedora 上构建，需要在检索 B2G 源码后指定 GCC4.6 为默认主编译器，（默认情况下发行版使用 GCC4.7）。可以阅读 <a class="vt-p" href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file#Changing_the_default_host_compiler">Changing the default host compiler</a> 了解如何做到这一点。</div> - -<div class="note"><strong>注意：</strong>在运行任何构建命令之前，<strong>请先阅读下面左右指令，</strong>以确保你正在做的事是正确的！</div> - -<p>一旦有了构建 B2G 的系统环境，为了正确安装你需要设定移动设备 。要获得支持设备列表，可以使用 <code>config.sh</code> 工具， 如下所示：</p> - -<pre>./config.sh -</pre> - -<p>这会显示一个支持设备列表，例如：</p> - -<p>Usage: ./config.sh [-cdflnq] (device name)<br> - Flags are passed through to |./repo sync|.</p> - -<pre>Valid devices to configure are: -- galaxy-s2 -- galaxy-nexus -- nexus-4 -- nexus-4-kk -- nexus-5 -- nexus-5-l -- nexus-s -- nexus-s-4g -- flo (Nexus 7 2013) -- otoro -- unagi -- inari -- keon -- peak -- hamachi -- helix -- tarako -- dolphin -- dolphin-512 -- pandaboard -- vixen -- flatfish -- flame -- flame-kk -- flame-l -- rpi (Revision B) -- emulator -- emulator-jb -- emulator-kk -- emulator-l -- emulator-x86 -- emulator-x86-jb -- emulator-x86-kk -- emulator-x86-l -> Sony Xperia devices -- aries (Z3 Compact KK) -- aries-l (Z3 Compact L) -- leo-kk (Z3 KK) -- leo-l (Z3 L) -- scorpion-l (Z3 Tablet Compact L) -- sirius-l (Z2 L) -- tianchi-l (T2U L) -- flamingo-l (E3 L)</pre> - -<p>如果你的设备未被列出，应该马上停止来帮忙将 B2G 移植到你的设备，或是等别人完成移植。我们当然比较希望你可以帮忙移植！</p> - -<div class="note"><strong>注意：</strong>在 <a href="https://developer.mozilla.org/zh-CN/docs/Mozilla/Firefox_OS/Phones">Firefox OS 手机</a>页面上可以找到你手机的设备名。</div> - -<div class="note"><strong>注意：<strong>对于<strong> Keon </strong></strong>的<strong>配置和构建</strong>在 Mac 上进行是无法工作的。</strong>针对该设备的构建你需要使用 Linux。</div> - -<div class="note"><strong>注意：</strong>如果因为任何原因，你想要编译构建 Gecko 的某个特定版本，请阅读 <a href="#Building_against_a_custom_Gecko">Building against a custom Gecko</a>，然后再继续。如果你想要构建一个你设备默认以外的分支（例如，建立 B2G 的特定版本），请阅读 <a href="#Building_a_branch">Building a branch</a>。</div> - -<div class="note"><strong>注意：</strong>不同设备默认的可能是自己的分支版本，未必是主干（trunk）版本.。</div> - -<p>这将是一个很好的喝咖啡时间，需要将所有所需的代码提取、构建并引导到 Gecko，这一过程会花费很长的时间，你可能需要通过使用 Ctrl-C 停止和稍后重新启动工作。如果你觉得某部分因为终止，而未完成，可以运行 “./repo sync” 来修复任何可能出现的问题。</p> - -<h3 id="为移动设备配置">为移动设备配置</h3> - -<p>首先，连接你的设备，在配置过程中需要访问它。</p> - -<p>如果你的设备被列出，可以通过运行 <code>config.sh</code> 指定你的设备名称再次启动配置程序。例如，要为三星 Google Nexus S 构建，请键入：</p> - -<pre>./config.sh nexus-s -</pre> - -<div class="note"><strong>注意：</strong>如果你得到了一个"<code>fatal: manifest 'nexus-s.xml' not available</code>"的错误提示，这时你只需要指定一个你想要使用的分支 。请阅读 <a href="#Building_a_branch">Building a branch</a>了解详情。</div> - -<p>在配置的刚开始，你可能需要设置颜色使用的选项，在这里你可以只选择“Y”，因为可能会想要一个自己的颜色版本。完事之后会继续配置流程。现在就可以去喝个咖啡休息一下，因为你第一次需要把构建 Boot to Gecko 中所有要的程序都抓下来。</p> - -<h3 id="使用系统备份配置构建">使用系统备份配置构建</h3> - -<p>如果你的手机不再使用 Android 且 B2G tree 还没装到手机上，但聪明地<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites#Backup_the_phone_system_partition">作一份<code>/system</code> 分区</a>的备份的话，你可以在系统备份基础上执行构建，像这样：</p> - -<pre class="language-html">ANDROIDFS_DIR=<absolute path to parent dir of system dir> ./config.sh <target> -</pre> - -<p>请注意，构建系统将会有默认存放目录，如“backup-inari/system”（取决于设备配置），如果打算把文件存放在默认位置，你不需要特意指定目录。</p> - -<p>注意：如果你的手机原本就运行着 Firefox OS，而从来没有运行过Android，它仍然会细致的把文件挂载到/system 分区，这样会为你指引到正确的文件。</p> - -<h3 id="配置构建一个模拟器">配置构建一个模拟器</h3> - -<p>如果你想要在模拟器中构建，可以选择一款 ARM 设备模拟器作为指定模拟器，或是使用 "emulator-x86" 来打造x86模拟器。后者速度更快，但不能准确的表现出实际移动设备的表现。</p> - -<p>现在，举个例子，构建ARM模拟器，应该这样配置：</p> - -<pre>./config.sh emulator -</pre> - -<p>在配置的刚开始，你可能需要设置颜色使用的选项，在这里你可以只选择“Y”，因为可能会想要一个自己的颜色版本。完事之后会继续配置流程。现在就可以去喝个咖啡休息一下，因为你第一次需要把构建 Boot to Gecko 中所有要的程序都抓下来。</p> - -<p>此时你应该准备好<a href="/zh-CN/docs/Mozilla/Firefox_OS/Building">开始构建</a>，除非你需要更高级的信息，详情如下。</p> - -<p>注意：模拟器无法在64位 Linux上构建。</p> - -<div class="note"> -<p><strong>注意：</strong>./config.sh 可能会比你想想的更耗费时间和网络资源。你可能需要通过使用 Ctrl-C 停止和稍后重新启动工作。如果你觉得某部分因为终止，而未完成，可以运行 “./repo sync” 来修复任何可能出现的问题。</p> -</div> - -<h2 id="构置定制一个_Gecko">构置定制一个 Gecko</h2> - -<p>可能你会想要或需要以好几种版本的 Gecko 来编译 Boot to Gecko（manifest 中预设是一种）。你可以在你抓仓储（在上述的 config.sh 之前），藉由编辑 .userconfig 来做到这件事情<code>。</code>在举例来说，如果你要根据 mozilla-central 来编译：</p> - -<pre>export GECKO_PATH=/path/to/mozilla-central -export GECKO_OBJDIR=/path/to/mozilla-central/objdir-gonk -</pre> - -<div class="note"> -<p><strong>注意：</strong>如果是在 Mac OS X 中编译自定义版 Gecko 的话，文件系统会区分 mozilla-central 目录的大小写。</p> -</div> - -<p>注意，可以在你抓仓储之前（也就是在上述的 config.sh 之前）或之后几步。你也可以通过多个 UserConfig 的文件（使用不同的设置 - 当然每个都需要不同 OBJDIR）和编辑，保留多个构建（与调试等）。添加一个符号连接（symlink）指向一个配置（你想要使用哪个构建就指向那个配置）。</p> - -<p>欲了解更多信息，请阅读 <a class="vt-p" href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file#Changing_the_Gecko_source_tree" title="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file#Changing_the_Gecko_source_tree">Changing the Gecko source tree</a>。</p> - -<h2 id="建立一个分支">建立一个分支</h2> - -<p>如果你想要构建一个非默认的分支（<strong>注：默认分支可能不是“主干”</strong>），需要调用 config.sh 并前缀分支名称，像这样：</p> - -<pre>BRANCH=branch-name ./config.sh <device></pre> - -<p>分支名称应该是合乎逻辑的，主要是按照产品/版本的名称，比如<code>v1-train</code>、<code>v1.0.0、</code><code>v1.0.1、v1.1、v1.1.0hd、</code><code>v1.2，</code>以此类推。举个例子，在模拟器上构建 B2G Firefox 1.2，你需要键入：</p> - -<pre class="language-html">BRANCH=v1.2 ./config.sh emulator</pre> - -<p>如果你已经运行过 config.sh，可以通过去<code>B2G/.repo/manifests</code> 查看分支名称，或者用<code> “git branch -a</code>”，<strong>使用分支名在行的最尾端即可，如：“<code>v1-train</code>” 或 “<code>master</code>”：</strong></p> - -<pre> remotes/origin/master - remotes/origin/v1-train - remotes/origin/v1.0.0 - remotes/origin/v1.0.1</pre> - -<p>另外要了解更多关于定制，你可以查看 <a href="/en-US/docs/Mozilla/Firefox_OS/Customization_with_the_.userconfig_file" title="Mozilla/Firefox_OS/Customization_with_the_.userconfig_file">Customization with the .userconfig file</a> 。</p> - -<h2 id="复制你的_B2G_树(tree)到一台新机器">复制你的 B2G 树(tree)到一台新机器</h2> - -<p>如果你之前已经设置了 B2G tree，如果你又有了一代新电脑，想要把 B2G tree 从一台电脑转移到另一台电脑的话，你会发现至少比起重新配置整个事情更容易。</p> - -<p>要做到这一点，将你旧电脑的硬盘挂载到新电脑，然后敲入下面的命令，就可以了：</p> - -<pre>rsync -a <em>source</em>/ <em>dest</em>/ -</pre> - -<p><code>source</code> 是整个原码树(source tree)的完整路径（包括后面的斜线），而 <code>dest</code> 是你要复制到目标位置（同样也包含后面的斜线，它很重要！）。</p> - -<div class="note"><strong>注意：</strong>如果你采用把文件从一台电脑复制到另一台电脑的方法，应该确保在开始构建之前运行一次“./build.sh clean”。如果不这样做，可能会遇到编译问题。</div> - -<p>如果你采用了这个方法迁移代码，可以跳过本文余下的部份，然后直接跳到的“<a href="/zh-CN/docs/Mozilla/Firefox_OS/Building">构建</a>”部份。</p> - -<h2 id="更新你的B2G树">更新你的B2G树</h2> - -<p>当存储库更新到了新版本，你要更新你的B2G tree。./sync 命令不会更新你的B2G树。要做到这一点，你可以运行下面的命令：</p> - -<pre class="language-html">git fetch origin -git checkout origin/master</pre> - -<p>你可以运行一下命令，检查是否工作正常：</p> - -<pre class="language-html">git show HEAD</pre> - -<p>并检查提交的版本是否与最新提交版本显示匹配：<a href="https://github.com/mozilla-b2g/B2G/commits/master" title="https://github.com/mozilla-b2g/B2G/commits/master">https://github.com/mozilla-b2g/B2G/commits/master</a></p> diff --git a/files/zh-cn/archive/b2g_os/quickstart/index.html b/files/zh-cn/archive/b2g_os/quickstart/index.html deleted file mode 100644 index ebe1f7c220..0000000000 --- a/files/zh-cn/archive/b2g_os/quickstart/index.html +++ /dev/null @@ -1,49 +0,0 @@ ---- -title: Build -slug: Archive/B2G_OS/Quickstart -tags: - - NeedsTranslation - - TopicStub -translation_of: Archive/B2G_OS/Quickstart ---- -<div class="summary"> - <p>Quickstart information on coding open web apps.</p> -</div> -<dl> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/Intro_to_open_web_apps">Introduction to open web apps</a></dt> - <dd> - What are open web apps? How they differ from regular web pages? Why is this significant? This article aims to answer these questions and more.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/Your_first_app">Your first app</a></dt> - <dd> - This article takes you through the basic steps and additional knowledge on top of regular web development required to create installable open web apps.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/Intro_to_Firefox_OS">Introduction to Firefox OS</a></dt> - <dd> - An introduction to Firefox OS, Mozilla's new open web app-based mobile platform.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/Intro_to_manifests">Introduction to manifests</a></dt> - <dd> - An FAQ designed to answer any questions you may have about manifests, hosting apps, origins, and other such topics.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/For_Web_developers">App development for web developers</a></dt> - <dd> - If you're a web developer, how do open web apps differ from what you're used to? This article explains all.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/For_mobile_developers">App development for mobile developers</a></dt> - <dd> - If you're a native mobile application developer, what advantages can open web apps bring to you, and how do they differ from what you are used to? Here are some ideas.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/Developing_app_functionality">Developing app functionality</a></dt> - <dd> - This page talks about the kinds of different functionality that you might want to build into your apps, with links to further information.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/Payments">Payments</a></dt> - <dd> - How do you build functionality to make people pay for installing your open web apps? Here is the lowdown.</dd> - <dt> - <a href="/en-US/docs/Web/Apps/Quickstart/Build/App_tools">App tools</a></dt> - <dd> - Last for this section, we provide some links to more information on the tools available to help you develop great open web apps.</dd> -</dl> diff --git a/files/zh-cn/archive/b2g_os/quickstart/your_first_app/index.html b/files/zh-cn/archive/b2g_os/quickstart/your_first_app/index.html deleted file mode 100644 index 63c859ce8a..0000000000 --- a/files/zh-cn/archive/b2g_os/quickstart/your_first_app/index.html +++ /dev/null @@ -1,261 +0,0 @@ ---- -title: 你的第一个应用 -slug: Archive/B2G_OS/Quickstart/Your_first_app -translation_of: Archive/B2G_OS/Quickstart/Your_first_app ---- -<article class="brush: js"> -<div class="summary"> -<p>开放式Web应用让开发人员实现了期盼多年的夙愿：通过Firefox OS这一首款开放式Web应用平台，可以仅仅使用Html、CSS和JavaScript在跨平台的环境中生成可部署的应用。本手册包含了基本的架构和应用构建指南，你能够迅速掌握这些内容并开始创造自己的下一个伟大的应用！</p> -</div> - -<p>如果你想按照本指南开发，你可以下载我们的<a href="https://github.com/chrisdavidmills/mdn-app-template">快速入门应用模板</a>。还可以参阅<a href="/en-US/docs/Project:MDN/Style_guide/Sample_app_coding_guidelines#Apps_template">应用模板</a>指南找到更多有关其内容的介绍。</p> - -<h2 id="应用架构">应用架构</h2> - -<h3 id="打包型应用_VS._托管型应用">打包型应用 VS. 托管型应用</h3> - -<p>开放网络应用有两种类型：打包型和托管型。打包型应用本质上来说就是一个包含各种HTML、CSS、JavaScript、图像、清单（manifest）等应用资源的zip文件。托管型应用在一个给定域名的服务器上运行，就像是一个独立的网站。两种应用都需要有有效的清单。到了要在火狐市场中列出你的应用是，你要上传应用的zip文件或提供托管应用所在的URL</p> - -<div style="width: 480px; margin: 0 auto;"> -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/Q7x-B13y33Q?rel=0&html5=1"></iframe></div></div><p></p> - -<div class="video-caption"> -<p>Made in partnership with Treehouse: <a class="button" href="http://teamtreehouse.com/?cid=1154">Check them out!</a></p> -</div> -</div> - -<p>在本指南结束时，你将创建一个寄宿于本机（localhost）地址上的托管型应用。一旦你的应用准备好进入火狐市场，你可以选择把它作为打包应用打包或作为托管应用启动。</p> - -<h3 id="应用清单">应用清单</h3> - -<p>每一个火狐应用都需要一个位于应用根目录下的manifest.webapp文件， 这个文件提供与应用有关的重要信息，如：版本、名称、描述、图标地址、本地字符串、指明应用可以从哪儿被安装等等。只有名称和描述是必须的。应用模板中的简单清单如下所示：</p> - -<pre class="brush: js">{ - "version": "0.1", - "name": "Open Web App", - "description": "Your new awesome Open Web App", - "launch_path": "/app-template/index.html", - "icons": { - "16": "/app-template/app-icons/icon-16.png", - "48": "/app-template/app-icons/icon-48.png", - "128": "/app-template/app-icons/icon-128.png" - }, - "developer": { - "name": "Your Name", - "url": "http://yourawesomeapp.com" - }, - "locales": { - "es": { - "description": "Su nueva aplicación impresionante Open Web", - "developer": { - "url": "http://yourawesomeapp.com" - } - }, - "it": { - "description": "La tua nuova fantastica Open Web App", - "developer": { - "url": "http://yourawesomeapp.com" - } - } - }, - "default_locale": "en" -}</pre> - -<div style="width: 480px; margin: 0 auto;"> -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/dgAUgHQOm8M#t?rel=0&html5=1"></iframe></div></div><p></p> - -<div class="video-caption"> -<p>Made in partnership with Treehouse: <a class="button" href="http://teamtreehouse.com/?cid=1154">Check them out!</a></p> -</div> -</div> - -<p> </p> - -<p>一个基本的清单是你所需要最先上手的地方。关于清单的更多细节，见<a href="/en-US/docs/Web/Apps/Manifest">应用清单</a>。</p> - -<h2 id="应用布局设计">应用布局&设计</h2> - -<p>随着不同设备上屏幕分辨率标准的增多，响应式设计已经变得越来越重要。即使你应用的主要目标平台是移动平台比如Firefox OS，其他设备很有可能也会访问它。<a href="https://developer.mozilla.org/docs/CSS/Media_queries">CSS媒体选择（CSS media queries）</a>使你可以根据设备调整布局，如下的CSS样例中所示的结构：</p> - -<pre class="brush: css">/* The following are examples of different CSS media queries */ - -/* Basic desktop/screen width sniff */ -@media only screen and (min-width : 1224px) { - /* styles */ -} - -/* Traditional iPhone width */ -@media - only screen and (-webkit-min-device-pixel-ratio : 1.5), - only screen and (min-device-pixel-ratio : 1.5) { - /* styles */ -} - -/* Device settings at different orientations */ -@media screen and (orientation:portrait) { - /* styles */ -} -@media screen and (orientation:landscape) { - /* styles */ -}</pre> - -<p>有许多JavaScript和CSS的框架可以用于协助响应式设计和移动应用发展（<a href="http://twitter.github.com/bootstrap">Bootstrap</a>等），选择最适合你的应用和开发样式的框架即可。</p> - -<h2 id="Web_APIs">Web APIs</h2> - -<p>JavaScript APIs正随着设备即时的被开发和增强。Mozilla的<a href="https://wiki.mozilla.org/WebAPI">WebAPI</a>致力于为JavaScript APIs引入许多标准的移动端特性。设备支持状态列表可以在<a href="https://wiki.mozilla.org/WebAPI">WebAPI</a>页面中查看。JavaScript的特征检测依旧是最好的做法，如下例所示：</p> - -<pre class="brush: js">// If this device supports the vibrate API... -if('vibrate' in navigator) { - // ... vibrate for a second - navigator.vibrate(1000); -}</pre> - -<p>在下面这个例子中，<code><div>的显示样式会根据设备的电池状态的改变而改变：</code></p> - -<pre class="brush: java">// Create the battery indicator listeners -(function() { - var battery = navigator.battery || navigator.mozBattery || navigator.webkitBattery, - indicator, indicatorPercentage; - - if(battery) { - indicator = document.getElementById('indicator'), - indicatorPercentage = document.getElementById('indicator-percentage'); - - // Set listeners for changes - battery.addEventListener('chargingchange', updateBattery); - battery.addEventListener('levelchange', updateBattery); - - // Update immediately - updateBattery(); - } - - function updateBattery() { - // Update percentage width and text - var level = (battery.level * 100) + '%'; - indicatorPercentage.style.width = level; - indicatorPercentage.innerHTML = 'Battery: ' + level; - // Update charging status - indicator.className = battery.charging ? 'charging' : ''; - } -})();</pre> - -<p>在上面的示例代码中，一旦你确定设备支持<a href="https://developer.mozilla.org/en-US/docs/DOM/window.navigator.battery">Battery API</a>，你就可以为<code>chargingchange</code> 和 <code>levelchange</code>添加时间监听器来更新元素的样式。</p> - -<p>时常检查<a href="https://wiki.mozilla.org/WebAPI">WebAPI</a>页面以确保更新设备API的状态</p> - -<h3 id="Install_API功能">Install API功能</h3> - -<p>在我们的样例快速开始应用模板中，我们已经实现了一个安装按钮，可以在你把应用当作一个标准网页来浏览时可以单击它来把那个网站当作一个应用安装在Firefox OS上。按钮标签并没有什么特别的：</p> - -<pre class="brush: html"><button id="install-btn">Install app</button></pre> - -<p>按钮的功能由Install API实现（见install.js）：</p> - -<pre class="brush: js">var manifest_url = location.href + 'manifest.webapp'; - -function install(ev) { - ev.preventDefault(); - // define the manifest URL - // install the app - var installLocFind = navigator.mozApps.install(manifest_url); - installLocFind.onsuccess = function(data) { - // App is installed, do something - }; - installLocFind.onerror = function() { - // App wasn't installed, info is in - // installapp.error.name - alert(installLocFind.error.name); - }; -}; - -// get a reference to the button and call install() on click if the app isn't already installed. If it is, hide the button. -var button = document.getElementById('install-btn'); - -var installCheck = navigator.mozApps.checkInstalled(manifest_url); - -installCheck.onsuccess = function() { - if(installCheck.result) { - button.style.display = "none"; - } else { - button.addEventListener('click', install, false); - }; -}; -</pre> - -<p>我们来简要的看一下发生了什么：</p> - -<ol> - <li>我们得到一个安装按钮的引用并把它储存在<code>button变量中。</code></li> - <li>我们使用<code>navigator.mozApps.checkInstalled</code> 来检查这个由<code>http://people.mozilla.com/~cmills/location-finder/manifest.webapp这个清单来定义的应用是否已经安装在设备上。这个测试结果被储存在<code>installCheck这个变量中。</code></code></li> - <li>当测试成功完成时，它的成功完成事件被触发，因此<code>installCheck.onsuccess = function() { ... }会被执行。</code></li> - <li>然后我们用一个<code>if语句判断<code>installCheck.result是否存在。如果存在，以为着应用已经被安装了，隐藏安装按钮。</code></code>在应用已经被安装的情况下不需要安装按钮（废话>_<!）</li> - <li>如果应用没有被安装，为按钮添加一个单击事件监听器，所以在按钮被单击的时候<code>install()函数会被执行。</code></li> - <li>当单击按钮并且<code>install()函数执行时，我们把清单位置保存在一个叫<code>manifest_url的变量中，然后利用</code></code><code>navigator.mozApps.install(manifest_url)来安装应用，用一个<code>installLocFind变量来储存对那个安装的应用。你会注意到安装也会触发success和error事件，所以你可以根据应用是否成功安装来执行不同的动作。</code></code></li> -</ol> - -<p>第一次遇到可安装网络应用时你可能想要核实<a href="/en-US/docs/Web/Apps/JavaScript_API">API的执行状态</a>。</p> - -<div class="note"> -<p>注意：可安装开放网络应用有一个“每个来源（origin，感觉就是URL的意思）一个应用”的安全策略；基本上， 你不可以在一个来源上托管多个可安装应用。这会让检测变得有一点复杂，但是仍有很多办法解决这个问题，比如为应用创建多个子域名、用Firefox OS模拟器测试应用、或者在Firefox Aurora/Nightly上安装测试功能，通过这种方式你可以在桌面环境上安装开发网络应用。关于来源的跟多信息详见<a href="/en-US/docs/Web/Apps/FAQs/About_app_manifests">应用清单FAQ</a></p> -</div> - -<h2 id="WebRT_APIs_(基于权限的_APIs)">WebRT APIs (基于权限的 APIs)</h2> - -<p>有些WebAPI虽然可以使用但是需要特定的功能开启才具有使用的权限。应用可能会像下面这样在<code>manifest.webapp中</code>记录权限请求：</p> - -<pre class="brush: js">// New key in the manifest: "permissions" -// Request access to any number of APIs -// Here we request permissions to the systemXHR API -"permissions": { - "systemXHR": {} -}</pre> - -<p>权限分为下面三个等级：</p> - -<ul> - <li>一般权限——不需要任何特定访问权限的API。</li> - <li>特殊权限——只要开发者在应用清单文件中设置了访问权限就可以在应用中利用并通过可信任来源进行分发的API。</li> - <li>认证权限——控制力设备上关键功能的API，比如打电话和发短信的服务。这些一般不允许第三方开发者使用。</li> -</ul> - -<p>关于应用权限等级的更多信息，请阅读<a href="https://developer.mozilla.org/en-US/docs/Web/Apps/Packaged_apps#Types_of_packaged_apps" title="/en-US/docs/Web/Apps/Packaged_apps#Types_of_packaged_apps">打包型应用的类型</a>。你可以在<a href="/en-US/docs/Web/Apps/App_permissions">应用权限</a>中找到更多关于API要求权限和需要什么样的权限。</p> - -<div class="note"> -<p>有一点需要注意的很重要就是不是所有的Web API都在Firefox OS模拟器中实现了。</p> -</div> - -<h2 id="工具测试">工具&测试</h2> - -<p>测试在对移动应用的支持中是至关重要的。测试可安装开放网络应用有多种方式。</p> - -<h3 id="Firefox_OS_模拟器">Firefox OS 模拟器</h3> - -<p>安装和使用<a href="https://marketplace.firefox.com/developers/docs/firefox_os_simulator">Firefox OS模拟器 </a> 是启动和运行你的应用最简单的方式。在你安装模拟器之后，可以通过工具->web开发者->Firefox OS模拟器菜单来启动。模拟器启动时会有一个Javascript控制台，这样你就可以在模拟器中调试你的应用。</p> - -<h3 id="应用管理器">应用管理器</h3> - -<p>测试工具的新宠儿被称为<a href="/en-US/docs/Mozilla/Firefox_OS/Using_the_App_Manager">应用管理器</a>。这个工具允许你通过USB链接桌面火狐浏览器和一个可兼容性设备（或者一个Firefox OS模拟器），直接将应用推送到设备上，验证应用并且像运行在设备上一样的调试。</p> - -<h3 id="单元测试">单元测试</h3> - -<p>当在测试不同设备和版本时，单元测试就会非常有价值。jQuery的QUnit是一个流行的客户端测试工具，当然你也可以使用任何你喜欢的测试工具。</p> - -<h3 id="在设备上安装Firefox_OS">在设备上安装Firefox OS</h3> - -<p>既然Firefox OS是一个开源平台，代码和工具都可以用于在你自己的设备上构建和安装Firefox OS。构建和安装指南以及什么设备可以安装的注意事项可以在<a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Platform">MDN</a>上发现。</p> - -<p>特定的Firefox OS开发者预览版设备可以在<a href="https://marketplace.firefox.com/developers/dev_phone">开发者预览版手机页面</a>找到更多信息。</p> - -<h2 id="应用提交和分发">应用提交和分发</h2> - -<p>一旦你的应用完成，你可以像标准网站或应用一样托管它（更多信息请阅读<a href="/en-US/docs/Web/Apps/Publishing/Self-publishing_Apps">发布应用</a>），或者可以<a href="https://marketplace.firefox.com/developers/submit/app/manifest">发布</a>到<a href="https://marketplace.firefox.com">火狐市场</a>。你的应用清单将被验证并且你可以选择你的应用将支持的设备（比如：Firefox OS、桌面版火狐浏览器、移动版火狐浏览器、平板班火狐浏览器）。一旦验证通过，你可以为你的应用添加更多细节（截屏、描述、价格等）并且正式在火狐市场应用列表中提交应用。提交成功后，你的应用可以被任何人购买和安装。</p> - -<h3 id="更多商场上市信息">更多商场&上市信息</h3> - -<ol> - <li><a href="/en-US/docs/Web/Apps/Publishing/Submitting_an_app">向Firefox OS商场中提交应用</a></li> - <li><a href="/en-US/docs/Web/Apps/Publishing/Marketplace_review_criteria">市场审查标准 </a></li> - <li><a href="http://s.vid.ly/embeded.html?link=8k2n4w&autoplay=false">应用提交演练视频 </a></li> -</ol> -</article> diff --git a/files/zh-cn/archive/b2g_os/quickstart/开源web应用程序简介/index.html b/files/zh-cn/archive/b2g_os/quickstart/开源web应用程序简介/index.html deleted file mode 100644 index bb2a8127cd..0000000000 --- a/files/zh-cn/archive/b2g_os/quickstart/开源web应用程序简介/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: 开源Web应用程序简介 -slug: Archive/B2G_OS/Quickstart/开源Web应用程序简介 -translation_of: Archive/B2G_OS/Quickstart/Intro_to_open_web_apps ---- -<div class="note"> -<p><strong>Note</strong>: The Quickstart section has been updated with a <a href="/en-US/Apps/Quickstart">new, more focused Quickstart article</a>, which replaces all the previous Quickstart articles. We hope you'll find this more useful, and a quicker learning experience than the older set of articles.</p> -</div> - -<p><img alt="Multi devices" src="/files/4523/multidevices.png" style="width: 640px; height: 225px;"></p> - -<div class="summary"> -<p>本文的目的是为那些希望学习更多关于开放式Web应用程序的人提供一个良好的起点，无论你是开发人员或者项目经理，或者应用程序开发或交付中的其他角色。在这里我们将提供一个简洁、更深层次的关于Web应用程序的概述，以及其背后的理念。</p> -</div> - -<p>开放的Web应用程序本质上同标准的网站或页面是没有什么不同的。它们是用标准的开放的网络技术---- HTML，CSS，Javascript 等等。----并且可以使用浏览器访问。主要的区别是它们可以安装到<span>设备并且可以脱机工作，并使用先进的API用于与设备进行交互，如相机，地址簿，和其他类似的东西。此外，它们几乎都是尽可能用开放的技术开发的。区别在于平台技术的实现，努力确保两者都支持，其一：通过不同的平台相结合的特征检测和适当的代码，其二：优美的退化。</span></p> - -<h2 id="开放式Web应用程序的优势">开放式Web应用程序的优势</h2> - -<p>我们来看一看关于开放式Web应用程序优势的一些细节：</p> - -<ul> - <li>本地安装和离线存储: 开放式Web应用程序可以安装在设备上及像本地安装和IndexedDB 有效的API上，以提供本地资料储存的容量。此外, 开放式Web技术倾向比原生apps更小的台面空间以及自动升级generally be updated automically rather than having to install a complete new package each time there's an update. (an exception to this is packaged apps, which require a whole new package when updating.) Apps are therefore less dependent on an always-on Web connection, and more useful when networks are patchy.</li> - <li><strong>Hardware access</strong>: The metadata provided with Open Web Apps can be used to grant the application permission to privileged APIs that enable usage of device hardware features, something the Web platform has not traditionally enjoyed.</li> - <li><strong>Breaking the walled gardens</strong>: The norm for mobile platforms tends to be be walled gardens written with proprietary technologies, so apps are locked inside their platforms. And smartphones tend to be expensive, and require credit cards for app purchases. Open Web Apps tend to be able to run on much cheaper hardware, especially in the case of Firefox OS devices where you've literally just got Firefox running on top of a lightweight Linux kernel. And they are written using open Web technologies, which is the most distributed platform around. In addition, Firefox OS devices feature payment systems where you can simply prepay for apps, or add the cost to your phone bill.</li> - <li><strong>Open Web App stores</strong>: Following on from the previous point, you can choose to host your apps in an existing marketplace (such as the <a href="https://marketplace.firefox.com/">Firefox Marketplace</a>), or host them somewhere else entirely. It's up to you. Mozilla aims to put the developer back in control of every aspect of the app experience — from easy development to distribution to direct customer relationship management. And the apps can be searched for just like any other Web-based experience.</li> -</ul> - -<p>The following video also looks at general advantages of open web apps, and developing for the Firefox OS platform:</p> - -<p style="text-align: center;"></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/RJJkFshnnVc?rel=0&html5=1"></iframe></div></div><p></p> - -<h2 id="The_Web_is_the_platform">The Web is the platform</h2> - -<p>An open web app as it exists as installed on a platform like Firefox OS is not a bookmark — it’s a proper part of the system. Open Web Apps hold that great promise. They are an opportunity that we should not miss, otherwise the Web might become fragmented once more. With this in mind it should be made clear that Open Web Apps (OWA in short) are intended to be standardized and to become part of "the Web". If successful, OWA should eventually work on all browsers, operating systems and devices.</p> - -<p>At Mozilla we are working hard to create this apps platform that is backed entirely by the open Web. It’s not intended to be a “Mozilla platform” or a “Firefox platform”. <strong>The Web is the platform</strong>. We’re creating a set of open APIs and implementations to show how portable apps can exist on the Web without vendor lock-in. Other groups like Facebook and Google Chrome are also working on apps platforms backed by the Web. <a href="https://developers.facebook.com/docs/guides/canvas/">Facebook apps</a> are meant to hook into Facebook and <a href="http://www.google.com/intl/en/chrome/webstore/apps.html">Chrome apps</a> are designed for Chrome OS devices and Google servers. Chrome apps are the most similar to Open Web Apps. We continue to collaborate with the Google Chrome team as app standards evolve and we definitely share a lot of the same vision. There is tremendous potential for all Web based app platforms to converge and we invite all vendors to help us build the right Open Web App APIs.</p> - -<p>Even though currently you must have a Mozilla Firefox-based engine ("Web runtime") to use Open Web Apps, it is not intended that this always will be the case. Many parts of the Open Web Apps project are still being worked out and it isn't possible to implement everything in all browsers at once. Although many parts of Open Web Apps are already standardized, many other parts are still in flux. It is intended and hoped that Open Web Apps will be a standard capability that is available in all major browsers.</p> - -<p>Therefore, when you read the MDN pages that deal with Open Web Apps, please keep in mind that even though much of the information is specific to Firefox right now, it will hopefully enable you to develop Open Web Apps for all browsers in the future.</p> - -<h2 id="Web_standards">Web standards</h2> - -<p>OWA technology is not a single piece, it is an umbrella that groups many different technologies and some of them are very young. At the moment, parts of OWA are standardized (HTML5, CSS, JavaScript, IndexedDB, etc.). Other parts are not yet standardized and the Mozilla implementation is thus specific to Firefox or to some other Mozilla technology. As the Mozilla mission is to share and to empower everyone, this situation is only temporary. That's why in the OWA docs we will try to clearly identify the parts of OWA that are not yet standardized.</p> - -<p>Please also note that there may be some OWA-related proposals and potential standards that are not used by Mozilla.</p> - -<h3 id="Intended_eventual_standards">Intended eventual standards</h3> - -<p>So here are the parts not standardized yet across the different Web platforms and that still are Firefox-only for the moment:</p> - -<ul> - <li><a href="/en-US/docs/Web/Apps/Manifest">OWA manifest</a> for defining an app</li> - <li><a href="/en-US/docs/Web/Apps/JavaScript_API">The Complete OWA API</a> for working with apps</li> - <li><a href="https://wiki.mozilla.org/WebAPI">Web APIs</a> to access things like phone, geolocation, etc. Also see <a href="http://arewemobileyet.com/">arewemobileyet.com</a> for a status report.</li> - <li><a href="/en-US/docs/Mozilla/Persona">Identity (Persona)</a> to work with user data</li> - <li><a href="https://wiki.mozilla.org/WebAPI/WebPayment">WebPayment API</a> to facilitate in-app payments and app purchases from any Marketplace</li> - <li><a href="https://wiki.mozilla.org/Apps/WebApplicationReceipt">OWA Receipts</a> to verify paid apps on any device and sell apps from any Marketplace</li> -</ul> - -<h3 id="Marketplace">Marketplace</h3> - -<h4 id="Buy_Once_Run_Everywhere">Buy Once, Run Everywhere</h4> - -<p>From the ground up Mozilla has been building an apps system that lets users buy an app once and run it on all of their HTML5 devices. Very soon Mozilla will <a href="http://bits.blogs.nytimes.com/2012/09/07/a-firefox-smartphone-for-the-poor/">launch the first Firefox OS phone</a> but that will be just one device on which to run your apps. When you purchase an app through the <a href="https://marketplace.firefox.com/">Firefox Marketplace</a>, the system installs a receipt on your device. The <a href="https://wiki.mozilla.org/Apps/WebApplicationReceipt">receipt</a> is a JSON Web Token with metadata that links to the Marketplace’s public key and its verification service URL. When an app starts up it can verify the receipt but the receipt on the device <em>is not tied</em> to the Firefox Marketplace. The receipt is just a cryptographically verifiable proof of purchase. Anyone can sell open Web apps if they follow the receipt specs. <strong>When you buy an app, it is intended to be portable across any device that supports the Open Web Apps system.</strong></p> - -<p>Mozilla is building the infrastructure needed to run Open Web Apps on any HTML5 device. <a href="http://www.mozilla.org/en-US/firefox/mobile/features/">Firefox for Android</a> will let you install and run apps (you can try it today on the <a href="http://nightly.mozilla.org/">nightly</a> build). Installed app icons go to your home screen just like regular Android apps. You can also install and run Web apps on your Windows, Mac, or Linux desktop using Firefox (this currently works in the <a href="http://nightly.mozilla.org/">nightly</a> build). Currently some version of Firefox is required, but it is intended that the Open Web Apps system will eventually be supported by all major browsers as a set of standards. From day one Mozilla has included all major HTML5 compliant browsers in its proof of concepts; you can take a look at this hosted JavaScript <a href="https://persona.org/include.js">shim</a> for ideas on how to support the apps platform on a non-Firefox browser.</p> - -<p>In the future the Open Web Apps system will support <a href="http://docs.services.mozilla.com/aitc/">syncing your installed apps</a> across devices. Since receipts are portable you could just sync them yourself if you wanted to. In case it’s not obvious, you can always run a free open Web app in any browser because it is no different than a website. It might, however, use new <a href="https://wiki.mozilla.org/WebAPI/">mobile specific web APIs</a> which are not implemented on all platforms.</p> - -<p>The video below provides a useful overview of the advantages of open marketplaces and an open web approach to app discovery:</p> - -<p style="text-align: center;"></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/QCH_ncCrZfE?rel=0&html5=1"></iframe></div></div><p></p> - -<h3 id="WebPayment_API">WebPayment API</h3> - -<h4 id="Commerce_For_Apps">Commerce For Apps</h4> - -<p>Part of the success of mobile app platforms like iOS and Android is that they make it very easy to try out new business models through mobile payments. Those models are still evolving but commerce is no doubt something that, at the moment, is awkward on the desktop Web and more natural on mobile. Specifically, it’s very convenient to charge something to your phone bill when you’re already accessing it from your phone anyway. With the launch of Firefox OS, the apps ecosystem will support app purchases and in-app payments through the <a href="https://wiki.mozilla.org/WebAPI/WebPayment" style="">WebPayment API</a>. Supporting commerce is crucial for the growth of an apps platform. <strong>The use of the proposed payment API is completely <em>optional</em></strong>. Mozilla won’t prevent any app from using its own in-app payment system.</p> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="https://blog.mozilla.org/webdev/2012/09/14/apps-the-web-is-the-platform/">Apps: The Web Is The Platform</a>, by Kumar McMillan (the blog post from which lots of the content of this article is borrowed)</li> - <li><a href="https://plus.google.com/113127438179392830442/posts/fR3iiuN4kEF">See the Web platform succeed for applications</a>, by Paul Irish</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/running_tests_on_firefox_os_for_developers/index.html b/files/zh-cn/archive/b2g_os/running_tests_on_firefox_os_for_developers/index.html deleted file mode 100644 index c7b64d1573..0000000000 --- a/files/zh-cn/archive/b2g_os/running_tests_on_firefox_os_for_developers/index.html +++ /dev/null @@ -1,58 +0,0 @@ ---- -title: '在 Firefox OS 中运行测试程序: 开发者指南' -slug: Archive/B2G_OS/Running_Tests_on_Firefox_OS_for_Developers -translation_of: Archive/B2G_OS/Running_Tests_on_Firefox_OS_for_Developers ---- -<div class="summary"> - <p>在我们自动化测试背后的团队一直在非常努力的对自动化测试的框架进行扩展以及构建了一个专门针对手机系统测试的框架以适应 Firefox OS 的需求。由于 Firefox OS 架构的关系，所有测试框架都可以工作和使用，但是也会使事情变得更复杂. 您时一名开发者，只是想运行一些测试来验证您的 patch 是否能正常工作。本文旨在对 Mozilla 中所有有效的测试资源进行梳理。</p> -</div> -<h2 id="入门">入门</h2> -<p>如果您是一位 Gecko 开发者，则需要对您已经熟悉的有关 Firefox OS 特定的自动化测试文档进行回顾： <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Mochitests">mochitest</a>, <a href="/en-US/docs/Mozilla/Firefox_OS/Platform/Automated_testing/Reftests">reftest</a>, 和 <a href="https://developer.mozilla.org/en-US/Firefox_OS/Platform/Automated_testing/XPCShell">xpcshell</a>.</p> -<p>如果您是一位 Gaia App 开发者，或者是一位 Gecko 开发者，但是对更深层次的终端用户样式测试感兴趣，则需要了解下 Gaia 测试套件。 一共有两个主测试套件：</p> -<ul> - <li><a href="/en-US/Firefox_OS/Platform/Automated_testing/gaia-ui-tests">Gaia UI 测试</a>: 这些测试以基于 Python 的， 可以运行在桌面和设备上。这些测试会兼顾到 Gaia UI 的各个方面，例如耐久性测试（在 Contacts 应用中添加许多联系人， 重复多次执行锁屏界面的解锁动作， 在 Alarm 应用中设置许多闹钟等），功能性测试（例如在 FM 收音机中收台， 使用 Camera app 来拍照）以及可访问性测试（例如，使能和禁止屏幕阅读器）。</li> - <li><a href="https://github.com/mozilla-b2g/gaia/#integration-tests">Gaia 集成测试</a>: 这些测试是基于 JavaScript， 使用 <a href="https://github.com/mozilla-b2g/marionette-js-runner">marionette-js-runner</a>，现在仅支持 B2G 桌面版本（对实际设备的支持也即将实现）。由于 Gaia 与其他 app 和服务进行交互的内容不同， 这些测试也会有区别。例如，Calednar app 是否可以成功的添加一个 CalDAV 服务器， 或者 Browser app 是否成功处理与搜索引擎的交互。</li> -</ul> -<p>可以依据您喜爱的工具链，以及测试的内容来决定究竟要选择何种测试。</p> -<p>让我们现在来查看和运行这些测试。</p> -<h2 id="运行_Gaia_UI_测试">运行 Gaia UI 测试</h2> -<p>The <a href="https://github.com/mozilla-b2g/gaia/tree/master/tests/python/gaia-ui-tests">Gaia UI Test</a> suite can be run on real devices and B2G Desktop builds, but in this section we'll concentrate on running them on a real device, as real devices are always best where possible.</p> -<p>Note that this test is <em><strong>destructive</strong></em> and as such, you should back up anything you care about on the phone before running these tests. Depending on which tests you run, they can also make phone calls. So be aware that you want to be very careful about what you run and how you back up the phone, remove the SIM card, etc. That said, if you've already created an engineering build they are really easy to get running. Here's how.</p> -<h3 id="One_Time_Set_up">One Time Set up</h3> -<p>You only need to perform the following steps once, assuming you do not change the location of your Gaia directory. Create a python virtualenv (<a href="https://pypi.python.org/pypi/virtualenv">install the virtualenv tool</a> first if you haven't already), activate it, and install the gaia UI test tool into your virtualenv. By creating the virtual environment using the steps below, you ensure that you are running the gaia UI test harness code that lives in your Gaia repo (that's useful in case you need to debug anything).</p> -<pre><code class="brush: bash">$ virtualenv gaia_ui_venv # This will create a gaia_ui_venv directory where the virtual environment lives. It can be anywhere on your system. -$ source gaia_ui_venv/bin/activate # This activates our virtualenv -(gaia_ui_venv)$ cd <b2groot>/gaia/tests/python/gaia-ui-tests;python setup.py develop # This installs the gaia ui harness into your virtual environment. </code></pre> -<p>If you have already created a virtual environment for gaia ui tests, you can simply do the following:</p> -<pre><code class="brush: bash">$ source gaia_ui_venv/bin/activate</code></pre> -<h3 id="To_Run_the_Tests">To Run the Tests</h3> -<p>First you need to create the testvars file. To do this, copy the standard one over, and add in the attributes to turn off the warnings that this test will <strong>destroy all content on your phone</strong>. These are good tests, they leave no state around and as such, you will need to make sure your phone is backed up before running them. Instructions from here on will assume you've activated the virtual environment and are working in the <code>gaia/tests/python/gaia-ui-tests</code> directory.</p> -<pre><code class="brush: bash">(gaia_ui_venv)$ cp gaiatest/testvars_template.json testvars.json -# Now edit your copy of testvars.json and add in the following attributes into the json: -"acknowledged_risks": true, -"skip_warning": true,</code></pre> -<p>Now you just need to connect our phone via USB, forward the marionette port so your test runner can access it and run our tests. The tests are in <code>gaiatest/tests</code> and you can pick whichever one you want to run. For example, if you wanted to run contacts tests you would do the following:</p> -<pre><code>(gaia_ui_venv)$ adb forward tcp:2828 tcp:2828 -(gaia_ui_venv)$ gaiatest --testvars=testvars.json --address=localhost:2828 gaiatest/tests/functional/contacts/</code></pre> -<div class="note"> - <p><b>注意</b>: To find out what UI tests are available, browse through the <a href="https://github.com/mozilla-b2g/gaia/tree/master/tests/python/gaia-ui-tests/gaiatest/tests">gaiatest directories inside the Gaia repo</a>.</p> -</div> -<p>To get out of the python virtualenv, just use the special virtualenv command <code>deactivate</code>:</p> -<pre><code>(gaia_ui_venv)$ deactivate -$</code></pre> -<div class="note"> - <p><b>注意</b>: To learn more about the Gaia UI Tests and find more detailed information, move on to the <a href="/en-US/Firefox_OS/Platform/Automated_testing/gaia-ui-tests">Gaia UI Tests</a> pages.</p> -</div> -<h2 id="运行_Gaia_集成测试">运行 Gaia 集成测试</h2> -<p>To run the <a href="https://github.com/mozilla-b2g/gaia/#integration-tests">Gaia Integration tests</a> tests you currently have to use a B2G Desktop build (note that these are also going to be available for devices soon as well). Let's look at how this is done.</p> -<p>These just require a Gaia tree and NodeJS to be installed on your computer; the following command will do the rest:</p> -<pre><code>$ cd gaia $ make test-integration </code></pre> -<p>That's it — this instruction will download a B2G desktop build, and start running the tests in that build.</p> -<div class="note"> - <p><strong>注意</strong>: To learn more about Gaia Integration Tests, read the <a href="https://github.com/mozilla-b2g/gaia/#integration-tests">Gaia Integration Tests</a> Github repo.</p> -</div> -<div class="note"> - <p><b>注意</b>: To find out what integration tests are available, look in the <a href="https://github.com/mozilla-b2g/gaia/tree/master/apps">apps directory in the Gaia repo</a>; integration tests can be found in <code>test/marionette/</code> subfolders.</p> -</div> -<h2 id="总结">总结</h2> -<p>As always, work is underway to make all our tests easier to run both locally for developers as well as in our automation systems. Feel free to drop into the #ateam channel any time you have questions about test automation for Firefox OS or any of the Mozilla automation tools.</p> diff --git a/files/zh-cn/archive/b2g_os/screencast_series_colon__app_basics_for_firefox_os/index.html b/files/zh-cn/archive/b2g_os/screencast_series_colon__app_basics_for_firefox_os/index.html deleted file mode 100644 index 4193506bed..0000000000 --- a/files/zh-cn/archive/b2g_os/screencast_series_colon__app_basics_for_firefox_os/index.html +++ /dev/null @@ -1,219 +0,0 @@ ---- -title: 'Screencast series: App Basics for Firefox OS' -slug: 'Archive/B2G_OS/Screencast_series:_App_Basics_for_Firefox_OS' -translation_of: 'Archive/B2G_OS/Firefox_OS_apps/Screencast_series:_App_Basics_for_Firefox_OS' ---- -<div class="summary"> -<p><span class="seoSummary"><a href="http://www.mozilla.org/en-US/firefox/os/">Firefox OS</a> is an operating system that brings the Web to mobile devices. Instead of being a new OS with new technologies and development environments it builds on standardised web technologies that have been in use for years now. If you are a web developer and you want to build a mobile app, Firefox OS gives you the tools to do so, without having to change your workflow or learn a totally new development environment. In this collection of short videos, developers from Mozilla and Telenor met in Oslo, Norway to explain in a few steps how you can get started to build applications for Firefox OS.</span></p> -</div> - -<p>In this series you’ll learn:</p> - -<ul> - <li>How to build your first application for Firefox OS.</li> - <li>How to debug and test your application both on your desktop and a real device.</li> - <li>How to get it listed in the <a href="/en-US/Marketplace">Firefox Marketplace</a>.</li> - <li>How to use the APIs and special interfaces Firefox OS offers a JavaScript developer to take advantage of the hardware available in smartphones.</li> -</ul> - -<div class="note"> -<p><strong>Note</strong>: Each of the screencasts is short enough to get through in a short break; the whole series should not take more than an hour to watch.</p> -</div> - -<h2 id="Code_and_development_environment">Code and development environment</h2> - -<p>In addition to the screencasts, you can download the accompanying <a href="https://github.com/comoyo/fxos-video-script/">code samples from GitHub</a>. If you want to try the code examples out for yourself, you will need to set up a very simple development environment. All you need is:</p> - -<ul> - <li>A current version of <a href="https://www.mozilla.org/en-US/firefox/">Firefox</a>, which comes out of the box with the developer tools you need — we recommend getting <a href="http://www.mozilla.org/en-US/firefox/aurora/">Firefox Aurora</a> or <a href="https://nightly.mozilla.org/">Nightly</a> if you really want to play with the state-of-the-art technology.</li> - <li>A text editor — in the screencasts we used <a href="http://www.sublimetext.com/">Sublime Text</a>, but any will do. If you want to be really web native, you can try <a href="http://brackets.io/">Adobe Brackets</a>.</li> - <li>A local server or a server to push your demo files to. A few of the demo apps need HTTP connections instead of local ones.</li> -</ul> - -<h2 id="Introducing_the_series">Introducing the series</h2> - -<p>The series features <a href="http://twitter.com/janjongboom">Jan Jongboom (@janjongboom)</a> and <a href="http://twitter.com/sergimansilla">Sergi Mansilla (@sergimansilla)</a> of Telenor Digital, and <a href="http://twitter.com/codepo8">Chris Heilmann (@codepo8)</a> of Mozilla; it was shot in three days in Oslo, Norway at the Telenor head office in February 2014.</p> - -<p>Here are the three of us telling you about the series and what to expect:</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/bp87xaLI0h4?rel=0&html5=1"></iframe></div></div><p></p> - -<h2 id="Section_1_Building_your_first_Firefox_OS_app_and_getting_it_published">Section 1: Building your first Firefox OS app and getting it published</h2> - -<p>In Section 1's five screencasts we show you how to build a Firefox OS application, how to debug and test it on your computer — and on a real device, and how to get it listed in the <a href="https://marketplace.firefox.com/">Firefox Marketplace</a>. This may sound like a lot of work, but you will soon find out that if you already know how to build a website, you are 90% of the way there already.</p> - -<h3 id="More_than_a_website">More than a website</h3> - -<p>Firefox OS applications are HTML5 applications. In essence, these use the same technologies as websites do. You can start writing a website and turn it into an app simply by giving it a manifest file (see <a href="#The_app_manifest">The app manifest</a> for more details). This tells Firefox OS that you are writing an app and allows you to:</p> - -<ul> - <li>List the app in the marketplace.</li> - <li>Get access to the hardware of the device it runs on, to gather information such as <a href="/en-US/docs/Web/API/Geolocation">Geolocation</a> and <a href="/en-US/Apps/Build/gather_and_modify_data/Keep_it_level_responding_to_device_orientation_changes">Device Orientation</a>.</li> - <li>Much more!</li> -</ul> - -<p>In essence, HTML5 applications are supercharged websites and should follow the same rules, such as:</p> - -<ul> - <li>Progressive enhancement: Test to see if what you want to use is really available before trying to access it.</li> - <li>Adapting to their environment: For example using <a href="/en-US/docs/Web/Guide/CSS/Media_queries">media queries</a> and <a href="/en-US/Apps/app_layout/responsive_design_building_blocks#Responsive_images.2Fvideo">responsive images</a> to optimize apps for different screen sizes, resolutions and available network speeds.</li> - <li>Using <a href="/en-US/docs/Web/HTML">HTML</a>, <a href="/en-US/docs/Web/CSS">CSS</a> and <a href="/en-US/docs/Web/JavaScript">JavaScript</a> as the core technologies.</li> -</ul> - -<p>The main difference is that for a web page to become a great application, you should very much consider mobile users. This means first and foremost that your application should:</p> - -<ul dir="ltr"> - <li><a href="/en-US/Apps/Build/Offline">Work offline</a>.</li> - <li>Allow your users to do one thing and have an interface that makes that easy.</li> - <li>Play nicely with the battery life, and processor speed.</li> -</ul> - -<p>In many cases, this means you need to slim your web page down a bit and simplify the interface. The good news is that all your users will benefit from that.</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/fBJmUreevRU?rel=0&html5=1"></iframe></div></div><p></p> - -<div class="note"> -<p><strong>Note</strong>: To find out more about how to design a good HTML5 App, check out the <a href="/en-US/Apps">App Center on MDN</a>.</p> -</div> - -<h3 id="The_app_manifest">The app manifest</h3> - -<p>The <a href="/en-US/Apps/Build/Manifest">App Manifest in Firefox OS</a> is a simple JSON file that tells the operating system about your app. In essence, this is what turns a web page into an <a href="https://developer.mozilla.org/en-US/Apps/Quickstart/Build/Intro_to_open_web_apps">Open Web App</a>. In it, you define the name in different locales and you ask the operating system to get access to various services and hardware. You can also define the preferred orientation of your app and — if needed — lock it.</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/txyux8RZrxY?rel=0&html5=1"></iframe></div></div><p></p> - -<p>More information about the manifest and tools that can help you:</p> - -<ul> - <li>The <a href="https://marketplace.firefox.com/developers/validator">Open Web Apps Manifest Validator</a> — also available as an <a href="http://firefox-marketplace-api.readthedocs.org/en/latest/">API</a>.</li> - <li>The <a href="/en-US/Apps/Build/Manifest">MDN documentation on the Open Web Apps Manifest</a> — includes information on how to serve a manifest from your own server.</li> -</ul> - -<h3 id="The_App_Manager">The App Manager</h3> - -<p>The simplest way to get started with Firefox OS is to try out the <a href="https://developer.mozilla.org/en-US/Firefox_OS/Using_the_App_Manager">App Manager</a>. This tool stands alongside the <a href="https://developer.mozilla.org/en-US/docs/Tools/">Firefox developer tools for desktop</a> and allows you to connect to a Firefox OS simulator running on your computer, or a real Firefox OS device if you have one available. From there, you can play with Firefox OS, install apps straight onto the simulator or real device, and debug them as they are running on Firefox OS — seeing the live changes immediately without needing to uninstall or update apps.</p> - -<p>The following video provides first steps with using the App Manager along with the simulator:</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/wiROpnExj-A?rel=0&html5=1"></iframe></div></div><p></p> - -<div class="note"> -<p><strong>Note</strong>: The App Manager allows you to debug your own applications even when you're offline, without any hassle.</p> -</div> - -<p>More information about the App Manager:</p> - -<ul> - <li>The <a href="https://developer.mozilla.org/en-US/Firefox_OS/Using_the_App_Manager">App Manager documentation on MDN.</a></li> - <li>Introductory <a href="https://hacks.mozilla.org/2013/10/introducing-the-firefox-os-app-manager/">blog post on Mozilla Hacks.</a></li> -</ul> - -<h3 id="Testing_on_a_Real_Device">Testing on a Real Device</h3> - -<p>Testing your applications in the simulator is nice, but it only gets you as far as a simulated environment can. If you want to test the performance of the app interaction, or react to things like device orientation, you need a real device. Together with the developer tools and the App Manager, you can use the device and get detailed insight into what happens to your application as you use it.</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/OIUQwqQMVZM?rel=0&html5=1"></iframe></div></div><p></p> - -<h3 id="Publishing_to_Marketplace">Publishing to Marketplace</h3> - -<p>The <a href="http://marketplace.firefox.com/">Firefox OS Marketplace</a> is the most convenient place to list your application and make it available to people on their devices and the Web. The Marketplace also allows you to list your app for other platforms like Firefox Desktop and Firefox for Android. You can also allow users to rate your app, give you feedback, and buy your application using a simple checkout process. Getting your app listed is simple:</p> - -<ul> - <li>Submit the marketplace URL to your manifest file.</li> - <li>Add a description of your app (which also helps people to find it amongst the many other available apps.)</li> - <li>Provide screenshots or videos to demonstrate your app's functionality.</li> - <li>Pick a category for your application.</li> - <li>Provide us with an email address to contact you on.</li> - <li>Provide end users with a link to your privacy policy and a support web site.</li> - <li>Provide a <a href="/en-US/Marketplace/Submission/Rating_Your_Content">content rating</a> for your application.</li> -</ul> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/gipaEJTM3TU?rel=0&html5=1"></iframe></div></div><p></p> - -<p>Applications submitted to the Marketplace are reviewed by Mozilla's app review team and you will be notified of the state of your submission within a few days. If there are issues with your application you will get a validation message during the submission but you might also get a human readable explanation of what is wrong and how to fix it.</p> - -<div class="note"> -<p><strong>Note</strong>: Read <a href="/en-US/Marketplace/Submission/Submitting_an_app">Submitting an application to the Firefox Marketplace</a> for more information about the submittion process.</p> -</div> - -<h2 id="Section_2_Advanced_Firefox_OS_topics">Section 2: Advanced Firefox OS topics</h2> - -<p>In the first few videos we introduced you to Firefox OS and how to build your first app. We also covered how to debug your application on desktop — and on a real device — and how to get your app listed in the Firefox Marketplace. In the remaining five videos we’ll deep-dive into the technologies that enable Firefox OS apps to go that extra mile and give you access to the functionality that makes developing for a smartphone or tablet interesting to developers. Whilst some of these technologies are currently only working in Firefox OS, they are all open source and submitting as standards proposals. Working with these APIs today will mean you are ready for other devices and platforms emerging in the near future.</p> - -<h3 id="Web_APIs">Web APIs</h3> - -<p>Smartphones are full of great technology — cameras, accelerometer, and GPS to name but a few. The problem was that all of these were not accessible by web technologies — if you wanted to access them, you needed to write native applications. To fix this, Mozilla and partners defined a set of APIs to allow developers to reach deep into the hardware of a mobile devices using JavaScript in a secure manner. These are called <a href="https://wiki.mozilla.org/WebAPI">Web APIs</a> and are defined in the open and available for others to implement. Firefox OS is the first platform that uses them; the below screencast explains more:</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/p0DWpWNTd7w?rel=0&html5=1"></iframe></div></div><p></p> - -<p>More information about Web APIs:</p> - -<ul> - <li>The <a href="https://wiki.mozilla.org/WebAPI">Wiki Page describing the ongoing work and state of implementation</a> — also includes links to standards they are based on.</li> - <li><a href="https://hacks.mozilla.org/category/webapi/">Posts on Mozilla Hacks</a> dealing with the subject of WebAPIs.</li> -</ul> - -<h3 id="Web_Activities">Web Activities</h3> - -<p><a href="https://wiki.mozilla.org/WebAPI/WebActivities">Web Activities</a> are an alternative way to access the hardware of a device. Instead of getting an API to speak to the device directly, Web Activities allow you to create an ecosystem of applications on the device that talk to each other and share capabilities. For example, instead of trying to access the camera directly, your app can use a Web Activity to ask for an image and the user of the device can use their favourite application to take a photo, which is then returned to the app that requested it.</p> - -<p>Instead of asking the users for access to their hardware (which is important in terms of security), you allow them to use applications they already trust to carry out such functions. Furthermore, you can register your application as the go-to application for certain tasks in the operating system. You can think of Web Activities as being equivalent to right/Ctrl + clicking on a file in a Desktop OS and choosing which application to open the file with. You are given several choices, plus on option to tell the OS to always use this app to open this file type from now on.</p> - -<p>Web Activities allow apps to talk to each other — on the device, without any need for a server in between. All they transmit from one app to the other is the final data.</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/CQODL9AGKv0?rel=0&html5=1"></iframe></div></div><p></p> - -<p>More information about Web Actitivies:</p> - -<ul> - <li>The <a href="https://wiki.mozilla.org/WebAPI/WebActivities">Web Activities Wiki Page</a></li> - <li><a href="/en-US/docs/WebAPI/Web_Activities">Web activities reference on MDN</a></li> - <li>An <a href="https://hacks.mozilla.org/2013/01/introducing-web-activities/">Introduction to Web Activities</a> on Mozilla Hacks</li> -</ul> - -<h3 id="Push_Notifications">Push Notifications</h3> - -<p>Push Notifications — invoked using the <a href="https://wiki.mozilla.org/WebAPI/SimplePush">SimplePush Web API</a> — are a way to make applications wake up when a device receives a certain message. This allows you to build applications that can stay closed — thus saving battery — until they are needed. Notifications created this way also have the benefit of carrying no data, thus Mozilla will never get the information of your app and attackers won't be able to listen in.</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/qpgNIsJ2pg4?rel=0&html5=1"></iframe></div></div><p></p> - -<p>More information about Push Notifcations using SimplePush:</p> - -<ul> - <li>The <a href="https://wiki.mozilla.org/WebAPI/SimplePush">SimplePush Wiki Page </a></li> - <li><a href="/en-US/docs/WebAPI/Simple_Push">Simple Push guide on MDN</a></li> - <li>An<a href="https://hacks.mozilla.org/2013/07/dont-miss-out-on-the-real-time-fun-use-firefox-os-push-notifications/"> introduction to SimplePush</a> on Mozilla Hacks</li> -</ul> - -<h3 id="Offline_functionality">Offline functionality</h3> - -<p>Apps are not much use if they don't work offline. That's partly why users prefer installed apps to just opening a browser and looking for content on their device's web browser; the term "web application" even sounds like it needs a web connection to be usable. Our users <strong>will</strong> be offline sometimes — on a plane, underground or with no data left on their SIM — and we need to ensure that our apps are still usable when this happens. HTML5 offers a few technologies that allow for offline functionality, mainly <a href="https://developer.mozilla.org/en-US/docs/HTML/Using_the_application_cache">AppCache</a> and <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage">DOMStorage</a>.</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/dnuoUM_bIQM?rel=0&html5=1"></iframe></div></div><p></p> - -<p>More information about offline functionality:</p> - -<ul> - <li>The <a href="https://developer.mozilla.org/en-US/docs/Web/Guide/API/DOM/Storage">DOMStorage Wiki page</a>.</li> - <li>The <a href="https://developer.mozilla.org/en-US/docs/HTML/Using_the_application_cache">AppCache Wiki page</a>.</li> - <li><a href="https://developer.mozilla.org/en-US/docs/IndexedDB/Using_IndexedDB">Using IndexedDB</a> — for advanced storage on the client.</li> - <li><a href="https://github.com/mozilla/localForage">LocalForage</a> is a wrapper used in Firefox OS to provide the simplicity of DOMStorage along with the power of IndexedDB (explained in detail in <a href="https://hacks.mozilla.org/2014/02/localforage-offline-storage-improved/">this Mozilla Hacks post</a>.)</li> -</ul> - -<h2 id="Where_to_find_more">Where to find more</h2> - -<p>We hope that this video series gave you a clear introduction to building your first open web apps. If you are interested in learning more, there are a few resources and channels you can use:</p> - -<p></p><div class="intrinsic-wrapper"><div class="intrinsic-container "><iframe src="https://www.youtube.com/embed/Z2yVFXEYnnc?rel=0&html5=1"></iframe></div></div><p></p> - -<ul> - <li>The <a href="https://developer.mozilla.org/en-US/docs/Apps/">MDN App Center</a> features information on how to design and build good open web apps.</li> - <li>The <a href="/en-US/Marketplace">MDN Marketplace zone</a> contains detailed instructions how to get your app listed in the Firefox Marketplace, different publishing options, and handling payments.</li> - <li>The <a href="https://hacks.mozilla.org">Hacks Blog</a> features weekly articles on Firefox OS apps (featuring Mozilla staff and third party developers like you), and cutting edge technologies — this is a great place to get an insight into what will come in the next versions of Firefox and Firefox OS.</li> - <li>The <a href="/en-US/Firefox_OS">MDN Firefox OS zone</a> and <a href="https://wiki.mozilla.org/B2G">B2G Wiki</a> have in-depth information about the Firefox OS operating system.</li> - <li>We are on IRC a lot — simply use <a href="http://irc.mozilla.org">irc.mozilla.org</a> and find us in #devrel, #b2g, #openwebapps or #marketplace.</li> -</ul> - -<p>Hope to see you there,</p> - -<p>Chris, Sergi and Jan</p> diff --git a/files/zh-cn/archive/b2g_os/security/application_security/index.html b/files/zh-cn/archive/b2g_os/security/application_security/index.html deleted file mode 100644 index cb986bfc9d..0000000000 --- a/files/zh-cn/archive/b2g_os/security/application_security/index.html +++ /dev/null @@ -1,126 +0,0 @@ ---- -title: 应用安全 -slug: Archive/B2G_OS/Security/Application_security -translation_of: Archive/B2G_OS/Security/Application_security ---- -<div class="summary"> - <p>本文对Firefox OS 应用安全进行了详细阐述。</p> -</div> -<p>由Firefox OS 引入的关键性Web应用控制包含如下几个方面： </p> -<ul> - <li>Web应用需要真正的安装和启动，而不是在浏览器中随意的导航而转到对应页面。应用在使用之前必须预安装到手机上，安全控制系统会对应用的更新和删除进行管理以保护用户的安全。</li> - <li>是否允许访问新的web API 是由权限系统控制的，即应用程序必须声明它打算使用之前安装的权限。为了获取对功能更强的API的使用权限，这些应用需要满足一定的要求，还要被Marketplace审查，批准，并签名通过。</li> - <li>Web应用是一个沙箱，在其中只能看到它们自己的资源（包括cookies, 离线存储IndexedDB 数据库等).即便两个应用从相同的URL装载页面，这两个页面也不会看作是同源的，因为它们是运行在单独的应用中的。</li> -</ul> -<h3 id="应用安全">应用安全</h3> -<p>FirefoxOS 支持三种类型的web应用: "<strong>web</strong>", "<strong>privileged</strong>" 以及 "<strong>certified</strong>".一个应用的类型是在它的 <a href="/en-US/docs/Apps/Manifest" title="/en-US/docs/Apps/Manifest">manifest</a> 中声明的,同时也就决定了它能请求的权限列表。 </p> -<ul> - <li><strong>Web Apps:</strong> 绝大多数第三方应用程序都是 "web" apps, 而且它也是一种默认类型。除了已经暴露给Web的权限外，它不会授予应用程序任何其他的权限。Web应用可以从任何网站上安装，而且不会进行任何进一步的验证。它们也可以被<a href="/en-US/docs/Web/Apps/Packaged_apps">打包</a>，但打包时不会允许应用具有任何其他的权限。</li> - <li><strong>Privileged Apps</strong>: 这些应用会被允许增加权限，而且它们必须要被Marketplace认证通过。</li> - <li><strong>Certified Apps: </strong>Certified apps 是指由OEM选定并预安装在设备上的应用。</li> -</ul> -<div class="note"> - <p><b>注意</b>: 要进一步的了解这三种类型，可以参考 <a href="/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">App Manifest</a> 文档。</p> -</div> -<h3 id="应用交付">应用交付</h3> -<p>在Firefox OS 中，应用可以通过托管和打包这两种不同的机制交付。常规的web应用可以使用任何一种方式交付，而 privileged 和 certified 应用则必须要打包才能交付。</p> -<h4 id="托管的应用">托管的应用</h4> -<p>托管的应用程序中在开发者web服务器中只包含一个<a href="/en-US/docs/Apps/Manifest">应用程序manifest</a>文件,而这个文件会指向应用的index文件(通常会被称作安装路径)。通常manifest文件也会指向一个appcache manifest文件：这个文件会将应用的信息缓存起来，从而使应用启动时更加快速而且能够离线使用；同时这个文件在其他方面则不会对应用造成任何影响。 从安全的角度来看，托管的应用更像是通常的web站点。当托管应用加载时，加载页面的URL其实就是这些页面在它们web服务器的一般的URL地址。因此要链接应用中一个特定的页面或资源， 使用的URL地址与在web站点链接到那个页面的URL地址是相同的。</p> -<h4 id="打包的应用">打包的应用</h4> -<p><b>一个打包的应用</b> 是一个开放的Web应用，会在本地zip文件中存放有关应用的所有资源（包括 HTML, CSS, JavaScript, app manifest 等) contained in a zip file, 而不是将资源存放在web服务器上。要了解更多的细节，可参考<a href="/en-US/docs/Apps/Packaged_apps" title="Apps/Packaged_apps"> Packaged apps</a>. </p> -<h3 id="应用安装"><b>应用安装</b></h3> -<p>应用是通过 <a href="/en-US/docs/JavaScript_API" title="/en-US/docs/JavaScript_API">Apps Javascript API</a> 来安装的:</p> -<ul> - <li>托管的应用 : 托管的应用是通过调用 <code>navigator.mozApps.<a href="/en-US/docs/Web/API/Apps.install" title="/en-US/docs/Web/API/Apps.install">install</a>(manifestURL)方法来安装的</code>, 其中 manifestURL 是一个URL用来指定应用位置的。要了解更多的细节，可参考 <a href="/en-US/docs/DOM/Apps.install">Installing Apps</a>.</li> - <li>打包的应用: 打包的应用是用过调用<code>navigator.mozApps.<a href="/en-US/docs/Web/API/Apps.installPackage" title="/en-US/docs/Web/API/Apps.installPackage">installPackage</a>(packageURL)方法来安装的。对打包的应用而言，应用程序的manifest文件存放在它自身的包内，因此是已经认证过的。</code> 还有第二个"mini-manifest"用来启动和安装应用。可参考 <a href="/en-US/docs/DOM/Apps.installPackage">Installing Packaged Apps</a> 和<a href="/en-US/docs/Apps/Packaged_apps" title="Apps/Packaged_apps"> Packaged apps</a> 来获取更多的信息。</li> -</ul> -<p>为了能保证一个应用能够想要作为一个web应用来安装，我们必须确保不能使一个网站假冒托管的应用程序清单。 我们会要求manifest要提供一个具体的mime-type <code>application/x-web-app-manifest+json。当manifest应用和和应用 manifest请求的页面相同，都是请求应用安装的页面时，这种限制才是放开的。</code></p> -<h3 id="更新">更新</h3> -<p>有关应用更新的过程是在 <a href="/en-US/docs/Apps/Updating_apps" title="Apps/Updating_apps">Updating apps</a> 有详细描述。</p> -<h2 id="权限">权限</h2> -<p>应用可以被授予在正常的网页最高权限之外的权限。默认情况下，应用会和正常的web页面拥有同样的权限，为了能够得到额外的权限，第一步就是在应用程序maifest文件中列出它想要的额外权限。 </p> -<h3 id="Manifest_声明">Manifest 声明</h3> -<p>对每一个应用需要的额外权限，manifest文件必须要在manifest中列出该权限，并且以人类可阅读的描述解释为什么应用需要访问这个权限。例如，如果应用需要使用 <a href="/en-US/docs/Web/API/window.navigator.geolocation" title="/en-US/docs/Web/API/window.navigator.geolocation">navigator.geolocation</a> API, 它就必须在manifest中如下声明：</p> -<pre class="brush: html">"permissions": { - "geolocation":{ -<code class="language-js"><span class="token string"> "description"</span><span class="token punctuation">:</span> <span class="token string">"Required for autocompletion in the share screen"</span><span class="token punctuation">,</span></code> - } -}, -</pre> -<p>This allows the app to then prompt for the geolocation permission, in the same way that a web page normally would. For further detail on manifests, see <a href="/en-US/docs/Apps/Manifest" title="Apps/Manifest">App manifest</a>.</p> -<div class="note"> - <p><strong>Note</strong>: Currently permissions usage intentions are not exposed to the user — see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=823385" title="https://bugzilla.mozilla.org/show_bug.cgi?id=823385">bug 823385</a>.</p> -</div> -<h3 id="授予权限">授予权限</h3> -<p>When permissions are requested in the manifest, the permission is either set to <em>allow</em> or <em>prompt</em>, depending on the permissions. Allow permissions are granted by virtue of being declared in the manifest with no further approval needed. For prompt permissions, the user is prompted the first time the user accesses the related API, and has to make a choice prior to the API being granted. In general, Firefox OS only prompts users for permissions that have a privacy impact, and it is reasonable for the user to understand what they are being asked. For example, access to contacts is prompted, but access to make a raw TCP connection is implicitly granted since it is not reasonable for a user to understand the security implications of allowing this permission. Use of allow permissions is reviewed as part of Marketplace security review processes to ensure users are protected.</p> -<h3 id="撤销权限">撤销权限</h3> -<p>Users are allowed to change their mind about prompt permissions at any time, and can revoke these permissions via the Firefox OS settings app. Allow permissions are not user configurable, however.</p> -<h2 id="Web_应用沙箱">Web 应用沙箱</h2> -<h3 id="Data_stored_per_app_2"><span class="mw-headline" id="Data_stored_per_app">Data stored per app </span></h3> -<p>Each app runs in as a separate sandbox, meaning that all data stored by an app is separate from all data stored by another app. This includes things like cookie data, localStorage data, indexedDB data, and site permissions.</p> -<p><img alt="A diagram showing three Firefox OS apps all open is separate sandboxes, so none of them can affect each other." src="https://mdn.mozillademos.org/files/7091/sandbox.png" style="width: 1040px; height: 437px; display: block; margin: 0px auto;"></p> -<p>This means that if the user has two apps installed, App A and App B, these apps will have a completely different set of cookies, different local data, and different permissions. This even applies if both of these apps open an <a href="/zh-CN/docs/Web/HTML/Element/iframe" title="HTML内联框架元素 <iframe> 表示嵌套的浏览上下文，有效地将另一个HTML页面嵌入到当前页面中。在HTML 4.01中，文档可能包含头部和正文，或头部和框架集，但不能包含正文和框架集。但是，<iframe>可以在正常的文档主体中使用。每个浏览上下文都有自己的会话历史记录和活动文档。包含嵌入内容的浏览上下文称为父浏览上下文。顶级浏览上下文（没有父级）通常是浏览器窗口。"><code><iframe></code></a> that points to the same origin. i.e. if both App A and App B open an <code><iframe></code> pointing to "<a class="external free" href="http://www.mozilla.org" rel="nofollow">http://www.mozilla.org</a>", they will both render the website, however the website will be fetched and rendered with different cookies in the two apps.</p> -<p>A result of this is that if the user logs in to, for example, Facebook while using App A, this in no way affects App B's ability to interact with the user's account on Facebook. The login cookie that Facebook sets when the user logs in using App A is only available in App A. If App B opens an <code><iframe></code> to Facebook, the cookie wouldn't be there and so when App B opens Facebook, it receives the Facebook login page rather than the user's account.</p> -<h3 id="Apps_can't_open_each_other"><span class="mw-headline" id="Apps_can.27t_open_each_other">Apps can't open each other </span></h3> -<p>This means that apps can't open other apps by using iframes. If App A creates an <code><iframe></code> with the <code>src</code> set to the URL of App B, this won't actually open App B in the <code><iframe></code>. It will simply open the website located at that URL. It will not use any of App B's cookies and so it will behave no differently than if App B wasn't installed on the user's device.</p> -<p>This applies even for packaged apps (more about them below). If App A tries to open the packaged App B using an <code><iframe></code> pointing to the <code>app://</code> URL of App B, this will simply fail to load. If this results in a 404 or some other type of error is still to be determined, but it will definitely fail to load. And it will fail in the same way no matter if App B is installed on the user's device or not, as to make it impossible for App A to determine if App B is installed.</p> -<p>The same thing happens if the top-level frame of App A is navigated to a URL for App B. We always know for a given frame which app is opened in it, therefore when attempting to load the App B URL in the App A frame, this will behave exactly like the two situations described above, i.e. in no way will App B's resources, like cookies or other local data, be used.</p> -<h3 id="Motivation_2"><span class="mw-headline" id="Motivation">Motivation</span></h3> -<p>There are both benefits and downsides to this approach. The downside is that if the user interacts with the same web site through several apps, he/she will have to log in to every app. Likewise, if a web site wants to store data locally, and the user interacts with this web site in several apps, the data will end up getting duplicated in each app, which could be a problem if it's a large amount of data.</p> -<p>The main benefit of this approach is that it's a more stable model. There is no way that several apps could interact with each other through a third-party website in unexpected ways such that installing an app causes another app to stop working. When an app is uninstalled there is no way that data for another app could be lost, or that another app will stop working due to functional dependence on the uninstalled app.</p> -<p>There are also large security benefits. A user can safely use his AwesomeSocial app to log in to Facebook without having to worry that the SketchGame app can mount any type of attack for getting at the user's Facebook data by exploiting bugs or other shortcomings in the Facebook web site.</p> -<p>There are also good privacy benefits. The user can safely install the PoliticalPartyPlus app without having to worry that MegaCorpEmployeeApp will be able to detect that the app was installed or what data it has created.</p> -<h3 id="Sandboxed_权限"><span class="mw-headline" id="Sandboxed_Permissions">Sandboxed 权限</span></h3> -<p>In the same way that web site data is sandboxed per app, so is permission data. If App A loads a page from <a class="external free" href="http://maps.google.com" rel="nofollow">http://maps.google.com</a> and that page requests to use geolocation and the user says "yes, and remember this decision for all times", this only means that <a class="external free" href="http://maps.google.com" rel="nofollow">http://maps.google.com</a> has access to geolocation within App A. If App B then opens <a class="external free" href="http://maps.google.com" rel="nofollow">http://maps.google.com</a>, that page won't have access to geolocation unless the user grants that permission again.</p> -<p>And just like in the normal browser, permissions are separated by origin. If App A is granted permission to use Geolocation, this does not mean that all origins running in App A have the permission to use Geolocation. If App A opens an <code><iframe></code> to <a class="external free" href="http://maps.google.com" rel="nofollow">http://maps.google.com</a>, then <a href="http://docs.google.com"><span class="external free">http://docs.google.com</span></a> still has to ask the user for permission before geolocation access is granted.</p> -<h3 id="浏览器_API_沙箱">浏览器 API 沙箱</h3> -<p>To additionally secure applications that open a large set of URLs, such as browsers, we have added a <em>browserContent flag</em>. The browserContent flag allows each app to have not one, but two sandboxes: one for the app itself, and one for any "web content" that it opens. For example:</p> -<p>Say that the MyBrowser app is loaded from the <a class="external free" href="https://mybrowser.com" rel="nofollow">https://mybrowser.com</a> domain. This is the domain the scripts and resources are loaded within. The scripts and resources - <i> - belong</i> - to this domain.</p> -<p>Now, if a page in this app creates an <code><iframe mozbrowser></code>, a different sandbox is created and used for this <code><iframe></code>, which is different from the sandbox used by the app. So for example if this <code><iframe></code> is navigated to <a class="external free" href="https://mybrowser.com" rel="nofollow">https://mybrowser.com</a>, it will result in different cookies being used inside the <code><iframe mozbrowser></code>. Likewise, the contents inside the <code><iframe mozbrowser></code> will see different IndexedDB and localStorage databases from the ones opened by the app.</p> -<p>This also applies if the MyBrowser app wants to create integration with, for example, Google Maps to implement location-based browsing. If the app opens an <code><iframe></code> to <a class="external free" href="http://maps.google.com" rel="nofollow">http://maps.google.com</a>, it will receive a set of cookies for the <a class="external free" href="http://maps.google.com" rel="nofollow">http://maps.google.com</a> website. If the user then navigates inside the <code><iframe mozbrowser></code> containing <a class="external free" href="http://maps.google.com" rel="nofollow">http://maps.google.com</a>, this will use different cookies and different permissions to the top level app.</p> -<p>Another example where this is useful is in a Yelp-like app. Yelp has the ability to visit a restaurant's website directly in the app. By using <code><iframe mozbrowser></code> to open the restaurant website, the Yelp app ensures that the restaurant website can't contain an <code><iframe></code> pointing back to Yelp's app (which points to <a class="external free" href="http://yelp.com" rel="nofollow">http://yelp.com</a>). If it does, the website will only receive the Yelp website, rather than the Yelp app. So there is no way that the restaurant website can mount an attack against the app since the contained Yelp website won't share any permissions or data with the Yelp app.</p> -<h2 id="应用安全小结">应用安全小结</h2> -<p>The table below summarizes the different types of Firefox OS apps, and describes the format, installation, and update processes for open web apps running on Firefox OS.</p> -<table> - <caption> - Web App Types</caption> - <thead> - <tr> - <th scope="col">Type</th> - <th scope="col">Delivery</th> - <th scope="col">Permission Model</th> - <th scope="col">Installation</th> - <th scope="col">Updates</th> - </tr> - </thead> - <tbody> - <tr> - <td>Web</td> - <td>Hosted or Packaged</td> - <td>Less sensitive permissions, which are not dangerous to expose to unvalidated web content.</td> - <td>Installed from anywhere</td> - <td>Can be updated transparently to user or explicitly via a marketplace, depending on where the app was installed from, and the delivery mechanism.</td> - </tr> - <tr> - <td>Privileged</td> - <td>Packaged & Signed</td> - <td>Privileged APIs requiring validation and authentication of the app.</td> - <td>Installed from a trusted marketplace</td> - <td>Updated via a trusted marketplace, user prompted to approve download and installation of updates.</td> - </tr> - <tr> - <td>Certified</td> - <td>Packaged</td> - <td>Powerful and dangerous APIs not available to third-party apps.</td> - <td>Pre-installed on the device</td> - <td>Updated only as part of system level updates.</td> - </tr> - </tbody> -</table> -<div class="note"> - <p><strong>Note</strong>: For version 1.0 of Firefox OS, although web apps can be installed from any website/marketplace, privileged apps can only be installed from the Mozilla Marketplace, as support for multiple trusted marketplaces is not yet complete.</p> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/security/index.html b/files/zh-cn/archive/b2g_os/security/index.html deleted file mode 100644 index 18730f4b81..0000000000 --- a/files/zh-cn/archive/b2g_os/security/index.html +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: Firefox OS security -slug: Archive/B2G_OS/Security -tags: - - B2G - - Firefox OS - - Mobile - - NeedsTranslation - - Security - - TopicStub -translation_of: Archive/B2G_OS/Security ---- -<p>下面文章介绍了 Firefox OS 安全相关的主题。其中包括安全特征概要，应用安全以及如果使安装进程保证安全。</p> -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h2 class="Documentation" id="Documentation" name="Documentation">Firefox OS 安全文档 </h2> - <dl> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Security_model" title="/en-US/docs/Mozilla/Firefox_OS/Security/Security_model">Firefox OS 安全模型</a></dt> - <dd> - Firefox OS 安全模型</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Security/System_security" title="/en-US/docs/Mozilla/Firefox_OS/Security/Security_model">系统安全</a></dt> - <dd> - FirefoxOS 运行时内部的安全控制细节</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security" title="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security">Firefox OS 中的应用安全</a></dt> - <dd> - 在 Firefox OS 如何使应用安全概要</dd> - <dt> - <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Installing_and_updating_applications" title="/en-US/docs/Mozilla/Firefox_OS/Security/Installing_and_updating_applications">安全安装和更新应用</a></dt> - <dd> - Firefox OS 如何安全的安装和更新应用</dd> - <dt> - <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Security/Debugging_and_security_testing" title="/en-US/docs/Mozilla/Firefox_OS/Security/Debugging_and_security_testing#Marionette.3A_A_JavaScript_debugging_shell_for_Firefox_OS">对 Firefox OS 的调试和安全测试 </a></dt> - <dd> - 本指南介绍了基本的安全测试步骤，从打开远程的 JavaScript 调试器到在Firefox OS 桌面版本中设置一个拦截 HTTP(S) 代理</dd> - </dl> - <p><span class="alllinks"><a href="/en-US/docs/tag/B2G" title="/en-US/docs/tag/B2G">查看全部...</a></span></p> - </td> - <td> - <h2 class="Community" id="Community" name="Community">从社区获得帮助</h2> - <p>如果您正在为 Firefox OS 工作或者开发一个运行在 Firefox OS 设备上的应用，这里有一些社区资源可以帮助您！</p> - <ul> - <li>咨询 Boot to Gecko 项目论坛: <ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-b2g"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.b2g"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.b2g/feeds"> Web feed</a></li> -</ul></li> - <li>在 Mozilla's Boot to Gecko IRC 上提问: <a class="link-irc" href="irc://irc.mozilla.org/b2g" title="irc://irc.mozilla.org/b2g">#b2g</a></li> - </ul> - <p><span class="alllinks"><a class="external" href="http://www.catb.org/~esr/faqs/smart-questions.html" title="http://www.catb.org/~esr/faqs/smart-questions.html">不要忘记提问的艺术...</a></span></p> - <br> - <h2 class="Related_Topics" id="Related_Topics" name="Related_Topics">相关主题</h2> - <ul> - <li><a href="/en-US/docs/Mobile" title="en-US/docs/Mobile">Mobile</a></li> - <li><a href="/en-US/docs/Security" title="/en-US/docs/Security">Security</a></li> - </ul> - </td> - </tr> - </tbody> -</table> -<p> </p> -<div id="cke_pastebin" style="position: absolute; top: 483px; width: 1px; height: 1px; overflow: hidden; left: -1000px;"> - <br> - Firefox OS</div> diff --git a/files/zh-cn/archive/b2g_os/security/security_model/index.html b/files/zh-cn/archive/b2g_os/security/security_model/index.html deleted file mode 100644 index f7c2247523..0000000000 --- a/files/zh-cn/archive/b2g_os/security/security_model/index.html +++ /dev/null @@ -1,285 +0,0 @@ ---- -title: Firefox OS security overview -slug: Archive/B2G_OS/Security/Security_model -tags: - - B2G - - Firefox OS - - IPC - - IPDL - - Mobile - - 安全 - - 指南 -translation_of: Archive/B2G_OS/Security/Security_model ---- -<div class="summary"> - <p><span class="seoSummary">本文对 Mozilla Firefox OS 安全架构进行了概述，包括包括保护移动设备不受平台， apps 和 数据的威胁。在 Firefox OS 中，Mozilla 实现了完整，多层次的安全模型，为移动电话提供了绝佳的防护效果。</span></p> -</div> -<h2 id="平台安全">平台安全</h2> -<p>Firefox OS 平台使用了多层次的安全模型，可将各层级的开发风险降至最低。第一线的保护机制与深入防护策略相结合，进而为移动电话提供了完成的防护效果。</p> -<h3 id="安全架构">安全架构</h3> -<p>Firefox OS 将基于网页的应用与底层的硬件结合起来了。这个集成技术栈包括下面几个等级：</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5023/platform.png" style="width: 678px; height: 478px;"></p> -<ul> - <li>Gaia: 构建用户体验的 web apps 套件( app 中包括 HTML5, CSS, JavaScript, images, media,等)。</li> - <li>Gecko: 提供 app 运行框架以及实现用来访问移动设备功能的 Web API 的应用程序运行层级。</li> - <li>Gonk: 底层 Linux 内核(kernle)，系统库，固件以及运行在上面的设备驱动。</li> - <li>The mobile device: 运行 Firefox OS 的移动设备</li> -</ul> -<p>Gecko 扮演的是守门人的角色，为避免对移动设备的误用，它会强制执行安全策略。 Gecko 层 web apps（Gaia 层）与 手机之间的中间阶层。Gonk 则可将移动手机底层的硬件功能直接给 Gecko 层使用。 只有在 Gecko 允许访问请求时， Web apps 才可以通过 Web APIs 访问移动手机的功能 — 而不会有直接存取或走后门的情况产生。Gecko 会强制执行权限并阻止对未授权请求的访问。</p> -<h3 id="部署安全系统">部署安全系统</h3> -<p>将 Firefox OS 安装在智能手机上。原始系统的镜像文件是由已知，可信任的源所创建的 — 通常是设备 OEM — 它主要负责<span id="ouHighlight__0_9TO0_1">装配</span><span id="ouHighlight__10_10TO2_2">、</span><span id="noHighlight_0.9961474102491263"> </span><span id="ouHighlight__12_19TO4_5">构建</span><span id="ouHighlight__20_20TO6_6">、</span><span id="noHighlight_0.9553509446423349"> </span><span id="ouHighlight__22_28TO8_9">测试</span><span id="ouHighlight__31_33TO10_10">和</span><span id="ouHighlight__35_43TO11_14">对发布包进行签名。</span></p> -<p>整个技术层都需要经过安全验证。文件系统权限检查是由 Linux's 访问控制清单 (ACLs) 所强制执行的。系统应用都安装在一个只读的空间中（除了更新过程外，这是可能是短暂的可读写的）;一般而言，只有包含用户内容的区域才可能可读写。Various components within the device hardware have built-in protections that are implemented by default as standard industry practice — chipset manufacturers, for example, employ hardening techniques to reduce vulnerabilities. The core platform (Gecko and Gonk) is hardened to strengthen its defense against potential threats, and hardening features of the compiler are used where applicable. For further details see <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Runtime_security" title="/en-US/docs/Mozilla/Firefox_OS/Security/Runtime_security">Runtime security</a>.</p> -<h3 id="更新安全系统">更新安全系统</h3> -<p>Subsequent upgrades and patches to the Firefox OS platform are deployed using a secure Mozilla process that ensures the ongoing integrity of the system image on the mobile phone. The update is created by a known, trusted source — usually the device OEM — that is responsible for assembling, building, testing, and digitally signing the update package.</p> -<p>System updates can involve all or a portion of the Firefox OS stack. If changes to Gonk are included in the update, then FOTA (Firmware Over the Air) is the install process used. FOTA updates can also include any other part of the Firefox OS stack, including device management (FOTA, firmware / drivers), settings management (Firefox OS settings), security updates, Gaia, Gecko, and other patches.</p> -<p>Updates that do not involve Gonk can be done using the Mozilla System Update Utility. Firefox OS uses the same update framework, processes, and Mozilla ARchive (MAR) format (used for update packages) as the Firefox Desktop product.</p> -<p>A built-in update service — which may be provided by the OEM — on the mobile phone periodically checks for system updates. Once a system package becomes available and is detected by the update service, the user is prompted to confirm installation. Before updates are installed on the mobile device, the device storage is checked for sufficient space to apply the update, and the distribution is verified for:</p> -<ul> - <li>Update origin (verify the source location protocol:domain:port of the system update and manifest)</li> - <li>File integrity (SHA-256 hash check)</li> - <li>Code signature (certificate check against a trusted root)</li> -</ul> -<p>在更新过程中会使用下面的安全措施：</p> -<ul> - <li>Mozilla recommends and expects that updates are fetched over an SSL connection.</li> - <li>Strong cryptographic verification is required before installing a firmware package.</li> - <li>The complete update must be downloaded in a specific and secure location before the update process begins.</li> - <li>The system must be in a secure state when the update process starts, with no web apps running.</li> - <li>The keys must be stored in a secure location on the device.</li> -</ul> -<p>Rigorous checks are in place to ensure that the update is applied properly to the mobile phone.</p> -<div class="note"> - <p><strong>Note</strong>: For more information on how thee updates work and how to create and distribute updates, read <a href="/en-US/Firefox_OS/Building_and_installing_Firefox_OS/Creating_Firefox_OS_update_packages">Creating and applying Firefox OS update packages</a>.</p> -</div> -<h2 id="App_安全">App 安全</h2> -<p>Firefox OS uses a defense-in-depth security strategy to protect the mobile phone from intrusive or malicious applications. This strategy employs a variety of mechanisms, including implicit permission levels based on an app trust model, sandboxed execution at run time, API-only access to the underlying mobile phone hardware, a robust permissions model, and secure installation and update processes. For technical details, refer to <a href="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security" title="/en-US/docs/Mozilla/Firefox_OS/Security/Application_security">Application security.</a></p> -<p>In Firefox OS, all applications are web apps — programs written using HTML5, JavaScript, CSS, media, and other open web technologies (pages running within the browser are not referred to as web apps in this context). Because there are no binary ("native") applications installed by the user, all system access is mediated strictly through the Web APIs. Even access to the file system happens only through Web APIs and a back-end SQLite database — there is no direct access from apps to files stored on the SD card.</p> -<p>Firefox OS limits and enforces the scope of resources that can be accessed or used by an app, while also supporting a wide range of apps with varying permission levels. Mozilla has implemented tight control over what type of applications can access which APIs. For example, only certified apps (shipped with the phone) can have access to the Telephony API. The Dialer app has privileges to access the Telephony API in order to make phone calls, but not all certified apps can access this API.</p> -<p>This prevents a situation, for example, in which an arbitrary third-party app gets installed, dials a pay-per-use phone number (900 and 910), and racks up a large cell phone bill.</p> -<p>Other OEM apps might be selectively given access to the Telephony API, however. For example, an operator might provide a systems management application that allows a customer to manage their account, including the ability to phone the Operator’s billing or support office directly.</p> -<h3 id="受信任（Trusted）和不受信任_（Untrusted）的_App">受信任（Trusted）和不受信任 （Untrusted）的 App</h3> -<p>Firefox OS 根据下面的类型对 app 进行分类</p> -<table> - <thead> - <tr> - <th style="width: 82px;"> - <p>Type</p> - </th> - <th style="width: 102px;"> - <p>Trust Level</p> - </th> - <th style="width: 447px;"> - <p>Description</p> - </th> - </tr> - </thead> - <tbody> - <tr> - <td style="width: 82px;"> - <p>Certified</p> - </td> - <td style="width: 102px;"> - <p>Highly Trusted</p> - </td> - <td style="width: 447px;"> - <p>System apps that have been approved by the Operator or OEM (due to risk of device corruption or risk to critical functionality). System apps and services only; not intended for third-party applications.<br> - This designation is reserved for just a small number of critical applications. Examples: SMS, Bluetooth, camera, system clock, telephony, and the default dialer (to ensure that emergency services are always accessible).</p> - </td> - </tr> - <tr> - <td style="width: 82px;"> - <p>Privileged</p> - </td> - <td style="width: 102px;"> - <p>Trusted</p> - </td> - <td style="width: 447px;"> - <p>Third-party apps that have been reviewed, approved, and digitally signed by an authorized Marketplace.</p> - </td> - </tr> - <tr> - <td style="width: 82px;"> - <p>Web (everything else)</p> - </td> - <td style="width: 102px;"> - <p>Untrusted</p> - </td> - <td style="width: 447px;"> - <p>Regular web content. Includes both installed apps (stored on the mobile phone) and hosted apps (stored remotely, with only an app manifest stored on the mobile phone). The manifest for hosted apps can be obtained through a Marketplace.</p> - </td> - </tr> - </tbody> -</table> -<p>An application’s trust level determines, in part, its ability to access mobile phone functionality.</p> -<ul> - <li>Certified apps have permissions to most Web API operations.</li> - <li>Privileged apps have permissions to a subset of the Web API operations accessible to Certified apps.</li> - <li>Untrusted apps have permissions to a subset of the Web API operations accessible to Privileged apps — only those Web APIs that contain sufficient security mitigations to be exposed to untrusted web content.</li> -</ul> -<p>Some operations, such as network access, are assumed to be an implicit permission for all apps. In general, the more sensitive the operation (for example, dialing a phone number or accessing the Contacts list), the higher the app trust level required to execute it.</p> -<div class="note"> - <p><strong>注意</strong>: for more information on the APIs available and their permission levels, consult <a href="/en-US/Apps/Developing/App_permissions">App permissions</a>.</p> -</div> -<h4 id="Principle_of_Least_Permissions">Principle of Least Permissions</h4> -<p>For web apps, the Firefox OS security framework follows the <em>principle of least permissions</em>: start with the absolute minimum permissions, then selectively grant additional privileges only when required and reasonable. By default, an app starts with very low permissions, which is comparable to untrusted web content. If the app makes Web API calls that require additional permissions, it must enumerate these additional permissions in its <em>manifest</em> (described later in this document). Gecko will consider granting Web API access to an application only if the applicable privileges are explicitly requested in its manifest. Gecko will grant the requested permission only if the <em>type </em>of the Web App (certified, trusted, or web) is sufficiently qualified for access.</p> -<h4 id="Review_Process_for_Privileged_Apps_in_the_Marketplace">Review Process for Privileged Apps in the Marketplace</h4> -<p>In order for an app to become privileged, the app provider must submit it for consideration to an authorized Marketplace. The Marketplace subjects the app to a rigorous code review process: verifying its authenticity and integrity, ensuring that requested permissions are used for the purposes stated (in the permission rationale), verifying that the use of implicit permissions is appropriate, and validating that any interfaces between privileged app content and unprivileged external content have the appropriate mitigations to prevent elevation of privilege attacks. The Marketplace has the responsibility to ensure that the web app will not behave maliciously with the permissions that it is granted.</p> -<p>After an app passes this review, it is approved for use, its app manifest is digitally signed by the Marketplace, and it is made available for mobile users to download. The signature ensures that, if the web store were somehow hacked, the hacker could not get away with installing arbitrary content or malicious code on users’ phones. Due to this vetting process, Firefox OS gives privileged apps obtained from a Marketplace a higher degree of trust than everyday (untrusted) web content.</p> -<div class="note"> - <p><strong>Note</strong>: to find out more about Marketplaces including the <a href="https://marketplace.firefox.com/">Firefox Marketplace</a>, go to the <a href="/en-US/Marketplace">Marketplace zone</a>.</p> -</div> -<h3 id="封装式（Packaged）和托管式（Hosted）_Apps">封装式（Packaged）和托管式（Hosted） Apps</h3> -<p>Apps for Firefox OS can be either <em>packaged</em> (stored on the mobile phone) or <em>hosted</em> (stored on a remote web server, with just a manifest stored on the mobile phone). There are some differences in the way in which security is managed for each. Nonetheless, packaged and hosted apps are both subject to application sandboxing, which is described later in this document.</p> -<div class="note"> - <p><strong>Note</strong>: You can find out more about hosted and packaged apps at <a href="/en-US/docs/Mozilla/Marketplace/Publish_options">App publishing options</a>.</p> -</div> -<h4 id="封装式（Packaged）_Apps">封装式（Packaged） Apps</h4> -<p>A packaged app consists of a ZIP file containing application resources (HTML5, CSS, JavaScript, images, media), as well as a manifest that provides an explicit list of assets and their corresponding hashes. Certified and privileged apps must be packaged apps because the app manifest needs to be digitally signed. When a user obtains a packaged app, the ZIP file is downloaded onto the mobile phone, and the manifest is read from a known location inside the ZIP file. During the install process, app assets are verified and remain stored locally in the package. All explicit permissions are requested at runtime, showing the user the app's data usage intentions, and persisted by default.</p> -<p>To refer to app resources in a packaged app, the URL begins with app: using the following format:</p> -<p><code>app://<em>identifier</em>/<em>path_within_zipfile</em>/file.html</code></p> -<p>where app:// represents the mount point for the ZIP file, and <em>identifier</em> is a UUID that is generated when the app is installed on the mobile phone. This mechanism ensures that resources referred to with an app: URL are contained in the ZIP file. The path within an app: is relative, so relative links to resources in the ZIP file are allowed.</p> -<p>While packaged apps are primarily intended to be used for Certified or Privileged apps, regular web apps can also be packaged. However, they do not gain any increase in trust or permissions access simply because they are packaged.</p> -<h4 id="托管式（Hosted）_Apps">托管式（Hosted） Apps</h4> -<p>Hosted apps are located on a web server and loaded via HTTP. Only the app manifest is stored on the mobile phone. Everything else is stored remotely. Certain APIs are available only to privileged and certified apps, which requires the app to be packaged due to signing requirements. Therefore, a hosted app will not have access to any of the Web API operations that require privileged or certified app status.</p> -<p>From a security point of view, hosted apps work very much like normal websites. A hosted app is loaded by invoking a hard-coded, fully-qualified URL that points to the startup page in the root directory of the app on that web server. Once a hosted app is loaded, the mobile phone links to pages using the same URLs that are used when browsing the web site.</p> -<h3 id="App_Manifest">App Manifest</h3> -<p>An Open Web App manifest contains information that a Web browser needs in order to interact with an app. A manifest is a JSON file with (at a minimum) a name and description for the app. For further details, refer to <a href="/en-US/docs/Apps/FAQs/About_app_manifests" title="/en-US/docs/Apps/FAQs/About_app_manifests">FAQs about app manifests</a>.</p> -<h4 id="Manifest_示例">Manifest 示例</h4> -<p>The following code listing shows an example manifest with just basic settings:</p> -<pre class="brush:text">{ - "name": "My App", - "description": "My elevator pitch goes here", - "launch_path": "/", - "icons": { - "128": "/img/icon-128.png" - }, - "developer": { - "name": "Your name or organization", - "url": "http://your-homepage-here.org" - }, - "default_locale": "en" -}</pre> -<h3 id="App_Manifest_的安全设置">App Manifest 的安全设置</h3> -<p>The manifest can also contain other settings, including the following security settings:</p> -<table> - <thead> - <tr> - <th style="width: 152px;"> - <p>Field</p> - </th> - <th style="width: 479px;"> - <p>Description</p> - </th> - </tr> - </thead> - <tbody> - <tr> - <td style="width: 152px;"> - <p>permissions</p> - </td> - <td style="width: 479px;"> - <p>Permissions required by the app. An app must list every Web API it intends to use that requires user permission. Most permissions make sense for privileged apps or certified apps, but not for hosted apps. Properties per API:</p> - <ul> - <li><strong>description</strong>: A string specifying the intent behind requesting use of this API. Required.</li> - <li><strong>access</strong>: A string specifying the type of access required for the permission. Implicit permissions are granted at install time. Required for only a few APIs. Accepted values: <strong>read</strong>, <strong>readwrite</strong>, <strong>readcreate</strong>, and <strong>createonly</strong>.</li> - </ul> - </td> - </tr> - <tr> - <td style="width: 152px;"> - <p>installs_allowed_from</p> - </td> - <td style="width: 479px;"> - <p>The Origin of the app; can be singular or an array of origins (scheme+unique hostname) that are allowed to trigger installation of this app. Allows app providers to restrict installs from only an authorized Marketplace (such as <a href="https://marketplace.firefox.com/">https://marketplace.firefox.com/</a>).</p> - </td> - </tr> - <tr> - <td style="width: 152px;"> - <p>csp</p> - </td> - <td style="width: 479px;"> - <p>Content Security Policy (CSP). Applied to all pages loaded in the app. Used to harden the app against bugs that would allow an attacker to inject code into the app. If unspecified, privileged and certified apps have system-defined defaults. Syntax:<br> - <a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#csp">https://developer.mozilla.org/en-US/docs/Apps/Manifest#csp</a></p> - <p><em>Note that this directive can only increase the CSP applied. You cannot use it, for example, to reduce the CSP applied to a privileged App.</em></p> - </td> - </tr> - <tr> - <td style="width: 152px;"> - <p>type</p> - </td> - <td style="width: 479px;"> - <p>Type of application (web, privileged, or certified).</p> - </td> - </tr> - </tbody> -</table> -<p>Firefox OS requires that the manifest be served with a specific mime-type (<code>application/x-web-app-manifest+json</code>) and from the same fully-qualified host name (origin) from which the app is served. This restriction is relaxed when the manifest app (and thus the app manifest) is same-origin with the page that requested the app to be installed. This mechanism is used to ensure that it's not possible to trick a website into hosting an application manifest.</p> -<h3 id="沙盒技术_Sandboxed_Execution">沙盒技术 Sandboxed Execution</h3> -<p>This section describes application and execution sandboxes.</p> -<h4 id="Application_Sandbox">Application Sandbox</h4> -<p>The Firefox OS security framework uses sandboxing as a defense-in-depth strategy to mitigate risks and protect the mobile phone, platform, and data. Sandboxing is a way of putting boundaries and restrictions around an app during run-time execution. Each app runs in its own worker space and it has access only to the Web APIs and the data it is permitted to access, as well as the resources associated with that worker space (IndexedDB databases, cookies, offline storage, and so on).</p> -<p>The following figure provides an overview of this security model.</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5025/sandbox.png"></p> -<p>By isolating each app, its impact is contained within its own worker space and it cannot interfere with anything (such as other apps or their data) outside of that worker space.</p> -<h4 id="Execution_Sandbox">Execution Sandbox</h4> -<p>B2G (Gecko) runs in a highly-privileged system process that has access to hardware features in the mobile phone. At runtime, each app runs inside an execution environment that is a child process of the B2G system process. Each child process has a restricted set of OS privileges — for example, a child process cannot directly read or write arbitrary files on the file system. Privileged access is provided through Web APIs, which are mediated by the parent B2G process. The parent ensures that, when a child process requests a privileged API, it has the necessary permission to perform this action.</p> -<p>Apps communicate only with the B2G core process, not with other processes or apps. Apps do not run independently of B2G, nor can apps open each other. The only “communication” between apps is indirect (for example, when one app sets a system alarm and another app triggers a system notification as a result of it), and is mediated through the B2G process.</p> -<h4 id="仅通过_Web_API_才能硬件访问">仅通过 Web API 才能硬件访问</h4> -<p>Web apps have only one entry point to access mobile phone functionality: the Firefox OS Web APIs, which are implemented in Gecko. Gecko provides the sole gateway to the mobile device and underlying services. The only way to access device hardware functionality is to make a Web API call. There is no “native” API and there are no other routes (no “back doors”) to bypass this mechanism and interact directly with the hardware or penetrate into low-level software layer.</p> -<h2 id="安全基础架构">安全基础架构</h2> -<p>The following figure shows the components of the Firefox OS security framework:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5027/securityframework.png" style="width: 979px; height: 591px;"></p> -<ul> - <li><strong>Permission Manager</strong>: Gateway to accessing functionality in the Web API, which is the only access to the underlying hardware.</li> - <li><strong>Access Control List</strong>: Matrix of roles and permissions required to access Web API functionality.</li> - <li><strong>Credential Validation</strong>: Authentication of apps/users.</li> - <li><strong>Permissions Store</strong>: Set of privileges required to access Web API functionality.</li> -</ul> -<h3 id="权限管理与执行">权限管理与执行</h3> -<p>Firefox OS security is designed to verify and enforce the permissions granted to web apps.</p> -<p>The system grants a particular permission to an app only if the content requests it, and only if it has the appropriate permissions requested in the app’s manifest. Some permissions require further authorization from the user, who is prompted to grant permission (as in the case of an app requesting access to the user’s current location). This app-centric framework provides more granular control over permissions than traditional role-centric approaches (in which individual roles are each assigned a set of permissions).</p> -<p>A given Web API has a set of actions and listeners. Each Web API has a required level of permission. Every time a Web API is called, Gecko checks permission requirements (role lookup) based on:</p> -<ul> - <li>Permissions associated with calling app (as specified in the manifest and based on the app type.)</li> - <li>Permissions required to execute the requested operation (Web API call.)</li> -</ul> -<p>If the request does not meet the permission criteria, then Gecko rejects the request. For example, untrusted apps cannot execute any Web APIs that are reserved for trusted apps.</p> -<h3 id="要求用户权限许可">要求用户权限许可</h3> -<p>In addition to permissions that are implicitly associated with the web apps, certain operations require explicit permission from the user before they can be executed (for example, "can the web app access your camera?"). For these operations, web apps are required to specify, in their manifest, their justification for requiring this permission. This <em>data usage intention</em> informs users about what the web app intends to do with this data if permission is granted, as well as any risk involved. This allows users to make informed decisions and maintain control over their data.</p> -<h3 id="安全_App_更新过程">安全 App 更新过程</h3> -<p><img alt="" src="https://mdn.mozillademos.org/files/5029/updateprocess.png" style="width: 979px; height: 102px;"></p> -<p>For app upgrades and patches to a <em>privileged</em> app, app providers submit the updated package to an authorized Marketplace, where it is reviewed and, if approved, signed and made available to users. On Firefox OS devices, an App Update Utility periodically checks for app updates. If an update is available, then the user is asked whether they want to install it. Before a update is installed on the mobile device, the package is verified for:</p> -<ul> - <li>Update origin (verify the source location protocol:domain:port of the update and manifest)</li> - <li>File integrity (SHA-256 hash check)</li> - <li>Code signature (certificate check against a trusted root)</li> -</ul> -<p>Rigorous checks are in place to ensure that the update is applied properly to the mobile phone. The complete update package must be downloaded in a specific and secure location before the update process begins. Installation does not overwrite any user data.</p> -<div class="note"> - <p><strong>Note</strong>: For more information on app updates, read <a href="/en-US/Apps/Developing/Updating_apps">Updating apps</a>.</p> -</div> -<h2 id="设备安全_(硬件)">设备安全 (硬件)</h2> -<p>Security mechanisms for the mobile device hardware are typically handled by the OEM. For example, an OEM might offer SIM (Subscriber Identity Module) card locks, along with PUK (PIN Unlock Key) codes to unlock SIM cards that have become locked following incorrect PIN entries. Contact your OEM for details. Firefox OS does allow users to configure passcodes and timeout screens, which are described in the next section.</p> -<h2 id="数据安全">数据安全</h2> -<p>Users can store personal data on their phone that they want to keep private, including contacts, financial information (bank & credit card details), passwords, calendars, and so on. Firefox OS is designed to protect against malicious apps that could steal, exploit, or destroy sensitive data.</p> -<h3 id="密码和超时锁屏">密码和超时锁屏</h3> -<p>Firefox OS allows users to set a passcode to their mobile phone so only those who supply the passcode can use the phone. Firefox OS also provides a timeout screen that is displayed after a configurable period of phone inactivity, requiring passcode authentication before resuming use of the phone.</p> -<h3 id="沙盒数据_Sandboxed_Data">沙盒数据 Sandboxed Data</h3> -<p>As described earlier, apps are sandboxed at runtime. This prevents apps from accessing data that belongs to other apps <em>unless</em> that data is explicitly shared, and the app has sufficient permissions to access it.</p> -<h3 id="串行数据_Serialized_Data">串行数据 Serialized Data</h3> -<p>Web apps do not have direct read and write access to the file system. Instead, all access to storage occurs only through Web APIs. Web APIs read from, and write to, storage via an intermediary SQLite database. There is no direct I/O access. Each app has its own data store, which is serialized to disk by the database.</p> -<h3 id="数据破坏">数据破坏</h3> -<p>When a user uninstalls an app, all of the data (cookies, localStorage, IndexedDB, and so on) associated with that application is deleted.</p> -<h3 id="隐私">隐私</h3> -<p>Mozilla is committed to protecting user privacy and user data according to its privacy principles (<a href="https://www.mozilla.org/privacy/">https://www.mozilla.org/privacy/</a>), which stem from the Mozilla Manifesto (<a href="https://www.mozilla.org/about/manifesto.html">https://www.mozilla.org/about/manifesto.html</a>). The Mozilla Firefox Privacy Policy describes how Mozilla collects and uses information about users of the Mozilla Firefox web browser, including what Firefox sends to websites, what Mozilla does to secure data, Mozilla data practices, and so on. For more information, see:</p> -<ul> - <li><a href="http://www.mozilla.org/en-US/legal/privacy/firefox.html">http://www.mozilla.org/en-US/legal/privacy/firefox.html</a></li> - <li><a href="https://blog.mozilla.org/privacy/">https://blog.mozilla.org/privacy/</a></li> - <li><a href="http://support.mozilla.org/en-US/kb/privacy-and-security-settings-firefox-os-phones">http://support.mozilla.org/en-US/kb/privacy-and-security-settings-firefox-os-phones</a></li> -</ul> -<p>Firefox OS implements these principles by putting the control of the user data in the hands of the user, who gets to decide where this personal information goes. Firefox OS provides the following features:</p> -<ul> - <li>Do Not Track option</li> - <li>ability to disable Firefox browser cookies</li> - <li>ability to delete the Firefox OS browsing history</li> -</ul> diff --git a/files/zh-cn/archive/b2g_os/simulator/index.html b/files/zh-cn/archive/b2g_os/simulator/index.html deleted file mode 100644 index 908b5a4049..0000000000 --- a/files/zh-cn/archive/b2g_os/simulator/index.html +++ /dev/null @@ -1,240 +0,0 @@ ---- -title: Firefox OS 模拟器 -slug: Archive/B2G_OS/Simulator -translation_of: Archive/B2G_OS/Simulator ---- -<div class="note"> - <p>Firefox OS 模拟器目前还处于开发早期，还没有那么我们想的那么稳定和功能齐备。</p> - <p>如果你发现了bug，请 <a href="https://github.com/mozilla/r2d2b2g/issues?state=open">在 GitHub 上面提交</a>，如果你有任何问题，可以在<a href="https://lists.mozilla.org/listinfo/dev-developer-tools"> dev-developer-tools 邮件列表</a> 或者 <a href="irc://irc.mozilla.org/#devtools">irc.mozilla.org 上的 </a><a href="irc://irc.mozilla.org/#devtools">#devtools on </a>提问。</p> - <p>你还可阅读“<a href="#Unsupported-APIs" title="#Unsupported-APIs">获取帮助</a>”章节中的 <a href="#Simulator-verbose-logging" title="#Simulator-verbose-logging">how to enable verbose logging</a> 与 <a href="#Simulator-latest-preview-build" title="#Simulator-latest-preview-build">get the latest preview build</a>。</p> -</div> -<p>Firefox OS 模拟器（<strong style="line-height: 1.5; color: rgb(77, 78, 83);">Simulator）</strong><span style="line-height: 1.5;">给你提供一个在桌面系统下测试和调试 </span><a href="/en-US/docs/Apps" style="line-height: 1.5;" title="/en-US/docs/Apps">Firefox OS 应用</a><span style="line-height: 1.5;">的环境，使得 code-test-debug（编码-测试-调试）的流程比使用实体设备更加快捷。当然你并不需要一个实体设备来运行这个模拟器。</span></p> -<p>本质上来讲，模拟器是由下面两个部分组成的：</p> -<ul> - <li><b>模拟器</b>: 模拟器包括 比运行在桌面环境的<a href="/en-US/docs/Mozilla/Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a>更高层的<a href="/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client" title="/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client">Firefox OS 桌面系统客户端</a>。还包含一些标准版Firefox OS桌面版本中没有的<a href="#Simulator-toolbar" title="#Simulator-toolbar">额外的仿真特性</a>。</li> - <li><strong>信息中心（</strong><strong style="color: rgb(77, 78, 83);">the Dashboard）</strong>: 这里你可以开始和停止运行模拟器，在模拟器里面安装，卸载以及调试你的应用。通过信息中心，你也可以把应用推送到实体设备中。信息中心也会manifests文件中一些常见问题进行检测.</li> -</ul> -<p>下面的这个截图展示了一个使用模拟器调试应用的过程。</p> -<p>右上的那个截图是信息中心，它运行在一个Firefox 标签页中。 我们已经添加了一个名为“where am I?" 的打包应用。左上截图显示的是该应用正运行在模拟器中。而且我们也连接了调试工具，也就是底部的那个面板。可以看到控制台面板显示了有关该应用的一些信息。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5513/Simulator-overview-4.0.png"></p> -<p>该指南包含了下面的内容:</p> -<ul> - <li><a href="#Installing" title="#Installing">如何安装模拟器</a></li> - <li><a href="#Adding-updating-removing" title="#Adding-updating-removing">如何添加，移除以及刷新应用</a></li> - <li><a href="#Manifest-validation" title="#Manifest-validation">manifest 文件的验证</a></li> - <li><a href="#Running-the-Simulator" title="#Running-the-Simulator">如何运行模拟器</a></li> - <li><a href="#Attaching-developer-tools" title="#Attaching-developer-tools">如何把开发者工具（如 Js 调试工具）和在模拟器中运行的应用连接起来</a></li> - <li><a href="#Simulator-receipts" title="#Simulator-receipts">如何为付费应用找到测试收据</a></li> - <li><a href="#Push-to-device" title="#Push-to-device">如何把应用推送到已连接的设备上</a></li> - <li><a href="#Limitations" title="#Limitations">与运行 Firefox OS 的实体设备相比，模拟器的局限性。</a></li> -</ul> -<div class="note"> - 想从头到尾了解如何使用模拟器调试Web应用，请参见 <a href="/en-US/docs/Tools/Firefox_OS_Simulator/Simulator_Walkthrough" title="/en-US/docs/Tools/Firefox_OS_Simulator/Simulator_Walkthrough">Firefox OS 简易攻略</a> 一文。</div> -<h2 id="安装模拟器"><a name="Installing_the_Simulator">安装模拟器</a></h2> -<p>模拟器是以Firefox 附加组件的形式打包和分发的。安装步骤:</p> -<ol> - <li>使用Firefox访问 <a href="https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/" title="https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/">the Simulator's page on addons.mozilla.org</a>。</li> - <li>点击 "添加到Firefox（Add to Firefox）"。</li> - <li>下载完成后会提示你是否需要安装，点击: "现在安装（Install Now）".</li> -</ol> -<p>鉴于该组件的体积，在安装过程中，Firefox可能会出现假死的情况。可能会出现一个对话框"警告：script无响应（Warning: Unresponsive script）"。加入你看到该对话框，点击"继续"以完成安装。这种情况不会在Firefox27以上版本中出现。</p> -<p>安装完成后，Firefox会检查是否有该组件的更新版本，如果有的话，会自动更新至最新版本。</p> -<p><span style="line-height: 1.5;">安装完成后，信息中心会自动打开。当然你也可以从"Firefox" 菜单(或者“工具“菜单)-Web开发者-Firefox OS 模拟器打开。</span></p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5141/simulator-open-on-windows-7.png" style="margin-right: auto; margin-left: auto; display: block;"></p> -<p>通过信息中心，你可以把你的应用添加到模拟器并且运行该应用。下面的截图就是信息中心的样子：<img alt="" src="https://mdn.mozillademos.org/files/5491/dashboard-4.0.png"></p> -<h2 id="添加，移除和刷新应用"><a name="Adding-updating-removing">添加，移除和刷新应用</a></h2> -<h3 id="添加应用">添加应用</h3> -<p>怎样把<a href="/en-US/docs/Apps/Packaged_apps" title="/en-US/docs/Apps/Packaged_apps">打包应用</a>添加到模拟器？打开信息中心，点击 "添加文件夹（Add Directory）" ，然后选择 <a href="/en-US/docs/Apps/Manifest" title="/en-US/docs/Apps/Manifest">manifest 文件</a>。<br> - <br> - 如果要添加基于服务器端的 Web 应用（hosted app)，在有”<span style="line-height: 1.5;">URL for page or manifest.webapp"提示的</span><span style="line-height: 1.5;">输入框中输入，然后点击“添加 URL”(</span><span style="line-height: 1.5;">Add URL)</span><span style="line-height: 1.5;">. 如果链接指向的是manifest文件，那么就会使用这个manifest文件。如果链接指向的不是manifest文件，信息中心就会为该URL生成一个manifest文件: 所以通过输入网站的URL，你就可以把该网站以应用的形式添加进来。</span></p> -<p>在你添加应用之后，信息中心对你的manifest文件进行一系列的测试，查找一些常见的问题。具体会进行那些测试，参阅<a href="#Manifest-validation" title="#Manifest-validation"> Manifest Validation</a>（Manifest 验证）。</p> -<p>如果在Manifest验证阶段没有发现任何错误，信息中心则会在模拟器中自动运行你的应用。</p> -<h3 id="管理应用">管理应用</h3> -<p>在你添加应用之后，该应用会出现在已安装应用的管理列表中：<br> - <img alt="" src="https://mdn.mozillademos.org/files/5493/dashboard-list-apps-4.0.png"><br> - 每条记录都告诉我们关于应用的一些信息:</p> -<ul> - <li>应用名称，从manifest文件获取</li> - <li>类型，"Packaged", "Hosted" 或者 "Generated"中的一种。</li> - <li>到manifest文件的链接</li> - <li>manifest文件的验证结果</li> -</ul> -<p>同时我们也可以看到4个命令:</p> -<ul> - <li><strong>"Refresh"（刷新）:</strong> 在你改变应用内容后，通过该命令可以用来在模拟器中刷新以及重新加载应用。而且，信息中心会重新验证一次manifest文件。如果你对应用做的改变没有自动更新到已安装的应用，这个时候你就需要通过刷新来应用这些改变。</li> - <li><strong>"Connect"（连接）:</strong>借助该命令，你可以把开发者工具跟选定的应用连接起来。如果模拟器和应用还没有运行，在你使用连接命令的时候，信息中心会启动模拟器并打开应用。</li> - <li><strong>"Remove" ("X")（移除）:</strong> 借助该命令，你可以从模拟器和信息中心中移除应用。只要信息中心的标签页是打开的，你就可以撤销该动作恢复应用。</li> - <li><strong>"Receipt"（收据）:</strong> 该命令是用来验证付费应用的收据（Receipt,你已经购买该应用的凭据）。在你选择一种收据进行测试时，信息中心会在重新安装该应用的同时安装收据文件。</li> -</ul> -<div class="note"> - <p><strong>在模拟器窗口中刷新应用</strong>: 在应用运行的状态下，通过模拟器窗口的 <a href="#Simulator-menubar" title="#Simulator-menubar">菜单或者是与之绑定的快捷方式</a> 更新和重新加载该应用。</p> -</div> -<h3 id="Manifest_验证"><a name="Manifest-validation">Manifest 验证</a></h3> -<p>加入你提供了 manifest 文件，管理器会对该文件进行一些验证并且会针对下列3类问题给出报告：</p> -<ul> - <li>manifest 错误: 这类问题会阻止app安装或运行</li> - <li>manifest 警告: 这类问题可能会导致应用无法正常工作</li> - <li>针对模拟器的警告: 模拟器目前还不支持你的应用使用的某些特性</li> -</ul> -<p>这些问题会列出来，点击错误提示你会看到这些问题的详细信息。</p> -<h4 id="Manifest_错误">Manifest 错误</h4> -<p>信息中心会把下列情形当成错误，意味着如果不修复他们就无法运行你的的应用：</p> -<ul> - <li>manifest没有必填属性“name"</li> - <li>manifest不是有效的JSON文件</li> - <li>服务器端的应用，<a href="/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a>一项对应的值为<a href="/en-US/docs/Apps/Packaged_apps#Types_of_packaged_apps" title="/en-US/docs/Apps/Packaged_apps#Types_of_packaged_apps">"privileged" 或者 "certified"</a>。这两个值仅对打包的应用有效。</li> - <li>应用缓存错误（common appCache errors） （打包的应用不能使用appCache, 或者对manifest URL的请求返回一个HTTP的跳转或者是HTTP错误状态）</li> -</ul> -<p>这里是尝试添加一个没有”name"属性的manifest文件的结果：<br> - <img alt="" src="https://mdn.mozillademos.org/files/5495/dashboard-missing-name-4.0.png"></p> -<h4 id="Manifest_警告">Manifest 警告</h4> -<p>信息中心会把下列情形当成警告:</p> -<ul> - <li>没有图标</li> - <li>图标尺寸小于128 pixels:所有提交给应用市场的应用都必须包含至少一个图标，并且图标尺寸不得小于128px*128px。</li> - <li>无法识别<a href="/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a> 项</li> - <li>manifest请求一项无法识别的<a href="/en-US/docs/Apps/Manifest#permissions" style="text-decoration: underline;" title="/en-US/docs/Apps/Manifest#permissions">权限</a></li> - <li>manifest请求一项会被拒绝的<a href="/en-US/docs/Apps/Manifest#permissions" title="/en-US/docs/Apps/Manifest#permissions">权限</a></li> - <li>manifest请求一项无法决定的<a href="/en-US/docs/Apps/Manifest#permissions" title="/en-US/docs/Apps/Manifest#permissions">权限</a></li> -</ul> -<h4 id="针对模拟器的警告">针对模拟器的警告</h4> -<p>最后，如果应用使用了还没有被Firefox OS完全支持的特性，管理器会对此弹出警告：</p> -<ul> - <li><a href="/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a>的值为"certified"（认证的）, 但是模拟器目前尚未完全支持认证应用（certified apps）</li> - <li>manifest请求使用某个<u><a href="#Unsupported-APIs">尚未</a><a href="#Unsupported-APIs" style="text-decoration: underline;" title="#Unsupported-APIs">被模拟器支持的API</a></u>的<a href="/en-US/docs/Apps/Manifest#permissions" style="text-decoration: underline;" title="/en-US/docs/Apps/Manifest#permissions">权限</a></li> -</ul> -<h2 id="运行模拟器"><a name="Running-the-Simulator">运行模拟器</a></h2> -<p>可以通过两种不同的方法启动模拟器：</p> -<ul> - <li>在添加应用之后，点击“refresh"（刷新）或者是“connect"（连接）按钮之后，信息中心会在模拟器中自动运行你的应用</li> - <li>假如你点击了位于信息中心左手边的”stopped"按钮，模拟器会启动主屏（Home Screen)，然后你就可以导航到你的应用。</li> -</ul> -<p>不管是哪种方法，只要模拟器一开始运行，标签为“Stopped"按钮就会变成绿色，同时标签也会变成”Running"（运行中）。要停止模拟器的运行，只需要再次点击这个按钮。</p> -<p>模拟器会在独立的窗口中运行，屏幕区域为320*480pixels, 在<a href="#Simulator-toolbar" title="#Simulator-toolbar">底部的工具栏(toolbar)</a>和<a href="#Simulator-menubar" title="#Simulator-menubar">顶部的菜单栏(menubar)</a> 还包括一些额外的功能：</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5505/simulator-bars.png" style="margin-right: auto; margin-left: auto; display: block;"></p> -<p>你可以通过点击鼠标和按下鼠标键之后的拖拽来模拟触屏事件。所以通过在主屏的点击和从右到左的拖拽，你就会看到内置的应用和你自己添加的应用：</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5517/simulator-homescreen.png"></p> -<h3 id="模拟器工具栏（Simulator_toolbar）"><a name="Simulator-toolbar">模拟器工具栏（Simulator toolbar）</a></h3> -<p>在底部的工具栏中，从左到右，分别是主屏（Home)按钮, 屏幕旋转(screen Rotation)按钮和地理位置（Geolocation）按钮.</p> -<ul> - <li>主屏按钮会把你带到主屏（长按几秒的话会打开任务列表）</li> - <li>屏幕旋转按钮会使设备在横屏和竖屏之间切换。这种切换会生成一个 <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Managing_screen_orientation#Listening_orientation_change" title="/en-US/docs/WebAPI/Detecting_device_orientation">orientationchange</a>事件。</li> - <li>点击地理位置按钮会触发一个对话框，询问你是否要分享你当前的地理位置或者是你自定义的坐标：通过<a href="/en-US/docs/WebAPI/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Geolocation API</a>，你也可以在你的应用中实现该功能。</li> -</ul> -<p><a href="https://mdn.mozillademos.org/files/5511/simulator-geolocation.png"><img alt="" src="https://mdn.mozillademos.org/files/5511/simulator-geolocation.png" style="width: 520px; height: 309px;"></a><a href="https://mdn.mozillademos.org/files/5519/simulator-screen-orientation.png"><img alt="" src="https://mdn.mozillademos.org/files/5519/simulator-screen-orientation.png" style="width: 500px; height: 297px;"></a></p> -<h3 id="模拟器菜单栏"><a name="Simulator-menubar"></a>模拟器菜单栏</h3> -<p>通过顶部的菜单栏，你可以更方便快捷的运行一些有用的命令。这会使你的开发工作更有效率。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5525/simulator-menubar.png"></p> -<ul> - <li><strong>File -> Quit</strong> (<em>Ctrl/Cmd - Q</em>):关闭模拟器</li> - <li><strong>App -> Refresh</strong> (<em>Ctrl/Cmd - R</em>): 刷新当前运行的应用</li> -</ul> -<p>键盘上 <strong>"App Refresh"</strong> 的快捷方式使得从表面上来看开发一个应用就像是开发一个网页（浏览器中刷新一个页面的快捷方式也是<em>Ctrl/Cmd-R</em>):</p> -<ul> - <li>更改你的代码后 (如果需要的话，重新运行你的工具，如volo / yeoman / grunt）</li> - <li>使用键盘的快捷方式刷新正在运行的应用</li> -</ul> -<div class="note"> - <p><strong>"刷新应用并清除数据（强制刷新）" 隐藏的快捷方式：</strong>有些时候清除掉模拟器存储的应用数据会非常有用。所以模拟器实际上有一个隐藏的快捷方式 <em>Shift - Ctrl/Cmd - R</em>, 该快捷方式在刷新应用的同时，也会清除下列数据：</p> - <ul> - <li> - <p>本地存储/会话存储 (localStorage / sessionStorage)</p> - </li> - <li> - <p>cookies</p> - </li> - <li> - <p>indexedDB</p> - </li> - <li> - <p>appCache</p> - </li> - </ul> -</div> -<h2 id="调用开发者工具"><a name="Attaching-developer-tools">调用开发者工具</a></h2> -<p>在模拟器中你可以调用开发者工具，以帮助你调试应用。目前你可以调用 <a href="/en-US/docs/Tools/Debugger" title="/en-US/docs/Tools/Debugger">JavaScript调试器</a>, <a href="/en-US/docs/Tools/Web_Console" title="/en-US/docs/Tools/Web_Console">Web控制台</a>, <a href="/en-US/docs/Tools/Style_Editor" title="/en-US/docs/Tools/Style_Editor">样式编辑器</a>, <a href="/en-US/docs/Tools/Profiler" title="/en-US/docs/Tools/Profiler">分析器</a> 以及<a href="/en-US/docs/Tools/Network_Monitor" title="/en-US/docs/Tools/Network_Monitor">网络</a>，但是我们会努力支持更多的 <a href="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window" title="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window">开发者工具</a>。</p> -<div class="geckoVersionNote"> - <p>某些工具只适用于Firefox的Beta, Aurora或者是Nightly版本。</p> -</div> -<p>点击应用的 <strong>"Connect"</strong>（连接）按钮来调用开发者工具</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5497/connect-to-app-button.png" style="margin-right: auto; margin-left: auto; display: block;"></p> -<p>接着信息中心会在标签页底部打开开发者工具面板，并且连接到该应用:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5501/simulator-devtools-connected.png" style="margin-right: auto; margin-left: auto; display: block;"></p> -<h3 id="Web控制台">Web控制台</h3> -<p>The app can log to this console using the global <a href="/en-US/docs/DOM/console" title="/en-US/docs/DOM/console">console</a> object, and it displays various other messages generated by the app: network requests, CSS and JS warnings/errors, and security errors. (<a href="/en-US/docs/Tools/Web_Console" title="/en-US/docs/Tools/Web_Console">Learn more about the Web Console.</a>)</p> -<h3 id="调试器">调试器</h3> -<p>Using the Debugger, you can step through JavaScript code that is running in the connected app, manage breakpoints, and watch expressions to track down errors and problems faster. (<a href="/en-US/docs/Tools/Debugger" title="/en-US/docs/Tools/Web_Console">Learn more about the Debugger.</a>)</p> -<h3 id="样式编辑器">样式编辑器</h3> -<p>You can view and edit CSS files referenced in the app using the connected Style Editor. Your changes will be applied to the app in real time, without needing to refresh the app. (<a href="/en-US/docs/Tools/Style_Editor" title="/en-US/docs/Tools/Web_Console">Learn more about the Style Editor.</a>)</p> -<h3 id="分析器">分析器</h3> -<p>Using the Profiler tool connected to the app, you can to find out where your JavaScript code is spending too much time. The Profiler periodically samples the current JavaScript call stack and compiles statistics about the samples. (<a href="/en-US/docs/Tools/Profiler" title="/en-US/docs/Tools/Web_Console">Learn more about the Profiler.</a>)</p> -<h3 id="网络监控">网络监控</h3> -<p>Thanks to the new Network Monitor, you can analyze the status, headers, content and timing of all the network requests initiated by the app through a friendly interface. (<a href="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/" title="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/">Learn more about the Network Monitor.</a>)</p> -<h2 id="收据（Receipts）"><a name="Simulator-receipts"></a>收据（Receipts）</h2> -<p>如果你正在开发付费应用，那么你也应该使用有效（加密签名）的收据测试一下你的收据确认码（receipt validation code) （收据确认码是用来确认一个用户是否已经购买该应用或者用户已申请退款，然后根据这两种情况来锁定或者解锁应用）。</p> -<p>通过信息中心的<strong>"Receipts"</strong> 菜单，你可以安装<strong>"Valid"（有效的）</strong>, <strong>"Invalid"（无效的）</strong>, 或者 <strong>"Refunded"（退款）</strong> 的测试收据。选择你希望测试的收据类型，信息中心会从市场（Marketplace)的收据服务中心获取该类型的收据，然后在模拟器中重新安装该应用，同时也会安装该收据。:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5523/simulator-receipts-selector-4.0.png"></p> -<h2 id="推送到设备"><a name="Push-to-device">推送到设备</a></h2> -<p>如果你有安装Firefox OS系统的实体设备，你可以把该设备连接到模拟器，然后可以把应用从信息中心推送到设备上。</p> -<h3 id="连接设备">连接设备</h3> -<p>关于如何把设备连接到信息中心，请参阅 <a href="/en-US/docs/Mozilla/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop">connecting a Firefox OS device to the desktop</a>. 请注意你并不需要安装ADB（Android Debug Bridge）, 因为模拟器的附加组件中已经包含了它。</p> -<h3 id="把应用推送到设备">把应用推送到设备</h3> -<p>在你设置后设备和桌面后，通过USB把设备连接到桌面系统，你会看到<strong>"Device connected"</strong>（设备已连接）的提示 ，同时你也会看到一个标签为“Push"（推送）的按钮:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5521/simulator-push2device.png"></p> -<p>点击 <strong>"Push"</strong>, 应用就会安装到你的Firefox OS 设备上。</p> -<div class="note"> - <p><strong>手动操作步骤:</strong></p> - <ul> - <li> - <p>在你把应用推送到设备后，你需要手动关闭和重启设备以获得更新后的内容。</p> - </li> - <li> - <p>如果你更改了manifest文件中的任何内容（比如， app name, orientation, type, permissions), 那么你需要重启操作系统来使这些改变生效</p> - </li> - </ul> -</div> -<h3 id="Firefox_OS_设备连接确认">Firefox OS 设备连接确认</h3> -<p>每次重启设备后的第一次”推送“需要你在设备上确认一下:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5527/device-push-confirmation.png" style="width: 320px; height: 480px;"></p> -<h3 id="Linux系统下的问题">Linux系统下的问题</h3> -<p>在创建udev规则后，如果你不能连接设备，请参见<a href="https://github.com/mozilla/r2d2b2g/issues/515" title="https://github.com/mozilla/r2d2b2g/issues/515">bug</a>。</p> -<h2 id="模拟器的局限"><a name="Limitations">模拟器的局限</a></h2> -<p>请注意Firefox OS 模拟器目前并不完美。</p> -<h3 id="硬件的局限">硬件的局限</h3> -<p>除了屏幕尺寸外，模拟器无法模拟Firefox OS设备的硬件换件，比如内存，CPU。</p> -<h3 id="Audiovideo_解码">Audio/video 解码</h3> -<p>下面列出的编码依赖于硬件加速的解码，所以目前还没被支持:</p> -<ul> - <li>MP3</li> - <li>AAC</li> - <li>H.264 (MP4)</li> - <li>WebM</li> -</ul> -<p>这意味目前还无法测试依赖于这些编码的应用以及像Youtube这类网站<span style="line-height: 1.5;">的视频回放功能</span><span style="line-height: 1.5;">。</span></p> -<h3 id="不支持的APIs"><a name="Unsupported-APIs">不支持的APIs</a></h3> -<p>在实体设备上被支持的某些API在模拟器中并没有被支持。通常是因为桌面环境中并没有支持这些API的硬件。我们模拟出了想地理位置的一些API，希望在以后的版本中可以支持更多的API。不管怎么说，目前模拟器尚未支持下面列出的这些API。如果你使用他们，可能会弹出错误或者返回不正确的结果：</p> -<ul> - <li><a href="/en-US/WebAPI/WebTelephony" title="/en-US/WebAPI/WebTelephony">Telephony</a></li> - <li><a href="/en-US/docs/WebAPI/WebSMS" title="/en-US/docs/WebAPI/WebSMS">WebSMS</a></li> - <li><a href="/en-US/docs/WebAPI/WebBluetooth" title="/en-US/docs/WebAPI/WebBluetooth">WebBluetooth</a></li> - <li><a href="/en-US/docs/WebAPI/Using_Light_Events" title="/en-US/docs/WebAPI/Using_Light_Events">Ambient Light</a></li> - <li><a href="/en-US/docs/WebAPI/Proximity" title="/en-US/docs/WebAPI/Proximity">Proximity</a></li> - <li><a href="/en-US/docs/WebAPI/Network_Information" title="/en-US/docs/WebAPI/Network_Information">Network Information</a></li> - <li><a href="/en-US/docs/Online_and_offline_events" title="/en-US/docs/Online_and_offline_events">navigator.onLine and offline events</a></li> - <li><a href="/en-US/docs/WebAPI/Vibration" title="/en-US/docs/WebAPI/Vibration">Vibration</a></li> -</ul> -<h2 id="帮助"><a name="Simulator-help"></a>帮助</h2> -<p>Firefox OS模拟器目前还处于开发的早期阶段，所以在稳定性和功能完整性方面还不尽人意。</p> -<p>如果你发现任何bug，请 <a href="https://github.com/mozilla/r2d2b2g/issues?state=open">在GitHub上面提交</a>. 如果你有任何问题，也可以在 <a href="https://lists.mozilla.org/listinfo/dev-developer-tools">dev-developer-tools mailing list</a> 或者 <a href="irc://irc.mozilla.org/#devtools">#devtools on irc.mozilla.org</a> 提问。</p> -<h3 id="如何启用详细记录"><a name="Simulator-verbose-logging"></a>如何启用详细记录</h3> -<p>使用 about:config 打开偏好设置。<br> - <a href="mailto:extensions.r2d2b2g@mozilla.org.sdk.console.logLevel" style="line-height: 1.5;">extensions.r2d2b2g@mozilla.org.sdk.console.logLevel</a><span style="line-height: 1.5;">, 把值设为0，然后 禁用/开启 这个插件。然后关于模拟器运行操作的详细信息就会现在在错误控制台（Error Console） (较新版本的Firefox里面叫浏览器控制台（Browser Console） ).</span></p> -<h3 id="如何获得最新的预览版本"><a name="Simulator-latest-preview-build"></a>如何获得最新的预览版本</h3> -<p>正如在 <a href="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on">section on installing the Simulator</a> 所解释, 你可以从 <a href="https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/">addons.mozilla.org</a>获得模拟器的最新版本。.</p> -<p>你可能想在我们正式发布前体验最新的特性，那么你可以从下面的链接中获取预览版本：</p> -<ul> - <li>Windows: <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/r2d2b2g/r2d2b2g-windows.xpi">https://ftp.mozilla.org/pub/mozilla.org/labs/r2d2b2g/r2d2b2g-windows.xpi</a></li> - <li>Mac: <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/r2d2b2g/r2d2b2g-mac.xpi">https://ftp.mozilla.org/pub/mozilla.org/labs/r2d2b2g/r2d2b2g-mac.xpi</a></li> - <li>Linux: <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/r2d2b2g/r2d2b2g-linux.xpi">https://ftp.mozilla.org/pub/mozilla.org/labs/r2d2b2g/r2d2b2g-linux.xpi</a></li> -</ul> -<p>但是请注意，相比正式版，预览版并没有被完全测试，在稳定性方面也稍差一些。</p> diff --git a/files/zh-cn/archive/b2g_os/simulator/simulator_walkthrough/index.html b/files/zh-cn/archive/b2g_os/simulator/simulator_walkthrough/index.html deleted file mode 100644 index 40fee1e3bf..0000000000 --- a/files/zh-cn/archive/b2g_os/simulator/simulator_walkthrough/index.html +++ /dev/null @@ -1,269 +0,0 @@ ---- -title: Firefox OS 模拟器简易攻略 -slug: Archive/B2G_OS/Simulator/Simulator_Walkthrough -translation_of: Archive/B2G_OS/Simulator/Simulator_Walkthrough ---- -<p>In this page we'll debug a very simple (but very buggy!) web app using the <a href="/en-US/docs/Tools/Firefox_OS_Simulator" title="/en-US/docs/Tools/Firefox_OS_Simulator">Firefox OS Simulator</a>.</p> -<p>The walkthrough is structured into six parts: each part uses a different diagnostic/debugging tool, specifically, <a href="#Using-manifest-validation" title="#Using-manifest-validation">manifest validation</a>, <a href="#Using-the-WebConsole" title="#Using-the-Error-Console">the Web Console</a>, <a href="#Using-the-JavaScript-Debugger" title="#Using-the-JavaScript-Debugger">the JavaScript Debugger</a>, <a href="#Using-the-NetworkMonitor" title="#Using-the-NetworkMonitor">the Network Monitor</a>, <a href="#Using-the-StyleEditor" title="#Using-the-StyleEditor">the Style Editor</a> and the <a href="#Using-the-TestReceipts" title="#Using-the-TestReceipts">Test Receipts</a>.</p> -<p>It's intended that each part should be self-contained, so it should be possible to read only that part and have it make sense.</p> -<h2 id="Using_manifest_validation"><a name="Using-manifest-validation">Using manifest validation</a></h2> -<div class="note"> - <p>If you want to follow along, the various revisions of the app are in the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough" title="https://github.com/rpl/firefoxos-simulator-walkthrough">firefoxos-simulator-walkthrough</a> repository on GitHub, and you can pick the walkthrough up at this point by starting with the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-1" title="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-1">whereami-1</a> version of the app.</p> - <p>The app displays a single button labeled "Where am I?". When the user clicks the button, the app fetches the user's current location using the Geolocation API, and displays it on a map.</p> - <p>The walkthrough assumes that you've <a href="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on" title="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on">installed the Simulator</a> and opened the Dashboard.</p> -</div> -<p>First we'll add the app to the Dashboard by clicking <strong>"Add Directory"</strong> and selecting the manifest. We'll see this:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5529/manifest-error-collapsed-4.0.png"><br> - <br> - Clicking on <strong>"(2 errors and 0 warnings)"</strong> we see this:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5531/manifest-error-expanded-4.0.png"><br> - This error message is pretty clear, and if we look at <strong>"manifest.webapp"</strong>, we can see that it's missing a <strong>"name"</strong>:</p> -<pre>{ - "description": "A simple web app", - "launch_path": "/index.html", - "icons": { - "128": "/style/icons/earth.png" - } -}</pre> -<p><br> - Add the <strong>"name"</strong> field to the manifest file, save it, and click <strong>"Refresh"</strong> in the Dashboard:</p> -<pre>{ - "name": "Where am I?", - "description": "A simple web app", - "launch_path": "/index.html", - "icons": { - "128": "/style/icons/earth.png" - } -}</pre> -<p><br> - This time the Dashboard should tell us that we have no errors, and should run the app:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5533/whereami-no-map-4.0.png"></p> -<p>But when you click the button, nothing happens. In the next section, we'll try using the WebConsole to diagnose this problem.</p> -<h2 id="Using_the_WebConsole"><a name="Using-the-WebConsole">Using the WebConsole</a></h2> -<div class="note"> - <p><strong>If you haven't followed along from the start of this walkthrough:</strong></p> - <p>In this section we'll debug a very simple (but very buggy!) web app using the <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator" title="/en-US/docs/Tools/Firefox_OS_Simulator">Firefox OS Simulator</a>. The various versions of the app are in the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough" title="https://github.com/rpl/firefoxos-simulator-walkthrough">firefoxos-simulator-walkthrough</a> repository on GitHub, and you can pick the walkthrough up at this point by starting with the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-2" title="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-2">whereami-2</a> version.</p> - <p>The app displays a single button labeled "Where am I?". When the user clicks the button, the app fetches the user's current location using the Geolocation API, and displays it on a map.</p> - <p>But in this version, when we click the button nothing happens. In this section of the walkthrough, we'll use the WebConsole to try to diagnose the problem.</p> - The walkthrough assumes that you've <a href="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on" title="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on">installed the Simulator</a>, opened the Dashboard, and added the app by clicking "Add Directory" in the Dashboard, then selecting the app's "manifest.webapp" file.</div> -<p>Over in the Dashboard, you have to click the button labeled <strong>"Connect"</strong>:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5497/connect-to-app-button.png"></p> -<p>A Simulator window will open automatically and run the app (if it's not already), and the WebConsole should appear into the Simulator Dashboard tab.</p> -<p>In the console output you might see a few errors, warnings, and messages, but the last one in particular looks relevant:<br> - <br> - <img alt="" src="https://mdn.mozillademos.org/files/5535/webconsole-whereami-error.png"><br> - <br> - This is obviously a problem in our app's script, "whereami.js". Here are the first few lines of the script:</p> -<pre class="brush: js">var whereami = document.getElementById('whereami'); - -whereami.onclick = function() { - navigator.geolocation.getCurrentPosition(getMap, error); -};</pre> -<p><br> - Comparing this with our app's "index.html", the problem's obvious:</p> -<pre class="brush: html"><!DOCTYPE html> - -<html> - - <head> - <meta charset='utf-8'> - <script src="http://open.mapquestap.com/sdk/js/v7.0.s/mqa.toolkit.js"></script> - <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> - - </head> - - <body> - <button id ="where-am-i">Where am I?</button> - <div id="map"></div> - <script src="scripts/whereami.js"></script> - <link media="all" href="style/style.css" type="text/css" rel="stylesheet"> - </body> - -</html></pre> -<p><br> - In the HTML, the button is assigned an ID of "where-am-i", but in the JavaScript, we're trying to use "whereami". So let's fix that:</p> -<pre class="brush: js">var whereami = document.getElementById('where-am-i'); - -whereami.onclick = function() { - navigator.geolocation.getCurrentPosition(getMap, error); -};</pre> -<p>Now the app starts up without any errors, but when we click the button, the map doesn't appear, and we get a new message in the WebConsole:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5537/webconsole-whereami-geolocation-error.png"></p> -<p>This message is logged by our "whereami.js" script, and indicates that the geolocation API has returned an error - but it unhelpfully doesn't tell us what the error was. We can use the JavaScript Debugger to figure that out.</p> -<h2 id="Using_the_JavaScript_Debugger"><a name="Using-the-JavaScript-Debugger">Using the JavaScript Debugger</a></h2> -<div class="note"> - <p><strong>If you haven't followed along from the start of this walkthrough:</strong></p> - <p>In this section we'll debug a very simple (but very buggy!) web app using the <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator" title="/en-US/docs/Tools/Firefox_OS_Simulator">Firefox OS Simulator</a>. The various versions of the app are in the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough" title="https://github.com/rpl/firefoxos-simulator-walkthrough">firefoxos-simulator-walkthrough</a> repository on GitHub, and you can pick the walkthrough up at this point by starting with the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-3" title="https://github.com/wbamberg/firefoxos-simulator-walkthrough/tree/master/whereami-1">whereami-3 </a>version.</p> - <p>The app displays a single button labeled "Where am I?". When the user clicks the button, the app fetches the user's current location using the Geolocation API, and displays it on a map.</p> - <p>But in this version, when we click the button the Geolocation API returns an error. In this section of the walkthrough, we'll use the JavaScript Debugger to figure out exactly which error is returned.</p> - <p>The walkthrough assumes that you've <a href="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on" title="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on">installed the Simulator</a>, opened the Dashboard, and added the app by clicking "Add Directory" in the Dashboard, then selecting the app's "manifest.webapp" file.</p> -</div> -<p>In the WebConsole connected to the app, click the link on the right of the geolocation error log:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5539/webconsole-whereami-geolocation-error-annotated.png"><br> - Clicking on the <strong>"whereami.js:8"</strong> link, the JavaScript Debugger will be automatically loaded and pointed to the related file and line number.</p> -<p>According to the <a href="/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition#PositionError" title="/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition#PositionError">Geolocation API reference</a>, the specific error is given by the <code>code</code> property of the <code>error</code> object that's passed into the error handler <code>error()</code>. So set a breakpoint inside <code>error()</code> by clicking to the left of line 8:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5541/webconsole-whereami-set-breakpoint.png"></p> -<p>In the app, click <strong>"Where am I?"</strong>. Execution should stop at the breakpoint:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5545/webconsole-whereami-hit-breakpoint.png"></p> -<p>Click where it says <strong>"Add watch expression"</strong> and type <strong>"error.code"</strong>, and you'll immediately see its value, <strong>"1"</strong>:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5547/webconsole-whereami-watch.png"><br> - According to the <a href="/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition#PositionError" title="/en-US/docs/DOM/window.navigator.geolocation.getCurrentPosition#PositionError">Geolocation API documentation</a>, "1" means "Permission denied". This is an error web apps get if they have not requested the <a href="/en-US/docs/Apps/App_permissions" title="/en-US/docs/Apps/App_permissions">geolocation permission</a>, or if the permission wasn't granted by the user.<br> - <br> - Looking at the "manifest.webapp" file, we'll see that we didn't ask for the permission:</p> -<pre>{ - "name": "Where am I?", - "description": "A simple web app", - "launch_path": "/index.html", - "icons": { - "128": "/style/icons/earth.png" - } -}</pre> -<p><br> - Let's fix that:</p> -<pre>{ - "name": "Where am I?", - "description": "A simple web app", - "launch_path": "/index.html", - "icons": { - "128": "/style/icons/earth.png" - }, - "permissions": { - "geolocation": { - "description": "Needed to tell the user where they are" - } - } -}</pre> -<p><br> - Save <strong>"manifest.webapp"</strong>, and click <strong>"Refresh"</strong> in the Dashboard one more time. Remember to resume the Debugger as it is still at the breakpoint. This time the app runs, and when you click "Where am I?" it asks you to share your location, and if you allow it, the map doesn't appear and we get a new message in the WebConsole:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5549/webconsole-whereami-mapquestapi-not-defined.png"></p> -<p>This message indicates that the MapQuest API, which we have included into our app using a tag script, is not loaded correctly. We can use the Network Monitor to figure that out.</p> -<h2 id="Using_the_Network_Monitor"><a name="Using-the-NetworkMonitor"></a>Using the Network Monitor</h2> -<div class="note"> - <p><strong>If you haven't followed along from the start of this walkthrough:</strong></p> - <p>In this section we'll inspect network request from a very simple (but very buggy!) web app using the <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator" title="/en-US/docs/Tools/Firefox_OS_Simulator">Firefox OS Simulator</a>. The various versions of the app are in the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough" title="https://github.com/rpl/firefoxos-simulator-walkthrough">firefoxos-simulator-walkthrough</a> repository on GitHub, and you can pick the walkthrough up at this point by starting with the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-4" title="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-4">whereami-4 </a>version.</p> - <p>The app displays a single button labeled "Where am I?". When the user clicks the button, the app fetches the user's current location using the Geolocation API, and displays it on a map.</p> - <p>But in this version, when we click the button the WebConsole shows a "MQA is not defined" error. In this section of the walkthrough, we'll use the Network Monitor to figure out exactly why the MapQuest API is not loaded.</p> - <p>The walkthrough assumes that you've <a href="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on" title="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on">installed the Simulator</a>, opened the Dashboard, and added the app by clicking "Add Directory" in the Dashboard, then selecting the app's "manifest.webapp" file.</p> -</div> -<div class="warning"> - <p><strong>Warning:</strong> the <a href="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/" title="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/">Network Monitor is available for Firefox >= 23.0</a> (which is currently <a href="http://www.mozilla.org/en-US/firefox/beta/" title="http://www.mozilla.org/en-US/firefox/beta/">Firefox Beta</a>)</p> -</div> -<p>In the Developer Tools panel connected to the app, click the <strong>Network</strong> tab and the following panel will be presented to you, where you see that requests for the <strong>"mqa.toolkit.js"</strong> resource from the <strong>"open.mapquestap.com"</strong> domain are never completed successfully:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5551/network-monitor-timing-panel.png"></p> -<p>Successful requests are <strong>green colored</strong>, if we click on one of the requests to the <strong>"open.mapquestap.com"</strong> domain (<strong>dark grey colored</strong>) and select the <strong>Timings</strong> detail panel, we can figure out that the request never reached the <strong>Connecting</strong> status, because DNS resolution did not succeed.</p> -<p>Looking at the <strong>"index.html"</strong> file, we'll see that the script tag points to the wrong domain.</p> -<p>Let's fix this bug, changing the script tag to use the correct domain: <strong>open.mapquestapi.com</strong> (add the missing 'i' to the domain name):</p> -<pre class="brush: html"><!DOCTYPE html> - -<html> - - <head> - <meta charset='utf-8'> - <script src="<span style="background-color: #ffff00;">http://open.mapquestapi.com/sdk/js/v7.0.s/mqa.toolkit.js</span>"></script> - <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> - - </head> - - <body> - <button id ="where-am-i">Where am I?</button> - <div id="map"></div> - <script src="scripts/whereami.js"></script> - <link media="all" href="style/style.css" type="text/css" rel="stylesheet"> - </body> - -</html></pre> -<p>Save <strong>"index.html"</strong>, and click <strong>"Refresh"</strong> in the Dashboard one more time. This time the app runs, and when you click "Where am I?" it asks you to share your location, and if you allow it, the app finally displays the map:<br> - <img alt="" src="https://mdn.mozillademos.org/files/5553/whereami-map.png" style="width: 399px; height: 663px;"></p> -<h2 id="Using_the_Style_Editor"><a name="Using-the-StyleEditor"></a>Using the Style Editor</h2> -<div class="note"> - <p><strong>If you haven't followed along from the start of this walkthrough:</strong></p> - <p>In this section we'll customizing the app stylesheets using the <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator" title="/en-US/docs/Tools/Firefox_OS_Simulator">Firefox OS Simulator</a>. The various versions of the app are in the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough" title="https://github.com/rpl/firefoxos-simulator-walkthrough">firefoxos-simulator-walkthrough</a> repository on GitHub, and you can pick the walkthrough up at this point by starting with the version <a href="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-5" title="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-5">whereami-5</a>.</p> - <p>The app displays a single button labeled "Where am I?". When the user clicks the button, the app fetches the user's current location using the Geolocation API, and displays it on a map.</p> - <p>In this version all the previous bugs are already fixed, and we're going to use the Style Editor to change the style real time on the running app and save it back when we're <span class="short_text" id="result_box" lang="en"><span class="hps">satisfied.</span></span></p> - <p>The walkthrough assumes that you've <a href="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on" title="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on">installed the Simulator</a>, opened the Dashboard, and added the app by clicking "Add Directory" in the Dashboard, then selecting the app's "manifest.webapp" file.</p> -</div> -<div class="warning"> - <p><strong>Warning:</strong> the <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=816967" title="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/">Style Editor is available for Firefox >= 23.0</a> (which is currently <a href="http://www.mozilla.org/en-US/firefox/beta/" title="http://www.mozilla.org/en-US/firefox/beta/">Firefox Beta</a>)</p> -</div> -<p>In the Developer Tools connected to the app, click the <strong>Style Editor</strong> tab and the following panel will be presented to you:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5555/whereami-style-editor.png"></p> -<p>Select <strong>"style/style.css"</strong> from the style sheets list on the left and make some changes to the CSS rules. The new rules will be applied to the connected app immediately:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5557/whereami-style-editor-changes.png"></p> -<p>Now you can click on the <strong>"Save"</strong> link just below <strong>"style/style.css"</strong> in the style sheets list to save it back into the project.</p> -<h2 id="Using_the_Test_Receipts"><a name="Using-the-TestReceipts"></a>Using the Test Receipts</h2> -<div class="note"> - <p><strong>If you haven't followed along from the start of this walkthrough:</strong></p> - <p>In this section we'll add payment receipt validation code to a web app using the <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator" title="/en-US/docs/Tools/Firefox_OS_Simulator">Firefox OS Simulator</a>. The various versions of the app are in the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough" title="https://github.com/rpl/firefoxos-simulator-walkthrough">firefoxos-simulator-walkthrough</a> repository on GitHub, and you can pick the walkthrough up at this point by starting with the <a href="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-6" title="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-6">whereami-6</a><a href="https://github.com/wbamberg/firefoxos-simulator-walkthrough/tree/master/whereami-5" title="https://github.com/wbamberg/firefoxos-simulator-walkthrough/tree/master/whereami-5"> </a>version.</p> - <p>The app displays a single button labeled "Where am I?". When the user clicks the button, the app fetches the user's current location using the Geolocation API, and displays it on a map.</p> - <p>In this version we're going to change it to became a paid web app<span class="short_text" id="result_box" lang="en"><span class="hps">.</span></span></p> - <p>The walkthrough assumes that you've <a href="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on" title="/en-US/docs/Tools/Firefox_OS_Simulator#Installing_the_Simulator_add-on">installed the Simulator</a>, opened the Dashboard, and added the app by clicking "Add Directory" in the Dashboard, then selecting the app's "manifest.webapp" file.</p> -</div> -<p>Now that your app is bug-free and properly styled, you can add payment receipt validation to ensure that users of your app have purchased it.</p> -<p>Mozilla has released a small JavaScript library which will help an app check its receipts: <a href="https://github.com/mozilla/receiptverifier" title="https://github.com/mozilla/receiptverifier">http://github.com/mozilla/receiptverifier</a></p> -<p>Let's add receiptverifier to the app, e.g. adding a new script tag to its "index.html" file:</p> -<pre class="brush: html"><!DOCTYPE html> - -<html> - - <head> - <meta charset='utf-8'> - <span style="background-color: #ffff00;"><script src="https://raw.github.com/mozilla/receiptverifier/master/receiptverifier.js"></script></span> - <script src="http://open.mapquestapi.com/sdk/js/v7.0.s/mqa.toolkit.js"></script> - <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script> - - </head> - - <body> - <button id ="where-am-i">Where am I?</button> - <div id="map"></div> - <script src="scripts/whereami.js"></script> - <link media="all" href="style/style.css" type="text/css" rel="stylesheet"> - </body> - -</html></pre> -<p>and check the receipts in the <strong>"scripts/whereami.js"</strong> using the <strong>"mozmarket.receipts.Verifier"</strong> API (e.g. checking the receipts on the button click or on the app loading):</p> -<pre class="brush: js">... - -var verifier = new mozmarket.receipts.Verifier({ - installs_allowed_from: '*', - typsAllowed: 'test-receipt', - logLevel: mozmarket.receipts.Verifier.levels.DEBUG, - onlog: mozmarket.receipts.Verifier.consoleLogger -}); -verifier.clearCache(); - -function verifyPaymentReceipts(cb) { - verifier.verify(function (verifier) { - if (verifier.state instanceof verifier.states.OK) { - cb(null); // valid payment - } else { - cb("invalid-payment"); // invalid payment - } - }); - setTimeout(function checkNoReceipts() { - if (verifier.state instanceof verifier.states.NoReceipts) { - cb("no-receipts"); - } - }, 2000); -} - -whereami.onclick = function() { - verifyPaymentReceipts(function (err) { - if (err) { - alert("Invalid Payment Receipt."); - } else { - navigator.geolocation.getCurrentPosition(getMap, error); - } - }); -}; -</pre> -<p>Receipts are cryptographically signed (by the Marketplace and the Payment services), but you can use the Simulator to install your app with a test receipt by selecting the type of receipt to install (which defaults to <strong>"None"</strong>) using the <strong>"Receipts"</strong> menu in the app entry:</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5559/receipts-whereami-menu-annotated.png"></p> -<p>Now you can test how the app will behave with <strong>"Valid"</strong>, <strong>"Invalid"</strong>, and <strong>"Refunded"</strong> receipts (or when there isn't any receipt) and observe the results by looking at the logs produced by the <strong>receiptverifier</strong> library in the Web Console:</p> -<p> </p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5561/whereami-receipt-invalid.png"></p> -<p><img alt="" src="https://mdn.mozillademos.org/files/5563/whereami-receipt-valid.png"></p> -<div class="note"> - <p><strong>Note:</strong> You can get the completed app from the <a class="external" href="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-7" title="https://github.com/rpl/firefoxos-simulator-walkthrough/tree/master/whereami-7">whereami-7 </a>version.</p> -</div> -<p> </p> diff --git a/files/zh-cn/archive/b2g_os/using_firefox_os_simulator/index.html b/files/zh-cn/archive/b2g_os/using_firefox_os_simulator/index.html deleted file mode 100644 index 1abeb853a8..0000000000 --- a/files/zh-cn/archive/b2g_os/using_firefox_os_simulator/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: 使用Firefox OS模拟器 -slug: Archive/B2G_OS/Using_Firefox_OS_Simulator -translation_of: Archive/B2G_OS/Simulator ---- -<p>The Firefox OS Simulator is a desktop platform tool that shows you what apps will look like on a phone that is running the Firefox OS. It is the easiest way to try out apps on Firefox OS before submitting them to the Firefox Marketplace. The Firefox OS Simulator was formerly called "r2d2b2g", but that name is too difficult.</p> -<p>The Simulator is packaged as a desktop Firefox add-on. You can use any recent version of Firefox from Firefox 17 onward.</p> -<p>Although there are other ways to run the Firefox OS desktop, the best and most convenient way for app developers is this one. If you're a core Firefox OS platform developer, or are working on localization, there are other tools that are better suited for your needs. The Simulator add-on includes support for adding apps to the test environment, and is configured to support remote debugging, remote Web console, and other features. It also provides a visible Home button you can click, and sets the user-agent string to the one used by Firefox OS on devices. The result is, in nearly every way, a better environment for app developers.</p> -<h2 id="安装Firefox_OS模拟器" style="">安装Firefox OS模拟器</h2> -<ol> - <li>Using Firefox, go to this link: <a href="https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/" title="/en-US/firefox/addon/firefox-os-simulator/">https://addons.mozilla.org/addon/firefox-os-simulator/</a></li> - <li>Click <strong>Add to Firefox</strong>. It's a large download. Follow the prompts that appear.</li> -</ol> -<div class="warning"> - <p>Because of the size of the add-on, Firefox may freeze for several seconds while installing it, and its <em>unresponsive script</em> dialog may appear, due to <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=814505" title="https://bugzilla.mozilla.org/show_bug.cgi?id=814505">bug 814505</a>. If it does, just click the <em>Continue</em> button, and Firefox will continue installing the add-on.</p> -</div> -<h2 id="Starting_the_Simulator">Starting the Simulator</h2> -<ol> - <li>On the <strong>Firefox</strong> menu (Windows) or the <strong>Tools</strong> menu (Mac, Linux), go to <strong>Web Developer</strong> and click <strong>Firefox OS Simulator</strong>. The dashboard appears. - <p><img alt="Dashboard" src="/files/4487/dashboard.jpg" style="width: 600px; height: 419px;"></p> - </li> - <li>Click the <strong>Stopped</strong> button. It changes into the <strong>Running</strong> button and Firefox OS boots up in its own window. The default size for this window is 320x480. - <p><img alt="Simulator" src="/files/4485/simulator.jpg" style="width: 336px; height: 552px;"></p> - <p>To stop the Simulator, click the <strong>Running</strong> button in the dashboard, or just close the Simulator window.</p> - </li> -</ol> -<div class="note"> - <p><strong>Note:</strong> You can also start and stop the Simulator in the Developer Toolbar command line using <code>firefoxos start</code> and <code>firefoxos stop</code>.</p> -</div> -<h2 id="Navigating_in_the_Simulator">Navigating in the Simulator</h2> -<p>Imitate swipe motions in the Simulator by clicking and dragging with the mouse. The mouse scroll wheel will move a list up and down, such as in the Settings app. Click and hold down the mouse button to simulate a long press.</p> -<p>To get back to the home screen, click the home button at the bottom of the Simulator, or press the <strong>Home</strong> key on your keyboard. On Mac keyboards without a <strong>Home</strong> key, use <strong>Fn + Left Arrow</strong>.</p> -<h2 id="Console_checkbox">Console checkbox</h2> -<p>Click the <strong>Console</strong> check box before you start the Simulator to open an error console so you can spot errors that might occur while you're working on your app.</p> -<h2 id="Web_APIs_in_the_Simulator">Web APIs in the Simulator</h2> -<p>Mozilla is working on many Web APIs to make native platform capabilities available to Open Web Apps. The Web APIs currently supported in the Simulator are:</p> -<ul> - <li>Contacts API</li> - <li>Settings API</li> - <li><span style="color: #ff0000;"><span style="background-color: #ffff00;">? what other APIs ?</span></span></li> -</ul> -<h2 id="Installing_an_app_in_the_Simulator">Installing an app in the Simulator</h2> -<p>To install a hosted app in the Simulator, type the URL to the app's manifest in the URL box, and click <strong>Add Manifest</strong>. This will install the app in the Simulator. Here is a simple weather app that you can use as a test:</p> -<pre>http://jlongster.github.com/weatherme/manifest.webapp</pre> -<p>The app's icon will be added to one of the home screens in the Simulator.</p> -<p>You can also install a plain website in the same way. Just type the website's URL in the box and click <strong>Add URL</strong>, and an icon for the site will be added to a home screen. Autocompletion works if you have the website open in another tab.</p> -<p>To install a packaged app in the Simulator, click the <strong>Add Directory</strong> button, then select the mini-manifest of the app on your local filesystem.</p> -<p>To remove an app from the Simulator, click the <strong>Remove</strong> link for the app in the dashboard. You may have to restart the Simulator to see it gone.</p> -<h2 id="Updating_an_app">Updating an app</h2> -<p>If you are working on an app and need to update it in the Simulator, click the app's Update button in the dashboard. You will have to restart the Simulator. Hosted apps follow the usual rules for Website caching and working with appcache.</p> -<h2 id="Reporting_bugs">Reporting bugs</h2> -<p>Remember that the Simulator is a brand-new tool and is still heavily under development. Please <a href="https://github.com/mozilla/r2d2b2g/issues?state=open" title="https://github.com/mozilla/r2d2b2g/issues?state=open">let us know</a> if you find any bugs.</p> -<h2 id="More_information">More information</h2> -<p>The Simulator itself is the <a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client" title="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client">Firefox OS desktop client</a> (also called the B2G desktop client), which is a build of Firefox OS that runs on Windows, Mac, and Linux. Firefox OS Simulator makes it easier to test apps on Firefox OS desktop because it includes functionality for adding apps to the environment and is configured/extended in a variety of ways to better meet the needs of app developers.</p> -<p>However, because the Simulator uses the Firefox OS desktop client, the documentation for B2G Desktop, Gaia, and B2G generally will also apply to the Simulator to some extent. Here are a couple of those docs:</p> -<p><a href="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client" title="/en-US/docs/Mozilla/Boot_to_Gecko/Using_the_B2G_desktop_client">Using the Firefox OS desktop client</a></p> -<p><a href="https://wiki.mozilla.org/Gaia/Hacking" title="https://wiki.mozilla.org/Gaia/Hacking">Hacking Gaia</a></p> diff --git a/files/zh-cn/archive/b2g_os/using_the_app_manager/index.html b/files/zh-cn/archive/b2g_os/using_the_app_manager/index.html deleted file mode 100644 index 35b8506eed..0000000000 --- a/files/zh-cn/archive/b2g_os/using_the_app_manager/index.html +++ /dev/null @@ -1,183 +0,0 @@ ---- -title: 使用应用管理器 -slug: Archive/B2G_OS/Using_the_App_Manager -translation_of: Archive/B2G_OS/Using_the_App_Manager ---- -<div class="summary"> - <p>“应用管理器 (App Manager)”为桌面版 Firefox 的新工具，开发者可以通过浏览器，直接在 Firefox OS 手机 和 Firefox OS 模拟器 (Firefox OS Simulator) 中进行 HTML5 Web App 的测试、布署、调试等工作。</p> - <p>App Manager是为使用Firefox OS 1.2 及之后的版本的开发者服务的，如果您正在Firefox OS 1.1 版本上开发app，则需要参考有关<a href="/en-US/docs/Tools/Firefox_OS_1.1_Simulator">Firefox OS 1.1 仿真器</a>的介绍。</p> -</div> -<p style="text-align: center;"> </p> -<p>应用管理器具备下列组件：</p> -<ul> - <li><a href="#Apps_panel">“应用”面板</a>，将管理本地 App（即在你电脑上的 App 源代码）与托管（Hosted）在外部的 App，让开发者能在自己的设备或模拟器上进行打包和安装，并通过工具箱调试。</li> - <li><a href="#Device_panel">“设备”面板</a>，显示已连线设备的相关信息，包括所安装 Firefox OS 的版本、所使用设备 API 的必要权限、已安装的 App 等。</li> - <li><a href="/zh-CN/docs/Tools/Tools_Toolbox">开发者工具箱</a>， 包含了一套开发者工具（Web控制台、查看器、调试器等），可通过“应用”面板连接上执行中的 App来执行调试。</li> -</ul> -<h2 id="快速设置："><a name="Configuring_device">快速设置：</a></h2> -<p>本节的目的是让开发者尽快的设置和应用工具。如果你需要一些更详细的资料，则可以请跳过本节，直接从《<a href="#设备和系统配置">设备和系统配置</a>》阅读。如遇到任何问题，也可参阅《<a href="#疑难排除">疑难排除</a>》获取帮助。</p> -<ol> - <li>确保已安装了桌面版Firefox 26+</li> - <li>打开应用管理器（在地址栏输入 <code>about:app-manager</code> ）</li> - <li>如果你没有实际的 Firefox OS 设备： - <ol> - <li>安装 <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/">Firefox OS 模拟器 (Firefox OS Simulator)</a></li> - <li>在应用管理器底部的工具栏中，点击“启动模拟器” ，然后再点击模拟器名称（已安装的模拟器均应出现）。</li> - </ol> - </li> - <li>如果你拥有 Firefox OS 设备： - <ol> - <li>请确保你的设备运行Firefox OS 1.2+</li> - <li>在Windows上，请安装你的手机制造商提供的驱动程序</li> - <li>进入设备的“Settings”，停用“Screen Lock（<code>Settings</code> > <code>Screen Lock</code>）”，并启用“Remote Debugging（<code>Settings</code> > <code>Device information</code> > <code>More information</code> > <code>Developer</code>）”</li> - <li>为桌面版 Firefox 安装附加组件 <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/">ADB Helper</a></li> - <li>通过 USB 接口将设备连接到你的电脑</li> - <li> 你应该可以在应用管理器底部的工具栏看到设备的名称，点击它</li> - </ol> - </li> - <li>底部工具栏应显示 “连接到: xxx”</li> - <li>点选 “应用”面板 并新增应用（打包或托管应用皆可）</li> - <li>“刷新”按钮将验证该 App 并安装到模拟器/设备中</li> - <li>调试按钮连接开发者工具到运行中的 App</li> - <li><strong>如遇到<span class="short_text" id="result_box" lang="zh-CN"><span>麻烦</span></span>，请参阅 <a href="#疑难排除">疑难排除</a>章节以得到更多帮助</strong></li> -</ol> -<h2 id="设备和系统配置_2"><a name="设备和系统配置"></a>设备和系统配置</h2> -<p>使用应用管理器前的第一件事，就是要确保你的系统和手机的设定是正确的。接着就是按照本节说明的各个步骤运行。</p> -<h3 id="需要Firefox_1.2">需要Firefox 1.2+</h3> -<p>请确保你的设备运行Firefox OS1.2/Boot2Gecko1.2或更高版本。要检查当前 Firefox OS 版本，则可进入 <code>Settings</code> > <code>Device Information</code> > <code>Software</code> 。</p> -<p>如果您没有安装足够高版本的 Firefox OS，则你需要根据手机型号的不同，安装 Firefox 1.2+ nightly 版本，或通过源代码配置和构建自己的版本。</p> -<p>可用的构建：</p> -<ul> - <li><a href="http://downloads.geeksphone.com/">Geeksphone Keon/Peak builds</a>（要了解更多使用方式，可参阅 <a href="/zh-CN/docs/Mozilla/Firefox_OS/Developer_phone_guide/Updating_and_Tweaking_Geeksphone">Updating and Tweaking your Firefox OS Developer Preview phone/Geeksphone</a> ）</li> - <li>敬请期待更多</li> -</ul> -<div class="note"> - <p>注意：要构建自己的 Firefox OS 1.2+，请参阅 <a href="/zh-CN/docs/Mozilla/Firefox_OS/Building_and_installing_Firefox_OS">编译及安装Firefox OS火狐操作系统</a> 说明，并从 <a href="/zh-CN/docs/Mozilla/Firefox_OS/Firefox_OS_build_prerequisites">编译Firefox OS的系统需求</a> 着手。</p> -</div> -<h3 id="远程调试">远程调试</h3> -<p>接下来，你需要在 Firefox OS 中启用远程调试，开启方法为：进入 <code>Settings</code> > <code>Device information</code> > <code>More information</code> > <code>Developer</code>，并勾选 Remote Debugging 复选框即可。</p> -<h3 id="Adb_Helper_Add-on" name="Adb_Helper_Add-on"><a name="ADB 或 ADB helper"></a>ADB 或 ADB helper</h3> -<p>通过 Android Debug Bridge (ADB) 连接设备与电脑并通信。有两个运行ADB的方式：</p> -<ul> - <li> - <p>让 Firefox 处理 ADB（推荐）。<a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/">安装 ADB Helper 附加组件</a>，可让过程变得简单。安装了 ADB Helper 就不需再安装 ADB，也不需再输入 <code>adb forward</code> 指令，一切由此附加组件将处理。</p> - <a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/" style="margin-bottom: 20px; padding: 10px; text-align: center; border-radius: 4px; display: inline-block; background-color: #81BC2E; white-space: nowrap; color: white; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25); box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.2), 0px -1px 0px 0px rgba(0, 0, 0, 0.3) inset;" title="https://addons.mozilla.org">下载扩展 ADB Helper</a></li> - <li>手动使用 ADB。你需要把它安装在你的电脑上—下载、安装 <code>adb</code>（可参考<code><a href="/en-US/Debugging/Installing_ADB">安装ADB</a> ）</code>。然后通过在终端中输入以下命令来启用端口映射： - <pre>adb forward tcp:6000 localfilesystem:/data/local/debugger-socket</pre> - 注意，每次重启或插拔手机，都需要重复上述动作 1 次。</li> -</ul> -<div class="note"> - <p>注意：如果安装了 ADB Helper 扩展，就不需执行此指令。</p> -</div> -<h2 id="将设备连接到应用管理器">将设备连接到应用管理器</h2> -<p>所有配置完成之后，就可将设备连上电脑并启动应用管理器：</p> -<ol> - <li>通过USB接口连接电脑。</li> - <li>在你设备上禁用锁屏，方法是 <code>Settings > Screen Lock </code>并 取消 <code>Lock Screen</code> 勾选。这是非常必要的，因为当屏幕锁定后，手机和电脑的连接就会中断，这样就无法调试了。</li> - <li>启动应用管理器(App Manager) — 在桌面版 Firefox 菜单中点击 <code style="font-size: 14px;">Tools > Web Developer > App Manage</code> 启动，或在通过地址栏输入”about:app-manager“启动。</li> - <li>应用管理器标签页底部，会看到连接状态栏（见下图）。您应该能够通过点击“连接到 localhost:6000”按钮即可连线设备。</li> - <li>如连接成功，就会有“An incoming request to permit remote debugging connection was detected. Allow connection?”对话框。点击“OK”钮（你可能需要按下手机的电源键，才能看到该对话框）。这时连接状态栏应该更新为”连接到 B2G“，如想断开连接，可以按”断开“连接。</li> -</ol> -<p><img alt="" src="https://mdn.mozillademos.org/files/6263/connection-status.png" style="width: 600px; height: 30px; display: block; margin: 0px auto;"></p> -<div class="note"> - <p>注意：在连线状态栏中有其他控件，允许你通过模拟器连接到应用管理器 ，我们将在下一节中说明。另外要更改连接端口，则需要启动”端口映射“功能，可参阅上节的《<a href="#端口映射">端口映射</a>》。</p> -</div> -<h2 id="使用_Firefox_OS_Simulator_附加组件"><a name="Simulator">使用 Firefox OS Simulator 附加组件</a></h2> -<p>如果你没有实际的 Firefox OS 设备来配合 App Manager，可以使用 <a href="/zh-CN/docs/Tools/Firefox_OS_Simulator">FirefoxOS 模拟器</a>。不过要选择适合自己操作系统的模拟器版本：</p> -<p><a href="https://ftp.mozilla.org/pub/mozilla.org/labs/fxos-simulator/" style="margin-bottom: 20px; padding: 10px; text-align: center; border-radius: 4px; display: inline-block; background-color: #81BC2E; white-space: nowrap; color: white; text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.25); box-shadow: 0px 1px 0px 0px rgba(0, 0, 0, 0.2), 0px -1px 0px 0px rgba(0, 0, 0, 0.3) inset;">安装 Firefox 模拟器</a></p> -<div class="note"> - <p>注意：目前只有 Firefox OS 1.2 模拟器，未来将提供更多版本选择。</p> -</div> -<p>一旦你安装了模拟器，就可以在应用管理器底部栏找到并点击 ”启动模拟器“按钮。接着将出现 3 个按钮：</p> -<ul> - <li>”Firefox OS 1.2“（或类似的）：最左侧的按钮显示你所安装模拟器的版本名称。点击它来启动连接模拟器。</li> - <li>”添加“：中间的按钮将链接到本文本节，这样你就可以添加更多新版本的模拟器（如Firefox OS 1.2, Firefox OS 1.3, ...）。</li> - <li>”取消“：右侧按钮可以取消连接。</li> -</ul> -<h2 id="“应用”面板"><a name="Apps_panel">“应用”面板</a></h2> -<p>现在一切设定完毕，我们了解一下应用管理器的功能吧。首先是“应用”面板。在这里你可以导入现有应用到设置，便于调试。</p> -<ul> - <li>若安装本地应用，则点击“添加已打包应用”标签按钮，在弹出对话框中选择放置该应用的目录即可。</li> - <li>若安装外部托管应用，则点击“添加已托管应用” 标签按钮后填入应用 manifest 文件的绝对路径，再点击 “+” 按钮。</li> -</ul> -<p>在窗口右侧会显示你应用的相关信息，如下图所示：</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6261/apps-panel.png" style="width: 600px; height: 375px; display: block; margin: 0px auto;"></p> -<h3 id="Manifest_编辑器">Manifest 编辑器</h3> -<p>从 Firefox 28 开始，“应用”面板包含一个应用 manifest 编辑器：</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6613/apps-panel-fx-28.png" style="width: 600px; display: block; margin: 0px auto;"></p> -<h3 id="调试">调试</h3> -<p>点击“更新”（安装）按钮，则更新（安装）应用到设备中。点击“调试”按钮将调用工具箱，让你直接来调试应用源代码。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6265/debug.png" style="width: 600px; height: 375px; display: block; margin: 0px auto;"></p> -<div class="note"> - <p>注意：你可以尝试玩一下工具盒 — 比如，尝试修改DOM，CSS等等，你会立即看到实时反映到了设备上。这些修改被保存到已安装的应用代码里，在你下次在设备上打开应用后会看到改变。</p> -</div> -<p>在 Firefox 28 之前，这个工具都是在单独窗口中启动。从 Firefox 28 开始，这些工具都会在应用管理器中的“应用”和“设备”面板标签旁边，以标签形式出现。该标签很容易找打，该标签卡会出现应用的图标。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6615/toolbox-fx-28.png" style="width: 600px; height: 375px; display: block; margin: 0px auto;"></p> -<h3 id="错误">错误</h3> -<p>如果应用没有被成功添加（例如，URL不正确，或者打包了一个错误文件夹）— 即使引入了一个错误的应用，也会被包括错误信息。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6259/apps-error.png" style="width: 600px; height: 375px; display: block; margin: 0px auto;"></p> -<p>你可以在上图中删除一个应用，把鼠标悬停在左侧窗口应用名/描述上，然后按出现的“X”按钮即可。然而，这并没有真正把设备上的应用删除了，你仍然需要在设备上手动删除应用。</p> -<h2 id="“设备”面板"><a name="Device_panel">“设备”面板</a></h2> -<p>“设备”面板显示已连接设备的相关信息。在“已安装应用”窗口中可以启动和调试设备上的应用。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6267/device-tab.png" style="width: 600px; height: 375px; display: block; margin: 0px auto;"></p> -<div class="note"> - <p>注：Certified Apps 默认不列出。可参阅 <a href="#Debugging_Certified_Apps">Certified App 的调试方式</a>。</p> -</div> -<p><a name="permissions"></a> “权限”窗口显示当前设备的各种 <a href="/zh-CN/docs/WebAPI">Web API</a> 所需要的权限。</p> -<p><img alt="" src="https://mdn.mozillademos.org/files/6269/permissions.png" style="width: 600px; height: 375px; display: block; margin: 0px auto;"></p> -<p>最后，你可以点击“截图”按钮，截下当前设置显示的画面，截图会显示在 Firefox 的新标签页中，你可以另存该图。</p> -<h2 id="调试_Certified_Apps"><a name="Debugging_Certified_Apps">调试 Certified Apps</a></h2> -<p>目前仅限搭载 Firefox OS 1.2 开发版本的设备，才能进行 Certified Apps 的调试。若你的设备正运行开发版本，则可将首选项中的“ devtools.debugger.forbid-certified-apps”变更为“false”，即可开始 Certified Apps 的调试。具体请按照下列步骤操作：</p> -<ol> - <li> - <p>在电脑的终端/控制台中输入下列指令，以进入设备的文件系统：</p> - <pre class="brush: bash">adb shell</pre> - <p>命令行会提示转为 <code>root@android</code>.</p> - </li> - <li> - <p>接着，使用下列命令停止B2G运行：</p> - <pre class="brush: bash">stop b2g</pre> - </li> - <li> - <p>进入以下目录：</p> - <pre>cd /data/b2g/mozilla/*.default/</pre> - </li> - <li> - <p>这一步，使用下列代码更新 prefs.js 文件：</p> - <pre class="brush: js">echo 'user_pref("devtools.debugger.forbid-certified-apps", false);' >> prefs.js</pre> - </li> - <li> - <p>当你完成编辑并保存文件后，使用以下命令重新启动B2G：</p> - <pre class="brush: bash">start b2g</pre> - </li> - <li> - <p>this will return you to your normal terminal prompt.使用 <code>exit</code> 命令退出 android 的文件系统；就会返回到正常的终端提示符画面。</p> - </li> - <li> - <p>接下来，重新连接到应用管理器，你应该可以看到 Certified Apps 出现，就可以进行调试了。</p> - </li> -</ol> -<div class="note"> - <p>注意：如果你想把这个偏好设定加入自己的 Gaia 版本，且即使重设手机也能让该设定保持启用状态，则可将此偏好设定加入 <code>build/custom-prefs.js</code> 再执行 <code>make reset-gaia</code> 即可。</p> -</div> -<h2 id="疑难排除_2"><a name="疑难排除">疑难排除</a></h2> -<p id="My_device_is_not_recognized">如果设备无法识别：</p> -<ul> - <li>请先完整阅读上方的《<a href="#Configuring_device">装置与系统设定</a>》章节，确认已完成所有步骤：</li> - <li>你的设备上运行的是否是 Firefox OS 1.2+？</li> - <li>无法看到所有应用？查看是否启用了“<a href="#Debugging_Certified_Apps">调试 Certified Apps</a>”？</li> - <li>是否已启用手机的“远程调试（Remote Debugging）”？</li> - <li>如果你不使用扩展 <a href="#ADB 或 ADB helper">ADB Helper</a> ： - <ul> - <li>是否已成功执行 <code>adb forward</code> 指令？</li> - </ul> - </li> - <li>如果你使用了扩展 <a href="#ADB 或 ADB helper">ADB Helper</a> ，但自己的设备并未出现于底部工具栏中： - <ul> - <li>如果你使用Linux，<a href="http://developer.android.com/tools/device.html#setting-up">一定要正确设置 udev</a></li> - <li>如果你使用Windows，<a href="http://developer.android.com/tools/device.html#setting-up">请确保安装相应的驱动程序</a></li> - </ul> - </li> - <li>你的手机是解锁状态吗？</li> -</ul> -<p>无法将设备连接到应用管理器或启动模拟器？请<a href="https://wiki.mozilla.org/DevTools/GetInvolved#Communication">让我们知道</a>或<a href="https://bugzilla.mozilla.org/enter_bug.cgi?alias=&assigned_to=nobody%40mozilla.org&attach_text=&blocked=&bug_file_loc=http%3A%2F%2F&bug_ignored=0&bug_severity=normal&bug_status=NEW&cf_blocking_b2g=---&cf_crash_signature=&cf_status_b2g18=---&cf_status_b2g_1_1_hd=---&cf_status_b2g_1_2=---&cf_status_firefox24=---&cf_status_firefox25=---&cf_status_firefox26=---&cf_status_firefox27=---&cf_status_firefox_esr17=---&cf_status_firefox_esr24=---&cf_tracking_b2g18=---&cf_tracking_firefox24=---&cf_tracking_firefox25=---&cf_tracking_firefox26=---&cf_tracking_firefox27=---&cf_tracking_firefox_esr17=---&cf_tracking_firefox_esr24=---&cf_tracking_firefox_relnote=---&cf_tracking_relnote_b2g=---&comment=&component=Developer%20Tools%3A%20App%20Manager&contenttypeentry=&contenttypemethod=autodetect&contenttypeselection=text%2Fplain&data=&defined_groups=1&dependson=&description=&flag_type-203=X&flag_type-37=X&flag_type-41=X&flag_type-5=X&flag_type-607=X&flag_type-720=X&flag_type-721=X&flag_type-737=X&flag_type-748=X&flag_type-781=X&flag_type-787=X&flag_type-791=X&flag_type-799=X&flag_type-800=X&flag_type-802=X&flag_type-803=X&flag_type-809=X&flag_type-825=X&form_name=enter_bug&keywords=&maketemplate=Remember%20values%20as%20bookmarkable%20template&op_sys=All&priority=--&product=Firefox&qa_contact=developer.tools%40firefox.bugs&rep_platform=x86&requestee_type-203=&requestee_type-41=&requestee_type-5=&requestee_type-607=&requestee_type-748=&requestee_type-781=&requestee_type-787=&requestee_type-791=&requestee_type-800=&short_desc=&status_whiteboard=&target_milestone=---&version=Trunk">反馈错误</a>。</p> diff --git a/files/zh-cn/archive/b2g_os/using_the_b2g_emulators/index.html b/files/zh-cn/archive/b2g_os/using_the_b2g_emulators/index.html deleted file mode 100644 index 5b7b9bb025..0000000000 --- a/files/zh-cn/archive/b2g_os/using_the_b2g_emulators/index.html +++ /dev/null @@ -1,72 +0,0 @@ ---- -title: 使用B2G仿真器 -slug: Archive/B2G_OS/Using_the_B2G_emulators -translation_of: Archive/B2G_OS/Using_the_B2G_emulators ---- -<p></p> -<p>This article provides a brief guide to some key things you should know when using the Boot to Gecko emulators. This doesn't purport to be a complete user manual; instead, it simply tells you a few useful things that you might not learn on your own.</p> -<p>This guide assumes you've already built one of the emulators; if you haven't, rewind to <a href="/en/Mozilla/Boot_to_Gecko/Building_and_installing_Boot_to_Gecko" title="en/Mozilla/Boot_to_Gecko/Building_and_installing_Boot_to_Gecko">Building and installing Boot to Gecko</a>!</p> -<h2 id="About_the_B2G_emulators">About the B2G emulators</h2> -<p>There are two B2G emulators. The first, built by configuring for "emulator-x86" when running <code>config.sh</code>, is an x86 device emulator. While this is much faster than emulating the ARM processor, it's not as accurate a representation of what an actual device will work like. Configuring for "emulator" when running <code>config.sh</code> gets you the ARM device emulator.</p> -<div class="note"> - <strong>Note:</strong> In recent months the Automation Team has stopped using the x86 emulator due to stability issues. As such, there's a fair chance that things might just not work at all on emulator-x86. Use the ARM emulator unless you have a good reason to do otherwise.</div> -<p>Once you've selected, configured, and built an emulator, the rest works the same way from a user standpoint, so the rest of this guide is common to both.</p> -<div class="note"> - <strong>Note:</strong> On Mac OS X, the B2G emulator requires a Core 2 Duo processor or later; that is, a system that is compatible with Mac OS X 10.7 "Lion." You do not actually have to be running Lion, you just have to be compatible with it.</div> -<h2 id="Starting_the_emulator">Starting the emulator</h2> -<p>To start the B2G emulator, type the following command:</p> -<pre>./run-emulator.sh -</pre> -<p>This will handle all the emulator startup tasks for you. Now wait patiently while the emulator starts up and Boot to Gecko boots up on it. It can take a couple of minutes, so be patient.</p> -<h2 id="When_the_emulator_doesn't_work">When the emulator doesn't work</h2> -<p>Sometimes the emulator fails to start up. Welcome to the bleeding edge of technology! Here are some tips for resolving problems.</p> -<h3 id="Make_sure_the_adb_server_is_running">Make sure the adb server is running</h3> -<p>This usually happens because the adb server that handles interacting with the emulated device is either not running or has malfunctioned.</p> -<div class="note"> - <p><strong>Note:</strong> If you're using the <code>adb</code> built by the B2G build system (which you probably are), it's located in the <code>$B2G/out/host/<platform>/bin</code> directory. On Mac, this is <code>$B2G/out/host/darwin-x86/bin</code>, for example.</p> -</div> -<p>Look to see if <code>adb</code> is even running by doing:</p> -<pre>ps aux | grep adb -</pre> -<p>If it's there, do this to kill it, because it's probably not working correctly.</p> -<pre>adb kill-server -</pre> -<p>If it's not there, do this:</p> -<pre>adb start-server -</pre> -<p>Then try running the emulator again. If it's still not working, time to drop in on <a class="link-irc" href="irc://irc.mozilla.org/b2g" title="irc://irc.mozilla.org/b2g">#b2g</a> on irc.mozilla.org for help.</p> -<h3 id="Erase_configuration_settings">Erase configuration settings</h3> -<p>Sometimes, out of date configuration settings on your emulated device can cause it to misbehave. You can delete the IndexedDB database fix this, as follows:</p> -<ol> - <li>Make sure adb is running, as described in <a href="#Make_sure_the_adb_server_is_running">Make sure the adb server is running</a>.</li> - <li>Start up the emulator.</li> - <li>in the terminal on the host computer, go into the root code build directory for your emulator, then type: <code>out/host/<platform>/bin/adb -e shell</code>; on Mac, this would be <code>out/host/darwin-x86/bin/adb -e shell</code>.</li> - <li>Now you're in the adb shell, and can execute shell commands on your emulated device. Let's stop B2G on the device: <code>stop b2g</code>.</li> - <li>Delete the IndexedDB database: <code>rm -rf /data/local/indexedDB</code>.</li> - <li>Restart B2G on the emulated device: <code>start b2g</code>.</li> -</ol> -<p>Hopefully at this point you will wind up in the Gaia interface and all will be well.</p> -<h2 id="Configuring_the_emulator">Configuring the emulator</h2> -<p>There are several options you can change to adjust the emulator to be more similar to the device you want to emulate. This section provides some basic information on how to do that. You can adjust the emulator's configuration by editing the <code>run-emulator.sh</code> script (or, ideally, a copy of it). Only a few of the most useful parameters are discussed here; you'll want to <a class="external" href="http://www.qemu.org/" title="http://www.qemu.org/">look at the qemu site</a> for details on the others.</p> -<div class="note"> - <strong>Tip:</strong> Create one copy of <code>run-emulator.sh</code> for each device you want to simulate; this makes it easy to start up with different configurations.</div> -<h3 id="Changing_skins">Changing skins</h3> -<p>By default, the emulator starts up in HVGA mode; that's half-VGA, or 320x480 pixels. This is specified by the <code>-skin</code> parameter given to the emulator when started up. You can switch to a different display mode by editing the <code>run-emulator.sh</code> script (or, ideally, a copy of it). The provided skins are:</p> -<ul> - <li>HVGA (320x480)</li> - <li>QVGA (240x320)</li> - <li>WQVGA (240x400)</li> - <li>WQVGA432 (240x432)</li> - <li>WSVGA (1024x600)</li> - <li>WVGA800 (480x800)</li> - <li>WVGA854 (480x854)</li> - <li>WXGA720 (1280x720)</li> - <li>WXGA800 (1280x800)</li> -</ul> -<p>The skins are located in the <code>B2G/development/tools/emulator/skins</code> directory. It's worth noting that the format for skins is quite simple; if you look at them, they're simply folders filled with PNG files for the various user interface objects and a text file called <code>layout</code> which describes the layout of the interface and screen area. It's fairly simple to create custom skins if needed.</p> -<h3 id="Changing_memory_size">Changing memory size</h3> -<p>Another option you may wish or need to configure is the device memory size. The default is 512 MB; however, if the device you're emulating has more or less memory, it is likely important that you adjust this setting to match, to ensure your app will run on the baseline device you want to work on. To do this, change the value of the <code>-memory</code> parameter to the size you need in megabytes. Other than the 512 MB default, 256 MB and 1024 MB are likely ones you'll want to test with.</p> -<p>To change the amount of emulated storage capacity for the device (that is, the storage space for local data, like the flash storage on a mobile phone or the hard drive on a computer), change the value of the <code>-partition-size</code> parameter. The default is 512 MB, but you can specify any size in MB you need in order to simulate the kind of device you need to test for.</p> -<h3 id="Network_Connectivity">Network Connectivity</h3> -<p>If for some reason you cannot connect your emulator to the internet you can run the following command from your commandline:</p> -<pre>adb shell setprop net.dns1 10.0.2.3</pre> diff --git a/files/zh-cn/archive/css3/index.html b/files/zh-cn/archive/css3/index.html deleted file mode 100644 index fe08545c87..0000000000 --- a/files/zh-cn/archive/css3/index.html +++ /dev/null @@ -1,1047 +0,0 @@ ---- -title: CSS3 -slug: Archive/CSS3 -tags: - - CSS - - CSS 参考 - - CSS3 - - 进阶 -translation_of: Archive/CSS3 ---- -<p><strong>CSS3</strong> 是<em>层叠样式表（Cascading Style Sheets）</em>语言的最新版本，旨在扩展CSS2.1。</p> - -<p>它带来了许多期待已久的新特性， 例如圆角、阴影、<a href="/zh-CN/docs/Web/Guide/CSS/Using_CSS_gradients" title="Using CSS gradients">gradients(渐变)</a> 、<a href="/zh-CN/docs/Web/Guide/CSS/Using_CSS_transitions" title="CSS transitions">transitions(过渡)</a> 与 <a href="/zh-CN/docs/Web/Guide/CSS/Using_CSS_animations" title="CSS animations">animations(动画)</a> 。以及新的布局方式，如 <a href="/en/CSS/Using_CSS_multi-column_layouts" title="Using CSS multi-column layouts">multi-columns</a> 、<a href="/zh-CN/docs/Web/Guide/CSS/Flexible_boxes"> flexible box</a> 与 grid layouts。实验性特性以浏览器引擎为前缀（vendor-prefixed），应避免在生产环境中使用，或极其谨慎地使用，因为将来它们的语法和语义都有可能被更改。</p> - -<h2 id="模块和标准化进程">模块和标准化进程</h2> - -<p>CSS Level 2 经历了 9 年的时间（从 2002 年 8 月到 2011 年 6 月）才达到 Recommendation（推荐） 状态，主要原因是被一些次要特性拖了后腿。为了加快那些已经确认没有问题的特性的标准化速度，W3C 的 <a class="external" href="http://www.w3.org/blog/CSS/" title="http://www.w3.org/blog/CSS/">CSS Working Group(CSS 工作组)</a> 作出了一项被称为 <a class="external" href="http://fantasai.inkedblade.net/weblog/2011/inside-csswg/modules" title="http://fantasai.inkedblade.net/weblog/2011/inside-csswg/modules">Beijing doctrine</a> 的决定，将 CSS 划分为许多小组件，称之为<em>模块</em>。这些模块彼此独立，按照各自的进度来进行标准化。其中一些已经是 W3C Recommendation 状态，也有一些仍是 early Working Drafts（早期工作草案）。当新的需求被肯定后， 新的模块也会同样地添加进来。</p> - -<p><a href="/@api/deki/files/6120/=CSS_Modules_and_Snapshots.png" title="CSS_Modules_and_Snapshots.png"><img alt="CSS Modules and Snapshots as defined since CSS3" class="internal lwrap" src="/files/3623/CSS_Modules_and_Snapshots.png" style="float: left; width: 550px;"> </a></p> - -<p> </p> - -<p> </p> - -<p> </p> - -<p> </p> - -<p> </p> - -<p> </p> - -<p>从形式上来说，CSS3 标准<em>自身已经不存在了</em>。每个模块都被独立的标准化，现在标准 CSS 包括了修订后的 CSS2.1 以及完整模块对它的扩充，模块的 level（级别）数并不一致。可以在每个时间点上为 CSS 标准定义一个 <span style="line-height: 1.5;">snapshots（</span><span style="line-height: 1.5;">快照），列出 CSS 2.1 和成熟的模块。</span></p> - -<p>W3C 会定期的发布这些 <span style="line-height: 1.5;">snapshots</span><span style="line-height: 1.5;">，如 </span><a class="external" href="http://www.w3.org/TR/css-beijing/" style="line-height: 1.5;" title="http://www.w3.org/TR/css-beijing/">2007</a>, <a class="external" href="http://www.w3.org/TR/css-2010/" style="line-height: 1.5;" title="http://www.w3.org/TR/css-2010/">2010</a>, <a href="https://www.w3.org/TR/css-2015/">2015</a> 或 <a href="https://www.w3.org/TR/css-2017/">2017</a>。</p> - -<p>目前为止，还没有 level 超过 3 的模块被标准化，未来应该会有所改变。 不过有些模块，比如 Selectors（选择器）4 或 CSS Borders and Backgrounds（边框和背景）Level 4 早已拥有了 Editor's Draft（编辑草案），即使它们还没达到 First Published Working Draft（初次发布工作草案）状态。</p> - -<div style=""> </div> - -<h2 id="CSS_模块状态" style="">CSS 模块状态</h2> - -<h3 id="稳定模块（Stable_modules）">稳定模块（Stable modules）</h3> - -<p>有些 CSS 模块已经十分稳定，其状态为 CSSWG 规定的三个推荐品级之一：Candidate Recommendation（候选推荐）， Proposed Recommendation（建议推荐）或 Recommendation（推荐）。表明这些模块已经十分稳定，使用时也不必添加前缀， 但有些特性仍有可能在 Candidate Recommendation 阶段被放弃。</p> - -<p>这些模块扩展并修改了 CSS2.1 规范（核心规范）。 以下为 CSS 规范当前的 snapshot。</p> - -<h4 id="Colors_(Level_3)" style="display: none;">Colors (Level 3)</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(128,255,128);"><strong>{{ SpecName("CSS3 Colors", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Colors") }} 自 2011 年 6 月 7 日</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>增加 {{ cssxref("opacity") }} 属性，还有 <code>hsl</code><code>()，</code> <code>hsla()</code>， <code>rgba()</code> 和 <code>rgb()</code> 函数来创建 {{cssxref("<color>")}} 值。 它还将 <code>currentColor</code> 关键字定义为合法的颜色值。</p> - - <p><code>transparent</code> 颜色目前是真彩色 (多亏了支持 alpha 通道) 并且是 <code>rgba(0,0,0,0.0)</code> 的别名。</p> - - <p>它废弃了<span style="color: #4d4e53; line-height: 1.5;"> system-color keywords(</span><span style="line-height: 1.5;">系统颜色关键字)， 它们已经不能在生产环境中使用。</span></p> - </td> - </tr> - </tbody> -</table> - -<h4 id="Selectors" style="display: none;">Selectors</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(128,255,128);"><strong>{{ SpecName("CSS3 Selectors", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Selectors") }} 自 2011 年 9 月 29 日</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>增加：</p> - - <ul> - <li>子串匹配的属性选择器， <code>E[attribute^="value"]</code>， <code>E[attribute$="value"]，</code> <code>E[attribute*="value"]。</code></li> - <li>新的伪类：{{ cssxref(":target") }}， {{ cssxref(":enabled") }} 和 {{ cssxref(":disabled") }}， {{ cssxref(":checked") }}， {{ cssxref(":indeterminate") }}， {{ cssxref(":root") }}， {{ cssxref(":nth-child") }} 和 {{ cssxref(":nth-last-child") }}， {{ cssxref(":nth-of-type") }} 和 {{ cssxref(":nth-last-of-type") }}， {{ cssxref(":last-child") }}， {{ cssxref(":first-of-type") }} 和 {{ cssxref(":last-of-type") }}， {{ cssxref(":only-child") }} 和 {{ cssxref(":only-of-type") }}， {{ cssxref(":empty") }}， 和 {{ cssxref(":not") }}。</li> - <li>伪元素使用两个冒号而不是一个来表示：<code>:after</code> 变为 {{ cssxref("::after") }}， <code>:before</code> 变为 {{ cssxref("::before") }}， <code>:first-letter</code> 变为 {{ cssxref("::first-letter") }}， 还有 <code>:first-line</code> 变为 {{ cssxref("::first-line") }}。</li> - <li>新的 <em>general sibling combinator(普通兄弟选择器)</em> ( <code>h1~pre</code> )。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p><a class="external" href="http://dev.w3.org/csswg/selectors4/" title="http://dev.w3.org/csswg/selectors4/">下一个迭代的选择器规范</a>早已开始运作，它还没有达到 First Public Working Draft 阶段。</p> - -<h4 id="Namespaces" style="display: none;">Namespaces</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(128,255,128);"><strong>{{ SpecName("CSS3 Namespaces", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Namespaces") }} 自 2011 年 9 月 29 日</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>通过定义 <em>CSS qualified name(CSS 限定名)</em> 的概念来增加对 XML Namespace(名空间) 的支持， 使用 ' <code>|</code> ' 语法并增加 {{ cssxref("@namespace") }} CSS @ 规则。</p> - </td> - </tr> - </tbody> -</table> - -<h4 id="Media_Queries" style="display: none;">Media Queries</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(128,255,128);"><strong>{{ SpecName("CSS3 Media Queries", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Media Queries") }} 自 2012 年 6 月 19 日</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>将之前的媒体类型 ( <code>print，</code> <code>screen，……</code>) 扩充为完整的语言， 允许使用类似 <code style="font-size: 12px;">only screen 和 (color)</code><span style="line-height: 1.5;"> 来实现</span><span style="line-height: 1.5;"> </span><a href="/en/CSS/Media_queries" style="line-height: 1.5;" title="en/CSS/Media_queries">设备媒体能力查询功能</a><span style="line-height: 1.5;">。</span></p> - - <p>媒体查询并非仅能用于 CSS 文档中，它也被用于 HTML 元素的某些属性中， 例如 <span style="line-height: 1.5;">{{ HTMLElement("link") }} 元素的 </span><span style="line-height: 1.5;">{{ htmlattrxref("media","link") }} 属性。</span></p> - </td> - </tr> - </tbody> -</table> - -<p><a href="http://dev.w3.org/csswg/mediaqueries4" title="http://dev.w3.org/csswg/mediaqueries4">该规范的下一个迭代</a>也在进行中，借助新的媒体特征例如 <span style="line-height: 1.5;"> </span><code style="font-size: 14px;">hover</code><span style="line-height: 1.5;"> 或 </span><code style="font-size: 14px;">pointer，可以在 User Agent(用户代理) 上对 Web 站点的输入方法进行定制。</code><span style="line-height: 1.5;">对 ECMAScript 的检测， 使用 </span><code style="font-size: 14px;">script</code><span style="line-height: 1.5;"> 媒体特征也已经被提出。</span></p> - -<h4 id="Style_attribute" style="display: none;">Style attribute</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(128,255,128);"><strong>{{ SpecName("CSS3 Style", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Style") }} 自 2013 年 11 月 7 日</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">正式定义了 HTML <a href="/en/HTML/Global_attributes#attr-style" title="en/HTML/Global_attributes#attr-style"> <code>style</code> </a> 全局属性内容的语法。</td> - </tr> - </tbody> -</table> - -<h4 id="Backgrounds_and_Borders" style="display: none;">Backgrounds and Borders</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Backgrounds", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Backgrounds") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>增加：</p> - - <ul> - <li>背景支持各种类型的 {{cssxref("<image>")}}， 并不局限于之前定义的 <code>url()。</code></li> - <li>支持 multiple background images(多背景图片)。</li> - <li>{{ cssxref("background-repeat") }} 属性的 <code>space</code> 和 <code>round</code> 值，还有支持两个值的语法。</li> - <li>{{ cssxref("background-attachment") }} <code>local</code> 值。</li> - <li>CSS {{ cssxref("background-origin") }}，{{ cssxref("background-size") }} 和 {{ cssxref("background-clip") }} 属性。</li> - <li>支持带弧度的 border corner(边框角) CSS 属性：{{ cssxref("border-radius") }}，{{ cssxref("border-top-left-radius") }}，{{ cssxref("border-top-right-radius") }}，{{ cssxref("border-bottom-left-radius") }} 和 {{ cssxref("border-bottom-right-radius") }} 。</li> - <li>支持边框使用 {{cssxref("<image>")}}： {{ cssxref("border-image") }}，{{ cssxref("border-image-source") }}，{{ cssxref("border-image-slice") }}，{{ cssxref("border-image-width") }}，{{ cssxref("border-image-outset") }} 和 {{ cssxref("border-image-repeat") }} 。</li> - <li>支持元素的阴影：{{ cssxref("box-shadow") }} 。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p><a class="external" href="http://dev.w3.org/csswg/css4-background/" title="http://dev.w3.org/csswg/css4-background/">背景和边框规范的 CSS4 迭代</a>早已进行，即便它还没有达到 First Public Working Draft 阶段，它计划增加对边框的裁剪功能 (借助 CSS {{ cssxref("border-clip") }}，{{ cssxref("border-clip-top") }}，{{ cssxref("border-clip-right") }}，{{ cssxref("border-clip-bottom") }} 和 {{ cssxref("border-clip-left") }} 属性) 或边框一角的形状 (使用 CSS {{ cssxref("border-corner-shape") }} 属性)。</p> - -<h4 id="Multi-column_layout" style="display: none;">Multi-column layout</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Multicol", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Multicol") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">增加简单的多列布局， 使用 CSS {{ cssxref("columns") }}， {{ cssxref("column-count") }}， {{ cssxref("column-fill") }}， {{ cssxref("column-gap") }}， {{ cssxref("column-rule") }}， {{ cssxref("column-rule-color") }}， {{ cssxref("column-rule-style") }}， {{ cssxref("column-rule-width") }}， {{ cssxref("column-span") }}， {{ cssxref("column-width") }}， {{ cssxref("break-after") }}， {{ cssxref("break-before") }}， 和{{ cssxref("break-inside") }}。</td> - </tr> - </tbody> -</table> - -<h4 id="Speech" style="display: none;">Speech</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Speech", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Speech") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">定义 <code>speech</code> 媒体类型，一个 aural formatting model(听觉格式化模型) 和多个用于 speech-rendering(语音呈现) 用户代理的属性。</td> - </tr> - </tbody> -</table> - -<h4 id="Image_Values_and_Replaced_Content" style="display: none;">Image Values and Replaced Content</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Images", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Images") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>定义 {{cssxref("<image>")}} 数据类型。</p> - - <p>扩充 <code>url()</code> 语法使其支持使用 media fragments(媒体片段) 来切割图片。</p> - - <p>增加：</p> - - <ul> - <li>{{cssxref("<resolution>")}} 数据类型的 <code>dppx</code> 单位。</li> - <li><code>image()</code> 函数，作为 <code>url()</code> 的更具灵活性的替代版本， 使用 url 来定义图片。<br> - <strong>有风险：</strong>由于缺少足够的浏览器支持， <code>image()</code> 函数的标准化可能会被推迟到该模块的下一个迭代中。</li> - <li>支持 <code>linear-gradient()，</code> <code>repeating-linear-gradient()</code>， <code>radial-gradient()</code> 和 <code>repeating-radial-gradient()。</code></li> - <li>使用 CSS {{ cssxref("object-fit") }} 属性来定义一个“替换元素”的“内容(Content)”如何适应包含这个“替换元素”的盒子。<br> - <strong>有风险</strong><strong>： </strong>由于缺少足够的浏览器支持， {{ cssxref("object-fit") }} 及其属性的标准化可能会被推迟到该模块的下一个迭代中。</li> - <li>使用 CSS {{cssxref("image-resolution") }} 和 {{cssxref("image-orientation") }} 属性来覆盖一个外部图片的分辨率和方向。<br> - <strong>有风险：</strong>由于缺少足够的浏览器支持，{{cssxref("image-resolution") }} 和 {{ cssxref("image-orientation")}} 属性的标准化可能会被推迟到该模块的下一个迭代中。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p>用于取代 CSS Image Level 3 的 <a href="#Images_(Level_4)">CSS Image Values and Replaced Content Level 4</a> 正在发展中，目前为 {{Spec2("CSS4 Images")}}。</p> - -<h4 id="Values_and_Units" style="display: none;">Values and Units</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: 1px solid; width: 30%; background-color: rgb(220, 255, 220);"><strong>{{ SpecName("CSS3 Values", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Values") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>使 <code>initial</code> 和 <code>inherit</code> 关键字能够被用于任意 CSS 属性中。</p> - - <p>正式定义了 CSS 2.1 中的 CSS 数据类型，之前是隐晦的由它们的语法记号和文本来定义。</p> - - <p>增加：</p> - - <ul> - <li>定义了新的相对字体长度单位：<code>rem</code> 和 <code>ch。</code></li> - <li>定义了相对视口长度单位：<code>vw，</code><code>vh，</code><code>vmax</code> 和 <code>vmin</code> 。</li> - <li>精确了绝对长度单位的实际尺寸，此前它们并非是绝对值，而是使用了 reference pixel(参考像素) 来定义。</li> - <li>定义 {{ cssxref("<angle>") }}，{{cssxref("<time>")}}， {{cssxref("<frequency>")}}，{{cssxref("<resolution>")}}。</li> - <li>规范 {{cssxref("<color>")}}，{{cssxref("<image>")}} 和 {{cssxref("<position>")}} 定义的值。</li> - <li>{{cssxref("calc", "calc()") }}，{{cssxref("attr", "attr()")}}和 <code>toggle()</code> 函数符号的定义。</li> - </ul> - - <p><strong>有风险：</strong> 由于缺少足够的浏览器支持，<code>calc()，</code> <code>attr()，</code> 和 <code>toggle()</code> 函数符号的标准化可能会被推迟到该模块的下一个迭代中。</p> - </td> - </tr> - </tbody> -</table> - -<p>像 <code><ident></code> 和 <code><custom-ident> </code>这样的类型定义在 CSS Values and Units Module Level 4 中被推迟。</p> - -<h4 id="Flexible_box_layout" style="display: none;">Flexible box layout</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Flexbox", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Flexbox") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">为 CSS {{ cssxref("display") }} 属性增加了 flexbox layout(伸缩盒布局) 及多个新 CSS 属性来控制它：{{ cssxref("flex") }}，{{ cssxref("flex-align") }}，{{ cssxref("flex-direction") }}，{{ cssxref("flex-flow") }}，{{ cssxref("flex-item-align") }}，{{ cssxref("flex-line-pack") }}，{{ cssxref("flex-order") }}，{{ cssxref("flex-pack") }} 和 {{ cssxref("flex-wrap") }}。</td> - </tr> - </tbody> -</table> - -<h4 id="Conditional_Rules" style="display: none;">Conditional Rules</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(220, 255, 220);"><strong>{{ SpecName("CSS3 Conditional", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Conditional") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">增加了对样式表部分内容进行条件处理的功能， 若浏览器或文档的能力符合条件，则该部分的样式生效。它主要是允许了在 {{ cssxref("@media") }} 中嵌套 @ 规则， 增加了一个新的 CSS @ 规则， {{ cssxref("@supports") }} 和一个新的 DOM 方法 {{domxref("CSS.supports()")}}。</td> - </tr> - </tbody> -</table> - -<h4 id="Text_decorations" style="display: none;">Text decorations</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(220, 255, 220);"><strong>{{ SpecName("CSS3 Text Decoration", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Text Decoration") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>扩展：</p> - - <ul> - <li>CSS {{ cssxref("text-decoration") }} 属性作为 CSS {{ cssxref("text-decoration-line") }}， {{ cssxref("text-decoration-color") }}， 和 {{ cssxref("text-decoration-style") }} 属性的简写形式。并增加了 {{ cssxref("text-decoration-skip") }}， 和 {{ cssxref("text-underline-position") }} 属性。</li> - </ul> - - <p>增加：</p> - - <ul> - <li>使用 CSS {{ cssxref("text-emphasis") }}， {{ cssxref("text-emphasis-style") }}， {{ cssxref("text-emphasis-color") }}， 和 {{ cssxref("text-emphasis-position") }} 属性来支持 East-Asian-script emphasis marks(东亚文本重点符号)。</li> - <li>使用 CSS {{ cssxref("text-shadow") }} 属性来支持文本的阴影。</li> - </ul> - - <p>明确：</p> - - <ul> - <li>装饰的绘制顺序。</li> - </ul> - - <p><strong>有风险</strong><strong>： </strong>由于缺少足够的浏览器支持，<code>text-decoration-skip </code>行定位规则和在相同的基础文本上放置重点符号和 ruby 的能力的标准化可能会被推迟到该模块的下一个迭代中。</p> - </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Fonts", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Fonts") }}</td> - </tr> - <tr> - <td colspan="2"> - <p>修正 CSS2.1 字体匹配算法，以便接近于真实的实现。</p> - - <p>增加：</p> - - <ul> - <li>通过 CSS {{ cssxref("@font-face") }} @ 规则来支持可下载字体。</li> - <li>借助 CSS {{ cssxref("font-kerning") }} 属性来控制 contextual inter-glyph spacing(上下文 inter-glyph 间距)。</li> - <li>借助 CSS {{ cssxref("font-language-override") }} 属性来选择语言指定的字形。</li> - <li>借助 CSS {{ cssxref("font-feature-settings") }} 属性来选择带有 OpenType 特性的字形。</li> - <li>借助 CSS {{ cssxref("font-size-adjust") }} 属性来控制当使用 fallback fonts(备用字体) 时的宽高比。</li> - <li>选择替代字体，使用 CSS {{ cssxref("font-stretch") }}，{{ cssxref("font-variant-alternates") }}，{{ cssxref("font-variant-caps") }}，{{ cssxref("font-variant-east-asian") }}，{{ cssxref("font-variant-ligatures") }}，{{ cssxref("font-variant-numeric") }}，和 {{ cssxref("font-variant-position") }} 属性。还扩展了相关的 CSS {{ cssxref("font-variant") }} 速记属性，并引入了 {{ cssxref("@font-features-values") }} @ 规则。</li> - <li>当这些字体在 CSS {{ cssxref("font-synthesis") }} 属性中找不到时自动生成斜体或粗体的控制。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Cascade", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Cascade") }}</td> - </tr> - <tr> - <td colspan="2"> - <p>增加:</p> - - <ul> - <li>属性的初始值和未设定值。</li> - <li>CSS {{ cssxref("all") }} 属性。</li> - <li>域机制。</li> - </ul> - - <p>明确：</p> - - <ul> - <li>与媒体依赖的@import声明交互与样式表的加载要求。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS3 Writing Modes", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Writing Modes") }}</td> - </tr> - <tr> - <td colspan="2">定义了水平和垂直脚本书写模式，概况了 CSS {{ cssxref("direction") }} 和 {{ cssxref("unicode-bidi") }} 属性是如何与新 CSS {{ cssxref("text-orientation") }} 属性相互之间产生影响的，并在需要它们的地方扩展它们。</td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS Shapes", "", "") }}</strong></td> - <td>{{ Spec2("CSS Shapes") }}</td> - </tr> - <tr> - <td colspan="2"> - <p>定义了可用于浮动（float）的几何图形。这些图形描述了行内元素可被包裹的区域，而非包裹其边界框（ bounding box）。</p> - </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(220,255,220);"><strong>{{ SpecName("CSS Masks", "", "") }}</strong></td> - <td>{{ Spec2("CSS Masks") }}</td> - </tr> - <tr> - <td colspan="2"> - <p>定义了部分或完整隐藏可视元素的一种方式。其描述了如何使用另一图形元素或图片作为亮度遮罩（luminance）或透明度遮罩（alpha）。</p> - </td> - </tr> - </tbody> -</table> - -<h3 id="处于改善阶段的模块">处于改善阶段的模块</h3> - -<p>处于改善阶段（refining phase）的规范已基本稳定。虽然还有可能被修改，但不会和当前的实现产生冲突；其主要定义在个别特殊情况的行为。</p> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("Web Animations", "", "") }}</strong></td> - <td>{{ Spec2("Web Animations") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS3 Counter Styles", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Counter Styles") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("Compositing", "", "") }}</strong></td> - <td>{{ Spec2("Compositing") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS3 Syntax", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Syntax") }}</td> - </tr> - <tr> - <td colspan="2"><span class="short_text" id="result_box" lang="zh-CN"><span>澄清如何确定字符集;</span> <span>分析和标记化算法的最小变化。</span></span></td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS Will Change", "", "") }}</strong></td> - <td>{{ Spec2("CSS Will Change") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<h4 id="Basic_User_Interface" style="display: none;">Basic User Interface</h4> - -<h4 id="Transitions" style="display: none;">Transitions</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS3 Transitions", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Transitions") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">通过增加 CSS {{ cssxref("transition") }}，{{ cssxref("transition-delay") }}，{{ cssxref("transition-duration") }}， {{ cssxref("transition-property") }}，和 {{ cssxref("transition-timing-function") }} 属性来支持定义两个属性值间的 transitions effects(<span style="line-height: 1.5;">过渡效果)。</span></td> - </tr> - </tbody> -</table> - -<h4 id="Animations" style="display: none;">Animations</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS3 Animations", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Animations") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">允许定义动画效果， 借助于新增的 CSS {{ cssxref("animation") }}， {{ cssxref("animation-delay") }}， {{ cssxref("animation-direction") }}， {{ cssxref("animation-duration") }}， {{ cssxref("animation-fill-mode") }}， {{ cssxref("animation-iteration-count") }}， {{ cssxref("animation-name") }}， {{ cssxref("animation-play-state") }}， 和 {{ cssxref("animation-timing-function") }} 属性， 以及 {{ cssxref("@keyframes") }} @ 规则。</td> - </tr> - </tbody> -</table> - -<h4 id="Transforms" style="display: none;">Transforms</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS3 Transforms", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Transforms") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>增加：</p> - - <ul> - <li>支持适用于任何元素的 bi-dimensional transforms(二维变形)，使用 CSS {{ cssxref("transform") }} 和 {{ cssxref("transform-origin") }} 属性。支持的变形有： <code>matrix</code><code>()</code>，<code>translate()</code>，<code>translateX()</code>，<code>translateY(，</code> <code>scale()</code>，<code>scaleX()</code>，<code>scaleY()</code>，<code>rotate()</code>，<code>skewX()</code>，和 <code>skewY()。</code></li> - <li>支持适用于任何元素的 tri-dimensional transforms(三维变形)，使用 CSS {{ cssxref("transform-style") }}， {{ cssxref("perspective") }}， {{ cssxref("perspective-origin") }}， 和 {{ cssxref("backface-visibility") }} 属性和扩展的 {{ cssxref("transform") }} 属性，使用以下变形： <code>matrix</code> <code>3d()</code>， <code>translate3d()</code>，<code>translateZ()</code>，<code>scale3d()</code>，<code>scaleZ()</code>，<code>rotate3d()</code>，<code>rotateX</code><code>()</code> ，<code>rotateY</code><code>()</code>，<code>rotateZ()</code>，和 <code>perspective()。</code></li> - </ul> - - <p><em><strong>注意：</strong> 该规范是 CSS 2D-Transforms， CSS 3D-Transforms 和 SVG transforms 合并的结果。</em></p> - </td> - </tr> - </tbody> -</table> - -<h4 id="Fragmentation" style="display: none;">Fragmentation</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: 1px solid; width: 30%; background-color: rgb(255, 255, 220);"><strong>{{ SpecName("CSS3 Fragmentation", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Fragmentation") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>定义了网页的分割将如何实行，即分页、分栏，以及窗口和孤儿页面的处理。</p> - - <p>增加：</p> - - <ul> - <li>通过 CSS {{ cssxref("box-decoration-break") }} 属性定义一个盒（box）被在页、栏或行被分割时，诸如边框与背景颜色或图片等修饰行为的支持。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<h4 id="Text" style="display: none;">Text</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS3 Text", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Text") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>扩展：</p> - - <ul> - <li>CSS {{ cssxref("text-transform") }} 属性的值 <code>full-width。</code></li> - <li>CSS {{ cssxref("text-align") }} 属性的值 <code>start<font face="Open Sans, sans-serif"><span style="line-height: 18px;">，</span></font></code><code>end<font face="Open Sans, sans-serif"><span style="line-height: 18px;">，</span></font></code><code>start end，</code>和 <code>match-parent</code>，为包含多个方向文本的文档提供良好支持。</li> - <li>CSS {{ cssxref("text-align") }} 属性的 {{cssxref("<string>")}} 值来根据该字符对齐。对于数字的小数点对齐特别有用。</li> - <li>CSS {{ cssxref("word-spacing") }} 和 {{ cssxref("letter-spacing") }} 属性拥有范围限制，来控制两端对齐时的灵活性。</li> - </ul> - - <p>增加：</p> - - <ul> - <li>使用 CSS {{ cssxref("text-space-collapse") }} 和 {{ cssxref("tab-size") }} 属性来控制空白该如何显示。</li> - <li>使用 CSS {{ cssxref("line-break") }}，{{ cssxref("word-break") }}，{{ cssxref("hyphens") }}，{{ cssxref("text-wrap") }}，{{ cssxref("overflow-wrap") }}，和 {{ cssxref("text-align-last") }} 属性来控制折行和单词边界。</li> - <li>使用 CSS {{ cssxref("text-justify") }} 属性来控制两端对齐的行为，这是为了对更多语言类型增加支持。</li> - <li>使用 CSS {{ cssxref("text-indent") }} 和 {{ cssxref("hanging-punctuation") }} 属性来控制 edge effect(边缘影响)。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p>一部分出现在早期 CSS Text Level 3 草案中的特性<a class="external" href="http://dev.w3.org/csswg/css3-text/#recent-changes" title="http://dev.w3.org/csswg/css3-text/#recent-changes">被推迟到了该规范的下个迭代中</a>。</p> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("CSS3 Variables", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Variables") }}</td> - </tr> - <tr> - <td colspan="2"><span class="short_text" id="result_box" lang="zh-CN"><span>定义了允许在 CSS 中定义变量的机制。</span></span></td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,255,220);"><strong>{{ SpecName("Compositing", "", "") }}</strong></td> - <td>{{ Spec2("Compositing") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<h4 id="Fonts" style="display: none;">Fonts</h4> - -<h3 id="处于修正阶段的模块">处于修正阶段的模块</h3> - -<p>处于修正阶段的模块没处于改善阶段的模块稳定。它们的语法一般还需要详细审查，可能还会有些大变化，还有可能不兼容之前的规范。<span lang="zh-CN"><span>替代语法已通过测试并被广泛实践。</span></span></p> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: rgb(255,160,100);"><strong>{{ SpecName("CSS3 Basic UI", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Basic UI") }}</td> - </tr> - <tr> - <td colspan="3" style="border: solid 1px;"> - <p>增加：</p> - - <ul> - <li>使用 CSS {{ cssxref("box-sizing") }} 属性来转换盒模型的能力。<br> - <strong><em><em><em><strong>处于风险中</strong></em><strong><em>：</em></strong></em></em> </strong><em><em><em><em>由于缺少足够的浏览器支持</em></em></em> ， <code>padding</code><code>-box</code> 值的</em><em><em>标准化</em>可能会被推迟到该模块的下一个迭代中。</em></li> - <li>根据表单内容来设置样式， 使用 CSS {{ cssxref(":indeterminate") }}， {{ cssxref(":default") }}， {{ cssxref(":valid") }}， {{ cssxref(":invalid") }}， {{ cssxref(":in-range") }}， {{ cssxref(":out-of-range") }}， {{ cssxref(":required") }}， {{ cssxref(":optional") }}， {{ cssxref(":read-only") }}，和 {{ cssxref(":read-write") }} 伪类与 {{ cssxref("::value") }}， {{ cssxref("::choices") }}， {{ cssxref("::repeat-item") }}， 和 {{ cssxref("::repeat-index") }} 伪元素。<br> - <em><strong><em><em><em><strong>处于风险中</strong></em><strong><em>：</em></strong></em></em></strong> <em><em><em><em>由于缺少足够的浏览器支持</em></em></em> ，</em>伪元素 {{ cssxref("::value") }}， {{ cssxref("::choices") }}， {{ cssxref("::repeat-item") }}， 和 {{ cssxref("::repeat-index") }} </em><em>的</em><em><em>标准化</em>可能会被推迟到该模块的下一个迭代中。</em></li> - <li>支持图标，通过 CSS {{ cssxref("icon") }} 属性定义， 同时在 CSS {{ cssxref("content") }} 属性中设置新<span style="font-family: courier new,andale mono,monospace; line-height: normal;">图标</span>的值。<br> - <em><em><strong><em><em><em><strong>处于风险中</strong></em><strong><em>：</em></strong></em></em></strong> </em><em><em><em><em><em>由于缺少足够的浏览器支持</em></em></em> ，</em></em>{{ cssxref("icon") }} 属性和 <code>icon</code> 值</em><em>的</em><em><em>标准化</em>可能会被推迟到 CSS 4 中。</em></li> - <li>支持 CSS {{ cssxref("outline-offset") }} 属性， 这样可以对 outline 的位置做更多的控制。</li> - <li>支持 CSS {{ cssxref("resize") }} 属性， Web 开发者可以控制元素是否能够以及如何调整大小。</li> - <li>支持 CSS {{ cssxref("text-overflow") }} 属性， 定义文本溢出的行为。<br> - <em><em><em><strong><em><em><em><strong>处于风险中</strong></em><strong><em>：</em></strong></em></em></strong></em></em> <em><em><em><em><em><em>由于缺少足够的浏览器支持</em></em></em> ，</em></em></em>该属性的双值语法也和 {{cssxref("<string>")}} 值一样， 它们的</em><em><em>标准化</em>可能会被推迟到该模块的下一个迭代中。</em></li> - <li>定义鼠标 hotspot(热点) 的功能， 扩展了 {{ cssxref("cursor") }} 属性， 增加了新值： <code>none</code>, <code>context-menu</code>, <code>cell</code>, <code>vertical-text</code>, <code>alias</code>, <code>copy</code>, <code>no-drop</code>, <code>not-allowed</code>, <code>nesw-</code><code>resize</code>, <code>nwse-</code><code>resize</code>, <code>col-resize</code>, <code>row-resize</code>, <code>all-scroll</code>, <code>zoom-in</code>, <code>zoom-out。</code></li> - <li>指定 sequential navigation order(连续导航顺序， 即 <em>tabbing order(移动顺序)</em>) 的功能， 使用 CSS {{ cssxref("nav-index") }}， {{ cssxref("nav-up") }}， {{ cssxref("nav-right") }}， {{ cssxref("nav-left") }}， {{ cssxref("nav-down") }} 属性。<br> - <em><em><em><em><strong><em><em><em><strong>处于风险中</strong></em><strong><em>：</em></strong></em></em></strong></em></em></em> <em><em><em><em><em><em><em>由于缺少足够的浏览器支持，</em></em></em></em></em></em></em>导航属性</em><em>的</em><em><em>标准化</em>可能会被推迟到该模块的下一个迭代中。</em></li> - <li>控制 IME editor(输入法编辑器) 使用的功能， 使用 CSS {{ cssxref("ime-mode") }} 属性。<br> - <em><em><em><em><em><strong><em><em><em><strong>处于风险中</strong></em><strong><em>：</em></strong></em></em></strong></em></em></em></em> <em>由于缺少足够的浏览器支持，</em>{{ cssxref("ime-mode") }}</em><em>属性</em><em>的</em><em><em>标准化</em>可能会被推迟到该模块的下一个迭代中。</em></li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p><a class="external external-icon" href="http://wiki.csswg.org/spec/css4-ui" title="http://wiki.csswg.org/spec/css4-ui">这里</a>提供了会出现在下次 <span style="line-height: 1.5;"> CSS Basic User Interface Module 迭代中的功能列表。</span></p> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,160,100);"><strong>{{ SpecName("CSS3 Grid", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Grid") }}</td> - </tr> - <tr> - <td colspan="2">添加了 grid 布局给 CSS <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/display" title=""><code>display</code></a> 属性，以及一些新的属性来控制它：{{cssxref("grid")}}，{{cssxref("grid-area")}}，{{cssxref("grid-auto-columns")}}，{{cssxref("grid-auto-flow")}}，{{cssxref("grid-auto-position")}}, {{cssxref("grid-auto-rows")}}, {{cssxref("grid-column")}}, {{cssxref("grid-column-start")}}, {{cssxref("grid-column-end")}}, {{cssxref("grid-row")}}, {{cssxref("grid-row-start")}}, {{cssxref("grid-row-end")}}, {{cssxref("grid-template")}}, {{cssxref("grid-template-areas")}}, {{cssxref("grid-template-rows")}}, and {{cssxref("grid-template-columns")}}.</td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,160,100);"><strong>{{ SpecName("CSS3 Box Alignment", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Box Alignment") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,160,100);"><strong>{{ SpecName("CSS3 Paged Media", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Paged Media") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,160,100);"><strong>{{ SpecName("CSSOM View", "", "") }}</strong></td> - <td>{{ Spec2("CSSOM View") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: rgb(255,160,100);"><strong>{{ SpecName("CSS4 Selectors", "", "") }}</strong></td> - <td>{{ Spec2("CSS4 Selectors") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<h4 id="Writing_modes" style="display: none;">Writing modes</h4> - -<h3 id="处于探索阶段的模块">处于探索阶段的模块</h3> - -<h4 id="Images_(Level_4)" style="display: none;">Images (Level 4)</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS4 Images", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS4 Images") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>扩展：</p> - - <ul> - <li><code>image()</code> 函数标记来描述图片 (<code>rtl 或</code> <code>ltr</code>) 的方向性，允许 bidi-sensitive(双向敏感) 的图片。</li> - <li>为 {{ cssxref("image-orientation") }} 属性增加关键字 <code>from-image，允许使用存储在图片中的 </code>EXIF 数据。</li> - </ul> - - <p>增加：</p> - - <ul> - <li><code>image-set()</code> 函数标记，允许定义不同分辨率下的对应图片实现依据分辨率选择图片。</li> - <li><code>element()</code> 函数标记， 允许将页面的部分当作图片来使用。</li> - <li><code>cross-fade()</code> 函数标记， 允许在两张图片之间过渡时使用中间图片，并定义了两张图片间的 interpolation(插值)。</li> - <li><code>conic-gradient()</code> 和 <code>repeating-conic-gradient()</code> 函数标记，描述了一种新的渐变类型。</li> - <li>{{cssxref("image-rendering")}} 属性允许定义如何处理改变图片大小的行为。</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<h4 id="Device_Adaptation" style="display: none;">Device Adaptation</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Device", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Device") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">增加一个新的 @ 规则， {{ cssxref("@viewport") }}，允许为视口指定尺寸（size）、缩放因子（zoom factor）和方向（orientation），这些将作为 initial containing block(初始包含块) 的基础。</td> - </tr> - </tbody> -</table> - -<h4 id="Grid_Layout" style="display: none;">Grid Layout</h4> - -<h4 id="GCPM" style="display: none;">GCPM</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 GCPM", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 GCPM") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">增加调整打印版本的功能，允许控制页头，页脚，同时引用表索引或表内容。</td> - </tr> - </tbody> -</table> - -<h4 id="Exclusions_and_Shapes" style="display: none;">Exclusions and Shapes</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Exclusions", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Exclusions") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">扩展浮动机制，在任何定位方案中生成一个 exclusion regions(<span style="line-height: 1.5;">排斥区域)。增加形状标记，其中的内容必须流动。</span></td> - </tr> - </tbody> -</table> - -<h4 id="Lists" style="display: none;">Lists</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Lists", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Lists") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;">扩展了列表计数机制， 这样可以为列表标记设置样式，并使 Web 开发者定义新的列表计数方案。</td> - </tr> - </tbody> -</table> - -<h4 id="Regions" style="display: none;">Regions</h4> - -<table class="standard-table" style="width: 100%;"> - <tbody> - <tr> - <td style="border: solid 1px; width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Regions", "", "") }}</strong></td> - <td style="border: solid 1px;">{{ Spec2("CSS3 Regions") }}</td> - </tr> - <tr> - <td colspan="2" style="border: solid 1px;"> - <p>定义了一种可使内容流动至数个非连续空间的机制，称为区域（Regions）。</p> - </td> - </tr> - </tbody> -</table> - -<h4 id="Variables" style="display: none;">Variables</h4> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("Filters 1.0", "", "") }}</strong></td> - <td>{{ Spec2("Filters 1.0") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Template", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Template") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Sizing", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Sizing") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS Line Grid", "", "") }}</strong></td> - <td>{{ Spec2("CSS Line Grid") }}</td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Positioning", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Positioning") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Ruby", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Ruby") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSSOM", "", "") }}</strong></td> - <td>{{ Spec2("CSSOM") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Overflow", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Overflow") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Font Loading", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Font Loading") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS3 Display", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Display") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS Scope", "", "") }}</strong></td> - <td>{{ Spec2("CSS Scope") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS4 Media Queries", "", "") }}</strong></td> - <td>{{ Spec2("CSS4 Media Queries") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("CSS Non-element Selectors", "", "") }}</strong></td> - <td>{{ Spec2("CSS Non-element Selectors") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{{ SpecName("Geometry Interfaces", "", "") }}</strong></td> - <td>{{ Spec2("Geometry Interfaces") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F66;"><strong>{ SpecName("CSS3 Inline", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Inline") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<h3 id="在重写的模块">在重写的模块</h3> - -<p><span id="result_box" lang="zh-CN"><span>以下模块已经过时，需要重写。</span>其<span>语法仍然在审查，可能会以不兼容的方式</span></span><span lang="zh-CN"><span>发展出很多。</span><span>替代语法已通过测试并被广泛实践。</span></span></p> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F33;"><strong>{{ SpecName("CSS3 Box", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Box") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F33;"><strong>{{ SpecName("CSS3 Content", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Content") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<table class="fullwidth-table" style="width: 100%;"> - <tbody> - <tr> - <td style="width: 30%; background-color: #F33;"><strong>{{ SpecName("CSS3 Inline Layout", "", "") }}</strong></td> - <td>{{ Spec2("CSS3 Inline Layout") }}</td> - </tr> - <tr> - <td colspan="2"> </td> - </tr> - </tbody> -</table> - -<p> </p> diff --git a/files/zh-cn/archive/firefox_os/api/simple_push_api/index.html b/files/zh-cn/archive/firefox_os/api/simple_push_api/index.html deleted file mode 100644 index 51c37e99ca..0000000000 --- a/files/zh-cn/archive/firefox_os/api/simple_push_api/index.html +++ /dev/null @@ -1,232 +0,0 @@ ---- -title: Simple Push -slug: Archive/Firefox_OS/API/Simple_Push_API -tags: - - Simple Push -translation_of: Archive/B2G_OS/API/Simple_Push_API ---- -<div>{{obsolete_header("51")}} {{non-standard_header}}</div> - -<div class="note"> -<p><strong>Note</strong>: The proprietary Simple Push API is deprecated in favor of the W3C <a href="/en-US/docs/Web/API/Push_API">Push API</a>.</p> -</div> - -<p><strong>简单推送API</strong>，也称为<strong>推送通知API</strong>，提供应用程式唤醒以接收通知的功能。您可以使用简单推送作为一个同步机制，甚至可以从第三方服务器获取最新数据。</p> - -<p>推送就是从远程服务端发来的一个事件.他的工作原理如下<span style="line-height: 1.5;">: An app uses the Simple Push API to request a special, unique URL called an endpoint. This request goes to an existing server maintained by Mozilla for this purpose (this is called the "push server"). When the app receives the endpoint back from the push server, the app sends the endpoint to its own server (your app server). The app server stores this endpoint, then when it wants to wake up the app, it calls the endpoint with a version number, and the push server contacts the app with a notification of the version number. The app can be made to do something when it receives the notification, including ignoring it.</span></p> - -<p>The Simple Push API extends <code>Window.navigator</code> with a <code>push</code> property which is a {{domxref("PushManager")}} object, and adds some new events you can receive to monitor the push status.</p> - -<h2 id="基础示例">基础示例</h2> - -<p>There are several ways to use the Simple Push API. This example covers the basics of how to use it. The example consists of the general steps below. See the following sections for full information on each step.</p> - -<ol> - <li><a href="#Add_push_to_manifest">Add push configuration to the app's manifest file</a></li> - <li><a href="#2._Call_PushManager.register()_to_request_an_endpoint">Call PushManager.register to request an endpoint</a></li> - <li><a href="#3._Send_the_endpoint_to_your_server">Send the endpoint to your server</a></li> - <li><a href="#4._Add_a_message_handler_for_push_notifications_to_your_app">Add message handlers for push notifications to your app</a></li> - <li><a href="#5._Send_a_notification_from_your_server_using_the_endpoint">Send a notification from your server using the endpoint</a></li> -</ol> - -<h2 id="1._Add_push_configuration_to_the_app's_manifest_file"><a name="Add_push_to_manifest"></a>1. Add push configuration to the app's manifest file</h2> - -<p>You need to change two things in the app's manifest file so it can use Simple Push:</p> - -<ol> - <li><a href="/docs/Web/Apps/Manifest#messages" title="https://developer.mozilla.org/en-US/docs/Web/Apps/Manifest?redirectlocale=en-US&redirectslug=Apps%2FManifest#messages"><code>messages</code> field</a> - Add <code>push</code> and <code>push-register</code> to <code>messages</code>.<br> - These indicate the app page that will receive each of these events (<code>push</code> and <code>push-register</code>). In this example, both are going to the same page: "/index.html", but they can use other pages also. See below for a more information on each of these events.</li> - <li><a href="/docs/Web/Apps/Manifest#permissions" title="https://developer.mozilla.org/en-US/docs/Web/Apps/Manifest?redirectlocale=en-US&redirectslug=Apps%2FManifest#permissions"><code>permissions</code> field</a> - Add that your app wants to receive push notifications.<br> - It's a good idea to provide a clear description here so that the end user will understand why you need push permissions.</li> -</ol> - -<pre><span class="s2">"messages"</span><span class="o">:</span> <span class="cp">[</span> - <span class="p">{</span> <span class="s2">"push"</span><span class="p">:</span> <span class="s2">"/index.html"</span><span class="p">},</span> - <span class="p">{</span> <span class="s2">"push-register"</span><span class="p">:</span> <span class="s2">"/index.html"</span><span class="p">}</span> -<span class="cp">]</span><span class="o">,</span> -<span class="s2">"permissions"</span><span class="o">:</span> <span class="p">{</span> - <span class="s2">"push"</span><span class="o">:</span> <span class="err">{ - </span>"description": "Required for being updated with new goals in soccer matches"<span class="err"> -</span><span class="p"> }</span> -<span class="err">}</span></pre> - -<h2 id="2._Call_PushManager.register()_to_request_an_endpoint">2. Call PushManager.register() to request an endpoint</h2> - -<p>The app needs to request an endpoint by calling {{domxref("PushManager.register")}}. You have to decide when this should be called. You could call it when the user has logged in to your service, or when the user decides to start watching a soccer match, or at some other point. The code below is one way to do it.</p> - -<pre class="brush: js"><span class="k">if</span> <span class="p">(</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">push</span><span class="p">)</span> <span class="p">{ - // Request the endpoint. This uses PushManager.register().</span> - <span class="kd">var</span> <span class="nx">req</span> <span class="o">=</span> <span class="nx">navigator</span><span class="p">.</span><span class="nx">push</span><span class="p">.</span><span class="nx">register</span><span class="p">();</span> - - <span class="nx">req</span><span class="p">.</span><span class="brush: js">onsuccess</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span> - <span class="kd">var</span> <span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">req</span><span class="p">.</span><span class="nx">result</span><span class="p">;</span> - console.log<span class="p">(</span><span class="s2">"New endpoint: "</span> <span class="o">+</span> <span class="nx">endpoint</span> <span class="p">); - // At this point, you'd use some call to send the endpoint to your server. - // For instance: - /* - var post = XMLHTTPRequest(); - post.open("POST", "https://your.server.here/registerEndpoint"); - post.setRequestHeader("Content-Type", "</span>application/x-www-form-urlencoded"); - post.send("endpoint=" + encodeURIComponents( endpoint ) ); - */ - // Obviously, you'll want to add .onload and .onerror handlers, add user id info, - // and whatever else you might need to associate the endpoint with the user. - <span class="p">}</span> - - <span class="nx">req</span><span class="p">.</span><span class="nx">onerror</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span> - console.error<span class="p">(</span><span class="s2">"Error getting a new endpoint: "</span> <span class="o">+</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">e</span><span class="p">));</span> - <span class="p">}</span> -<span class="p">}</span> <span class="k">else</span> <span class="p">{</span> - <span class="c1">// push is not available on the DOM, so do something else.</span> -<span class="p">}</span></pre> - -<h2 id="3._Send_the_endpoint_to_your_server">3. Send the endpoint to your server</h2> - -<p>Once the app has received an endpoint, it needs to send it to your app server. There is more than one way to do this. For example you can send it by email, or send it by <code>POST</code>, <code>PUT</code>, or even <code>GET</code>. We recommend that you store the endpoint with some user data from the app, such as a cookie, a username, or whatever you use to identify your endpoint-user pair.</p> - -<p>But if you are sending to your server, we recommend that you follow these good practices:</p> - -<ul> - <li>Send it by XMLHttpRequest.</li> - <li>Always use HTTPS. Otherwise if someone intercepts your endpoint, they could start sending notifications to your app.</li> - <li>Use something to match the user (or app installation) to the endpoint, like a cookie.</li> - <li>Keep the endpoint safe! Anyone with your endpoint could cause your app to drain your customer's battery or needlessly tie up your server, or other annoyances. You can always have the client fetch a new endpoint and drop the old one, but be aware that you'll want to make sure your server acknowledges the change.</li> -</ul> - -<h2 id="4._Add_message_handlers_for_push_notifications_to_your_app">4. Add message handlers for push notifications to your app</h2> - -<p>Once you have set up your endpoint as in the steps above, you are ready to have the app start listening for <code>push</code> and <code>push-register</code> messages using message handlers. </p> - -<h3 id="Add_a_push_message_handler">Add a <code>push</code> message handler</h3> - -<p>The <code>push</code> message handler could be in your <code>index.html</code> file or in your <code>main.js</code> script, or even in a specific <code>push-message.html</code> file that contains only the message handler. That could be useful if a <code>push</code> message is sent and your app is closed, because it will load just a small part of the HTML/JavaScript code, and you can decide if the app needs to be fully open or do something in the background. Wherever you decide to place the <code>push</code> message handler, make sure that the manifest file points to the right location (see the first step above), otherwise your app may not get updates. Here is an example of a <code>push</code> message handler:</p> - -<pre class="brush: js"><span class="k">if</span> <span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">mozSetMessageHandler</span><span class="p">)</span> <span class="p">{</span> - <span class="nb">window</span><span class="p">.</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">mozSetMessageHandler</span><span class="p">(</span><span class="s1">'push'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span> - console.log<span class="p">(</span><span class="s1">'My endpoint is '</span> <span class="o">+</span> <span class="nx">e</span><span class="p">.</span><span class="nx">pushEndpoint</span><span class="p">);</span> - console.log<span class="p">(</span><span class="s1">'My new version is '</span> <span class="o">+</span> <span class="nx">e</span><span class="p">.</span><span class="nx">version</span><span class="p">);</span> - <span class="c1">//Remember that you can handle here if you have more than</span> - <span class="c1">//one pushEndpoint</span> - <span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">pushEndpoint</span> <span class="o">===</span> <span class="nx">emailEndpoint</span><span class="p">)</span> <span class="p">{</span> - <span class="nx">emailHandler</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">version</span><span class="p">);</span> - <span class="p">}</span> <span class="k">else</span> <span class="k">if</span> <span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">pushEndpoint</span> <span class="o">===</span> <span class="nx">imEndpoint</span><span class="p">)</span> <span class="p">{</span> - <span class="nx">imHandler</span><span class="p">(</span><span class="nx">e</span><span class="p">.</span><span class="nx">version</span><span class="p">);</span> - <span class="p">}</span> - <span class="p">});</span> -<span class="p">}</span> <span class="k">else</span> <span class="p">{</span> - <span class="c1">// No message handler</span> -<span class="p">}</span></pre> - -<h3 id="Add_a_push-register_message_handler">Add a <code>push-register</code> message handler</h3> - -<div class="note"> -<p><strong>Note:</strong> Be sure to add this handler and check that it works. If you do not re-register your endpoints when this message is received by your app, the app <strong>WILL NOT BE ABLE </strong>to receive further push notifications.</p> -</div> - -<p>A <code>push-register</code> message will be sent to all apps when the device changes its internal identifier (called the UAID or User Agent Identifier). This could be because the push server has changed, or it has gone down and needs to recover, or other circumstances. If one of these things occurs, you <strong>MUST</strong> re-register all your endpoints, because your previous endpoints will not be valid anymore. Therefore your app needs to implement a <code>push-register</code> message handler. See the example code below.</p> - -<pre class="brush: js"><span class="k">if</span> <span class="p">(</span><span class="nb">window</span><span class="p">.</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">mozSetMessageHandler</span><span class="p">)</span> <span class="p">{</span> - <span class="nb">window</span><span class="p">.</span><span class="nx">navigator</span><span class="p">.</span><span class="nx">mozSetMessageHandler</span><span class="p">(</span><span class="s1">'push-register'</span><span class="p">,</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span> - console.log<span class="p">(</span><span class="s1">'push-register received, I need to register my endpoint(s) again!'</span><span class="p">);</span> - -<span class="c1"> <span class="kd">var</span> <span class="nx">req</span> <span class="o">=</span> <span class="nx">navigator</span><span class="p">.</span><span class="nx">push</span><span class="p">.</span><span class="nx">register</span><span class="p">();</span> - <span class="nx"> req</span><span class="p">.</span><span class="brush: js">onsuccess</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span> - <span class="kd"> var</span> <span class="nx">endpoint</span> <span class="o">=</span> <span class="nx">req</span><span class="p">.</span><span class="nx">result</span><span class="p">;</span> - console.log<span class="p">(</span><span class="s2">"New endpoint: "</span> <span class="o">+</span> <span class="nx">endpoint</span> <span class="p">); - localStorage.endpoint = endpoint;</span> - <span class="p">}</span> - - <span class="nx"> req</span><span class="p">.</span><span class="nx">onerror</span> <span class="o">=</span> <span class="kd">function</span><span class="p">(</span><span class="nx">e</span><span class="p">)</span> <span class="p">{</span> - console.error<span class="p">(</span><span class="s2">"Error getting a new endpoint: "</span> <span class="o">+</span> <span class="nx">JSON</span><span class="p">.</span><span class="nx">stringify</span><span class="p">(</span><span class="nx">e</span><span class="p">));</span> - <span class="p"> }</span></span> - <span class="p">});</span> -<span class="p">}</span> <span class="k">else</span> <span class="p">{</span> - <span class="c1">// No message handler</span> -<span class="p">}</span></pre> - -<h2 id="5._Send_a_notification_from_your_server_using_the_endpoint">5. Send a notification from your server using the endpoint</h2> - -<p>Once you have the endpoint on your server, you can send a notification by simply sending an HTTP <code>PUT</code> request to the endpoint with the body <code>version=<version></code>. For example, imagine an endpoint with this URL:</p> - -<pre><code>https://updates.push.services.mozilla.com/update/abcdef01234567890abcdefabcdef01234567890abcdef</code></pre> - -<p>and version 5:</p> - -<pre><code>version=5</code></pre> - -<p>Here is how the notification looks using curl:</p> - -<pre><code>curl -X PUT -d "version=5" https://updates.push.services.mozilla.com/update/abcdef01234567890abcdefabcdef01234567890abcdef</code></pre> - -<p>If the push server is running correctly, you will get a response with a <code>200 Status (OK)</code> and a <code>{}</code> as a body. You may also receive a <code>202 Status</code>, indicating that the message was accepted, but may be handled using an alternate system. If not, a valid HTTP error response with JSON explaining the error is returned.</p> - -<div class="note"> -<p><strong>Please remember:</strong> Just because Simple Push has accepted the message, there is no guarantee that the message will be delivered successfully to the app. Many factors, ranging from a device being offline to various network failures, may prevent successful delivery of a notification. We try our best, but sometimes the universe has other plans.</p> -</div> - -<p>Remember that the value of <code>version</code> should be integer numbers, and incremental. Apps <em>will not</em> get new notifications if the new version is lower than that stored on the server and/or device. Versions can be useful to the app to indicate if there are "missed" events it should really check up on. You could also just use the current UTC (the number of seconds since midnight, Jan. 1, 1970, GMT) if the actual version value isn't very important to you.</p> - -<h3 id="Unregister_an_endpoint">Unregister an endpoint</h3> - -<p>Once you finish using an endpoint and you do not want to receive more notifications, we kindly ask you to unregister the old endpoint using {{domxref("PushManager.unregister")}}. This will clean up the amount of data the device sends to the push server, and will also will lower the battery usage by not sending notifications for apps that will not use them.</p> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{domxref("PushManager")}}</li> - <li><a href="/en-US/docs/Web/API/Navigator.push">Window.navigator.push</a></li> - <li><a href="https://github.com/frsela/pushJSlibrary" title="https://github.com/frsela/pushJSlibrary">pushJSLibrary, a push shim for browsers that do not implement the API</a></li> - <li><a href="https://wiki.mozilla.org/WebAPI/SimplePush">SimplePush original design and discussion page</a></li> -</ul> diff --git a/files/zh-cn/archive/index.html b/files/zh-cn/archive/index.html deleted file mode 100644 index 44a6ec1584..0000000000 --- a/files/zh-cn/archive/index.html +++ /dev/null @@ -1,18 +0,0 @@ ---- -title: Archive of obsolete content -slug: Archive -translation_of: Archive ---- -<p>在MDN，我们尽量避免直接删除可能对以传统平台，操作系统和浏览器为目标的人有用的内容。例如，您的目标受众可能是使用旧硬件的用户，而无法升级到最新，最好的浏览器。或者出于“原因”，您的公司需要使用非常旧的软件，您需要构建在该软件上运行的Web内容。或者，您可能只是对过时的功能或API的历史以及它的工作方式感到好奇。 <br> - <br> - 旧文档可能有用的原因有很多。所以，我们已经建立了这个可以归档旧文档的区域。此存档内容区域中的材料不应用于为现代浏览器构建新的网站或应用程序。这里仅供参考。</p> - -<div class="note"> -<p><strong>请写作者注意:</strong> 我们需要尽量保持这里的子页面，而不是全部转储到一个大文件夹中。尝试创建子类别的材料的子树。此外，只能移动这里非常过时的页面。如果有人可能真的需要实时产品的信息，可能不适合移动在这里。一般来说，在移动内容之前，最好在Matrix频道 <a href="https://chat.mozilla.org/#/room/#mdn:mozilla.org">MDN Web Docs</a> 中进行讨论。</p> -</div> - -<p>{{SubpagesWithSummaries}}</p> - -<h2 id="Subnav">Subnav</h2> - -<p>{{ListSubpages("/en-US/docs/Archive", 2, 0, 1)}}</p> diff --git a/files/zh-cn/archive/jxon/index.html b/files/zh-cn/archive/jxon/index.html deleted file mode 100644 index 1b7c1d69e2..0000000000 --- a/files/zh-cn/archive/jxon/index.html +++ /dev/null @@ -1,1513 +0,0 @@ ---- -title: JXON -slug: Archive/JXON -translation_of: Archive/JXON ---- -<p><strong>JXON</strong> (无损 JavaScript XML对象注释) 是一个通用名称，通过它定义使用 <a href="/en/XML" title="en/XML">XML</a>的JavaScript对象的表示。 这种转换没有真正的标准，<a href="/zh-CN/docs/Archive/JXON#The_Parker_Convention">但一些公约开始出现在网络上</a>。在某些情况下，必须从JavaScript解释器中读取XML文档的全部内容（例如用于Web应用程序语言或设置XML文档）。在这些情况下，JXON可能是最实用的方法。</p> - -<p>在本文中，我们将演示如何将解析的XML <a href="https://www.w3.org/TR/DOM-Level-2-Core/core.html#i-Document">Document</a>（即<a href="https://www.w3.org/TR/DOM-Level-2-Core/core.html#i-Document">Document</a>的一个实例）转换为JavaScript Object树（即<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Object">Object</a>的嵌套实例树），反之亦然，用一些不同的算法。首先阅读<a href="/zh-CN/docs/XML_介绍">XML介绍文章</a>会比较有帮助。</p> - -<p>如果您想要<strong>一个完整的双向JXON库</strong>（在<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON">JSON</a>全局对象上建模），请跳至<a href="/zh-CN/docs/Archive/JXON#Appendix.3A_a_complete.2C_bidirectional.2C_JXON_library">专用段落</a>（但请阅读<a href="/zh-CN/docs/Archive/JXON#const_compatibility">关于const语句兼容性的注释</a>）。</p> - -<div class="note"><strong>注意：</strong>如果您只想解决XML文档的某些部分（而不是以JavaScript / JSON为模板目的开始），则使用<a href="/zh-CN/docs/Web/XPath">XPath</a>而不是将整个文档转换为JSON。</div> - -<h2 id="Conversion_snippets">Conversion snippets</h2> - -<p>现在想象你有这个示例XML文档：</p> - -<h5 id="example.xml">example.xml</h5> - -<pre class="brush: xml"><?xml version="1.0"?> -<!DOCTYPE catalog SYSTEM "catalog.dtd"> -<catalog> - <product description="Cardigan Sweater"> - <catalog_item gender="Men's"> - <item_number>QWZ5671</item_number> - <price>39.95</price> - <size description="Medium"> - <color_swatch image="red_cardigan.jpg">Red</color_swatch> - <color_swatch image="burgundy_cardigan.jpg">Burgundy</color_swatch> - </size> - <size description="Large"> - <color_swatch image="red_cardigan.jpg">Red</color_swatch> - <color_swatch image="burgundy_cardigan.jpg">Burgundy</color_swatch> - </size> - </catalog_item> - <catalog_item gender="Women's"> - <item_number>RRX9856</item_number> - <discount_until>Dec 25, 1995</discount_until> - <price>42.50</price> - <size description="Medium"> - <color_swatch image="black_cardigan.jpg">Black</color_swatch> - </size> - </catalog_item> - </product> - <script type="text/javascript"><![CDATA[function matchwo(a,b) { - if (a < b && a < 0) { return 1; } - else { return 0; } -}]]></script> -</catalog> -</pre> - -<p>首先，按照“<a href="/zh-CN/docs/Web/API/Document_Object_Model/How_to_create_a_DOM_tree">如何创建DOM树</a>”文章中的描述，创建一个类似前面示例的DOM树。如果您已经有使用<a href="/zh-CN/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a>的DOM树，请跳到下一段。</p> - -<div class="note"><strong>注意：</strong>如果您正在使用<a href="/zh-CN/docs/Web/API/XMLHttpRequest">XMLHttpRequest</a>实例来检索XML文件，请使用<code>yourRequest.responseXML</code>属性来获取已解析的XML文档。不要使用<code>yourRequest.responseText</code>！</div> - -<p>这里提出的算法（参见：<a href="/zh-CN/docs/Archive/JXON#Algorithm_.231.3A_a_verbose_way">＃1</a>，<a href="/zh-CN/docs/Archive/JXON#Algorithm_.232.3A_a_less_verbose_way">＃2</a>，<a href="/zh-CN/docs/Archive/JXON#Algorithm_.233.3A_a_synthetic_technique">＃3</a>，<a href="/zh-CN/docs/Archive/JXON#Algorithm_.234.3A_a_very_minimalist_way">＃4</a>）将只考虑以下类型的节点及其属性：</p> - -<ol> - <li><a href="/zh-CN/docs/Web/API/Document" title="Document 接口提供了一些在浏览器服务中作为页面内容入口点而加载的一些页面，也就是 DOM 树。 DOM 树包括诸如 <body> 和 <table> 之类的元素，及其他元素。其也为文档（document）提供了全局性的函数，例如获取页面的 URL、在文档中创建新的 element 的函数。"><code>Document</code></a> （只作为函数参数），</li> - <li><a href="/zh-CN/docs/Web/API/DocumentFragment" title="DocumentFragment 接口表示一个没有父级文件的最小文档对象。它被当做一个轻量版的 Document 使用，用于存储已排好版的或尚未打理好格式的XML片段。最大的区别是因为DocumentFragment不是真实DOM树的一部分，它的变化不会引起DOM树的重新渲染的操作(reflow) ，且不会导致性能等问题。"><code>DocumentFragment</code></a> （只作为函数参数），</li> - <li><a href="/zh-CN/docs/Web/API/Element" title="Element（元素）接口是 Document的一个对象. 这个接口描述了所有相同种类的元素所普遍具有的方法和属性。 这些继承自Element并且增加了一些额外功能的接口描述了具体的行为. 例如, HTMLElement 接口是所有HTML元素的基础接口， 而 SVGElement 接口是所有SVG元素的基本接口."><code>Element</code></a>,</li> - <li><a href="/zh-CN/docs/Web/API/Text" title="The Text interface represents the textual content of Element or Attr. If an element has no markup within its content, it has a single child implementing Text that contains the element's text. However, if the element contains markup, it is parsed into information items and Text nodes that form its children."><code>Text</code></a> （从不作为函数参数），</li> - <li><a href="/zh-CN/docs/Web/API/CDATASection" title="CDATASection 接口用来表示 CDATA 部分，这一部分可以被使用在XML中， CDATA可以包含那些没有转义字符的文本, 这些没有转义的字符包括但不限于 < 和 & ，他们不需要被转义，但在XML中使用时，保持原样就可以了。"><code>CDATASection</code></a> （从不作为函数参数），</li> - <li><a href="/zh-CN/docs/Web/API/Attr" title="该类型使用对象来表示一个DOM元素的属性。在大多数DOM方法中，你可能会直接通过字符串的方式获取属性值（例如Element.getAttribute()），但是一些函数（例如Element.getAttributeNode()）或通过迭代器访问时则返回Attr类型。"><code>Attr</code></a> （从不作为函数参数）。</li> -</ol> - -<p>对于JavaScript的使用来说，这是一个很好的<strong>标准化</strong>的妥协，因为XML文档的所有信息都包含在这些节点类型中。所有其他信息（如处理指令，模式，注释等）都将丢失。这种算法仍然被认为是<strong>无损</strong>的，因为丢失的是<strong>元信息</strong>而不是<strong>信息</strong>。</p> - -<p>为了避免冲突，节点和属性名称的表示<strong>不区分大小写</strong>（总是以<strong>小写</strong>形式呈现），所以使用JavaScript设置的对象的本地属性名称必须总是具有某种大小写（即至少有一个大写字母在他们的名字），如你可以看到下面。</p> - -<p>下面的算法有些基于<a href="/zh-CN/docs/Archive/JXON#The_Parker_Convention">Parker公约（版本0.4）</a>，它规定了<strong><a href="/zh-CN/docs/Web/API/Node/nodeName">标签名称</a>到<a href="/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects#Objects_and_properties">对象属性名称</a>的转换</strong>以及每个标签（纯文本解析）的所有收集 <a href="/en/DOM/Node.nodeValue" title="en/DOM/Node.nodeValue"><code>text content</code></a>的<strong> <a href="/en/JavaScript/Reference/Operators/typeof" title="en/JavaScript/Reference/Operators/typeof"><code>typeof</code></a></strong> <strong>的识别</strong>。但<a href="/zh-CN/docs/Archive/JXON#Code_considerations">有一些分歧</a>（所以，可以说我们遵循我们的惯例）。而且，对于设想的节点，<strong>所有算法都是同样无损的</strong>。</p> - -<p>我们认为<a href="/zh-CN/docs/Archive/JXON#Algorithm_.233.3A_a_synthetic_technique">第三种算法</a>是<strong>最具代表性和实用性的JXON解析算法</strong>。</p> - -<p>现在让我们将<code>doc</code>（DOM树）序列化为一个JavaScript对象树（您可以阅读关于<a href="/zh-CN/docs/Web/JavaScript/Guide/Working_with_Objects">使用对象</a>以及<a href="/zh-CN/docs/Learn/JavaScript/Objects">Javascript如何面向对象</a>的更多信息）。我们可以使用几种算法将其内容转换为Javascript对象树。</p> - -<h3 id="算法_1_一个冗长的方式">算法 #1: 一个冗长的方式</h3> - -<p>这个简单的递归构造函数将一个XML DOM树转换成一个JavaScript对象树。每个元素的文本内容都存储在<code>keyValue</code>属性中，而<code>nodeAttributes</code>（如果存在）列在子对象<code>keyAttributes</code>下。构造函数的参数可以是整个XML <code>Document</code>，<code>DocumentFragment</code>或简单的<code>Element</code>节点。</p> - -<pre class="brush: js">/*\ -|*| -|*| JXON Snippet #1 - Mozilla Developer Network -|*| -|*| https://developer.mozilla.org/en-US/docs/JXON -|*| https://developer.mozilla.org/User:fusionchess -|*| -|*| This framework is released under the GNU Public License, version 3 or later. -|*| http://www.gnu.org/licenses/gpl-3.0-standalone.html -|*| -\*/ - -function parseText (sValue) { - if (/^\s*$/.test(sValue)) { return null; } - if (/^(?:true|false)$/i.test(sValue)) { return sValue.toLowerCase() === "true"; } - if (isFinite(sValue)) { return parseFloat(sValue); } - if (isFinite(Date.parse(sValue))) { return new Date(sValue); } - return sValue; -} - -function JXONTree (oXMLParent) { - var nAttrLen = 0, nLength = 0, sCollectedTxt = ""; - if (oXMLParent.hasChildNodes()) { - for (var oNode, sProp, vContent, nItem = 0; nItem < oXMLParent.childNodes.length; nItem++) { - oNode = oXMLParent.childNodes.item(nItem); - if ((oNode.nodeType - 1 | 1) === 3) { sCollectedTxt += oNode.nodeType === 3 ? oNode.nodeValue.trim() : oNode.nodeValue; } // nodeType is "Text" (3) or "CDATASection" (4) - else if (oNode.nodeType === 1 && !oNode.prefix) { // nodeType is "Element" (1) - sProp = oNode.nodeName.toLowerCase(); - vContent = new JXONTree(oNode); - if (this.hasOwnProperty(sProp)) { - if (this[sProp].constructor !== Array) { this[sProp] = [this[sProp]]; } - this[sProp].push(vContent); - } else { this[sProp] = vContent; nLength++; } - } - } - this.keyValue = parseText(sCollectedTxt); - } else { this.keyValue = null; } - if (oParentNode.hasAttributes && oXMLParent.hasAttributes()) { - var oAttrib; - this.keyAttributes = {}; - for (nAttrLen; nAttrLen < oXMLParent.attributes.length; nAttrLen++) { - oAttrib = oXMLParent.attributes.item(nAttrLen); - this.keyAttributes[oAttrib.name.toLowerCase()] = parseText(oAttrib.value.trim()); - } - } - /* - * Optional properties... - - this.keyLength = nLength; - this.attributesLength = nAttrLen; - // this.DOMNode = oXMLParent; - - */ - - /* Object.freeze(this); */ -} - -/* -* Optional methods... Uncomment the optional properties first! - -JXONTree.prototype.valueOf = function () { return this.keyValue; }; -JXONTree.prototype.toString = function () { return String(this.keyValue); }; -JXONTree.prototype.getItem = function (nItem) { - if (nLength === 0) { return null; } - var nCount = 0; - for (var sKey in this) { if (nCount === nItem) { return this[sKey]; } nCount++; } - return null; -}; -JXONTree.prototype.getAttribute = function (nAttrId) { - if (nAttrLen === 0 || nAttrId + 1 > nAttrLen) { return null; } - var nAttr = 0; - for (var sAttrName in this.keyAttributes) { if (nAttr === nAttrId) { return this.keyAttributes[sAttrName]; } nAttr++; } - return null; -}; -JXONTree.prototype.hasChildren = function () { return this.keyLength > 0; }; - -*/ - -var myObject = new JXONTree(doc); -// we got our javascript object! try: alert(JSON.stringify(myObject)); -</pre> - -<div class="note"><strong>注意：</strong>如果你想冻结整个对象树（因为XML文档的“静态”性质），取消注释字符串：<code>/* Object.freeze(this); */</code>。 <code><a href="/en/JavaScript/Reference/Global_Objects/Object/freeze" title="en/JavaScript/Reference/Global_Objects/Object/freeze">Object.freeze()</a></code>方法防止将新属性添加到该属性中，防止现有属性被删除，并防止现有属性或其可枚举性，可配置性或可写性发生更改。本质上，对象树是有效的不可变的。</div> - -<p> </p> - -<p>用这个算法我们的<a href="/zh-CN/docs/Archive/JXON#example.xml">例子</a>变成：</p> - -<pre class="brush: js">{ - "catalog": { - "product": { - "catalog_item": [{ - "item_number": { - "keyValue": "QWZ5671" - }, - "price": { - "keyValue": 39.95 - }, - "size": [{ - "color_swatch": [{ - "keyValue": "Red", - "keyAttributes": { - "image": "red_cardigan.jpg" - } - }, { - "keyValue": "Burgundy", - "keyAttributes": { - "image": "burgundy_cardigan.jpg" - } - }], - "keyValue": null, - "keyAttributes": { - "description": "Medium" - } - }, { - "color_swatch": [{ - "keyValue": "Red", - "keyAttributes": { - "image": "red_cardigan.jpg" - } - }, { - "keyValue": "Burgundy", - "keyAttributes": { - "image": "burgundy_cardigan.jpg" - } - }], - "purchased": { - "keyValue": null - }, - "keyValue": null, - "keyAttributes": { - "description": "Large" - } - }], - "keyValue": null, - "keyAttributes": { - "gender": "Men's" - } - }, { - "item_number": { - "keyValue": "RRX9856" - }, - "discount_until": { - "keyValue": new Date(1995, 11, 25) - }, - "price": { - "keyValue": 42.5 - }, - "size": { - "color_swatch": { - "keyValue": "Black", - "keyAttributes": { - "image": "black_cardigan.jpg" - } - }, - "keyValue": null, - "keyAttributes": { - "description": "Medium" - } - }, - "keyValue": null, - "keyAttributes": { - "gender": "Women's" - } - }], - "keyValue": null, - "keyAttributes": { - "description": "Cardigan Sweater" - } - }, - "script": { - "keyValue": "function matchwo(a,b) {\n if (a < b && a < 0) { return 1; }\n else { return 0; }\n}", - "keyAttributes": { - "type": "text/javascript" - } - }, - "keyValue": null - }, - "keyValue": null -} -</pre> - -<p>如果您部分了解XML文档的结构，则可以使用这种技术。</p> - -<h3 id="算法_2_一个不太冗长的方式">算法 #2: 一个不太冗长的方式</h3> - -<p>这里是另一个更简单的转换方法，其中<code>nodeAttributes</code>列在子节点的同一对象下，但带有“@”前缀（由<a href="http://badgerfish.ning.com/">BadgerFish Convention</a>提出）。如上所述，文本内容存储在<code>keyValue</code>属性中。构造函数的参数可以是整个XML <code>Document</code>，一个<code>DocumentFragment</code>或简单的<code>Element</code>节点。</p> - -<pre class="brush: js">/*\ -|*| -|*| JXON Snippet #2 - Mozilla Developer Network -|*| -|*| https://developer.mozilla.org/en-US/docs/JXON -|*| https://developer.mozilla.org/User:fusionchess -|*| -|*| This framework is released under the GNU Public License, version 3 or later. -|*| http://www.gnu.org/licenses/gpl-3.0-standalone.html -|*| -\*/ - -function parseText (sValue) { - if (/^\s*$/.test(sValue)) { return null; } - if (/^(?:true|false)$/i.test(sValue)) { return sValue.toLowerCase() === "true"; } - if (isFinite(sValue)) { return parseFloat(sValue); } - if (isFinite(Date.parse(sValue))) { return new Date(sValue); } - return sValue; -} - -function JXONTree (oXMLParent) { - if (oXMLParent.hasChildNodes()) { - var sCollectedTxt = ""; - for (var oNode, sProp, vContent, nItem = 0; nItem < oXMLParent.childNodes.length; nItem++) { - oNode = oXMLParent.childNodes.item(nItem); - if ((oNode.nodeType - 1 | 1) === 3) { sCollectedTxt += oNode.nodeType === 3 ? oNode.nodeValue.trim() : oNode.nodeValue; } - else if (oNode.nodeType === 1 && !oNode.prefix) { - sProp = oNode.nodeName.toLowerCase(); - vContent = new JXONTree(oNode); - if (this.hasOwnProperty(sProp)) { - if (this[sProp].constructor !== Array) { this[sProp] = [this[sProp]]; } - this[sProp].push(vContent); - } else { this[sProp] = vContent; } - } - } - if (sCollectedTxt) { this.keyValue = parseText(sCollectedTxt); } - } - if (oParentNode.hasAttributes && oXMLParent.hasAttributes()) { - var oAttrib; - for (var nAttrib = 0; nAttrib < oXMLParent.attributes.length; nAttrib++) { - oAttrib = oXMLParent.attributes.item(nAttrib); - this["@" + oAttrib.name.toLowerCase()] = parseText(oAttrib.value.trim()); - } - } - /* Object.freeze(this); */ -} - -var myObject = new JXONTree(doc); -// we got our javascript object! try: alert(JSON.stringify(myObject)); -</pre> - -<div class="note"><strong>注意：</strong>如果你想冻结整个对象树（因为XML文档的“静态”性质），取消注释字符串：<code>/* Object.freeze(this); */</code>。 <code><a href="/en/JavaScript/Reference/Global_Objects/Object/freeze" title="en/JavaScript/Reference/Global_Objects/Object/freeze">Object.freeze()</a></code>方法防止将新属性添加到该属性中，防止现有属性被删除，并防止现有属性或其可枚举性，可配置性或可写性发生更改。本质上，对象树是有效的不可变的。</div> - -<p>用这个算法我们的<a href="/zh-CN/docs/Archive/JXON#example.xml">例子</a>变成：</p> - -<pre class="brush: js">{ - "catalog": { - "product": { - "catalog_item": [{ - "item_number": { - "keyValue": "QWZ5671" - }, - "price": { - "keyValue": 39.95 - }, - "size": [{ - "color_swatch": [{ - "keyValue": "Red", - "@image": "red_cardigan.jpg" - }, { - "keyValue": "Burgundy", - "@image": "burgundy_cardigan.jpg" - }], - "@description": "Medium" - }, { - "color_swatch": [{ - "keyValue": "Red", - "@image": "red_cardigan.jpg" - }, { - "keyValue": "Burgundy", - "@image": "burgundy_cardigan.jpg" - }], - "@description": "Large" - }], - "@gender": "Men's" - }, { - "item_number": { - "keyValue": "RRX9856" - }, - "discount_until": { - "keyValue": new Date(1995, 11, 25) - }, - "price": { - "keyValue": 42.5 - }, - "size": { - "color_swatch": { - "keyValue": "Black", - "@image": "black_cardigan.jpg" - }, - "@description": "Medium" - }, - "@gender": "Women's" - }], - "@description": "Cardigan Sweater" - }, - "script": { - "keyValue": "function matchwo(a,b) {\n if (a < b && a < 0) { return 1; }\n else { return 0; }\n}", - "@type": "text/javascript" - } - } -} -</pre> - -<p>如果您部分了解XML文档的结构，则可以使用这种技术。</p> - -<h3 id="Algorithm_3_一种组合的技巧">Algorithm #3: 一种组合的技巧</h3> - -<p>这是另一种转换方法。这个算法是最接近<a href="/zh-CN/docs/Archive/JXON#The_Parker_Convention">Parker约定</a>的。除了不包含除<code>Text</code>或<code>CDATASection</code>以外的其他可识别节点的节点不被视为对象，而是直接作为布尔值，字符串，数字或<code>Date</code>对象（请参阅<a href="/zh-CN/docs/Archive/JXON#The_Parker_Convention">Parker约定</a>）。空节点（即不包含其他<code>Element</code>节点，<code>Text</code>节点，<code>CDATASection</code>节点或<code>Attr</code>节点）的默认值为<code>true</code>（请参阅<a href="/zh-CN/docs/Archive/JXON#Code_considerations">代码注意事项</a>）。另外，这次我们使用一个函数来代替构造函数。函数的参数可以是整个XML <a href="/zh-CN/docs/Web/API/Document" title="Document 接口提供了一些在浏览器服务中作为页面内容入口点而加载的一些页面，也就是 DOM 树。 DOM 树包括诸如 <body> 和 <table> 之类的元素，及其他元素。其也为文档（document）提供了全局性的函数，例如获取页面的 URL、在文档中创建新的 element 的函数。"><code>Document</code></a>，一个<a href="/zh-CN/docs/Web/API/DocumentFragment" title="DocumentFragment 接口表示一个没有父级文件的最小文档对象。它被当做一个轻量版的 Document 使用，用于存储已排好版的或尚未打理好格式的XML片段。最大的区别是因为DocumentFragment不是真实DOM树的一部分，它的变化不会引起DOM树的重新渲染的操作(reflow) ，且不会导致性能等问题。"><code>DocumentFragment</code></a>，或者只是一个 <a href="/zh-CN/docs/Web/API/Element" title="Element（元素）接口是 Document的一个对象. 这个接口描述了所有相同种类的元素所普遍具有的方法和属性。 这些继承自Element并且增加了一些额外功能的接口描述了具体的行为. 例如, HTMLElement 接口是所有HTML元素的基础接口， 而 SVGElement 接口是所有SVG元素的基本接口."><code>Element</code></a> 节点。根据<a href="http://badgerfish.ning.com/">BadgerFish公约</a>的建议，<code>nodeAttributes</code>具有“@”前缀。<strong>在很多情况下，这是最实用的转换方法。</strong></p> - -<pre class="brush: js">/*\ -|*| -|*| JXON Snippet #3 - Mozilla Developer Network -|*| -|*| https://developer.mozilla.org/en-US/docs/JXON -|*| https://developer.mozilla.org/User:fusionchess -|*| -|*| This framework is released under the GNU Public License, version 3 or later. -|*| http://www.gnu.org/licenses/gpl-3.0-standalone.html -|*| -\*/ - -function parseText (sValue) { - if (/^\s*$/.test(sValue)) { return null; } - if (/^(?:true|false)$/i.test(sValue)) { return sValue.toLowerCase() === "true"; } - if (isFinite(sValue)) { return parseFloat(sValue); } - if (isFinite(Date.parse(sValue))) { return new Date(sValue); } - return sValue; -} - -function getJXONTree (oXMLParent) { - var vResult = /* put here the default value for empty nodes! */ true, nLength = 0, sCollectedTxt = ""; - if (oXMLParent.hasAttributes && oXMLParent.hasAttributes()) { - vResult = {}; - for (nLength; nLength < oXMLParent.attributes.length; nLength++) { - oAttrib = oXMLParent.attributes.item(nLength); - vResult["@" + oAttrib.name.toLowerCase()] = parseText(oAttrib.value.trim()); - } - } - if (oXMLParent.hasChildNodes()) { - for (var oNode, sProp, vContent, nItem = 0; nItem < oXMLParent.childNodes.length; nItem++) { - oNode = oXMLParent.childNodes.item(nItem); - if (oNode.nodeType === 4) { sCollectedTxt += oNode.nodeValue; } /* nodeType is "CDATASection" (4) */ - else if (oNode.nodeType === 3) { sCollectedTxt += oNode.nodeValue.trim(); } /* nodeType is "Text" (3) */ - else if (oNode.nodeType === 1 && !oNode.prefix) { /* nodeType is "Element" (1) */ - if (nLength === 0) { vResult = {}; } - sProp = oNode.nodeName.toLowerCase(); - vContent = getJXONTree(oNode); - if (vResult.hasOwnProperty(sProp)) { - if (vResult[sProp].constructor !== Array) { vResult[sProp] = [vResult[sProp]]; } - vResult[sProp].push(vContent); - } else { vResult[sProp] = vContent; nLength++; } - } - } - } - if (sCollectedTxt) { nLength > 0 ? vResult.keyValue = parseText(sCollectedTxt) : vResult = parseText(sCollectedTxt); } - /* if (nLength > 0) { Object.freeze(vResult); } */ - return vResult; -} - -var myObject = getJXONTree(doc); -// we got our javascript object! try: alert(JSON.stringify(myObject)); -</pre> - -<div class="note"><strong>注意：</strong>如果你想冻结整个对象树（因为XML文档的“静态”性质），取消注释字符串：<code>/* Object.freeze(this); */</code>。 <code><a href="/en/JavaScript/Reference/Global_Objects/Object/freeze" title="en/JavaScript/Reference/Global_Objects/Object/freeze">Object.freeze()</a></code>方法防止将新属性添加到该属性中，防止现有属性被删除，并防止现有属性或其可枚举性，可配置性或可写性发生更改。本质上，对象树是有效的不可变的。</div> - -<p>用这个算法我们的<a href="/zh-CN/docs/Archive/JXON#example.xml">例子</a>变成：</p> - -<pre class="brush: js">{ - "catalog": { - "product": { - "@description": "Cardigan Sweater", - "catalog_item": [{ - "@gender": "Men's", - "item_number": "QWZ5671", - "price": 39.95, - "size": [{ - "@description": "Medium", - "color_swatch": [{ - "@image": "red_cardigan.jpg", - "keyValue": "Red" - }, { - "@image": "burgundy_cardigan.jpg", - "keyValue": "Burgundy" - }] - }, { - "@description": "Large", - "color_swatch": [{ - "@image": "red_cardigan.jpg", - "keyValue": "Red" - }, { - "@image": "burgundy_cardigan.jpg", - "keyValue": "Burgundy" - }] - }] - }, { - "@gender": "Women's", - "item_number": "RRX9856", - "discount_until": new Date(1995, 11, 25), - "price": 42.5, - "size": { - "@description": "Medium", - "color_swatch": { - "@image": "black_cardigan.jpg", - "keyValue": "Black" - } - } - }] - }, - "script": { - "@type": "text/javascript", - "keyValue": "function matchwo(a,b) {\n if (a < b && a < 0) { return 1; }\n else { return 0; }\n}" - } - } -} -</pre> - -<p>如果您知道XML文档的结构，这是推荐的技术。</p> - -<h3 id="算法_4_一个非常简约的方式">算法 #4: 一个非常简约的方式</h3> - -<p>以下是另一种可以实现的转换方法。它也非常接近<a href="/zh-CN/docs/Archive/JXON#The_Parker_Convention">Parker约定</a>。使用此算法，包含同一级别中的其他子元素，文本或<code>CDATASection</code>节点的所有元素节点都将被视为<code>Boolean</code> ，<code>Number</code>， <code>String</code>，或<code>Date</code>构造函数的实例。因此，任何子元素节点（如果存在）将嵌套在这些类型的对象中。</p> - -<p>For example:</p> - -<pre class="brush: xml"><employee type="usher">John Smith</employee> -<manager>Lisa Carlucci</manager> -</pre> - -<p>becomes</p> - -<pre class="brush: js">var myObject = { - "employee": new String("John Smith"), - "manager": "Lisa Carlucci" -}; - -myObject.employee["@type"] = "usher"; - -// test - -alert(myObject.manager); // "Lisa Carlucci" -alert(myObject.employee["@type"]); // "usher" -alert(myObject.employee); // "John Smith" -</pre> - -<div class="note"><strong>注意：</strong>这个算法代表了转换的特殊情况。<strong>生成的JavaScript对象树不可<a href="/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify">字符串化</a></strong>（请参阅<a href="#Code_considerations" title="Code considerations">Code considerations</a>）。内部JavaScript访问非常实用，但如果要通过JSON字符串传输树，请不要使用它！</div> - -<p>对于第三种算法，不包含除Text或<code>CDATASection</code>之外的其他可识别节点的节点不被视为对象，而是直接作为<code>Boolean</code> ，<code>Number</code>（原始值）， <code>String</code>，或<code>Date</code>对象;而空节点（即，不包含其他<code>Element</code>节点，<code>Text</code>节点，<code>CDATASection</code>节点或<code>Attr</code>节点）具有默认值<code>true</code>。至于第三个算法，它不是使用构造函数，而是一个函数。该函数的参数可以是整个XML文档，一个<code>DocumentFragment</code>或简单的<code>Element</code>节点。根据BadgerFish公约的建议，<code>nodeAttributes</code>具有“@”前缀。</p> - -<pre class="brush: js">/*\ -|*| -|*| JXON Snippet #4 - Mozilla Developer Network -|*| -|*| https://developer.mozilla.org/en-US/docs/JXON -|*| https://developer.mozilla.org/User:fusionchess -|*| -|*| This framework is released under the GNU Public License, version 3 or later. -|*| http://www.gnu.org/licenses/gpl-3.0-standalone.html -|*| -\*/ - -function parseText (sValue) { - if (/^\s*$/.test(sValue)) { return null; } - if (/^(?:true|false)$/i.test(sValue)) { return sValue.toLowerCase() === "true"; } - if (isFinite(sValue)) { return parseFloat(sValue); } - if (isFinite(Date.parse(sValue))) { return new Date(sValue); } - return sValue; -} - -function objectify (vValue) { - if (vValue === null) { - return new (function() { - this.toString = function() { return "null"; } - this.valueOf = function() { return null; } - })(); - } - return vValue instanceof Object ? vValue : new vValue.constructor(vValue); -} - -var aTmpEls = []; // loaded element nodes cache - -function getJXONTree (oXMLParent) { - var sProp, vContent, vResult, nLength = 0, nLevelStart = aTmpEls.length, - nChildren = oXMLParent.hasChildNodes() ? oXMLParent.childNodes.length : 0, sCollectedTxt = ""; - - for (var oNode, nItem = 0; nItem < nChildren; nItem++) { - oNode = oXMLParent.childNodes.item(nItem); - if (oNode.nodeType === 4) { sCollectedTxt += oNode.nodeValue; } /* nodeType is "CDATASection" (4) */ - else if (oNode.nodeType === 3) { sCollectedTxt += oNode.nodeValue.trim(); } /* nodeType is "Text" (3) */ - else if (oNode.nodeType === 1 && !oNode.prefix) { aTmpEls.push(oNode); } /* nodeType is "Element" (1) */ - } - - var nLevelEnd = aTmpEls.length, vBuiltVal = parseText(sCollectedTxt); - - if (oParentNode.hasAttributes && oXMLParent.hasAttributes()) { - vResult = objectify(vBuiltVal); - for (nLength; nLength < oXMLParent.attributes.length; nLength++) { - oAttrib = oXMLParent.attributes.item(nLength); - vResult["@" + oAttrib.name.toLowerCase()] = parseText(oAttrib.value.trim()); - } - } else if (nLevelEnd > nLevelStart) { vResult = objectify(vBuiltVal); } - - for (var nElId = nLevelStart; nElId < nLevelEnd; nElId++) { - sProp = aTmpEls[nElId].nodeName.toLowerCase(); - vContent = getJXONTree(aTmpEls[nElId]); - if (vResult.hasOwnProperty(sProp)) { - if (vResult[sProp].constructor !== Array) { vResult[sProp] = [vResult[sProp]]; } - vResult[sProp].push(vContent); - } else { vResult[sProp] = vContent; nLength++; } - } - - aTmpEls.length = nLevelStart; - - if (nLength === 0) { vResult = sCollectedTxt ? vBuiltVal : /* put here the default value for empty nodes: */ true; } - /* else { Object.freeze(vResult); } */ - - return vResult; -} - -var myObject = getJXONTree(doc); -alert(myObject.catalog.product.catalog_item[1].size.color_swatch["@image"]); // "black_cardigan.jpg" -alert(myObject.catalog.product.catalog_item[1].size.color_swatch); // "Black" ! -</pre> - -<p> </p> - -<div class="note"><strong>注意：</strong>如果你想冻结整个对象树（因为XML文档的“静态”性质），取消注释字符串：<code>/* Object.freeze(this); */</code>。 <code><a href="/en/JavaScript/Reference/Global_Objects/Object/freeze" title="en/JavaScript/Reference/Global_Objects/Object/freeze">Object.freeze()</a></code>方法防止将新属性添加到该属性中，防止现有属性被删除，并防止现有属性或其可枚举性，可配置性或可写性发生更改。本质上，对象树是有效的不可变的。</div> - -<p>如果您知道XML文档的结构，这是一种可能的技术。</p> - -<p> </p> - -<h3 id="反向算法">反向算法</h3> - -<p>为了从JavaScript对象树开始构建一个新的XML文档，可以将这里提出的算法颠倒过来。为了简单，我们将在这里提出一个例子，在一个单一的方法，代表了所有我们的算法的反演。</p> - -<pre class="brush: js">/*\ -|*| -|*| JXON Snippet #5 - Mozilla Developer Network -|*| -|*| https://developer.mozilla.org/en-US/docs/JXON -|*| https://developer.mozilla.org/User:fusionchess -|*| -|*| This framework is released under the GNU Public License, version 3 or later. -|*| http://www.gnu.org/licenses/gpl-3.0-standalone.html -|*| -\*/ - -function createXML (oObjTree) { - function loadObjTree (oParentEl, oParentObj) { - var vValue, oChild; - if (oParentObj.constructor === String || oParentObj.constructor === Number || oParentObj.constructor === Boolean) { - oParentEl.appendChild(oNewDoc.createTextNode(oParentObj.toString())); /* verbosity level is 0 or 1 */ - if (oParentObj === oParentObj.valueOf()) { return; } - } else if (oParentObj.constructor === Date) { - oParentEl.appendChild(oNewDoc.createTextNode(oParentObj.toGMTString())); - } - for (var sName in oParentObj) { - if (isFinite(sName)) { continue; } /* verbosity level is 0 */ - vValue = oParentObj[sName]; - if (sName === "keyValue") { - if (vValue !== null && vValue !== true) { oParentEl.appendChild(oNewDoc.createTextNode(vValue.constructor === Date ? vValue.toGMTString() : String(vValue))); } - } else if (sName === "keyAttributes") { /* verbosity level is 3 */ - for (var sAttrib in vValue) { oParentEl.setAttribute(sAttrib, vValue[sAttrib]); } - } else if (sName.charAt(0) === "@") { - oParentEl.setAttribute(sName.slice(1), vValue); - } else if (vValue.constructor === Array) { - for (var nItem = 0; nItem < vValue.length; nItem++) { - oChild = oNewDoc.createElement(sName); - loadObjTree(oChild, vValue[nItem]); - oParentEl.appendChild(oChild); - } - } else { - oChild = oNewDoc.createElement(sName); - if (vValue instanceof Object) { - loadObjTree(oChild, vValue); - } else if (vValue !== null && vValue !== true) { - oChild.appendChild(oNewDoc.createTextNode(vValue.toString())); - } - oParentEl.appendChild(oChild); - } - } - } - const oNewDoc = document.implementation.createDocument("", "", null); - loadObjTree(oNewDoc, oObjTree); - return oNewDoc; -} - -var newDoc = createXML(myObject); -// we got our Document instance! try: alert((new XMLSerializer()).serializeToString(newDoc)); -</pre> - -<div class="note"><strong>注意：</strong>通过这个代码，<code>Date</code>实例（如果存在的话）通过<a href="/en/JavaScript/Reference/Global_Objects/Date/toGMTString" title="toGMTString"><code>toGMTString()</code></a> 方法转换为 <a href="/en/JavaScript/Reference/Global_Objects/String" title="String">Strings</a> 。没有什么禁止使用任何其他转换方法。此外，具有<code>true</code>值的树的所有属性都将被转换为没有文本节点的空元素（请参阅 <a href="#Code_considerations" title="Code considerations">Code considerations</a>）。</div> - -<p>如果要自动创建XML文档，这是一个很好的解决方案。但是，如果要重新构建以前转换为JSON的XML文档，这是一个不错的选择。虽然<strong>双向转换是非常忠实的</strong>（除了<a href="/zh-CN/docs/Web/API/CDATASection" title="CDATASection 接口用来表示 CDATA 部分，这一部分可以被使用在XML中， CDATA可以包含那些没有转义字符的文本, 这些没有转义的字符包括但不限于 < 和 & ，他们不需要被转义，但在XML中使用时，保持原样就可以了。"><code>CDATASection</code></a>节点，它们将被转换成文本节点），但这个过程是不必要的成本。事实上，如果您的目标是编辑XML文档，强烈建议您使用它而不是创建一个新的。</p> - -<h2 id="The_Parker_Convention">The Parker Convention</h2> - -<p>上面列出的用于将XML文档转换为<a href="/en/JSON" title="en/JSON">JSON</a>（通常称为“JXON算法”）的功能或多或少地基于Parker公约（尤其是关于将标签名称转换为对象属性名称，识别所有收集到的每个标签的文本内容以及单独的<code>Text</code>和/或<code>CDATASection</code>节点吸收为原始值）。It is called “Parker Convention” in opposition to “BadgerFish Convention”, after the comic Parker & Badger by Cuadrado. See also: <a href="http://badgerfish.ning.com/" title="BadgerFish convention">BadgerFish Convention</a>.</p> - -<p>以下是来自 <a href="http://code.google.com/p/xml2json-xslt/" title="xml2json-xslt project">xml2json-xslt</a>项目网站的“<a href="http://code.google.com/p/xml2json-xslt/wiki/TransformingRules" title="TransformingRules – xml2json-xslt">TransformingRules</a>”页面的Parker Convention文章（版本0.4）的转录。</p> - -<p>本公约是为了规范从<a href="/en/XSLT" title="en/XSLT">XSLT</a>到 <a href="/en/JSON" title="en/JSON">JSON</a> 的转换而编写的，所以它的一部分对于JavaScript来说是徒劳的。</p> - -<div class="note"><strong>注意：</strong>2013年10月29日，万维网联盟（World Wide Web Consortium）在一篇关于将<a href="/zh-CN/docs/Web/HTML/Global_attributes#itemid">HTML5微数据</a>转换为<em><a href="/en/JSON" title="en/JSON">JSON</a></em>的官方算法的备注中转载。但是，HTML微数据不是HTML：微数据是HTML的格式化子集。</div> - -<h3 id="Translation_JSON">Translation JSON</h3> - -<ol> - <li> - <p>The root element will be absorbed, for there is only one:</p> - - <pre class="brush: xml"><root>test</root></pre> - - <p>becomes</p> - - <pre class="brush: js">"test" -</pre> - </li> - <li> - <p>Element names become object properties:</p> - - <pre class="brush: xml"><root><name>Xml</name><encoding>ASCII</encoding></root></pre> - - <p>becomes</p> - - <pre class="brush: js">{ - "name": "Xml", - "encoding": "ASCII" -} -</pre> - </li> - <li> - <p>Numbers are recognized (integers and decimals):</p> - - <pre class="brush: xml"><root><age>12</age><height>1.73</height></root></pre> - - <p>becomes</p> - - <pre class="brush: js">{ - "age": 12, - "height": 1.73 -} -</pre> - </li> - <li> - <p>Booleans are recognized case insensitive:</p> - - <pre class="brush: xml"><root><checked>True</checked><answer>FALSE</answer></root></pre> - - <p>becomes</p> - - <pre class="brush: js">{ - "checked": true, - "answer": false -} -</pre> - </li> - <li> - <p>Strings are escaped:</p> - - <pre class="brush: xml"><root>Quote: &quot; New-line: -</root> -</pre> - - <p>becomes</p> - - <pre class="brush: js">"Quote: \" New-line:\n"</pre> - </li> - <li> - <p>Empty elements will become null:</p> - - <pre class="brush: xml"><root><nil/><empty></empty></root></pre> - - <p>becomes</p> - - <pre class="brush: js">{ - "nil": null, - "empty": null -} -</pre> - </li> - <li> - <p>If all sibling elements have the same name, they become an array</p> - - <pre class="brush: xml"><root><item>1</item><item>2</item><item>three</item></root> -</pre> - - <p>becomes</p> - - <pre class="brush: js">[1, 2, "three"] -</pre> - </li> - <li> - <p>Mixed mode text-nodes, comments and attributes get absorbed:</p> - - <pre class="brush: xml"><root version="1.0">testing<!--comment--><element test="true">1</element></root> -</pre> - - <p>becomes</p> - - <pre class="brush: js">{ "element": true } -</pre> - </li> - <li> - <p>Namespaces get absorbed, and prefixes will just be part of the property name:</p> - - <pre class="brush: xml"><root xmlns:ding="http://zanstra.com/ding"><ding:dong>binnen</ding:dong></root> -</pre> - - <p>becomes</p> - - <pre class="brush: js">{ "ding:dong" : "binnen" } -</pre> - </li> -</ol> - -<div class="note"><strong>注意：</strong>我们的算法符合第2,3,4和7点。第三和第四个算法也符合第6点（但是<code>true</code>而不是<code>null</code> - 请参阅<a href="#Code_considerations" title="Code considerations">Code considerations</a>）。第5点由JavaScript方法<code><a href="/en/JavaScript/Reference/Global_Objects/JSON/stringify" title="en/JavaScript/Reference/Global_Objects/JSON/stringify">JSON.stringify()</a></code>自动管理。关于第9点，我们选择忽略所有有前缀的节点;你可以通过从我们的算法中删除字符串<code>&& !oNode.prefix</code>来包含它们（参见 <a href="#Code_considerations" title="Code considerations">Code considerations</a>)）。</div> - -<h3 id="额外的JavaScript转换">额外的JavaScript转换</h3> - -<p>This is the same as the JSON translation, but with these extras:</p> - -<ol> - <li> - <p>Property names are only escaped when necessary</p> - - <pre class="brush: xml"><root><while>true</while><wend>false</wend><only-if/></root> -</pre> - - <p>becomes</p> - - <pre class="brush: js">{ - "while": true, - wend: false, - "only-if": null -} -</pre> - </li> - <li> - <p>Within a string, closing elements "</" are escaped as "<\/"</p> - - <pre class="brush: xml"><root><![CDATA[<script>alert("YES");</script>]]></root></pre> - - <p>becomes</p> - - <pre class="brush: js">{ script: "<script>alert(\"YES\")<\/script>" } -</pre> - </li> - <li> - <p>Dates are created as new <a href="/en/JavaScript/Reference/Global_Objects/Date" title="Date"><code>Date</code></a> objects</p> - - <pre class="brush: xml"><root>2006-12-25</root></pre> - - <p>becomes</p> - - <pre class="brush: js">new Date(2006, 12 - 1, 25) -</pre> - </li> - <li> - <p>Attributes and comments are shown as comments (for testing purposes):</p> - - <pre class="brush: xml"><!--testing--><root><test version="1.0">123</test></root> -</pre> - - <p>becomes</p> - - <pre class="brush: js">/* testing */ { test /* @version = "1.0" */ : 123} -</pre> - </li> - <li> - <p>A bit of indentation is done, to keep things legible</p> - </li> -</ol> - -<div class="note"><strong>注意：</strong>我们的算法符合第3点（但没有减少月份）。点1和2自动由JavaScript方法 <code><a href="/en/JavaScript/Reference/Global_Objects/JSON/stringify" title="en/JavaScript/Reference/Global_Objects/JSON/stringify">JSON.stringify()</a></code>进行管理。</div> - -<h2 id="In_summary">In summary</h2> - -<p>我们以<a href="/zh-CN/docs/Archive/JXON#Algorithm_.233.3A_a_synthetic_technique">第三种算法</a>作为<strong>最具代表性的JXON解析算法</strong>。单个结构化XML元素可能有八种不同的配置：</p> - -<ol> - <li>an empty element,</li> - <li>an element with pure text content,</li> - <li>an empty element with attributes,</li> - <li>an element with text content and attributes,</li> - <li>an element containing elements with different names,</li> - <li>an element containing elements with identical names,</li> - <li>an element containing elements and contiguous text,</li> - <li>an element containing elements and non contiguous text.</li> -</ol> - -<p>The following table shows the corresponding conversion patterns between XML and JSON according to the <a href="#Algorithm_.233.3A_a_synthetic_technique" title="Go to JXON algorithm #3">third algorithm</a>.</p> - -<table> - <thead> - <tr> - <th style="background: #faf9e2; color: #5d5636; text-align: center;"><strong>Case</strong></th> - <th style="background: #faf9e2; color: #5d5636; text-align: center;"><strong>XML</strong></th> - <th style="background: #faf9e2; color: #5d5636; text-align: center;"><strong>JSON</strong></th> - <th style="background: #faf9e2; color: #5d5636; text-align: center;"><strong>Javascript access</strong></th> - </tr> - </thead> - <tbody> - <tr> - <td style="background: #f6f6f6; color: #000000;">1</td> - <td style="background: #f6f6f6; color: #000000;"><code><animal /></code></td> - <td style="background: #f6f6f6; color: #000000;"><code>"animal": true</code></td> - <td style="background: #f6f6f6; color: #000000;"><code>myObject.animal</code></td> - </tr> - <tr> - <td style="background: #e7e5dc; color: #silver;">2</td> - <td style="background: #e7e5dc; color: #silver;"><code><animal>Deka</animal></code></td> - <td style="background: #e7e5dc; color: #silver;"><code>"animal": "Deka"</code></td> - <td style="background: #e7e5dc; color: #silver;"><code>myObject.animal</code></td> - </tr> - <tr> - <td style="background: #f6f6f6; color: #000000;">3</td> - <td style="background: #f6f6f6; color: #000000;"><code><animal name="Deka" /></code></td> - <td style="background: #f6f6f6; color: #000000;"><code>"animal": {"@name": "Deka"}</code></td> - <td style="background: #f6f6f6; color: #000000;"><code>myObject.animal["@name"]</code></td> - </tr> - <tr> - <td style="background: #e7e5dc; color: #silver;">4</td> - <td style="background: #e7e5dc; color: #silver;"><code><animal name="Deka">is my cat</animal></code></td> - <td style="background: #e7e5dc; color: #silver;"><code>"animal": { "@name": "Deka", "keyValue": "is my cat" }</code></td> - <td style="background: #e7e5dc; color: #silver;"><code>myObject.animal["@name"]</code>, <code>myObject.animal.keyValue</code></td> - </tr> - <tr> - <td style="background: #f6f6f6; color: #000000;">5</td> - <td style="background: #f6f6f6; color: #000000;"><code><animal> <dog>Charlie</dog> <cat>Deka</cat> </animal></code></td> - <td style="background: #f6f6f6; color: #000000;"><code>"animal": { "dog": "Charlie", "cat": "Deka" }</code></td> - <td style="background: #f6f6f6; color: #000000;"><code>myObject.animal.dog</code>, <code>myObject.animal.cat</code></td> - </tr> - <tr> - <td style="background: #e7e5dc; color: #silver;">6</td> - <td style="background: #e7e5dc; color: #silver;"><code><animal> <dog>Charlie</dog> <dog>Mad Max</dog> </animal></code></td> - <td style="background: #e7e5dc; color: #silver;"><code>"animal": { "dog": ["Charlie", "Mad Max"] }</code></td> - <td style="background: #e7e5dc; color: #silver;"><code>myObject.animal.dog[0]</code>, <code>myObject.animal.dog[1]</code></td> - </tr> - <tr> - <td style="background: #f6f6f6; color: #000000;">7</td> - <td style="background: #f6f6f6; color: #000000;"><code><animal> in my house <dog>Charlie</dog> </animal></code></td> - <td style="background: #f6f6f6; color: #000000;"><code>"animal": { "keyValue": "in my house", "dog": "Charlie" }</code></td> - <td style="background: #f6f6f6; color: #000000;"><code>myObject.animal.keyValue</code>, <code>myObject.animal.dog</code></td> - </tr> - <tr> - <td style="background: #e7e5dc; color: #silver;">8</td> - <td style="background: #e7e5dc; color: #silver;"><code><animal> in my ho <dog>Charlie</dog> use </animal></code></td> - <td style="background: #e7e5dc; color: #silver;"><code>"animal": { "keyValue": "in my house", "dog": "Charlie" }</code></td> - <td style="background: #e7e5dc; color: #silver;"><code>myObject.animal.keyValue</code>, <code>myObject.animal.dog</code></td> - </tr> - </tbody> -</table> - -<h2 id="Code_considerations">Code considerations</h2> - -<p>In these examples we chose to use a property named <code>keyValue</code> for the text content. The lack of standards for XML to JSON conversion leads developers to choose a variety of property names for the text content of XML <a href="/zh-CN/docs/Web/API/Element" title="Element（元素）接口是 Document的一个对象. 这个接口描述了所有相同种类的元素所普遍具有的方法和属性。 这些继承自Element并且增加了一些额外功能的接口描述了具体的行为. 例如, HTMLElement 接口是所有HTML元素的基础接口， 而 SVGElement 接口是所有SVG元素的基本接口."><code>Element</code></a> nodes that also contain other child nodes. Sometimes a property called <code>$</code> is used. Other times a property called <code>#text</code> is used (however, a name like this isn't a good choice, since the text content of a node can be parsed into a non-string value by our algorithms during the conversion). In the algorithms proposed here, you can easily change this name, depending on your needs.</p> - -<p>The choice of using a <code>true</code> value instead of a <code>null</code> value to represent empty nodes is due to the fact that <strong>when in an XML document there is an empty node the reason is often to express a<em> <code>Boolean</code></em></strong>, as in this case:</p> - -<pre class="brush: xml"><car> - <type>Ferrari</type> - <bought /> -</car> -</pre> - -<p>If the value were <code>null</code> it would be more cumbersome to launch a code like this:</p> - -<pre class="brush: js">if (myObject.car.bought) { - // do something -} -</pre> - -<div class="note"><strong>Note:</strong> According to our <a href="#Algorithm_.233.3A_a_synthetic_technique" title="Go to JXON algorithm #3">third algorithm</a> and our <a href="#Algorithm_.234.3A_a_very_minimalist_way" title="Go to JXON algorithm #4">fourth algorithm</a>, just <code>CDATASection</code> nodes which contain nothing but white spaces (precisely: <code>/^\s+$/</code>) will be parsed as <code>null</code>.</div> - -<p>The <a href="#Algorithm_.234.3A_a_very_minimalist_way" title="Go to JXON algorithm #4">fourth algorithm</a> represents a <strong>special case of conversion</strong>. As you can see, <strong>the generated JavaScript Object tree is not <a href="/en/JavaScript/Reference/Global_Objects/JSON/stringify" title="en/JavaScript/Reference/Global_Objects/JSON/stringify">stringifyable</a></strong>. It is very practical for internal JavaScript access, but don't use it if you want to transfer the tree via JSON string (as for <code><a href="/en/DOM/Worker" title="en/DOM/Worker">Worker</a></code> messages, for example).</p> - -<p>We chose to <strong>ignore nodes which have a prefix</strong> (for example: <code><ding:dong>binnen</ding:dong></code>), due to their special case (they are often used in order to represents an <a href="http://www.w3.org/TR/xmlschema-ref/" title="W3C XML Schema Definition Language (XSD): Component Designators">XML Schema</a>, which is <em>meta-information</em> concerning how to organize the <em>information</em> of the document, reserved for the XML parser). You can include them removing the string <code>&& !oNode.prefix</code> from our algorithms (by doing so the whole tag will become the property name: <code>{ "ding:dong": "binnen" }</code>).</p> - -<p>An important consideration is that, when using the <a href="#Algorithm_.233.3A_a_synthetic_technique" title="Go to JXON algorithm #3">third</a> or the <a href="#Algorithm_.234.3A_a_very_minimalist_way" title="Go to JXON algorithm #4">fourth</a> algorithm, an XML <a href="/zh-CN/docs/Web/API/Document" title="Document 接口提供了一些在浏览器服务中作为页面内容入口点而加载的一些页面，也就是 DOM 树。 DOM 树包括诸如 <body> 和 <table> 之类的元素，及其他元素。其也为文档（document）提供了全局性的函数，例如获取页面的 URL、在文档中创建新的 element 的函数。"><code>Document</code></a> can be used to create any type of JavaScript object. For example, If you want to create an object like the following:</p> - -<pre class="brush: js">{ - "myboolean": true, - "myarray": ["Cinema", "Hot dogs", false], - "myobject": { - "nickname": "Jack", - "registration_date": new Date(1995, 11, 25), - "privileged_user": true - }, - "mynumber": 99, - "mytext": "Hello World!" -} -</pre> - -<p>you must just create an XML document with the following structure:</p> - -<pre class="brush: xml"><myboolean>true</myboolean> -<myarray>Cinema</myarray> -<myarray>Hot dogs</myarray> -<myarray>false</myarray> -<myobject> - <nickname>Jack</nickname> - <registration_date>Dec 25, 1995</registration_date> - <privileged_user /> -</myobject> -<mynumber>99</mynumber> -<mytext>Hello World!</mytext> -</pre> - -<p>This example also shows how the ideal JXON document is an XML document designed specifically to be converted in JSON format, though <em>our algorithms work fine with any kind of XML document</em>.</p> - -<div class="note" id="ordering-lossless-note"><strong>Note:</strong> Despite the term JXON suggesting "lossless" conversions, these techniques are not actually lossless if one needs to preserve <strong>ordering of elements</strong>, as is common with many XML dialects (including of course <a href="/en-US/docs/XHTML" title="/en-US/docs/XHTML">XHTML</a>). The ECMAScript standard (JavaScript) indicates that object iteration order is <em>implementation dependent</em>.</div> - -<h2 id="Appendix_a_complete_bidirectional_JXON_library">Appendix: a complete, bidirectional, JXON library</h2> - -<p>Now we can create a more complete, bidirectional, JXON library based on <strong>all</strong> our algorithms (see: <a href="#Algorithm_.231.3A_a_verbose_way" title="Go to JXON algorithm #1">#1</a>, <a href="#Algorithm_.232.3A_a_less_verbose_way" title="Go to JXON algorithm #2">#2</a>, <a href="#Algorithm_.233.3A_a_synthetic_technique" title="Go to JXON algorithm #3">#3</a>, <a href="#Algorithm_.234.3A_a_very_minimalist_way" title="Go to JXON algorithm #4">#4</a>, <a href="#Reverse_algorithms" title="Reverse algorithms">reverse</a>). Its usage is modeled on the <a href="/en/JavaScript/Reference/Global_Objects/JSON" title="en/JavaScript/Reference/Global_Objects/JSON"><code>JSON</code></a> native object. <strong>Before implementing it in a working environment, please read the <a href="#const_compatibility" title="#const_compatibility">note about the <code>const</code> statement compatibility</a></strong>. The following code is also <a class="external external-icon" href="https://github.com/madmurphy/jxon.js">available on GitHub</a>.</p> - -<pre class="brush: js">"use strict"; - -/*\ -|*| -|*| JXON framework - Copyleft 2011 by Mozilla Developer Network -|*| -|*| Revision #3 - October 31th, 2016 -|*| -|*| https://developer.mozilla.org/en-US/docs/JXON -|*| https://developer.mozilla.org/User:fusionchess -|*| https://github.com/madmurphy/jxon.js -|*| -|*| This framework is released under the GNU Public License, version 3 or later. -|*| http://www.gnu.org/licenses/gpl-3.0-standalone.html -|*| -\*/ - -const JXON = new (function () { - - function parseText (sValue) { - if (rIsNull.test(sValue)) { return null; } - if (rIsBool.test(sValue)) { return sValue.toLowerCase() === "true"; } - if (isFinite(sValue)) { return parseFloat(sValue); } - if (isFinite(Date.parse(sValue))) { return new Date(sValue); } - return sValue; - } - - function EmptyTree () {} - - EmptyTree.prototype.toString = function () { return "null"; }; - - EmptyTree.prototype.valueOf = function () { return null; }; - - function objectify (vVal) { - return vVal === null ? new EmptyTree() : vVal instanceof Object ? vVal : new vVal.constructor(vVal); - } - - function createObjTree (oParentNode, nVerb, bFreeze, bNesteAttr) { - - const - nLevelStart = aCache.length, bChildren = oParentNode.hasChildNodes(), - bAttributes = oParentNode.hasAttributes && oParentNode.hasAttributes(), bHighVerb = Boolean(nVerb & 2); - - var - sProp, vContent, nLength = 0, sCollectedTxt = "", - vResult = bHighVerb ? {} : /* put here the default value for empty nodes: */ true; - - if (bChildren) { - for (var oNode, nItem = 0; nItem < oParentNode.childNodes.length; nItem++) { - oNode = oParentNode.childNodes.item(nItem); - if (oNode.nodeType === 4) { sCollectedTxt += oNode.nodeValue; } /* nodeType is "CDATASection" (4) */ - else if (oNode.nodeType === 3) { sCollectedTxt += oNode.nodeValue.trim(); } /* nodeType is "Text" (3) */ - else if (oNode.nodeType === 1 && !oNode.prefix) { aCache.push(oNode); } /* nodeType is "Element" (1) */ - } - } - - const nLevelEnd = aCache.length, vBuiltVal = parseText(sCollectedTxt); - - if (!bHighVerb && (bChildren || bAttributes)) { vResult = nVerb === 0 ? objectify(vBuiltVal) : {}; } - - for (var nElId = nLevelStart; nElId < nLevelEnd; nElId++) { - sProp = aCache[nElId].nodeName.toLowerCase(); - vContent = createObjTree(aCache[nElId], nVerb, bFreeze, bNesteAttr); - if (vResult.hasOwnProperty(sProp)) { - if (vResult[sProp].constructor !== Array) { vResult[sProp] = [vResult[sProp]]; } - vResult[sProp].push(vContent); - } else { - vResult[sProp] = vContent; - nLength++; - } - } - - if (bAttributes) { - - const - nAttrLen = oParentNode.attributes.length, - sAPrefix = bNesteAttr ? "" : sAttrsPref, oAttrParent = bNesteAttr ? {} : vResult; - - for (var oAttrib, nAttrib = 0; nAttrib < nAttrLen; nLength++, nAttrib++) { - oAttrib = oParentNode.attributes.item(nAttrib); - oAttrParent[sAPrefix + oAttrib.name.toLowerCase()] = parseText(oAttrib.value.trim()); - } - - if (bNesteAttr) { - if (bFreeze) { Object.freeze(oAttrParent); } - vResult[sAttrProp] = oAttrParent; - nLength -= nAttrLen - 1; - } - - } - - if (nVerb === 3 || (nVerb === 2 || nVerb === 1 && nLength > 0) && sCollectedTxt) { - vResult[sValProp] = vBuiltVal; - } else if (!bHighVerb && nLength === 0 && sCollectedTxt) { - vResult = vBuiltVal; - } - - if (bFreeze && (bHighVerb || nLength > 0)) { Object.freeze(vResult); } - - aCache.length = nLevelStart; - - return vResult; - - } - - function loadObjTree (oXMLDoc, oParentEl, oParentObj) { - - var vValue, oChild; - - if (oParentObj.constructor === String || oParentObj.constructor === Number || oParentObj.constructor === Boolean) { - oParentEl.appendChild(oXMLDoc.createTextNode(oParentObj.toString())); /* verbosity level is 0 or 1 */ - if (oParentObj === oParentObj.valueOf()) { return; } - } else if (oParentObj.constructor === Date) { - oParentEl.appendChild(oXMLDoc.createTextNode(oParentObj.toGMTString())); - } - - for (var sName in oParentObj) { - vValue = oParentObj[sName]; - if (isFinite(sName) || vValue instanceof Function) { continue; } /* verbosity level is 0 */ - if (sName === sValProp) { - if (vValue !== null && vValue !== true) { oParentEl.appendChild(oXMLDoc.createTextNode(vValue.constructor === Date ? vValue.toGMTString() : String(vValue))); } - } else if (sName === sAttrProp) { /* verbosity level is 3 */ - for (var sAttrib in vValue) { oParentEl.setAttribute(sAttrib, vValue[sAttrib]); } - } else if (sName.charAt(0) === sAttrsPref) { - oParentEl.setAttribute(sName.slice(1), vValue); - } else if (vValue.constructor === Array) { - for (var nItem = 0; nItem < vValue.length; nItem++) { - oChild = oXMLDoc.createElement(sName); - loadObjTree(oXMLDoc, oChild, vValue[nItem]); - oParentEl.appendChild(oChild); - } - } else { - oChild = oXMLDoc.createElement(sName); - if (vValue instanceof Object) { - loadObjTree(oXMLDoc, oChild, vValue); - } else if (vValue !== null && vValue !== true) { - oChild.appendChild(oXMLDoc.createTextNode(vValue.toString())); - } - oParentEl.appendChild(oChild); - } - } - - } - - /* Uncomment the following code if you want to enable the .appendJXON() method for *all* the "element" objects! */ - - /* - - Element.prototype.appendJXON = function (oObjTree) { - loadObjTree(document, this, oObjTree); - return this; - }; - - */ - - this.build = function (oXMLParent, nVerbosity /* optional */, bFreeze /* optional */, bNesteAttributes /* optional */) { - const nVerbMask = arguments.length > 1 && typeof nVerbosity === "number" ? nVerbosity & 3 : /* put here the default verbosity level: */ 1; - return createObjTree(oXMLParent, nVerbMask, bFreeze || false, arguments.length > 3 ? bNesteAttributes : nVerbMask === 3); - }; - - this.unbuild = function (oObjTree, sNamespaceURI /* optional */, sQualifiedName /* optional */, oDocumentType /* optional */) { - const oNewDoc = document.implementation.createDocument(sNamespaceURI || null, sQualifiedName || "", oDocumentType || null); - loadObjTree(oNewDoc, oNewDoc, oObjTree); - return oNewDoc; - }; - - const - sValProp = "keyValue", sAttrProp = "keyAttributes", sAttrsPref = "@", /* you can customize these values */ - aCache = [], rIsNull = /^\s*$/, rIsBool = /^(?:true|false)$/i; - -})(); -</pre> - -<div class="note" id="const_compatibility"><strong>Note:</strong> The current implementation of <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> (constant statement) <strong>is not part of ECMAScript 5</strong>. It is supported in Firefox & Chrome (V8) and partially supported in Opera 9+ and Safari. <strong>It is not supported in Internet Explorer 6-9, or in the preview of Internet Explorer 10</strong>. <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> is going to be defined by ECMAScript 6, but with different semantics. Similar to variables declared with the <a href="/en/JavaScript/Reference/Statements/let" title="en/JavaScript/Reference/Statements/let"><code>let</code></a> statement, constants declared with <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> will be block-scoped. <strong>We used it only for didactic purpose. If you want a full browser compatibility of this library, please replace all the <a href="/en/JavaScript/Reference/Statements/const" title="en/JavaScript/Reference/Statements/const"><code>const</code></a> statements with the <a href="/en/JavaScript/Reference/Statements/var" title="en/JavaScript/Reference/Statements/var"><code>var</code></a> statements.</strong></div> - -<h3 id="Usage">Usage</h3> - -<p>The obtained non-native <code>JXON</code> global object will have two methods:</p> - -<table class="fullwidth-table"> - <tbody> - <tr> - <th>Method</th> - <th>Description</th> - </tr> - <tr> - <td><a href="#JXON.build_syntax" title="JXON.build"><code>JXON.build(<em>document</em>[, <em>verbosity</em>[, <em>freeze</em>[, <em>nesteAttributes</em>]]])</code></a></td> - <td>Returns a JavaScript <a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/JavaScript/Reference/Global_Objects/Object"><code>Object</code></a> based on the given XML Document.</td> - </tr> - <tr> - <td><a href="#JXON.unbuild_syntax" title="JXON.unbuild"><code>JXON.unbuild(<em>objTree</em>[, <em>namespaceURI</em>[, <em>qualifiedNameStr</em>[, <em>documentType</em>]]])</code></a></td> - <td>Returns an XML <a href="/zh-CN/docs/Web/API/Document" title="Document 接口提供了一些在浏览器服务中作为页面内容入口点而加载的一些页面，也就是 DOM 树。 DOM 树包括诸如 <body> 和 <table> 之类的元素，及其他元素。其也为文档（document）提供了全局性的函数，例如获取页面的 URL、在文档中创建新的 element 的函数。"><code>Document</code></a> based on the given JavaScript <a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/JavaScript/Reference/Global_Objects/Object"><code>Object</code></a>.</td> - </tr> - </tbody> -</table> - -<p>These methods are inverses of each other. So, you can work with the <code>JXON</code> object by inserting the previous code at the beginning of your scripts. If you are not interested in a bidirectional conversion, don't use it, use only one of our algotithm instead.</p> - -<p>Sample usage:</p> - -<pre class="brush: js">var myObject = JXON.build(doc); -// we got our javascript object! try: alert(JSON.stringify(myObject)); - -var newDoc = JXON.unbuild(myObject); -// we got our Document instance! try: alert((new XMLSerializer()).serializeToString(newDoc));</pre> - -<p>…the same thing using AJAX:</p> - -<pre class="brush: js">function reqListener () { - - var myObject = JXON.build(this.responseXML); - // we got our javascript object! - alert(JSON.stringify(myObject)); - - var newDoc = JXON.unbuild(myObject); - // we got our Document instance! - alert((new XMLSerializer()).serializeToString(newDoc)); - -}; - -var oReq = new XMLHttpRequest(); -oReq.onload = reqListener; -oReq.open("get", "example.xml", true); -oReq.send();</pre> - -<h4 id="JXON.build_syntax">JXON.build syntax</h4> - -<p><code>JXON.build(<a href="#JXON_build-document" title="JXON.build – @document"><em>document</em></a>[, <a href="#JXON_build-verbosity" title="JXON.build – @verbosity"><em>verbosity</em></a>[, <a href="#JXON_build-freeze" title="JXON.build – @freeze"><em>freeze</em></a>[, <a href="#JXON_build-nesteAttributes" title="JXON.build – @nesteAttributes"><em>nesteAttributes</em></a>]]])</code></p> - -<h4 id="JXON.build_description">JXON.build description</h4> - -<p>Returns a JavaScript <a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/JavaScript/Reference/Global_Objects/Object"><code>Object</code></a> based on the given XML Document.</p> - -<h4 id="JXON.build_parameters">JXON.build parameters</h4> - -<dl> - <dt><code id="JXON_build-document">document</code></dt> - <dd>The XML document to be converted into JSON format.</dd> - <dt><code id="JXON_build-verbosity">verbosity</code> <span class="inlineIndicator optional optionalInline">Optional</span></dt> - <dd>The verbosity level of conversion (optional), from <code>0</code> to <code>3</code>. It is almost equivalent to our algorithms from <a href="#Algorithm_.234.3A_a_very_minimalist_way" title="Go to JXON algorithm #4">#4</a> to <a href="#Algorithm_.231.3A_a_verbose_way" title="Go to JXON algorithm #1">#1</a> (default value is <code>1</code>, which is equivalent to the <a href="#Algorithm_.233.3A_a_synthetic_technique" title="Go to JXON algorithm #3">algorithm #3</a>).</dd> - <dt><code id="JXON_build-freeze">freeze</code> <span class="inlineIndicator optional optionalInline">Optional</span></dt> - <dd>A boolean (optional) expressing whether the created object must be <a href="/en/JavaScript/Reference/Global_Objects/Object/freeze" title="en/JavaScript/Reference/Global_Objects/Object/freeze">freezed</a> or not (default value is <code>false</code>).</dd> - <dt><code id="JXON_build-nesteAttributes">nesteAttributes</code> <span class="inlineIndicator optional optionalInline">Optional</span></dt> - <dd>A boolean (optional) expressing whether the the <code>nodeAttributes</code> must be nested into a child-object named <code>keyAttributes</code> or not (default value is <code>false</code> for verbosity levels from <code>0</code> to <code>2</code>; <code>true</code> for verbosity level <code>3</code>).</dd> -</dl> - -<h4 id="JXON.unbuild_syntax">JXON.unbuild syntax</h4> - -<p><code>JXON.unbuild(<a href="#JXON_unbuild-objTree" title="JXON.unbuild – @objTree"><em>objTree</em></a>[, <a href="#JXON_unbuild-namespaceURI" title="JXON.unbuild – @namespaceURI"><em>namespaceURI</em></a>[, <a href="#JXON_unbuild-qualifiedNameStr" title="JXON.unbuild – @qualifiedNameStr"><em>qualifiedNameStr</em></a>[, <a href="#JXON_unbuild-documentType" title="JXON.unbuild – @objTree"><em>documentType</em></a>]]])</code></p> - -<h4 id="JXON.unbuild_description">JXON.unbuild description</h4> - -<p>Returns an XML Document based on the given JavaScript <a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/JavaScript/Reference/Global_Objects/Object"><code>Object</code></a>.</p> - -<h4 id="JXON.unbuild_parameters">JXON.unbuild parameters</h4> - -<dl> - <dt><code id="JXON_unbuild-objTree">objTree</code></dt> - <dd>The JavaScript Object from which you want to create your XML Document.</dd> - <dt><code id="JXON_unbuild-namespaceURI">namespaceURI</code> <span class="inlineIndicator optional optionalInline">Optional</span></dt> - <dd>Is a <a href="https://developer.mozilla.org/en-US/docs/Web/API/DOMString" title="A UTF-16 String. As JavaScript already uses such strings, DOMString is mapped directly to a String."><code>DOMString</code></a> containing the namespace URI of the document to be created, or <code>null</code> if the document doesn't belong to one.</dd> - <dt><code id="JXON_unbuild-qualifiedNameStr">qualifiedNameStr</code> <span class="inlineIndicator optional optionalInline">Optional</span></dt> - <dd>Is a <a href="https://developer.mozilla.org/en-US/docs/Web/API/DOMString" title="A UTF-16 String. As JavaScript already uses such strings, DOMString is mapped directly to a String."><code>DOMString</code></a> containing the qualified name, that is an optional prefix and colon plus the local root element name, of the document to be created.</dd> - <dt><code id="JXON_unbuild-documentType">documentType</code> <span class="inlineIndicator optional optionalInline">Optional</span></dt> - <dd>Is the <a class="internal" href="https://developer.mozilla.org/En/DOM/DocumentType" title="En/DOM/DocumentType"><code>DocumentType</code></a> of the document to be created. It defaults to <code>null</code>.</dd> -</dl> - -<h3 id="Extend_the_native_Element.prototype_object">Extend the native <code><a href="/en-US/docs/Web/API/element" title="/en-US/docs/Web/API/element">Element</a>.prototype</code> object</h3> - -<p>If you want to enable the <code>.appendJXON()</code> method for all the native <a href="/en-US/docs/Web/API/element"><code>element</code></a> objects, you can uncomment the following code from the JXON library:</p> - -<pre class="brush: js"> /* Uncomment the following code if you want to enable the .appendJXON() method for *all* the "element" objects! */ - - /* - - Element.prototype.appendJXON = function (oObjTree) { - loadObjTree(document, this, oObjTree); - return this; - }; - - */</pre> - -<h4 id="Example">Example</h4> - -<p>Imagine you want to populate the following <a href="/en-US/docs/Web/API/HTMLElement"><code>HTMLElement</code></a> through JSON:</p> - -<pre class="brush: html"><div id="form_container"></div></pre> - -<p>Then, the following code:</p> - -<pre class="brush: js">document.getElementById("form_container").appendJXON({ - "form": { - "script": { - "@type": "text/javascript", - "keyValue": "\n function numbersOnly (oToCheckField, oKeyEvent) {\n return oKeyEvent.charCode === 0 || /\\d/.test(String.fromCharCode(oKeyEvent.charCode));\n }\n" - }, - "input": [{ - "@type": "hidden", - "@name": "instId", - "@value": 1234 - }, { - "@type": "hidden", - "@name": "currency", - "@value": "GBP" - }, { - "@type": "hidden", - "@name": "amount", - "@value": 0 - }, { - "@type": "hidden", - "@name": "name", - "@value": "CAPTURED" - }], - "table": { - "tr": [{ - "th": { - "@style": "text-align: right;", - "keyValue": "Product:" - }, - "td": { - "span": [{ - "input": { - "@type": "radio", - "@name": "nome", - "@id": "rel_tshirt", - "@value": "tshirt" - }, - "label": { - "@for": "rel_tshirt", - "keyValue": "T-Shirt" - }, - "@class": "product" - }, { - "input": { - "@type": "radio", - "@name": "nome", - "@id": "rel_trousers", - "@value": "trousers" - }, - "label": { - "@for": "rel_trousers", - "keyValue": "Trousers" - }, - "@class": "product" - }, { - "input": { - "@type": "radio", - "@name": "nome", - "@id": "rel_pullover", - "@value": "pullover" - }, - "label": { - "@for": "rel_pullover", - "keyValue": "Pullover" - }, - "@class": "product" - }] - } - }, { - "th": { - "@style": "text-align: right;", - "keyValue": "Quantity:" - }, - "td": { - "input": { - "@type": "text", - "@name": "myInput", - "@onkeypress": "return numbersOnly(this, event);", - "@onpaste": "return false;" - } - } - }] - }, - "p": { - "input": { - "@type": "submit", - "@value": "Purchase!" - } - }, - "@action": "https://secure-test.worldpay.com/wcc/purchase", - "@name": "BuyForm", - "@method": "POST" - } -});</pre> - -<p>will populate the previous element in the following way:</p> - -<pre class="brush: html"><div id="form_container"> - <form action="https://secure-test.worldpay.com/wcc/purchase" name="BuyForm" method="POST"> - <script type="text/javascript"> - function numbersOnly(oToCheckField, oKeyEvent) { - return oKeyEvent.charCode === 0 || /\d/.test(String.fromCharCode(oKeyEvent.charCode)); - } - </script> - <input type="hidden" name="instId" value="1234" /> - <input type="hidden" name="currency" value="GBP" /> - <input type="hidden" name="amount" value="0" /> - <input type="hidden" name="name" value="CAPTURED" /> - <table> - <tr> - <th style="text-align: right;">Product:</th> - <td><span class="product"><input type="radio" name="nome" id="rel_tshirt" value="tshirt"/><label for="rel_tshirt">T-Shirt</label></span><span class="product"><input type="radio" name="nome" id="rel_trousers" value="trousers"/><label for="rel_trousers">Trousers</label></span><span class="product"><input type="radio" name="nome" id="rel_pullover" value="pullover"/><label for="rel_pullover">Pullover</label></span> - </td> - </tr> - <tr> - <th style="text-align: right;">Quantity:</th> - <td> - <input type="text" name="myInput" onkeypress="return numbersOnly(this, event);" onpaste="return false;" /> - </td> - </tr> - </table> - <p> - <input type="submit" value="Purchase!" /> - </p> - </form> -</div></pre> - -<h3 id="Other_examples">Other examples</h3> - -<h4 id="Example_1_How_to_use_JXON_to_create_an_HTML_document_instead_of_an_XML_document">Example #1: How to use JXON to create an HTML document instead of an XML document:</h4> - -<pre class="brush: js">/* The structure of my document */ -var oMyHTMLStruct = { - "html": { - "head": { - "meta": { - "@http-equiv": "Content-Type", - "@content": "text/html; charset=UTF-8" - }, - "title": "My HTML Document", - "script": { - "@type": "text/javascript", - "keyValue": "alert(\"Welcome!\");" - }, - "style": "p:first-letter {\n font: italic bold 30px Georgia, serif;\n}" - }, - "body": { - "h1": "My HTML Document", - "p": "Hello world!!" - } - } -}; - -/* Create the document */ -var oMyHTMLDoc = JXON.unbuild(oMyHTMLStruct, "http://www.w3.org/1999/xhtml");</pre> - -<p>…And here is the output of <code>alert((new XMLSerializer()).serializeToString(oMyHTMLDoc))</code>:</p> - -<pre class="brush: html"><html> - -<head> - <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> - <title>My HTML Document</title> - <script type="text/javascript"> - alert("Welcome!"); - </script> - <style> - p:first-letter { - font: italic bold 30px Georgia, serif; - } - </style> -</head> - -<body> - <h1>My HTML Document</h1> - <p>Hello world!!</p> -</body> - -</html></pre> - -<div class="note"><strong>Note:</strong> As we already said in <a href="#ordering-lossless-note">the note within <em>Code considerations</em></a>, despite the bidirectional conversion between XML and JSON <strong>is</strong> lossless regarding the whole content and the structure of an XML document, it <strong>is not</strong> lossless regarding the ordering of elements, which for some XML dialects (like XHTML) is part of the information. For instance, a bidirectional conversion of the following HTML paragraph: - -<pre class="brush: html"><p>She <strong>loves</strong> you. And definitely <strong>hates</strong> me.</p></pre> -would determine a result like the following: - -<pre class="brush: html"><p><strong>loves</strong><strong>hates</strong>Sheyou. And definitelyme.</p></pre> -As you can see in this special case, the whole information is preserved, the ordering of the elements is not.<br> -It turns out then that for some XML dialects JXON can be not the best choise, while it can be a really powerful tool in dealing with <em>standard XML</em>. One conversion method which is lossless for element order, as it relies on arrays (but, with a less human-readable, JavaScript-friendly syntax), is <a href="http://www.jsonml.org/" title="http://www.jsonml.org/">JsonML</a>.</div> - -<h3 id="About_this_library">About this library</h3> - -<p>The <code>JXON.build()</code> method summarizes all our four ways of conversion (see: <a href="#Algorithm_.231.3A_a_verbose_way" title="Go to JXON algorithm #1">#1</a>, <a href="#Algorithm_.232.3A_a_less_verbose_way" title="Go to JXON algorithm #2">#2</a>, <a href="#Algorithm_.233.3A_a_synthetic_technique" title="Go to JXON algorithm #3">#3</a>, <a href="#Algorithm_.234.3A_a_very_minimalist_way" title="Go to JXON algorithm #4">#4</a>). The result is therefore the same of our four algorithms, depending on the level of verbosity utilised. As above, optional properties and methods (commented in the example) of the <a href="#Algorithm_.231.3A_a_verbose_way" title="Go to JXON algorithm #1">first algorithm</a> (verbosity level: 3) are not included.</p> - -<p>The <code>JXON.unbuild()</code> method utilises our <a href="#Reverse_algorithms" title="Reverse algorithms">reverse algorithm</a>.</p> - -<p>Therefore, <strong>all <a href="#Code_considerations" title="Code considerations">code considerations</a> remain the same</strong>.</p> - -<h2 id="Resources">Resources</h2> - -<ul> - <li><a href="http://code.google.com/p/xml2json-xslt/wiki/TransformingRules" title="TransformingRules – xml2json-xslt">The Parker Convention</a></li> - <li><a href="http://badgerfish.ning.com/" title="BadgerFish convention">The BadgerFish Convention</a></li> - <li><a href="http://www.balisage.net/Proceedings/vol7/html/Lee01/BalisageVol7-Lee01.html" title="JXON: an Architecture for Schema and Annotation Driven JSON/XML Bidirectional Transformations – Balisage: The Markup Conference 2011">JXON: an Architecture for Schema and Annotation Driven JSON/XML Bidirectional Transformations</a></li> - <li><a href="http://www.w3.org/TR/microdata/#json">Converting HTML to other formats: JSON (The World Wide Web Consortium)</a></li> - <li><a href="http://dinogambone.com/2012/jxon-a-simple-way-to-keep-xml-out-of-your-life/" title="JXON – A simple way to keep XML out of your life – Dino Gambone's blog">JXON – A simple way to keep XML out of your life – Dino Gambone's blog</a></li> - <li><a href="http://webreflection.blogspot.it/2008/07/jxon-lossless-javascript-to-xml-object.html" title="Web Reflection: JXON – Lossless JavaScript to XML Object Notation convertion">Web Reflection: JXON – Lossless JavaScript to XML Object Notation convertion</a></li> - <li><a href="http://davidwalsh.name/convert-xml-json" title="Convert XML to JSON with JavaScript – David Walsh Blog">Convert XML to JSON with JavaScript – David Walsh Blog</a></li> - <li><a href="http://goessner.net/download/prj/jsonxml/" title="http://goessner.net/download/prj/jsonxml/">http://goessner.net/download/prj/jsonxml/</a> – just another json2xml and xml2json conversion tool</li> - <li><a href="http://tawani.blogspot.it/2006/12/serialize-javascript-objects-to-xml-for.html" title="Serialize JavaScript objects to XML (for use with Ajax) – Tawani's Blog Rants">Serialize JavaScript objects to XML (for use with Ajax) – Tawani's Blog Rants</a></li> - <li><a href="http://www.kawa.net/works/js/xml/objtree-e.html" title="XML.ObjTree – XML source code from/to JavaScript object like E4X – Kawa.net">XML.ObjTree – XML source code from/to JavaScript object like E4X – Kawa.net</a></li> - <li><a href="http://www.jsonml.org/" title="http://www.jsonml.org/">JsonML</a> – a conversion method which is lossless for element order, as it relies on arrays.</li> -</ul> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en/XML" title="en/XML">XML</a></li> - <li><a href="/en/JSON" title="en/JSON">JSON</a></li> - <li><a href="/en/XPath" title="en/XPath">XPath</a></li> - <li><a href="/en/E4X" title="en/E4X">E4X (ECMAScript for XML)</a></li> - <li><a href="/en/Parsing_and_serializing_XML" title="en/Parsing_and_serializing_XML">Parsing and serializing XML</a></li> - <li><a href="/en/DOM/XMLHttpRequest" title="en/XMLHttpRequest">XMLHttpRequest</a></li> - <li><a href="/en/How_to_create_a_DOM_tree" title="en/How_to_create_a_DOM_tree">How to Create a DOM tree</a></li> - <li><a href="/en/JavaScript/Introduction_to_Object-Oriented_JavaScript" title="Introduction to Object-Oriented JavaScript">Introduction to Object-Oriented JavaScript</a></li> - <li><a href="/en/JavaScript/Guide/Working_with_Objects" title="Working with Objects">Working with Objects</a></li> - <li><a href="/en/XML_Introduction" title="en/XML_Introduction">XML Introduction</a></li> -</ul> diff --git a/files/zh-cn/archive/mdn/index.html b/files/zh-cn/archive/mdn/index.html deleted file mode 100644 index 95f78220b5..0000000000 --- a/files/zh-cn/archive/mdn/index.html +++ /dev/null @@ -1,16 +0,0 @@ ---- -title: MDN -slug: Archive/MDN -tags: - - NeedsTranslation - - TopicStub -translation_of: Archive/MDN ---- -<p></p><div class="overheadIndicator obsolete obsoleteHeader"><p><strong><span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> Obsolete</strong><br>This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.</p></div><p></p> - -<p>The documentation listed below is archived, obsolete material about MDN itself.</p> - -<p></p><div class="row topicpage-table"> - <div class="section"><dl><dl><dt class="landingPageList"><a href="/en-US/docs/Archive/MDN/Content_kits">Content kits</a></dt><dd class="landingPageList">MDN Content Kits are subject-based collections of technical resources to help you host a local developer meetup or give a technical presentation at an event, conference, or workshop.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/MDN/Howto_Link_a_Github_account">How to link a GitHub account to your MDN profile</a></dt><dd class="landingPageList">All users who wish to contribute to MDN must add a GitHub login to their MDN account in order to edit. This article describes how to add GitHub authentication to your MDN profile.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/MDN/Persona_sign-ins">MDN and Persona sign-ins</a></dt><dd class="landingPageList">Starting on November 1, 2016, we only support GitHub for logging into MDN. If you didn't add a GitHub login to your MDN account before we disabled Persona logins, please file an <a href="https://mzl.la/accounthelp">"Account Help" bug</a> on Bugzilla.</dd></dl></dl></div> - <div class="section"><dl><dt class="landingPageList"><a href="/en-US/docs/Archive/MDN/Subject-matter_experts">Subject-matter experts</a></dt><dd class="landingPageList">This article's purpose is to help writers find the Mozilla developers who have answers for questions about various technologies. If you're an engineer on any Mozilla project, <strong>please</strong> make sure your technology is on this list and that the contact information for your group is provided.</dd><dt class="landingPageList"><a href="/en-US/docs/Archive/MDN/Zones">Zones</a></dt><dd class="landingPageList">A <strong>zone</strong> is a special area of MDN whose content is presented with some added user interface elements, such as a special zone navigation box and enhanced visuals in the header area of the page.</dd></dl></div> - </div><p></p> diff --git a/files/zh-cn/archive/meta_docs/custom_classes/index.html b/files/zh-cn/archive/meta_docs/custom_classes/index.html deleted file mode 100644 index 77a4ca21c9..0000000000 --- a/files/zh-cn/archive/meta_docs/custom_classes/index.html +++ /dev/null @@ -1,239 +0,0 @@ ---- -title: 'Project:自定义_CSS_类' -slug: Archive/Meta_docs/Custom_classes -tags: - - 所有分类 -translation_of: Archive/Meta_docs/Custom_classes ---- -<p></p><div class="standardSidebar"> - <div><a href="/Help:cn/%E7%9B%AE%E5%BD%95" style="font-size: large;">帮助目录</a></div> - - <dl> - <dt>指导</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:%E7%8E%B0%E5%9C%A8%E5%B0%B1%E5%BC%80%E5%A7%8B">现在就开始</a></li> - <li><a href="/zh-CN/docs/Project:%E7%BC%96%E8%80%85%E5%90%91%E5%AF%BC">编者向导</a></li> - <li><a href="/zh-CN/docs/Project:%E9%A1%B5%E9%9D%A2%E5%91%BD%E5%90%8D%E6%8C%87%E5%8D%97">页面命名指南</a></li> - <li><a href="/zh-CN/docs/Project:%E6%B6%88%E6%AD%A7%E4%B9%89">消歧义页</a></li> - <li><a href="/zh-CN/docs/Project:%E6%9C%AC%E5%9C%B0%E5%8C%96%E9%A1%B9%E7%9B%AE">开始一项新的mdc本地化项目</a></li> - <li><a href="/zh-CN/docs/Project:%E7%89%88%E6%9D%83">版权和许可</a></li> - </ul> - </dd> - - <dt>参考</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:Wiki%E6%A0%87%E8%AE%B0%E8%AF%AD%E6%B3%95%E5%8F%82%E8%80%83">维基语法参考</a></li> - <li><a href="/zh-CN/docs/Project:%E8%87%AA%E5%AE%9A%E4%B9%89_CSS_%E7%B1%BB">自定义 CSS 类</a></li> - <li><a href="/zh-CN/docs/Project:%E8%87%AA%E5%AE%9A%E4%B9%89%E6%A8%A1%E6%9D%BF">自定义模板</a></li> - <li><a href="/zh-CN/docs/Project:MediaWiki_%E6%89%A9%E5%B1%95">MediaWiki 扩展</a></li> - <li><a href="/zh-CN/docs/Project:%E5%A4%96%E9%83%A8%E9%87%8D%E5%AE%9A%E5%90%91">外部重定向</a></li> - <li><a href="/zh-CN/docs/Project:%E9%9C%80%E8%A6%81%E9%87%8D%E5%AE%9A%E5%90%91">需要重定向</a></li> - </ul> - </dd> - - <dt>列表</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:%E6%96%87%E6%A1%A3%E8%AF%B7%E6%B1%82%E5%88%97%E8%A1%A8">文档请求列表</a></li> - <li><a href="/zh-CN/docs/Project:To_Do_List">Editing/review to do list</a></li> - <li><a href="/zh-CN/docs/Project:%E5%B7%B2%E6%9C%89%E5%86%85%E5%AE%B9">合并列表</a></li> - </ul> - </dd> - </dl> - -</div><p></p> - -<p>下面的内容，将介绍如何在 Devmo wiki 中自定义 CSS 类。无论任何原因，如果您需要为本 wiki 创建自定义 CSS 类，请随时联系 <a>Dria</a>.</p> - -<h3 id=".E5.AE.9A.E4.B9.89_CSS_.E7.B1.BB" name=".E5.AE.9A.E4.B9.89_CSS_.E7.B1.BB">定义 CSS 类</h3> - -<table class="fullwidth-table"> - <tbody> - <tr> - <td class="header">类</td> - <td class="header">结果</td> - </tr> - <tr> - <td><code>div.tip</code></td> - <td>显示 tip 文本，范围不超出一个页的 body 部分。</td> - </tr> - <tr> - <td><code>div.bug</code></td> - <td>显示 bug 文本，范围不超出一个页的 body 部分。</td> - </tr> - <tr> - <td><code>.float-left</code></td> - <td>创建一个左向流 left-float 元素(通常是图形)</td> - </tr> - <tr> - <td><code>.float-right</code></td> - <td>创建一个右向流 right-float 元素（通常是图形）</td> - </tr> - <tr> - <td><code>.figure</code></td> - <td>定义一个未使用内容，不包含任何当前风格</td> - </tr> - <tr> - <td><code>.standard-table</code></td> - <td>基础标准表（table）风格。</td> - </tr> - <tr> - <td><code>.standard-table td.header</code></td> - <td>标准表（table）的表头风格。</td> - </tr> - <tr> - <td><code>.fullwidth-table</code></td> - <td>宽度设置为 100% 的表。（就像现在你正在看的这个表）</td> - </tr> - <tr> - <td><code>.fullwidth-table td.header</code></td> - <td>宽度设为 100% 的表的表头风格。</td> - </tr> - <tr> - <td><code>div.breadcrumbs</code></td> - <td>breadcrumbs 用户导航风格</td> - </tr> - <tr> - <td><code>div.breadcrumbs a.breadcrumbs</code></td> - <td>breadcrumbs 字符串用户导航风格。</td> - </tr> - <tr> - <td><code>div.breadcrumbs span.breadcrumbs</code></td> - <td>breadcrumbs 字符串导航中的本页内部标题风格。</td> - </tr> - <tr> - <td><code>div.side-note-left div.side-note-right</code></td> - <td>用来创建一个靠单方向的文本框。它将在父级文本（通常是文档本身）中，占据一个50%宽度的文本框。建议在使用的时候，左右方向交替使用，以便提高文档的可读性。</td> - </tr> - <tr> - <td><code>div.highlight</code></td> - <td>在左侧为段落创建一个三像素宽的蓝条。</td> - </tr> - <tr> - <td><code>.highlightred</code></td> - <td>文本颜色变为红色</td> - </tr> - <tr> - <td><code>.highlightblue</code></td> - <td>文本颜色变为蓝色</td> - </tr> - <tr> - <td><code>.highlightgreen</code></td> - <td>文本颜色变为绿色</td> - </tr> - </tbody> -</table> - -<h3 id=".E4.BE.8B.E5.AD.90" name=".E4.BE.8B.E5.AD.90">例子</h3> - -<h4 id=".E9.AB.98.E4.BA.AE.E7.9A.84.E4.BB.A3.E7.A0.81" name=".E9.AB.98.E4.BA.AE.E7.9A.84.E4.BB.A3.E7.A0.81">高亮的代码</h4> - -<p>我们经常会希望提请读者注意某段代码。这是可能通过使用spans，还用mediawiki内建的代码格式"indent-at-least-one-space" （“缩进至少一个空格”）。请注意，在<span class="nowiki"><pre></span>块内使用spans是没有用的，因为mediawiki分析器忽略了spans，而直接把他们作为代码的一部分输出。</p> - -<pre><span class="highlightred">这样不会有效</span> -</pre> - -<p>取代它的方法是，缩进你想要放在高亮部分的代码，并且在内部使用spans。注意，在代码中，空行也是需要缩进的。如果在空行前面没有空格，那么前一个段落将被解释器关闭，并另起一个新段落。</p> - -<pre class="eval">here is an example of - a <span class="highlightred">codeblock</span> with a blank line -</pre> - -<pre class="eval"> that is not <span class="highlightblue">indented</span>. -</pre> - -<p>很显然，上面是一个反面例子，正确的做法应该像下面这样的：</p> - -<pre class="eval">here is an example of - a <span class="highlightred">codeblock</span> with a blank line - - that is <span class="highlightblue">indented</span>. -</pre> - -<h4 id="Breadcrumbs" name="Breadcrumbs">Breadcrumbs</h4> - -<p> </p> - -<ul> - <li>例子请参见 <a href="cn/Core_JavaScript_1.5_Reference/About">Core JavaScript 1.5 Reference:About</a> 。</li> -</ul> - -<h4 id="table.standard-table" name="table.standard-table">table.standard-table</h4> - -<table class="standard-table"> - <tbody> - <tr> - <th>表标题 1</th> - <th>表标题 2</th> - </tr> - <tr> - <td>这里是一个例子:</td> - <td><code>table.standard-table</code></td> - </tr> - </tbody> -</table> - -<h4 id="table.fullwidth-table" name="table.fullwidth-table">table.fullwidth-table</h4> - -<table class="fullwidth-table"> - <tbody> - <tr> - <th>表标题 1</th> - <th>表标题 2</th> - </tr> - <tr> - <td>这是一个例子:</td> - <td><code>table.fullwidth-table</code></td> - </tr> - </tbody> -</table> - -<h4 id="Divs" name="Divs">Divs</h4> - -<h5 id="Tips" name="Tips">Tips</h5> - -<p>使用 <code>div class="note"</code> 格式化 tip:</p> - -<div class="note">这是一个 tip</div> - -<h5 id="Bugs" name="Bugs">Bugs</h5> - -<p>使用 <code>div class="bug"</code> 引用已知的 bug，可以创建指向bugzilla的bug连接：</p> - -<div class="bug"><a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=176320">Bug 176320: Minimal innerWidth/innerHeight values for popup windows</a></div> - -<h5 id="Warnings" name="Warnings">Warnings</h5> - -<p>使用 <code>div class="warning"</code> 将一段文档做成警告高亮。最后，我们回做一些很酷的事情，并且加一些图标啊什么的。</p> - -<div class="warning">这是一个 warning.</div> - -<h5 id="Notes" name="Notes">Notes</h5> - -<p><code>div class="note"</code> (via <a>Template:Note</a>) 用来将一段文档标记为一段笔记。不要直接使用 div 类，最好用模板<a>template</a>.</p> - -<div class="side-note-left">这是个左边的 note。</div> - -<p>分别演示side-note-levt和side-note-right</p> - -<div class="side-note-right">这是个右边的 note。</div> - -<p> </p> - -<h5 id=".E9.AB.98.E4.BA.AE.E6.AE.B5.E8.90.BD" name=".E9.AB.98.E4.BA.AE.E6.AE.B5.E8.90.BD">高亮段落</h5> - -<p><code>div class="highlight"</code> 的例子:</p> - -<div class="highlight"> -<p>这是一个段落 CSS 高亮的例子。通过这个方法可以让你的代码引起注意。最初，这个功能是在 <a href="cn/XUL_Tutorial">XUL Tutorial</a> 中添加进来的。</p> - -<pre>这段例子 - 演示了使用 - div - 高亮的情况 -</pre> -</div> - -<p></p> diff --git a/files/zh-cn/archive/meta_docs/devedge/index.html b/files/zh-cn/archive/meta_docs/devedge/index.html deleted file mode 100644 index 45372ce911..0000000000 --- a/files/zh-cn/archive/meta_docs/devedge/index.html +++ /dev/null @@ -1,61 +0,0 @@ ---- -title: DevEdge -slug: Archive/Meta_docs/DevEdge -tags: - - 所有分类 -translation_of: Archive/Meta_docs/DevEdge ---- -<p>This is a temporary Index of the content that has been migrated from DevEdge to this wiki. The original list and mirror are linked below.</p> -<p><b>Migrated documents and migrator</b>:</p> -<ul> - <li><a href="cn/Accessing_Web_Services_in_Mozilla_Using_WSDL_Proxying">Accessing Web Services in Mozilla Using WSDL Proxying</a> (<a>Doron Rosenberg</a>)</li> - <li><a href="cn/An_Interview_With_Douglas_Bowman_of_Wired_News">An Interview With Douglas Bowman of Wired News</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Background-position_Keyword_Order"><code>background-position</code> Keyword Order</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Bookmark_Keywords">Bookmark Keywords</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Browser_Detection_and_Cross_Browser_Support">Browser Detection and Cross Browser Support</a> (<a href="cn/Zameer">Zameer Manji</a>)</li> - <li><a href="cn/Bypassing_Security_Restrictions_and_Signing_Code">Bypassing Security Restrictions and Signing Code</a> (<a>Joel Stanley</a>)</li> - <li><a href="cn/Case_Sensitivity_in_class_and_id_Names">Case Sensitivity in <code>class</code> and <code>id</code> Names</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Choosing_Standards_Compliance_Over_Proprietary_Practices">Choosing Standards Compliance Over Proprietary Practices</a> (<a>Marek Stepien</a>)</li> - <li><a href="cn/Consistent_List_Indentation">Consistent List Indentation</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Core_JavaScript_1.5_Guide">Core JavaScript 1.5 Guide</a> (<a>Joost de Valk</a>)</li> - <li><a href="cn/Core_JavaScript_1.5_Reference">Core JavaScript 1.5 Reference</a> (<a>Deb Richardson</a>)</li> - <li><a href="cn/Correctly_Using_Titles_With_External_Stylesheets">Correctly Using Titles With External Stylesheets</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Defining_Cross-Browser_Tooltips">Defining Cross-Browser Tooltips</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/DHTML_Demonstrations_Using_DOM%2f%2fStyle">DHTML Demonstrations Using DOM/Style</a> (<a>Joost de Valk</a>)</li> - <li><a href="cn/DOM_Client_Object_Cross-Reference">DOM Client Object Cross-Reference</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Fixing_Incorrectly_Sized_List_Item_Markers">Fixing Incorrectly Sized List Item Markers</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Fixing_Table_Inheritance_in_Quirks_Mode">Fixing Table Inheritance in Quirks Mode</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Gecko's_%22Almost_Standards%22_Mode">Gecko's "Almost Standards" Mode</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Gecko's_Almost_Standards_Mode">Gecko's Almost Standards Mode</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Gecko_User_Agent_Strings">Gecko User Agent Strings</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Giving_'cursor'_a_Hand">Giving '<code>cursor</code>' a Hand</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/How_to_Turn_Off_Form_Autocompletion">How to Turn Off Form Autocompletion</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/HTML_Element_Cross_Reference">HTML Element Cross Reference</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/The_Importance_of_Correct_Commenting">The Importance of Correct Commenting</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Images%2c_Tables%2c_and_Mysterious_Gaps">Images, Tables, and Mysterious Gaps</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Incorrect_MIME_Type_for_CSS_Files">Incorrect MIME Type for CSS Files</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Internationalized_Domain_Names_(IDN)_Support_in_Mozilla_Browsers">Internationalized Domain Names (IDN) Support in Mozilla Browsers</a> (<a>Marek Stepien</a>)</li> - <li><a href="cn/Issues_Arising_From_Arbitrary-Element_hover">Issues Arising From Arbitrary-Element <code>hover</code></a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Liberty!_Equality!_Validity!">Liberty! Equality! Validity!</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Mozilla_Web_Developer_Community">Mozilla Web Developer Community</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Notes_on_TLS_-_SSL_3.0_Intolerant_Servers">Notes on TLS - SSL 3.0 Intolerant Servers</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Properly_Configuring_Server_MIME_Types">Properly Configuring Server MIME Types</a> (<a>Deb Richardson</a>)</li> - <li><a href="cn/Properly_Using_CSS_and_JavaScript_in_XHTML_Documents">Properly Using CSS and JavaScript in XHTML Documents</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Standards-Compliant_Authoring_Tools">Standards-Compliant Authoring Tools</a> (<a>Mathieu Deaudelin</a>)</li> - <li><a href="cn/Styling_Abbreviations_and_Acronyms">Styling Abbreviations and Acronyms</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/The_Business_Benefits_of_Web_Standards">The Business Benefits of Web Standards</a> (<a>Tristan Nitot</a>)</li> - <li><a href="cn/The_XSLT%2f%2fJavaScript_Interface_in_Gecko">The XSLT/JavaScript Interface in Gecko</a> (<a>Joost de Valk</a>)</li> - <li><a href="cn/Tips_for_Authoring_Fast-loading_HTML_Pages">Tips for Authoring Fast-loading HTML Pages</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Underscores_in_class_and_ID_Names">Underscores in <code>class</code> and <code>ID</code> Names</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Understanding_Underlines">Understanding Underlines</a> (<a>Serge K. Keller</a>)</li> - <li><a href="cn/Using_Breakpoints_in_Venkman">Using Breakpoints in Venkman</a> (<a>Nickolay Ponomarev</a>)</li> - <li><a href="cn/Using_the_Right_Markup_to_Invoke_Plugins">Using the Right Markup to Invoke Plugins</a> (<a>Joost de Valk</a>)</li> - <li><a href="cn/Using_XPInstall_to_Install_Plugins">Using XPInstall to Install Plugins</a> (<a>Tuqui</a>)</li> - <li><a href="cn/Venkman_Introduction">Venkman Introduction</a> (<a>Nickolay Ponomarev</a>)</li> - <li><a href="cn/Windows_Media_in_Netscape">Windows Media in Netscape</a> (<a>Joel Stanley</a>)</li> - <li><a href="cn/XPInstall_API_Reference">XPInstall API Reference</a> (<a>Rod Whiteley</a>)</li> - <li><a href="cn/XSLT_in_Gecko">XSLT in Gecko</a> (<a>Joost de Valk</a>)</li> -</ul> -<p>DevEdge Content Progress list: <a href="cn/DevEdge/Priority_Content">DevEdge:Priority Content</a><br> - DevEdge Mirror site: <a class="external" href="http://devedge-temp.mozilla.org/" rel="freelink">http://devedge-temp.mozilla.org/</a></p> -<p></p> diff --git a/files/zh-cn/archive/meta_docs/external_redirects/index.html b/files/zh-cn/archive/meta_docs/external_redirects/index.html deleted file mode 100644 index a8e1988c62..0000000000 --- a/files/zh-cn/archive/meta_docs/external_redirects/index.html +++ /dev/null @@ -1,74 +0,0 @@ ---- -title: 'Project:外部重定向' -slug: Archive/Meta_docs/External_redirects -tags: - - 所有分类 -translation_of: Archive/Meta_docs/External_redirects ---- -<p></p><div class="standardSidebar"> - <div><a href="/Help:cn/%E7%9B%AE%E5%BD%95" style="font-size: large;">帮助目录</a></div> - - <dl> - <dt>指导</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:%E7%8E%B0%E5%9C%A8%E5%B0%B1%E5%BC%80%E5%A7%8B">现在就开始</a></li> - <li><a href="/zh-CN/docs/Project:%E7%BC%96%E8%80%85%E5%90%91%E5%AF%BC">编者向导</a></li> - <li><a href="/zh-CN/docs/Project:%E9%A1%B5%E9%9D%A2%E5%91%BD%E5%90%8D%E6%8C%87%E5%8D%97">页面命名指南</a></li> - <li><a href="/zh-CN/docs/Project:%E6%B6%88%E6%AD%A7%E4%B9%89">消歧义页</a></li> - <li><a href="/zh-CN/docs/Project:%E6%9C%AC%E5%9C%B0%E5%8C%96%E9%A1%B9%E7%9B%AE">开始一项新的mdc本地化项目</a></li> - <li><a href="/zh-CN/docs/Project:%E7%89%88%E6%9D%83">版权和许可</a></li> - </ul> - </dd> - - <dt>参考</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:Wiki%E6%A0%87%E8%AE%B0%E8%AF%AD%E6%B3%95%E5%8F%82%E8%80%83">维基语法参考</a></li> - <li><a href="/zh-CN/docs/Project:%E8%87%AA%E5%AE%9A%E4%B9%89_CSS_%E7%B1%BB">自定义 CSS 类</a></li> - <li><a href="/zh-CN/docs/Project:%E8%87%AA%E5%AE%9A%E4%B9%89%E6%A8%A1%E6%9D%BF">自定义模板</a></li> - <li><a href="/zh-CN/docs/Project:MediaWiki_%E6%89%A9%E5%B1%95">MediaWiki 扩展</a></li> - <li><a href="/zh-CN/docs/Project:%E5%A4%96%E9%83%A8%E9%87%8D%E5%AE%9A%E5%90%91">外部重定向</a></li> - <li><a href="/zh-CN/docs/Project:%E9%9C%80%E8%A6%81%E9%87%8D%E5%AE%9A%E5%90%91">需要重定向</a></li> - </ul> - </dd> - - <dt>列表</dt> - <dd> - <ul style="padding: 0;"> - <li><a href="/zh-CN/docs/Project:%E6%96%87%E6%A1%A3%E8%AF%B7%E6%B1%82%E5%88%97%E8%A1%A8">文档请求列表</a></li> - <li><a href="/zh-CN/docs/Project:To_Do_List">Editing/review to do list</a></li> - <li><a href="/zh-CN/docs/Project:%E5%B7%B2%E6%9C%89%E5%86%85%E5%AE%B9">合并列表</a></li> - </ul> - </dd> - </dl> - -</div><p></p> -<p>MDC 维基可以重定向到外部网站。在<a>category</a>的页面里，我们使用类这样的链接。这些链接可以让我们连接到不包含在本维基内的外部页面去。</p> -<h3 id=".E5.88.9B.E5.BB.BA.E4.B8.80.E4.B8.AA.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91" name=".E5.88.9B.E5.BB.BA.E4.B8.80.E4.B8.AA.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91">创建一个外部重定向</h3> -<p>请按如下做法创建一个外部重定向链接：</p> -<p>首先，创建一个作为外部重定向的页面，用“(external)”作为后缀。例如：<a href="cn/Mozilla_Project_Wiki_(external)">Mozilla Project Wiki (external)</a>。这样的带有“(external)”后缀的页面将被用来作为指针，这个指针的作用在于，当用户点击指向这个页面的链接时，它将把用户带到一个维基以外的页面。这个功能主要用在目录列表里，而对于手工的连接则没什么必要。关于手工外部重定向链接的做法，请查看后面的信息。</p> -<p>Next, edit that page and add the redirect command, followed by the desired target URL enclosed in double square brackets. For example:</p> -<pre> #REDIRECT [[http://wiki.mozilla.org]] -</pre> -<p>Finally, add a category to the redirect page. Note that the category must be - <i> - on the same line</i> - as the REDIRECT command, or the parser will ignore it. For example:</p> -<pre> #REDIRECT [[http://wiki.mozilla.org]] [[Category:Mozilla Project:Other Resources]] -</pre> -<p>When this is finished, simply save the page as normal.</p> -<h3 id=".E6.89.8B.E5.8A.A8.E8.BF.9E.E6.8E.A5.E5.88.B0.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91" name=".E6.89.8B.E5.8A.A8.E8.BF.9E.E6.8E.A5.E5.88.B0.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91">手动连接到外部重定向</h3> -<p>You should not create links to external redirects. Instead, just create regular external links to the site. The reason for this is because linking to an external redirect obscures the URL and users won't know where they will end up. This can be pretty annoying, and annoying users is a bad thing.</p> -<h3 id=".E7.BC.96.E8.BE.91.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91" name=".E7.BC.96.E8.BE.91.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91">编辑外部重定向</h3> -<p>Since an external redirect page immediately bounces you to the external site, editing the external redirect can be a challenge. To do so, simply add "<code>?action=edit</code>" to the end of the URL for the external redirect page. This is somewhat inconvenient, but it works. For example:</p> -<p><a class="external" href="http://developer.mozilla.org/en/docs/Mozilla_Project_Wiki_%28external%29?action=edit">Example</a></p> -<h3 id=".E9.80.9A.E8.BF.87.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91.E8.BF.81.E7.A7.BB.E5.88.B0.E5.BC.95.E7.94.A8.E9.A1.B5.E9.9D.A2" name=".E9.80.9A.E8.BF.87.E5.A4.96.E9.83.A8.E9.87.8D.E5.AE.9A.E5.90.91.E8.BF.81.E7.A7.BB.E5.88.B0.E5.BC.95.E7.94.A8.E9.A1.B5.E9.9D.A2">通过外部重定向迁移到引用页面</h3> -<p>If you migrate an article into the MDC check the category page to see if there's an external redirect pointing at it as well.</p> -<p>If there is, check the "what links here" (link in right column, in - <i> - Toolbox</i> - ) to see if any other pages link to that external redirect. If any links exist, change them so they point at the newly migrated article.</p> -<p>When no pages link to the external redirect page, redirect it to the newly migrated article and put it in the "Junk" category (using <span class="nowiki">[[Category:Junk]]</span>) so it can be deleted.</p> -<p>If you have any questions about using External Redirects, feel free to email Deb Richardson at <a class="link-mailto" href="mailto:deb@dria.org">. </a></p> -<p><a class="link-mailto" href="mailto:deb@dria.org"></a></p> diff --git a/files/zh-cn/archive/meta_docs/index.html b/files/zh-cn/archive/meta_docs/index.html deleted file mode 100644 index eb6457acf7..0000000000 --- a/files/zh-cn/archive/meta_docs/index.html +++ /dev/null @@ -1,10 +0,0 @@ ---- -title: MDN "meta-documentation" archive -slug: Archive/Meta_docs -translation_of: Archive/Meta_docs ---- -<p>Here you'll find archived "meta-documentation"; that is, documentation about how to write documentation on MDN. The articles here are obsolete and should no longer be referenced; we are retaining them here for reference while we migrate some content to new places, but very little of this is useful.</p> -<p></p><div class="row topicpage-table"> - <div class="section"><dl><dl><dt class="landingPageList"><a href="/zh-CN/docs/DevEdge">DevEdge</a></dt><dd class="landingPageList">This is a temporary Index of the content that has been migrated from DevEdge to this wiki. The original list and mirror are linked below.</dd><dt class="landingPageList"><a href="/zh-CN/docs/Project:%E5%A4%96%E9%83%A8%E9%87%8D%E5%AE%9A%E5%90%91">Project:外部重定向</a></dt><dd class="landingPageList">MDC 维基可以重定向到外部网站。在<a>category</a>的页面里，我们使用类这样的链接。这些链接可以让我们连接到不包含在本维基内的外部页面去。</dd></dl></dl></div> - <div class="section"><dl><dt class="landingPageList"><a href="/zh-CN/docs/Archive/Meta_docs/Custom_classes">Project:自定义_CSS_类</a></dt><dd class="landingPageList">下面的内容，将介绍如何在 Devmo wiki 中自定义 CSS 类。无论任何原因，如果您需要为本 wiki 创建自定义 CSS 类，请随时联系 <a>Dria</a>.</dd></dl></div> - </div><p></p> diff --git a/files/zh-cn/archive/misc_top_level/images,_tables,_and_mysterious_gaps/index.html b/files/zh-cn/archive/misc_top_level/images,_tables,_and_mysterious_gaps/index.html deleted file mode 100644 index 7fa8f2d4e0..0000000000 --- a/files/zh-cn/archive/misc_top_level/images,_tables,_and_mysterious_gaps/index.html +++ /dev/null @@ -1,164 +0,0 @@ ---- -title: 'Images, Tables, and Mysterious Gaps' -slug: 'Archive/Misc_top_level/Images,_Tables,_and_Mysterious_Gaps' -translation_of: 'Archive/Misc_top_level/Images,_Tables,_and_Mysterious_Gaps' ---- -<div class="warning"> -<p>本文所介绍的技术不再是Web开发的最佳实践。现在推荐用CSS布局。<span style="line-height: 1.572;"> 但是当开发者不能确定用户使用的是现代浏览器时，这些技术可能是有用的，比如基于HTML的e-mail消息。</span></p> -</div> - -<p>无论何时你开始创建一个网页,当其设计是基于经典的“表格和多图像时”你的烦恼是相当多的 。 不管你是切一个图标去很好的适应设计, 或者使用大量的单像素GIFs间隔, 这些原理都是大同小异的. 在较早的时候, 这种方法是能很好工作的, 因为浏览器可以将表格单元的宽和高设置成其包含的图像的大小一样。</p> - -<p>到了2001年的时候, 以及基于标准的浏览器的兴起，它们使用HTML和CSS而不是自己的私有布局算法来布局页面. 感谢CSS规范的一个不起眼的小特性, 基于表格的精确小图像布局已经是一个可以预见的灾难了。 这完全取决于现代浏览器的正确DOCTYPE, and kaboom!</p> - -<h3 id="The_Components" name="The_Components">组件</h3> - -<p>让我们来好好的看看这个问题, 和为什么这会成为一个问题. 我们来看一个简单的例子, 如图1: 一个表格包含了一个图片.</p> - -<p><img alt="Figure 1" src="/@api/deki/files/718/=Images-tables-gaps-figure1.gif"></p> - -<p>显然大多数的设计都比这更加的复杂，但是在这里我们必须要那些东西。一个图像和一个表格就已经够了。这个例子没有什么明显的错误。这不应该是这样的，因为其实浏览器的默认行为。</p> - -<p>现在让我们看看同样一个例子在具有严格DOCTYPE声明的现代浏览器上的表现。</p> - -<p><img alt="Figure 2" src="/@api/deki/files/721/=Images-tables-gaps-figure2.gif"></p> - -<p>注意图片下面出现了一个空格。 原来的表格的标记并没有改变-- 这是因为渲染模型发生了改变。 浏览器现在渲染的是图像所在的行，而不是直接渲染图像本身，图像在行内，而图像默认是内联元素，所以发生了上面的情况。</p> - -<h3 id="How_Inline_Content_is_Constructed" name="How_Inline_Content_is_Constructed">如何创造内联内容</h3> - -<p>为了理解这种情况是如何发生的， 让我们来看一看行盒子的结构，图像在行盒子内， 而行盒子在一个表格中， 如图3所示，一个标准的行盒子包含有文本内容。</p> - -<p><img alt="Figure 3" src="/@api/deki/files/722/=Images-tables-gaps-figure3.gif"></p> - -<p>图三中最值得我们注意的是基线 (图中的蓝色线), 其在行盒子中。 基线的确切位置取决于线框的“默认”字体（由红色框表示），其由包含行框的元素的font-family的值确定. 基线的位置不能由人为改变。所以他的位置就在那儿。基线之下的空格被称为“下降空间”，因为这样就可以绘制小写字母如“j”，“y”和“q”的下降字符串。图4显示了当将图像添加到混合中时会发生什么。</p> - -<p><img alt="Figure 4" src="/@api/deki/files/723/=Images-tables-gaps-figure4.gif"></p> - -<p>请注意图像默认位置：其底边与线框的基线对齐。可以使用垂直对齐方式更改此位置-- 我们等会再来讲这个问题-- 但几乎没有人将其默认值改变。我们拿走文本，只留下图像，如图5所示。</p> - -<p><img alt="Figure 5" src="/@api/deki/files/724/=Images-tables-gaps-figure5.gif"></p> - -<p>所以我们有一个图像坐在只包含图像的行框的基线上. 现在考虑当我们把这个行放在表单元格中时会发生什么（图6）。</p> - -<p><img alt="Figure 6" src="/@api/deki/files/725/=Images-tables-gaps-figure6.gif"></p> - -<p>所以空格出现了--以前从未出现的空格. 在小图像下他更糟糕, 如图7所示的一个像素高的图像。</p> - -<p><img alt="Figure 7" src="/@api/deki/files/726/=Images-tables-gaps-figure7.gif"></p> - -<p>现在有各种各样的意外空格。足以让设计师疯狂。</p> - -<h3 id="How_About_a_Fix.3F" name="How_About_a_Fix.3F">怎样修复它?</h3> - -<p>显而易见的方法-- 停止创建基于表格和切片的单像素图像-- 但这对于许多设计师来说并不是很实际，它确实不会帮助修复最近浏览器中突然爆裂的旧设计. 还有一个明显的修复方法，就是确保你的文档不会触发“标准”渲染模式。</p> - -<p>你可以使用 DOCTYPE 来触发 <a class="external" href="http://www.mozilla.org/docs/web-developer/quirks/">"quirks" mode</a> 或者 <a href="en/Gecko's_Almost_Standards_Mode">"almost standards" mode</a>, 或者在你的文档中移除DOCTYPE声明. 缺少DOCTYPE将阻止验证，因此不推荐。对于使用遗留文档的作者，DOCTYPE的 "quirks" 模式是一个最好的选择。 在作者正在撰写新文档或尝试将设计迁移到尽可能基于标准的情况下，“几乎标准”模式可能是更好的选择。</p> - -<p>当然，XHTML Strict或HTML Strict创作的文件将触发“标准”渲染模式，因此我们将通过两种基本方法来解决严格的文档中的问题，以及一些方法来调用这些“修复“。</p> - -<h4 id="Setting_images_to_be_blocks" name="Setting_images_to_be_blocks">将images设置为block元素</h4> - -<p>第一选择，以及最适合大多数图形强烈设计的选择，是将图像从内联元素转换为块级元素。这样做，它不再生成一个线框，所以问题消失了 - 假设图像是唯一占据该表格单元格的东西。在最简单的情况下，我们可能会添加如下样式：</p> - -<pre> td img {display: block;}</pre> - -<p>考虑这个规则将应用在如下的标记中:</p> - -<pre><table cellspacing="0" cellpadding="0" border="0" width="500"> -<tr><td><img src="nav1.gif"><img src="nav2.gif"><img src="nav3.gif"><img -src="nav4.gif"><img src="nav5.gif"></td></tr> -<tr><td style="background: red;"> -<img src="smallred.gif" height="1" width="1"></td></tr> -<tr><td> -<p style="margin: 0.5em;">This is text in another cell of the - table. Within the textthere is an icon <img src="icon2.gif"> - that indicates a link to another site. It's very worldly. Lorem -ipsum, dolor sit amet...</p></td></tr></table></pre> - -<p>如图8所示，他在一些情况下表现很好但是在另一些情况下则不是。</p> - -<p><img alt="Figure 8" src="/@api/deki/files/727/=Images-tables-gaps-figure8.gif"></p> - -<p>细红线表明单像素间隔GIF现在只使单元格高一个像素， 正如预期一样。 不幸的是，顶部单元格中的按钮现在都是块级别，因此最终堆叠在另一个顶部，而不是并排显示。</p> - -<p>一个潜在的解决方案是将一个类添加到需要为块级别的任何图像上，然后写入匹配的规则。</p> - -<pre>td img.decoration {display: block;} - -<td><img src="reddot.gif" class="decoration"></td></pre> - -<p>然而，根据设计，这可能会导致为这一个简单的效果添加了很多类。如果有许多单像素单元旨在创建酷堆叠线，或类似的一些东西，这将尤其如此。 如果您的标记适用于此方法，则可以对表行进行类，而不是映像。因此你可能有：</p> - -<pre>tr.decoration img {display: block;}</pre> - -<p>...以及标记中的以下更改：</p> - -<pre><tr class="decoration"><td style="background: red;"> -<img src="smallred.gif" height="1" width="1"> -</td></tr></pre> - -<p>其结果是仅使间隔GIF块级别，从而使其他图像单独存在。这导致图9中的结果。</p> - -<p><img alt="Figure 9" src="/@api/deki/files/728/=Images-tables-gaps-figure9.gif"></p> - -<p>或者，您可以将表格单元格替换为行，如果这是更好的选择。 然而，在任何这些情况下，如果您的表格单元格不仅仅是单个图像，那么使图像块级别可能会产生意想不到的副作用，如图8所示。</p> - -<p>当然，当我们在图9中有一个单像素间隔单元时，在顶部的导航按钮下方仍然有不需要的空间。 摆脱这个空间可以像将每个图像放在自己的单元格中一样容易，并使它们都是块级的，但是让它们放在一个单元格中，所以我们可以说明另一种方法。</p> - -<h4 id="Using_vertical_alignment" name="Using_vertical_alignment">用 vertical alignment</h4> - -<p>另一个主要选择是将图像内联并改变图像相对于线框的垂直对齐方式。例如，您可以尝试以下操作：</p> - -<pre>td img {vertical-align: bottom;}</pre> - -<p>这将导致图像的底部边缘与线框的底部对齐，而不是基线。 如图10所示，这具有预期的效果：我们的导航栏图像下的空间已经消失。 然而，装饰细胞仍然太高，并且其他图像相对于它们周围的文本不对准。</p> - -<p><img alt="Figure 10" src="/@api/deki/files/719/=Images-tables-gaps-figure10.gif"></p> - -<p>再次，我们可以对图像，单元格或行进行分类，以缩小效果的焦点。 然而，上面所示的样式不能克服单像素图像的问题，因为它们周围的线框将是表格单元格的字体大小的高度，因此不会缩小。 图像将移动到单元格的底部，但单元格不会“缩小”图像。 另外，比线框短的任何其他图像都很高，在它周围仍然会有空间 - 就像红色间隔单元一样。 单元格中的单像素图像现在与单元格的底部对齐，但是行框返回，它是正常文本的大小。</p> - -<p>参见例如图11，其中文档的字体大小已经被提高到大量。导航栏图像现在有空间出现在它们之上，而红色的隔片变得更大。</p> - -<p><img alt="Figure 11" src="/@api/deki/files/720/=Images-tables-gaps-figure11.gif"></p> - -<p>很难避免这种情况，因为图像（在这种方式）仍然是内联的，因此仍然参与创建一个行框。如果线框足够高，则图像周围的空间将开始出现。</p> - -<h3 id="Looking_Forward_To_a_Fix" name="Looking_Forward_To_a_Fix">期待修复</h3> - -<p>感谢Mozilla对CSS2的全面实施，CSS工作组注意到表单中的内联图像强制打开不需要的空间的问题。 已经有很多建议来解决这个问题，但是最有希望的方法之一就是包含在CSS3中的 <a class="external" href="http://www.w3.org/TR/css3-box/#line-box-contain">line-box-contain</a>， 如果该属性被采用，那么任何支持它的浏览器都可以模仿传统的“收缩包装”行为，而不会因为以下规则而导致其他布局不安的风险：</p> - -<pre>td {line-box-contain: font replaced;} /* proposed for CSS3 */</pre> - -<p>目前的CSS3工作草案中还有其他可能的修复程序，例如<a class="external" href="http://www.w3.org/TR/css3-box/#line-height">line-height-policy</a>。显然，可以找到并实现更快的解决方案，到处都是更快乐的作者。 </p> - -<h3 id="Recommendations" name="Recommendations">建议</h3> - -<p>对CSS3的支持不够，难以为每个固定问题提供一套明确的步骤，因为给定文档的最佳解决方案将在很大程度上取决于其结构。 如果您的文档使用过渡标记，请确保您的DOCTYPE反映该事实，并且不触发“标准”模式。 这将阻止浏览器使用基于标准的渲染，因此避免了所有的图像布局问题。 如果您使用严格的标记，或者您需要其他原因进行“标准”渲染，请记住以下准则：</p> - -<ul> - <li>在单元格中单独的任何图像（例如，单像素间隔图像）应当被制成块级。</li> - <li>任何具有其他图像的表单元格中的图像都应与线框底部垂直对齐。</li> - <li>任何具有其他图像和文本的表格单元格中的图像都应该根据需要更改其垂直对齐方式（如果有的话）。</li> -</ul> - -<p>通过明智的混合方式和减少单像素图像技巧 - 在CSS功能的浏览器中，无论如何都是不必要的 - 这很有可能回避标准支持的这种奇怪的影响。 最好的解决方案可能是确保图像自身始终处于单元格中，从而允许作者使其成为块级，但一如以往将取决于作者的设计。</p> - -<h3 id="Related_Links" name="Related_Links">Related Links</h3> - -<ul> - <li><a href="en/Gecko's_Almost_Standards_Mode">Gecko's Almost Standards Mode</a></li> - <li><a href="en/Mozilla's_Quirks_Mode">Mozilla's Quirks Mode</a></li> -</ul> - -<div class="originaldocinfo"> -<h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3> - -<ul> - <li>Author(s): Eric A. Meyer</li> - <li>Last Updated Date: March 21st, 2003</li> - <li>Copyright © 2001-2003 Netscape.</li> -</ul> -</div> - -<p> </p> diff --git a/files/zh-cn/archive/misc_top_level/index.html b/files/zh-cn/archive/misc_top_level/index.html deleted file mode 100644 index 95bf3b61ab..0000000000 --- a/files/zh-cn/archive/misc_top_level/index.html +++ /dev/null @@ -1,8 +0,0 @@ ---- -title: Misc top level -slug: Archive/Misc_top_level -translation_of: Archive/Misc_top_level ---- -<p>In progress. These pages were moved from the top level of MDN in a spate of furious reorganization.</p> - -<p></p> diff --git a/files/zh-cn/archive/misc_top_level/same-origin_policy_for_file_colon__uris/index.html b/files/zh-cn/archive/misc_top_level/same-origin_policy_for_file_colon__uris/index.html deleted file mode 100644 index c53fd40c77..0000000000 --- a/files/zh-cn/archive/misc_top_level/same-origin_policy_for_file_colon__uris/index.html +++ /dev/null @@ -1,23 +0,0 @@ ---- -title: 档案同源策略 -slug: 'Archive/Misc_top_level/Same-origin_policy_for_file:_URIs' -tags: - - Same-origin policy - - XML - - 同源策略 - - 安全 -translation_of: 'Archive/Misc_top_level/Same-origin_policy_for_file:_URIs' ---- -<p>在Gecko 1.8或更早版本中，任意两个<code>file:</code>URI被认为是同源的。换句话说，本地磁盘上的任何HTML文件都可以读取本地磁盘上的任何其他文件。</p> - -<p>从Gecko 1.9开始，文件只允许读取某些其他文件。具体来说，只有当源文件的父目录是目标文件的祖先目录时，文件才能读取另一个文件。然而，目录不能以这种方式加载。</p> - -<p><font><font>举例来说，你有一个文件<code>foo.html</code>想要读取另一文件<code>bar.html</code>，你通过<code>index.html</code>进入了它，只有当<code>bar.html</code>存放于与<code>index.html</code>相同文件夹，或是index.html所在文件夹底下的子文件夹中时，才能读取成功。</font></font></p> - -<p><font><font>档案同源政策会影响到所有对同源政策的检查的行为，包括 </font></font><a href="https://developer.mozilla.org/en/DOM/XMLHttpRequest" title="En/XMLHttpRequest"><code><font><font>XMLHttpRequest</font></font></code></a><font><font> , XSLT,与XBL。</font></font></p> - -<p><font><font>至于跨window的DOM存取，基本上每一个档案都被视为不同源，除了以下例外：若是档案B被另一个档案A载入(例如透过iframe或</font></font><a href="https://developer.mozilla.org/en/DOM/window.open" title="En/DOM/Window.open"><code><font><font>window.open()</font></font></code></a><font><font> )，而档案A、B遵照此份档案同源政策可以被判定属于同源，那么当发生跨window的DOM存取时，也可以视为同源。（译者注：应该可以理解为，可以通过</font></font>subframe, link, location set, 调用<code><a href="https://developer.mozilla.org/en/DOM/window.open" title="En/DOM/Window.open">window.open()</a>之类的方法加载同源文件并对DOM进行操作</code><font><font>）</font></font></p> - -<p><font><font>例如， </font></font><code><font><font>/home/user</font></font></code><font><font>/ </font></font><code><font><font>foo.html</font></font></code><font><font> 是一个frameset，而它下嵌了另一个</font></font><font><font>/home/user/subdir/bar.html </font></font><font><font>的 </font></font><font><font>frame ,那么foo.html和bar.html可以视为同源，但如果</font></font><code>/home/user</code>/ <code>foo.html</code> 是/home/user/subdir/bar.htm的frameset下嵌的 一个frame<font><font>，那么foo.html和bar.html便不可以视为同源。</font></font></p> - -<p><font><font>另外当使用者想要关闭这些档案同源政策检查，可以变更 </font></font><code><font><font>security.fileuri.strict_origin_policy</font></font></code><font><font> 偏好设定为从预设true到false。</font></font></p> diff --git a/files/zh-cn/archive/misc_top_level/using_xml_data_islands_in_mozilla/index.html b/files/zh-cn/archive/misc_top_level/using_xml_data_islands_in_mozilla/index.html deleted file mode 100644 index 205769796d..0000000000 --- a/files/zh-cn/archive/misc_top_level/using_xml_data_islands_in_mozilla/index.html +++ /dev/null @@ -1,192 +0,0 @@ ---- -title: Using XML Data Islands in Mozilla -slug: Archive/Misc_top_level/Using_XML_Data_Islands_in_Mozilla -tags: - - XML -translation_of: Archive/Misc_top_level/Using_XML_Data_Islands_in_Mozilla ---- -<p>One handy feature of Internet Explorer is the ability to use data islands to link data to html controls on a page. This feature is not readily built into Mozilla, but one can easily mimic this behaviour to build cross-browser web applications.</p> -<p>The basic data island we are going to use is a simple xml element either linked to the page or explicitly coding the xml into the page. For instance, let us illustrate a simple example:</p> -<pre class="eval"><xml id="xmlDataIsland"> - <loaninfo> - <borrower id="1"> - <firstname>Brian</firstname> - <middlename>Ellis</middlename> - <lastname>Johnson</lastname> - </borrower> - </loaninfo> -</xml> -</pre> -<p>With this data island, we can populate any number of controls on a page simply by linking the data island to the controls via some JavaScript and the DOM.</p> -<p>To link this, all we need to do is have a function to handle populating the controls such as:</p> -<pre class="eval">function loadFields() -{ - var xmlNode = window.document.getElementsByTagName('xml'); - var borrowerNode = xmlNode[0].childNodes[1]; - if(borrowerNode.hasChildNodes()) - { - var i = 0; - var xmlChildNode, nodeVal=<i>;</i> - while(borrowerNode.childNodes[i]) - { - // get node - xmlChildNode = borrowerNode.childNodes[i]; - // check nodetype - if(xmlChildNode.nodeType != 3) // #text == 3 - { - // get nodeValue (aka text) - nodeVal += xmlChildNode.firstChild.nodeValue + ' '; - } - i++; - } - // set control value to nodeValue - window.document.getElementById('txtBorrowerName').value = nodeVal; - } -} -</pre> -<p><a class="external" href="http://www.mozilla.org/xmlextras/xmldataislands/example1.html">Example 1</a></p> -<p>Here is another example of an XML DataIsland for use in Mozilla or IE:</p> -<pre class="eval"><xml id="mxxdataisland"> - <mxxdataisland> - <rowset tagid="DATES"></rowset> - <rowset tagid="SUBJPRP"></rowset> - <rowset tagid="PRODUCT"></rowset> - </mxxdataisland> -</xml> -</pre> -<p>This dataisland's purpose is to inform the Application Server what tables this page is going to need access to or be requesting information from.</p> -<p>The controls on the page are then linked by way of custom attributes MXXOBJECT and MXXPROPERTY, much like the DATASRC and DATAFLD attributes used by IE. This allows the XML data returned to be parsed and linked or "bound" to the controls.</p> -<p>Note: MXXOBJECT and MXXPROPERTY are just attributes that I made up, these actually could be any attribute.</p> -<p>Binding the controls:</p> -<pre class="eval"><input - type="text" - id="PropertyStAddr1" - name="PropertyStAddr1" - style="height:21px;width:302px;text-align:left;" - maxlength="35" - class="fldDefault" - <span style="color: #CC0000;">mxxobject="SUBJPRP" mxxproperty="PropertyStAddr1"</span> <-- here are our "binding" tags -> - -<input - type="text" - class="fldZipCode" - name="PropertyZip" - id="PropertyZip" - size="10" - style="height:21px;width:69px;" - <span style="color: #CC0000;">mxxobject="SUBJPRP" mxxproperty="PropertyZip"</span> <-- here are our "binding" tags - <span style="color: #CC0000;">mxxxmlnode="xmldef_PropertyZip"</span> <-- this links to a control-level data island - <span style="color: #CC0000;">mxxtype="MXXZipCodeAutoLoadEdit"</span> <-- optional custom type for control handling -> -</pre> -<p>Since we are passing XML to the server, we can also send the server some additional info that a particular control may need, or alert the server of other controls on the page related to or driven by a control. The following is an example of a custom dataisland for a specific control type:</p> -<pre class="eval"><select - id="PropertyState" - name="PropertyState" - style="height:20px;width:48px;" - class="cmbDefault" - mxxtype="GFXStateList" - <span style="color: #CC0000;">mxxxmlnode="xmldef_PropertyState"</span> - mxxobject="GOXSUBJPRP" mxxproperty="PropertyState" -> -</select> - -<div style="width:0px; height:0px; visibility:hidden;z-index:1"> - <xml <span style="color: #CC0000;">id="xmldef_PropertyState"</span>> - <mxxstatelist> - <status value="initialize"></status> - <contenttype value="abbrev"></contenttype> - <controls> - <control type="countylist" tagid="PropertyCounty" contenttype="name" - valuetype ="name"></control> - </controls> - </mxxstatelist> - </xml> -</div> -</pre> -<p>These XMLDataIslands don't do us any good just like this. In order for them to work we need to do 2 things.</p> -<p>1. Build control handlers to handle the updating and rendering of different control types.</p> -<p>(Note: Control types can be anything. Form objects, tables, spans, divs, iFrames, anything that you can access via the DOM and an ID is eligible)</p> -<p>2. Build a handler to build a dom to send to the server and parse the return back out to the controls.</p> -<p>All a control handler has to do is be able to updata a control value. This means all Text Inputs can share a handler, selects another, and so on. One way to do this is to scrape the controls on a given page into an associative array. Then, when a response is returned, we can parse out the xml via an id attribute to match up the xml payload with a control.</p> -<pre class="eval"><input type="text" id="FirstName" ...> -</pre> -<p>Sample Object collector function:</p> -<pre class="eval"> // grab all the elements for parsing - var tags = window.document.body.getElementsByTagName("*"); - var pPrevElem = null; - var pNextElem = null; - for (var i = 0; i < tags.length; i++) - { - pHTMLElement = tags[i]; - - switch (pHTMLElement.tagName.toLowerCase()) - { - case "span": - case "table": - // this indexes by controlID and stores the elementObject - m_MXXPageObjectsArray[pHTMLElement.id] = pHTMLElement; - break; - case "input": - case "select": - case "textarea": - case "button": - // this indexes by controlID and stores the elementObject - m_MXXPageObjectsArray[pHTMLElement.id] = pHTMLElement; - break; - case "div": - // this indexes by controlID and stores the elementObject - m_MXXPageObjectsArray[pHTMLElement.id] = pHTMLElement; - break; - } - } -</pre> -<p>The xml payload going out might be:</p> -<pre class="eval"><page id="NewUser"> - <formcontrols> - <control id="FirstName"> - <value /> - </control> - </formcontrols> -</page> -</pre> -<p>The return would then be:</p> -<pre class="eval"><page id="NewUser"> - <formcontrols> - <control id="FirstName"> - <value>Dennis</value> - </control> - </formcontrols> -</page> -</pre> -<p>The parsing handler would then take the response, load it into an XML DOM, then pass out each node to the appropriate control handler.</p> -<pre class="eval"> processTextControl(control, xmlNode); -</pre> -<p>Sample parsing of returned xml:</p> -<pre class="eval"> // parseout to controls - var formControlNodes = xmlDoc.getElementsByTagName('formcontrols'); - for(i=0; i<formControlNodes.length;++i) - { - var pFormControlNode = formControlNodes[i]; - var pPageObject = m_MXXPageObjectsArray[pFormControlNode.getAttribute('id')]; - if(!pPageObject) - continue; - processTextControl(pPageObject, pBoundControlNode); - } -</pre> -<p>The control handler would then rip out the necessary data to populate the control. In this case the value nodevalue would be used to set control.value. A select could have the options to loop through and create new Options() with or even just replace the node or innerHTML with the new payload.</p> -<p><a class="external" href="http://www.mozilla.org/xmlextras/xmldataislands/MXX_Info.html">Here is a sample page.</a></p> -<p>Finally here is a <a class="external" href="http://www.mozilla.org/xmlextras/xmldataislands/table.html">small table sample</a> using XML Data Islands that works in both IE6 and Mozilla.</p> -<p>For any of the above to do us any good, we need to get this info to the server. We can do this a number of ways, including ASP, JSP, and CGI. I'm going to use XMLHTTP since it allows for me to update a page without having to reload it and it allows for the controls to update other controls and act like a regular 2 tier applicationa by providing instant updates and event handling.</p> -<p>Author: <a class="link-mailto" href="mailto:phiori@mindspring.com">Thad Hoffman</a></p> -<div class="originaldocinfo"> - <h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2> - <ul> - <li>Author(s): Thad Hoffman (<a class="link-mailto" href="mailto:phiori@mindspring.com">phiori@mindspring.com</a>, <a class="link-mailto" href="mailto:phiori@mac.com">phiori@mac.com</a>)</li> - <li>Other Contributors: Heikki Toivonen (<a class="link-mailto" href="mailto:heikki@netscape.com">heikki@netscape.com</a>)</li> - <li>Last Updated Date: June 21, 2005</li> - <li>Copyright Information: Copyright (C) <a class="link-mailto" href="mailto:phiori@mindspring.com">Thad Hoffman</a>, <a class="link-mailto" href="mailto:heikki@netscape.com">Heikki Toivonen</a></li> - </ul> -</div> -<p> </p> diff --git a/files/zh-cn/archive/mozilla/compiling_the_npruntime_sample_plugin_in_visual_studio/index.html b/files/zh-cn/archive/mozilla/compiling_the_npruntime_sample_plugin_in_visual_studio/index.html deleted file mode 100644 index 64c3a0f200..0000000000 --- a/files/zh-cn/archive/mozilla/compiling_the_npruntime_sample_plugin_in_visual_studio/index.html +++ /dev/null @@ -1,46 +0,0 @@ ---- -title: Compiling The npruntime Sample Plugin in Visual Studio -slug: Archive/Mozilla/Compiling_The_npruntime_Sample_Plugin_in_Visual_Studio -translation_of: Archive/Mozilla/Compiling_The_npruntime_Sample_Plugin_in_Visual_Studio ---- -<h2 id="General_decisions" name="General_decisions">通用选项</h2> - -<ul> - <li>DLL的文件名<br> - 必须以 "np" (不是 "ns") 开头并且以 ".dll" 结尾(我在这个地方一次又一次的犯错，小心)</li> - <li>mimetype<br> - 映射了这个插件处理的数据类型. 同时也是网页唤起你的插件的一个标识. 应该像是 "application/x-vnd-yourorganization-yourfiletype" 或者 在IANA上注册的类型 (不太可能)或者是一种标准类型(例如，如果你想要播放MPEG文件的话).</li> - <li>文件扩展名<br> - 映射了插件处理的数据类型，尤其是当插件从Windows系统的本地磁盘中加载的时候。</li> -</ul> - -<h2 id="Build" name="Build">Build</h2> - -<ol> - <li>创建一个<strong>Win32 GUI library工程</strong> (DLL) (在.NET 2003版本中: 选择模板中的<strong>Win32</strong> , 然后在弹出的对话框中找到<strong>应用程序类型</strong>，勾选<strong>DLL</strong>, 不添加公共头文件。)(在VS2008版本中，选择<strong>Visualc++|Win32|Win32 Project</strong>, 然后在向导中勾选DLL).</li> - <li>如果向导询问你是否创建一个空项目，那么勾选它。否则你需要在后面手动删除向导给你创建的文件。</li> - <li>请注意接下来的DLL创建中文件名必须以"<strong>np</strong>"开头, 你可以以这样的命名格式给你的工程命名，或者在后面的步骤中重命名你的项目。</li> - <li>（如果你不是创建了一个空项目才需要进行此步骤）从你的工程与磁盘中删除.cpp文件、.h文件、ReadMe文件。</li> - <li>复制npruntime例子插件源码到新创建工程的VS目录下，然后使用VS的界面向导方式添加这些文件到工程中。(<strong>.cpp</strong>文件添加到"源文件", <strong>.h</strong> 文件添加到 "头文件", <strong>.rc</strong> 文件添加到"资源文件"). 例子可以从以下网址获取：<br> - <a class="external" href="/en/Plugins/Samples_and_Test_Cases" title="https://developer.mozilla.org/en/Plugins/Samples_and_Test_Cases">https://developer.mozilla.org/en/Plugins/Samples_and_Test_Cases</a></li> - <li>下载<a href="http://code.google.com/p/npapi-sdk/" style="font-weight: bold;" title="http://code.google.com/p/npapi-sdk/">NPAPI SDK</a>.</li> - <li>添加<strong>NPAPI SDK的include目录 </strong>(例如 : C:\npapi-sdk\headers) 到项目属性<strong>|(所有配置)|C++|常规|附加包含目录</strong>. 注意: 如果你的项目仍然为空，C++树可能无法查看。所以先添加一些文件吧。</li> - <li>Add the following preprocessor definitions to <strong>Project Properties|(all configurations)|C++|Preprocessor|Preprocessor Definitions:</strong> <strong><code>WIN32;_WINDOWS;XP_WIN32;XP_WIN;_X86_;NPSIMPLE_EXPORTS</code></strong></li> - <li>Disable precompiled headers using <strong>Project Properties|(all configurations)|C++|Precompiled headers|Create/Use precompiled header</strong>. They may be already disabled.</li> - <li>Define the function exports by adding the <strong>.def</strong> filename (e.g. nprt.def) to <strong>Project Properties|(all configurations)|Linker|Input|Module Definition File</strong>. It could be either the full path or the path relative to the project directory.</li> - <li>Optional: Open the above <strong>.def</strong> file and change "NPRT" to the filename of your dll as VS sees it (without "np", if you decided to rename later)</li> - <li>Optional: Edit the <strong>.rc</strong> file and and the top of <strong>npp_gate.cpp</strong> for the description, mimetype, file extension etc. to reflect your plugin</li> - <li>Remove the function <strong><code>NPP_GetJavaClass</code></strong> from <strong>npp_gate.cpp</strong></li> - <li>Build</li> - <li>Rename the resulting DLL so that the filename starts with "<strong>np</strong>" and ends with ".dll" (or "32.dll"? 8.3?) and copy it in Mozilla's "plugins" folder</li> - <li>Start Mozilla and open <strong>about:plugins</strong> to verify the plugin is detected</li> - <li>Open the file "test.html" and begin testing. Make sure the mimetypes of your html embed tags match the mimetype specified in your <strong>nprt.rc</strong> file and the top of your <strong>npp_gate.cpp</strong> file</li> -</ol> - -<h2 id="Version_Issues" name="Version_Issues">Version Issues</h2> - -<ol> - <li>If VC++ compiler throws you <strong><code>error C2664</code></strong> on 'DrawText' function call, you may replace it by 'DrawTextA'. In fact, all win32 API functions dealing with character strings can be added an 'A' to the end to avoid unicode cast errors.</li> - <li>Visual C++ 2008 Express don't support C99 standard about <strong>int32_t</strong>, <strong>uint32_t</strong>. You have to add <strong>#include "nptypes.h"</strong> in top of <strong>plugin.h</strong> file.</li> - <li>Feel free to append here your issues fixes if the above guide helped you.</li> -</ol> diff --git a/files/zh-cn/archive/mozilla/getting_started_with_irc/index.html b/files/zh-cn/archive/mozilla/getting_started_with_irc/index.html deleted file mode 100644 index 730a987f20..0000000000 --- a/files/zh-cn/archive/mozilla/getting_started_with_irc/index.html +++ /dev/null @@ -1,316 +0,0 @@ ---- -title: Getting Started with IRC -slug: Archive/Mozilla/Getting_Started_with_IRC -tags: - - 'IRC: xgqfrms' - - MDN - - irc -translation_of: Archive/Mozilla/Getting_started_with_chat ---- -<h2 class="western" id="什么是_IRC" style="font-style: normal;">什么是 IRC?</h2> - -<p>IRC, or Internet Relay Chat, is a form of real-time text messaging between multiple users at the same time. Users connect to a server using an IRC client and join channels (chat rooms). Users type messages which are broadcasted to all users within a channel. IRC also allows one to one communication between connected users. This is the primary form of communication for members of the Mozilla community; developers, testers, users, and the like.</p> - -<h2 class="western" id="通用规则和礼仪" style="font-style: normal;">通用规则和礼仪</h2> - -<p style="margin-bottom: 0in; font-weight: normal;"><span style="font-style: normal;"><span style="text-decoration: none;">Once you have your client set up (see software below) and are connected to IRC, there are some basic rules you should follow to ensure the most enjoyable and productive IRC experience:</span></span></p> - -<p style="margin-bottom: 0in; font-weight: normal;"> </p> - -<p style="margin-bottom: 0in; padding-left: 30px;">1. Try to keep messages as concise as possible. If you have something long to post, a code snippet for example, use <a href="https://pastebin.mozilla.org/">pastebin.mozilla.org</a> and paste the generated URL in IRC instead.</p> - -<p style="margin-bottom: 0in; padding-left: 30px;">2. When addressing someone directly, try to use name: message format. For example, "ashughes: good morning!"</p> - -<p style="margin-bottom: 0in; padding-left: 30px;">3. Every channel has its own topic. Try to keep your messages within that subject matter. For example, do not talk about Thunderbird issues in #Firefox.</p> - -<p style="margin-bottom: 0in; padding-left: 30px;">4. Mozilla's IRC channels are most active between 9am and 7pm PST Monday to Friday, excluding <a href="https://www.opm.gov/policy-data-oversight/pay-leave/pay-administration/fact-sheets/holidays-work-schedules-and-pay/">US Holidays</a>.</p> - -<p style="margin-bottom: 0in; padding-left: 30px;">5. When asking a question, be patient. Sometimes, it can take a few minutes for people to respond.</p> - -<p style="margin-bottom: 0in; padding-left: 30px;">6. Posting a message like "Help!" is not particularly helpful. Asking a good question will result in a better experience for both you and the person trying to help. There is a good reference for what makes a good question <a href="https://www.gerv.net/hacking/how-to-ask-good-questions/">here</a>.</p> - -<p style="padding-left: 30px;"><span style="font-style: normal;">7. <strong>Relax and have fun!</strong></span></p> - -<h2 class="western" id="软件" style="font-style: normal;">软件</h2> - -<h3 class="western" id="ChatZilla_–_The_Firefox_Add-on"><strong><span style="font-size: small;"><span style="font-style: normal;"><span style="text-decoration: none;">ChatZilla – The Firefox Add-on</span></span></span></strong></h3> - -<p class="western"><span style="font-style: normal;"><span style="text-decoration: none;">There are several different applications which allow you to connect to IRC networks. The easiest one to use is an add-on for Firefox called Chatzilla. The following instructions describe how to install and configure Chatzilla for use on the Mozilla IRC network:</span></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">1. Go to <a href="https://addons.mozilla.org/en-US/firefox/addon/16">addons.mozilla.org</a> to download and install Chatzilla</span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">2. Click the green </span></span></span><em><span style="text-decoration: none;"><span style="font-weight: normal;">Add to Firefox</span></span></em><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;"> button</span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">3. Click the </span></span></span><em><span style="text-decoration: none;"><span style="font-weight: normal;">Install</span></span></em><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;"> button on the Addon Installation dialog</span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">4. Once ChatZilla is installed, click </span></span></span><em><span style="text-decoration: none;"><span style="font-weight: normal;">Restart Firefox</span></span></em></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">5. Once Firefox restarts, close the Add-ons dialog</span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">6. Now click Tools menu > ChatZilla to start the client</span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">7. In the textbox at the bottom of the window type </span></span></span><span style="font-size: x-small;"><span style="font-family: courier new,monospace;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">/server irc.mozilla.org</span></span></span></span></span><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;"> and press enter</span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">8. You will be given a random username when you first connect. Usually the client will just use your computer username. If this name is already in use, it will use something like </span></span></span><em><span style="text-decoration: none;"><span style="font-weight: normal;">IRCMonkey21710</span></span></em><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">. You can change your nickname by typing /nick nickname, where nickname is your desired nickname. You can also change your nickname using the dropdown box to the left of the textbox.</span></span></span></p> - -<p style="font-style: normal; padding-left: 30px;"><em><span style="text-decoration: none;"><span style="font-weight: normal;">See the <a href="#commands">Commands</a> section below for more IRC commands.</span></span></em></p> - -<p style="padding-left: 30px;"><span style="text-decoration: none;"><span style="font-weight: normal;">9. To join a channel type </span></span><span style="font-family: courier new,monospace;"><span style="font-size: xx-small;"><span style="text-decoration: none;"><span style="font-weight: normal;"><span style="font-size: x-small;">/join #channel</span>,</span></span></span></span><span style="text-decoration: none;"><span style="font-weight: normal;"> where #channel is the name of the channel you want to join.</span></span></p> - -<p style="padding-left: 30px;"><em><span style="text-decoration: none;"><span style="font-weight: normal;">See the <a href="#channels">Channels</a> section below for some channels available on the Mozilla IRC network.</span></span></em></p> - -<h3 class="western" id="Desktop_Clients"><span style="font-size: small;"><strong><span style="text-decoration: none;">Desktop Clients</span></strong></span></h3> - -<p style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">As mentioned earlier, ChatZilla is not the only IRC client available, though it is the simplest. The advantage is that the desktop clients allow much more detailed configuration. For example, you can connect using SSL or a non-secure connection, and you can configure the client to automatically connect to a server and join a particular set of channels when you start the client. The following are some other options available to you:</span></span></p> - -<table style="text-align: right; width: 100%;"> - <tbody> - <tr> - <td> </td> - <td> - <p align="CENTER"><strong>Windows</strong></p> - </td> - <td> - <p align="CENTER"><strong>Mac</strong></p> - </td> - <td> - <p align="CENTER"><strong>Linux</strong></p> - </td> - </tr> - <tr> - <td><a href="http://colloquy.info/downloads.html">Colloquy</a></td> - <td> </td> - <td> - <p align="CENTER">●</p> - </td> - <td> </td> - </tr> - <tr> - <td><a href="https://irssi.org/download#binaries">IRSSI</a></td> - <td> - <p align="CENTER">●</p> - </td> - <td> - <p align="CENTER">●</p> - </td> - <td> - <p align="CENTER">●<span style="font-family: arial,sans-serif;">*</span></p> - </td> - </tr> - <tr> - <td><a href="http://www.xchat.org/download/">Xchat</a></td> - <td> - <p align="CENTER">●</p> - </td> - <td> - <p align="CENTER">○</p> - </td> - <td> - <p align="CENTER">●<span style="font-family: arial,sans-serif;">*</span></p> - </td> - </tr> - </tbody> -</table> - -<p style="padding-left: 30px;"><em><span style="font-family: arial,sans-serif;"><span style="text-decoration: none;"><span style="font-weight: normal;">● </span></span></span></em><span style="font-family: arial,sans-serif;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">Binary or executable program available</span></span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-family: arial,sans-serif;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">○ Only available by downloading and compiling source code</span></span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-family: arial,sans-serif;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">●* Binary or executable may be available. If not, you'll have to download source code and compile.</span></span></span></span></p> - -<p style="padding-left: 30px;"><span style="font-family: arial,sans-serif;"><span style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">w Web-based client (i.e. it runs in the browser) </span></span></span></span></p> - -<p><em><span style="text-decoration: none;"><span style="font-weight: normal;">For a complete list of IRC clients go <a href="https://en.wikipedia.org/wiki/Comparison_of_Internet_Relay_Chat_clients">here</a>.</span></span></em></p> - -<p style="font-style: normal;"><span style="text-decoration: none;"><span style="font-weight: normal;">If using a desktop client, you will need to use the following information to configure the server connection:</span></span></p> - -<p style="font-style: normal; padding-left: 30px;"><span style="text-decoration: none;"><strong>Server: irc.mozilla.org</strong></span></p> - -<p style="padding-left: 30px;"><span style="font-style: normal;"><span style="text-decoration: none;"><strong>Port: 6667 (default) or 6697 (SSL)</strong></span></span></p> - -<h3 id="网络客户端">网络客户端</h3> - -<p><span style="font-style: normal;"><span style="text-decoration: none;">There are also a few web-based clients which allow connecting to IRC by clicking on irc:// links. One of the simplest web-based clients is </span></span><a href="https://www.mibbit.com/">Mibbit</a>, another is <a href="https://www.irccloud.com/">IRCCloud</a>. These operate very much in the same way as the previously mentioned desktop clients and ChatZilla. Mibbit does NOT require flash or any other plugins. <a name="channels"></a></p> - -<h2 class="western" id="频道">频道</h2> - -<p><span style="font-style: normal;">Here is a list of channels you should be aware of as a member of the Mozilla community: </span><span style="font-style: normal;"><strong>(Remember to use irc.mozilla.org and port 6697 or 6667 for your server settings)</strong></span></p> - -<table style="width: 100%;"> - <tbody> - <tr> - <td><a href="irc://irc.mozilla.org/qa"><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">#qa</span></span></a></td> - <td>A channel for QA discussion</td> - </tr> - <tr> - <td><a href="irc://irc.mozilla.org/developers"><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">#developers</span></span></a></td> - <td>A channel for Mozilla development discussion</td> - </tr> - <tr> - <td><a href="irc://irc.mozilla.org/sumo"><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">#sumo</span></span></a></td> - <td>A channel for support with Firefox</td> - </tr> - </tbody> -</table> - -<p><em>For more information about the Mozilla IRC network and more channels, go <a href="https://wiki.mozilla.org/IRC">here</a>.</em> <a name="commands"></a></p> - -<h2 class="western" id="指令" style="font-style: normal;">指令</h2> - -<p><span style="font-style: normal;">The following is a list of commands you should be familiar with. Simply type them into the message box at the bottom of the screen and press enter:</span></p> - -<table style="width: 100%;"> - <tbody> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/join #channel</span></span></td> - <td>Joins you to the specified channel until you quit your IRC client or quit the channel</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/leave</span></span></td> - <td>Leave the current channel</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/mode #channel +k password</span></span></td> - <td>Sets a password for the channel. If #channel is not specified, the command is executed for the current channel.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/mode #channel +o nickname</span></span></td> - <td>Sets specified user as an owner or moderator of the specified channel. If a #channel is not specified, the command is executed for the current channel.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/mode #channel +s</span></span></td> - <td>Sets the channel as a secret channel. This takes the channel off the public list of active channels and topics.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/msg nick message</span></span></td> - <td>Sends a private message to the specified user</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/nick nickname</span></span></td> - <td>Change your current nickname</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">nickname: ping</span></span></td> - <td>Get a user's attention (nickname is the name of the user you want the attention of)</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">nickname: pong</span></span></td> - <td>Respond to a user's ping (nickname is the name of the user who wants your attention)</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/query nickname</span></span></td> - <td>Opens a private chat with the specified user</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/quit message</span></span></td> - <td>Disconnects you from the current server displaying the message in all connected channels prior to quitting</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/reload styles</span></span></td> - <td>Some IRC clients, Colloquy on Mac in particular, stop displaying your messages in the channel window. If this happens, you can type this command to resolve this issue.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/server server-name</span></span></td> - <td>Manually connect to a server</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/topic topic</span></span></td> - <td>Changes the topic of the channel. The topic is a message that displays first when you join a channel.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/whois nickname</span></span></td> - <td>Display information about the specified user. This information displays in the server window.</td> - </tr> - </tbody> -</table> - -<p><em>For more information about IRC commands go <a href="http://www.technerd.net/irc-commands.html">here</a>.</em></p> - -<h2 class="western" id="机器人" style="font-style: normal;">机器人</h2> - -<p><span style="font-style: normal;">Some users in IRC are not human. These users are known as bots and automatically perform certain tasks; some automatic, some triggered by other users. The most common of these bots are called NickServ, ChanServ, and Firebot.</span></p> - -<h3 class="western" id="NickServ"><span style="font-size: small;"><span style="font-style: normal;"><strong>NickServ</strong></span></span></h3> - -<p><span style="font-style: normal;">This bot allows you to register your nickname which prevents other users from using it. NickServ also automatically elevates all registered users to operators when they sign on.</span><span style="font-style: normal;"><span style="font-weight: normal;">The following are some helpful commands which can be used by NickServ:</span></span></p> - -<table style="width: 100%;"> - <tbody> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;"><span style="font-style: normal;"><span style="font-weight: normal;">/msg NickServ REGISTER password email</span></span></span></span></td> - <td><span style="font-style: normal;"><span style="font-weight: normal;">This registers your nickname with the server.</span></span></td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;"><span style="font-style: normal;"><span style="font-weight: normal;">/msg NickServ IDENTIFY password</span></span></span></span></td> - <td><span style="font-style: normal;"><span style="font-weight: normal;">Once registered, you need to type this every time you want to sign into channels using your registered nickname</span></span></td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;"><span style="font-style: normal;"><span style="font-weight: normal;">/msg NickServ HELP</span></span></span></span></td> - <td><span style="font-style: normal;"><span style="font-weight: normal;">This displays a list of commands which can be used with NickServ</span></span></td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;"><span style="font-style: normal;"><span style="font-weight: normal;">/msg NickServ HELP REGISTER</span></span></span></span></td> - <td><span style="font-style: normal;"><span style="font-weight: normal;">This displays helpful information about nickname registration</span></span></td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;"><span style="font-style: normal;"><span style="font-weight: normal;">/msg NickServ HELP IDENTIFY </span></span></span></span></td> - <td><span style="font-style: normal;"><span style="font-weight: normal;">This displays helpful information about identifying yourself upon sign in</span></span></td> - </tr> - </tbody> -</table> - -<p><em><span style="font-weight: normal;">For more information about NickServ go <a href="https://www.esper.net/nickserv.php">here</a>.</span></em></p> - -<h3 id="ChanServ"><span style="font-size: small;"><span style="font-style: normal;"><strong>ChanServ</strong></span></span></h3> - -<p><span style="font-style: normal;"><span style="font-weight: normal;">This bot allows you to register new channels and control aspects of channels. The following are some helpful commands which can be used by ChanServ:</span></span></p> - -<table style="width: 100%;"> - <tbody> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/msg ChanServ HELP</span></span></td> - <td>This displays a list of commands which can be used with ChanServ</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/msg ChanServ IDENTIFY #channel password</span></span></td> - <td>Allows you to edit the aspects of the specified channel given the correct password</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/msg ChanServ REGISTER #channel password topic</span></span></td> - <td>Registers a channel given the correct password and sets the topic</td> - </tr> - </tbody> -</table> - -<p><em><span style="font-weight: normal;">For more information about ChanServ go <a href="https://www.esper.net/chanserv.php">here</a>.</span></em></p> - -<h3 id="Firebot"><span style="font-size: small;"><span style="font-style: normal;"><strong>Firebot</strong></span></span></h3> - -<p><span style="font-size: small;"><span style="font-style: normal;"><span style="font-weight: normal;">Firebot is a bot which assists with Mozilla related activities on IRC. For instance, Firebot automatically posts messages to #developers about the status of automated tests. The following are some helpful commands which can be used by Firebot:</span></span></span></p> - -<table style="width: 100%;"> - <tbody> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">bug ######</span></span></td> - <td>When a bug number is mentioned in a message, Firebot automatically displays the link and summary from bugzilla for that bug.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/msg firebot uuid</span></span></td> - <td>Displays a unique identifier. This is useful when creating interfaces for add-on development.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/msg firebot cid</span></span></td> - <td>Displays a unique 128-bit number which can be used to identify a class or component.</td> - </tr> - <tr> - <td><span style="font-size: x-small;"><span style="font-family: courier new,monospace;">/invite firebot #channel</span></span></td> - <td>Adds firebot to the specified channel.</td> - </tr> - </tbody> -</table> - -<p><em><span style="font-weight: normal;">For more information about Firebot go <a href="https://wiki.mozilla.org/Firebot">here</a>.</span></em></p> - -<h2 class="western" id="进一步阅读" style="font-style: normal;">进一步阅读</h2> - -<p><span style="font-style: normal;"><a href="http://www.irchelp.org/irchelp/changuide.html">IRC Channel Operator's Guide</a> (New Version)</span> <span style="font-style: normal;"><a href="http://www.irchelp.org/irchelp/opguide.html">IRC Channel Operator's Guide</a> (Old Version) [</span><em>From 1995, but still quite useful</em><span style="font-style: normal;">]</span></p> diff --git a/files/zh-cn/archive/mozilla/help_viewer/creating_a_help_content_pack/index.html b/files/zh-cn/archive/mozilla/help_viewer/creating_a_help_content_pack/index.html deleted file mode 100644 index 2a64c576e7..0000000000 --- a/files/zh-cn/archive/mozilla/help_viewer/creating_a_help_content_pack/index.html +++ /dev/null @@ -1,200 +0,0 @@ ---- -title: Creating a Help Content Pack -slug: Archive/Mozilla/Help_viewer/Creating_a_Help_Content_Pack -translation_of: Archive/Mozilla/Help_viewer/Creating_a_Help_Content_Pack ---- -<p><span class="comment">Original doc: <a class="external" href="http://www.mozilla.org/projects/help-viewer/content_packs" rel="freelink">http://www.mozilla.org/projects/help.../content_packs</a> I hesitate to call it "original", tho, because I've basically rewritten the entire thing so that it's easier and faster to use to create Help content. The previous document had a lot of places where ideas were simply introduced without explanation, and I've tried to go through things a bit more slowly with better descriptions. This is still very much a work in progress, tho, and I need to complete the rest of it soon (where "complete" means "use what's there that's good, build on the stuff that's not as good, and add other useful information as necessary".</span></p> -<p>This document describes how to integrate HTML help documentation into your application using the Mozilla Help Viewer. Documentation contained in the Help Viewer can be accessed using any XUL application or program that embeds Mozilla.</p> -<h3 id="What_is_a_Content_Pack.3F" name="What_is_a_Content_Pack.3F">What is a Content Pack?</h3> -<p>A Content Pack is a packaged set of files that describe Help content. Content Packs include help documents written in <a href="cn/XHTML">XHTML</a>, a content pack descriptor file written in <a href="cn/RDF">RDF</a>, and a table of contents, index, and glossary (also written in RDF). You can create a content packs which inherit from existing Mozilla Help content packs.</p> -<h3 id="The_Contents_of_a_Content_Pack" name="The_Contents_of_a_Content_Pack">The Contents of a Content Pack</h3> -<p>Content Packs consist of a general pack description file, table of contents, index, search, glossary, and help documents. The help documents are written in XHTML, and the rest are written in RDF. The content pack descriptor file outlines the framework of the contents of the pack by pointing to the files describing the table of contents, index, and glossary RDF files. The table of contents and index files are simple tree-based outlines written in RDF. The glossary file is written in RDF and consists of a simple list of terms with corresponding URLs to the term definition.</p> -<h3 id="Creating_a_Content_Pack" name="Creating_a_Content_Pack">Creating a Content Pack</h3> -<h4 id="The_Content_Pack_Descriptor_File" name="The_Content_Pack_Descriptor_File">The Content Pack Descriptor File</h4> -<p>As mentioned earlier, the content pack descriptor file is written using RDF. If you don't know RDF, that's okay - for our purposes, you won't need to learn very much. If you understand the basics of HTML or (preferably) XML, you'll understand the very basics of the syntax - elements, attributes, and element contents. Understanding the syntax is important because small syntax errors can mean that a whole file won't be loaded correctly. However, while it may seem like this is a disadvantage, it's actually an advantage - if you make an error you'll know immediately, and you should be able to easily figure out what the problem is by directly loading the file in Firefox. Later, when we get to actually writing content, you'll need to know XHTML, but for now knowledge of the syntax should be enough.</p> -<p>Open up your favorite text editor and create the file <code>content-pack.rdf</code>. Insert into it the following text:</p> -<pre><?xml version="1.0"?> -<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" - xmlns:nc="http://home.netscape.com/NC-rdf#"> - -</rdf:RDF> -</pre> -<p>If you're familiar with HTML or XML, you might recognize this as the container element for the whole document. It serves as a wrapper around the entire contents of the file, marking it as RDF.</p> -<p>Next, you'll need to insert a <code>rdf:Description</code> element into the file, inside the <code>rdf:RDF</code> element just created:</p> -<pre> <rdf:Description rdf:about="urn:root" - nc:title="" - nc:defaulttopic="" - nc:base=""> - </rdf:Description> -</pre> -<p>Fill in the attributes as follows:</p> -<ul> - <li><b>rdf:about</b> must be <code>urn:root</code> or your pack won't work. This attribute marks the start point in the RDF graph described by the file, and the Help Viewer searches for this element in order to query for further information (stored in child elements) about the content pack being parsed.</li> - <li><b>nc:title</b> is where you specify the title (e.g., "Mozilla Firefox Help") for the Help Window. This attribute is <b>required</b>.</li> - <li><b>nc:defaulttopic</b> will hold the <code>rdf:ID</code> of the topic you want displayed when the viewer first loads if none has been specified. This attribute also specifies what topic is loaded when the user hits the Home button in the viewer. We'll get to exactly how to fill in this attribute later. This attribute is <b>optional</b>, with fallback to the value <code>welcome</code>.</li> - <li><b>nc:base</b> contains the base URL relative to which the Help content referenced in the descriptor file is located. For example, if your glossary, index, and table of contents RDF files are all located at <code><a class="external" rel="freelink">chrome://myapp/locale/help/*</a></code>, then you could put <code><a class="external" rel="freelink">chrome://myapp/locale/help/</a></code> here and use only the actual file names without path when needed later. You don't actually need this attribute if you don't want it, but it's a useful shorthand to save typing.</li> -</ul> -<p>Next, we need to describe where to find the glossary, index, and table of contents. (We're still not actually to the point where we're describing the actual data in each of these, so we'll just use some filler data for now.) Add the following code inside the <code>rdf:Description</code> element you just created:</p> -<pre> <nc:panellist> - <rdf:Seq> - - </rdf:Seq> - </nc:panellist> -</pre> -<p>You'll create the relevant information descriptions within the <code>rdf:Seq</code> element.</p> -<p>The location of each of the glossary, index, and table of contents data sources is stored in one <code>rdf:Description</code> element contained within one <code>rdf:li</code> element, like so:</p> -<pre> <rdf:Seq> - <rdf:li> - <rdf:Description nc:panelid="glossary" - nc:datasources="chrome://foo/locale/help/glossary.rdf"/> - </rdf:li> - <rdf:li> - <rdf:Description nc:panelid="toc" - nc:datasources="chrome://foo/locale/help/glossary.rdf"/> - </rdf:li> - <rdf:li> - <rdf:Description nc:panelid="index" - nc:datasources="chrome://foo/locale/help/glossary.rdf"/> - </rdf:li> - </rdf:Seq> -</pre> -<p>The Help Viewer UI may or may not provide a panel for each of these data sources. In Firefox 1.0 each data source had a panel. Starting with Firefox 1.1 and the Mozilla 1.8 platform, only the table of contents data source will be displayed. The glossary and index data sources will be - <i> - hidden</i> - - information found only in them will not be displayed unless the user conducts a search of the Help pack that would return glossary or index results.<span class="comment">XXX this sentence is ugly - a little rewording help here would be nice</span></p> -<p>A data source description is pretty much the same no matter which type you're defining, and the syntax is pretty simple. Each panel is specified by one <code>rdf:Description</code> element with the following attributes:</p> -<ul> - <li><b>nc:panelid</b> specifies the name of the panel, which may be any one of <code>glossary</code>, <code>search</code>, <code>toc</code>, or <code>index</code>. The data source specified by <code>toc</code> will always be displayed, while the other data sources may only be available by searching through the loaded content pack.</li> - <li><b>nc:datasources</b> is a space-separated list of RDF datasources used in construction of the structure of referenced topics. Generally, each item in the list will be a URI to an RDF file, but if you're more familiar with RDF you can also refer to a specific node within the RDF file using its <code>rdf:ID</code> attribute.</li> - <li><b>nc:platform</b> (added in Mozilla 1.8b2/Firefox 1.1) when present specifies the platforms to which the information stored in the referenced data sources applies. This attribute is useful when some of your help contents only apply to one specific platform. If this attribute is omitted, the information in the data sources applies to - <i> - all</i> - platforms. The attribute is a space-separated list of platform strings. Strings recognized from 1.8 onward are <b>win</b>, <b>mac</b>, <b>os2</b>, and <b>unix</b>; more will be added as required. Unrecognized strings are ignored during parsing. An example of how to use this attribute follows:</li> -</ul> -<pre> <!-- Assumptions: - win-toc.rdf contains Windows- and OS/2-specific info, - unix-toc.rdf contains Linux- and Mac-specific info. --> - <rdf:li> - <rdf:Description nc:panelid="toc" - nc:platform="win os2" - nc:datasources="win-toc.rdf"/> - </rdf:li> - <rdf:li> - <rdf:Description nc:panelid="toc" - nc:platform="unix mac" - nc:datasources="unix-toc.rdf"/> - </rdf:li> -</pre> -<p>There's one final element to add inside <code>rdf:Seq</code> to complete the content pack descriptor file: an element to describe the Help Viewer's search function. Search automatically goes through all of the elements in the table of contents, index, and glossary, but you might wish to have Search go through more sources of data. One possible source might be an online, dynamically-generated list of added content stored on your web site. To have the Help Viewer search through these additional data sources, define another <code>rdf:li</code> element like so:</p> -<pre> <rdf:li> - <rdf:Description nc:panelid="search" - nc:datasources="" - nc:emptysearchtext="[No matching items found.]" - nc:emptysearchlink="chrome://foo/locale/bar.html"/> - </rdf:li> -</pre> -<ul> - <li><b>nc:panelid</b> should be set to <code>search</code>.</li> - <li><b>nc:datasources</b> should be set as with table of contents, index, and glossary definitions.</li> - <li><b>nc:platform</b> (added in Mozilla 1.8b2/Firefox 1.1) may be used on search data sources as it's used on table of contents, index, and glossary definitions.</li> - <li><b>nc:emptysearchtext</b> specifies the text that is shown when a search through Help returns no results.</li> - <li><b>nc:emptysearchlink</b> specifies what URI should be shown when the pseudo-result "no results found" is accessed. This attribute is <b>required</b>. The sample page <code><a class="external" rel="freelink">chrome://help/locale/welcome.xhtml</a></code> has a section on searching which may be a useful link to use here.</li> -</ul> -<p>Note that you can use the <code>nc:datasources</code> attribute to inherit content from other content packs. One common use of this is to inherit the small Using the Help Window article provided with the viewer. For example, the following code uses a datasource outside the content pack you have created to include the article in a table of contents:</p> -<pre> <rdf:li> - <rdf:Description nc:panelid="toc" - nc:datasources="chrome://help/locale/help-toc.rdf chrome://foo/locale/help/glossary.rdf"/> - </rdf:li> - -</pre> -<p>Each of the different data source types (<code>toc</code>, <code>index</code>, <code>glossary</code>, and <code>search</code>) may be used multiple times (and in the case of platform-specific information, must be used multiple times). However, it is recommended you use a space-separated list of URIs for <code>nc:datasources</code> instead of separate entries, as separate entries will require a slightly longer time to load.</p> -<h4 id="The_Glossary_File" name="The_Glossary_File">The Glossary File</h4> -<p>The glossary file has the simplest format of all the data sources you'll need because there's only one level of content. (The index, table of contents, and search data sources are more likely to be nested, complicating their formats.) Create a new RDF file (for now let's name it <code>glossary.rdf</code>), and add the following lines to it:</p> -<pre><?xml version="1.0"?> - -<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" - xmlns:nc="http://home.netscape.com/NC-rdf#"> - - <rdf:Description rdf:about="urn:root"> - <nc:subheadings> - <rdf:Seq> - - - </rdf:Seq> - <nc:subheadings> - </rdf:Description> - -</rdf:RDF> -</pre> -<p>This forms the outer framework of a glossary description file. To add data to it, add one of the following per entry in your glossary within the <code>rdf:Seq</code> above:</p> -<pre> <rdf:li> - <rdf:Description nc:name="" - nc:link=""/> - </rdf:li> -</pre> -<p>The <code>rdf:li</code> element serves purely to contain each separate entry. The <code>rdf:Description</code> element describes the glossary entry. It has two required attributes: <code>nc:name</code> and <code>nc:link</code>. <code>nc:name</code> is the name for the entry - it's what's currently displayed in the glossary as the entry's title. <code>nc:link</code> contains a URI referencing what will be displayed in the viewer when the entry is accessed.</p> -<h4 id="The_Index_File" name="The_Index_File">The Index File</h4> -<div class="side-note-right"> - <p>One important note on the index file is that there is <b>no</b> automatically generated set of top-level letters (e.g., A for Accessibility and Automation or B for Book and Border). Help documentation may be written in any language, so such automatic splitting is not desirable. You must implement such splitting if you wish to have it.</p> -</div> -<p>The index data source structurally differs from the glossary in that it is more likely to have multiple levels. A single-level index may be accomplished in exactly the same way as a glossary file, but multiple levels can make it easier to navigate to specific information. Let's start with a brief sample RDF file with a single level:</p> -<pre><?xml version="1.0"?> - -<rdf:RDF xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" - xmlns:nc="http://home.netscape.com/NC-rdf#"> - - <rdf:Description rdf:about="urn:root"> - <nc:subheadings> - <rdf:Seq> - <rdf:li><rdf:Description nc:link="foo.html" nc:title="Foo"/></rdf:li> - <rdf:li><rdf:Description nc:link="baz.html" nc:title="Baz"/></rdf:li> - </rdf:Seq> - <nc:subheadings> - </rdf:Description> - -</rdf:RDF> -</pre> -<p>There's not much here: a single level containing the two entries "Foo" and "Baz". Now, let's say you want to add an entry "bar" underneath "Foo". How would you do this? First, you need to add an attribute to the "Foo" entry so that you can precisely refer to it. The <code>rdf:ID</code> attribute serves this purpose. It should be unique both within file and within the data sources in your content pack to ensure clarity.</p> -<p> </p> -<pre class="eval"> <rdf:li><rdf:Description <b>rdf:ID="foo"</b> nc:link="foo.html" nc:title="Foo"/></rdf:li> -</pre> -<p>Next, add the following to your file just after the existing <code>rdf:Description</code> element:</p> -<pre> <rdf:Description rdf:about="#foo"> - <nc:subheadings> - <rdf:Seq> - <rdf:li><rdf:Description rdf:ID="bar" nc:link="bar.html" nc:title="bar"/></rdf:li> - </rdf:Seq> - </nc:subheadings> - </rdf:Description> -</pre> -<p>Except for the different value for <code>rdf:about</code>, this looks exactly like a top-level entry definition. The difference is a result of how RDF works. In RDF data describes data. Top-level entries describe the root node, <code>urn:root</code>; nested entries describe other entries. You can refer to an entry by giving the entry a unique <code>rdf:ID</code> attribute. Then, to describe that entry, you set an <code>rdf:about</code> attribute to the value of the entry's <code>rdf:ID</code>, prefixed by a <code>#</code>.</p> -<p>Nesting as described above works exactly the same no matter how deeply or shallowly nested your entry is. Nesting theoretically can work to any number of levels, but for practical reasons nesting is limited to roughly 20 levels. If you're coming anywhere close to this limit, however, you probably should be considering exactly why you need so much nesting.</p> -<h4 id="The_Table_of_Contents_File" name="The_Table_of_Contents_File">The Table of Contents File</h4> -<p>The table of contents file is the most important data source you'll create. The help viewer will display the table of contents when you start the viewer. In some versions of the viewer, it will be the - <i> - only</i> - data source ever directly displayed. It's the primary way to provide a structured view of the help you provide to users.</p> -<p>The table of contents also provides the list of topics from which the home page for the viewer will be chosen. Recall that in the content pack descriptor file you included an <code>nc:defaulttopic</code> attribute, which defaulted to "welcome". The value of that attribute is the <code>rdf:ID</code> of the topic you want displayed when the viewer is loaded.</p> -<p>The table of contents data source is exactly like an index data source, and if you have a working index data source you could use it as a table of contents with no changes whatsoever. See the instructions on creating glossary and index data sources to learn how to create a table of contents.</p> -<h4 id="Additional_Search_Databases" name="Additional_Search_Databases">Additional Search Databases</h4> -<p>Starting with Firefox 1.1, you can define additional information databases through which the help viewer will search. The data from these may never even be displayed to the user, but if he tries to search through Help, he will see results from these databases.</p> -<p>Defining a search database is exactly like defining a table of contents file (and therefore exactly like creating an index file), so follow the instructions there to create additional data sources as you need them.</p> -<h3 id="Viewing_your_Content_Pack_in_the_Help_Viewer" name="Viewing_your_Content_Pack_in_the_Help_Viewer">Viewing your Content Pack in the Help Viewer</h3> -<p>To launch the Help Viewer with your content pack, you need to have <code><a class="external" rel="freelink">chrome://help/content/contextHelp.js</a></code> loaded into the XUL file that provides the UI to open the help viewer:</p> -<pre> <script type="application/x-javascript" - src="chrome://help/content/contextHelp.js"/> -</pre> -<p>This will allow you to access all of the viewer functions. To open the Help Viewer, run the <code>openHelp()</code> function. It's exactly the same as any JavaScript command, you you can insert it in <code>command</code> elements, <code>oncommand</code> attributes, and other such places. The parameters are described below:</p> -<pre>openHelp(aTopic, aContentPackSpec); -</pre> -<ul> - <li><b>aTopic</b>: the <code>rdf:ID</code> of the topic you want to load as the home page in the help viewer.</li> - <li><b>aContentPackSpec</b>: the path to the content pack you want to load.</li> -</ul> -<p>Here is an example of how Firefox opens its help documentation:</p> -<pre>openHelp('firefox-help', 'chrome://browser/locale/help/help.rdf'); -</pre> -<h3 id="Packing_It_All_Up" name="Packing_It_All_Up">Packing It All Up</h3> -<div class="noinclude"> - </div> -<p></p> diff --git a/files/zh-cn/archive/mozilla/help_viewer/index.html b/files/zh-cn/archive/mozilla/help_viewer/index.html deleted file mode 100644 index 051ffdd64c..0000000000 --- a/files/zh-cn/archive/mozilla/help_viewer/index.html +++ /dev/null @@ -1,22 +0,0 @@ ---- -title: Help Viewer -slug: Archive/Mozilla/Help_viewer -translation_of: Archive/Mozilla/Help_viewer ---- -<p>Help Viewer: Allows information to be shown to the user inside Mozilla.</p> -<h3 id="Introduction" name="Introduction">Introduction</h3> -<p>Computers and software are incredibly complex. Naturally, then, everyone needs a little help now and then, and getting that help to the user is critical to making applications useful. Consequently, the Mozilla platform provides a cross-platform help viewer along with a framework for providing built-in help documentation. Mozilla's help viewer makes providing documentation an easy job, and this document will describe how you can use it.</p> -<ul> - <li><a class="external" href="http://www.mozilla.org/projects/help-viewer/">Help Viewer Project Page</a></li> -</ul> -<h3 id="Articles_&_Tutorials" name="Articles_&_Tutorials">Articles & Tutorials</h3> -<ul> - <li><a href="en/Help_Viewer/Creating_a_Help_Content_Pack">Creating a Help Content Pack</a> <span class="comment">task-oriented, as opposed to spec-type stuff like the link below will be</span></li> -</ul> -<h3 id="Other_Resources" name="Other_Resources">Other Resources</h3> -<ul> - <li><a href="en/Help_Viewer/Content_Pack_Specification">Content Pack Specification</a> <span class="comment">a technical description of it, meant primarily to solidify the idea of exactly what constitutes a content pack</span></li> -</ul> -<div class="noinclude"> - </div> -<p></p> diff --git a/files/zh-cn/archive/mozilla/index.html b/files/zh-cn/archive/mozilla/index.html deleted file mode 100644 index f4e2252d18..0000000000 --- a/files/zh-cn/archive/mozilla/index.html +++ /dev/null @@ -1,7 +0,0 @@ ---- -title: Archived Mozilla and build documentation -slug: Archive/Mozilla -translation_of: Archive/Mozilla ---- -<p>These articles are archived, obsolete documents about Mozilla, Gecko, and the process of building Mozilla projects.</p> -<p></p><dl><dt class="landingPageList"><a href="/zh-CN/docs/Archive/Mozilla/Help_viewer">Help Viewer</a></dt><dd class="landingPageList">Help Viewer: Allows information to be shown to the user inside Mozilla.</dd><dt class="landingPageList"><a href="/zh-CN/docs/Archive/Mozilla/Tamarin">Tamarin</a></dt><dd class="landingPageList"></dd><dt class="landingPageList"><a href="/zh-CN/docs/XPInstall">XPInstall</a></dt><dd class="landingPageList"></dd><dt class="landingPageList"><a href="/zh-CN/docs/XUL_Explorer">XUL Explorer</a></dt><dd class="landingPageList">XUL Explorer是一款提供一个很容易上手来进行XUL测试的 <a href="/en/XULRunner" title="en/XULRunner">XULRunner</a> 应用。这个编辑器很简单，他能在线预览或者在一个独立窗口预览XUL。它有一个列表的代码片段(小片段的XUL或JavaScript),可以快速插入到编辑器中。XUL可以加载和保存到文件。其中的XUL验证器和 <a href="/en/Error_Console" title="en/Error_Console">错误控制台</a> 可以帮助您找到问题所在。帮助菜单提供了访问 MDC上XUL信息的通道，更有 “keyword” 查找框帮助查找XUL元素。</dd><dt class="landingPageList"><a href="/zh-CN/docs/Drag_and_Drop">拖拽</a></dt><dd class="landingPageList">这部分描述了怎样实现可以拖拽和拖放到其他对象上的可拖拽对象。</dd></dl><p></p> diff --git a/files/zh-cn/archive/mozilla/marketplace/index.html b/files/zh-cn/archive/mozilla/marketplace/index.html deleted file mode 100644 index 3beff9da4f..0000000000 --- a/files/zh-cn/archive/mozilla/marketplace/index.html +++ /dev/null @@ -1,134 +0,0 @@ ---- -title: 火狐应用工场 -slug: Archive/Mozilla/Marketplace -tags: - - Marketplace - - TopicStub -translation_of: Archive/Mozilla/Marketplace ---- -<div class="summary">火狐应用工场是一个开放的、非独占的在线应用市场，其所提供的应用都是使用HTML5技术开发的Web应用。</div> - -<div class="column-container"> -<div class="warning"> -<p>为了提供更多、更深入的关于如何发布与管理您的应用的信息，此页面正处于不断的维护更新中。</p> -</div> - -<p><span class="seoSummary"><a href="https://marketplace.firefox.com/">火狐应用工场</a> 使得开发者可以使用标准的Web技术、语言和工具来发布跨平台的<a href="/zh-CN/Apps">开放Web应用</a>。Mozilla将会把它的核心理念——开放、自由、用户导向——带到每一个应用中去。</span></p> - -<p><span class="seoSummary"><a href="https://marketplace.firefox.com/" title="/zh-CN/docs/Web/Apps/Publishing/Submitting_an_app">火狐应用工场</a>是我们为了发行应用（免费或付费）而自行建立的应用商城。向火狐应用工场<a href="/zh-CN/docs/Web/Apps/Publishing/Submitting_an_app">提交应用</a>很简单，只需要上传应用并添加必要的信息，然后等待我们审查完毕，确认应用高效、非恶意即可。向火狐应用工场提交应用还可以获得一些其它的好处。您的应用会得到更广泛的推广，付费的应用发布起来也更加简单，而且您不需要在您的Web站点上实现任何特定的API。主机的应用和打包的应用都可以提交给火狐应用工场。</span></p> -</div> - -<div class="row topicpage-table"> -<div class="section"> -<h2 class="Community" id="Community" name="Community">发布您的应用</h2> - -<dl> - <dt><a href="/zh-CN/Marketplace/Options">应用发布选项</a></dt> - <dd>当你完成一个开放Web应用之后，你可以选择多种不同的方式来发布它。这一章节将会向您介绍这些方式的不同。</dd> - <dt><a href="/zh-CN/Marketplace/Submission/Submitting_an_app">向火狐应用商场提交应用</a></dt> - <dd>如果您想向火狐应用工场发布一个应用，这里提供了详尽的指引。</dd> - <dt><a href="/zh-CN/Apps/Publishing/General_app_publishing_topics">与应用发布有关的常见问题</a></dt> - <dd>这里列出了关于发布开放Web应用有关的常见的问题，相信会对您有用。</dd> - <dt><a href="/zh-CN/Marketplace/Marketplace_APIs">火狐应用商场API</a></dt> - <dd>这些API参考内容涵盖了火狐应用商场的大多数API，它们可以帮助您配置应用的收费账户，使您的应用提交自动化等。</dd> -</dl> -</div> - -<div class="section"> -<h2 class="Community" id="Community" name="Community">关于收益</h2> - -<dl> - <dt><a href="/zh-CN/Marketplace/Monetization/Profiting_from_your_app">从您的应用中获取收益</a></dt> - <dd>要如何从您辛勤开发的应用中获取回报呢？不用担心，这篇文章会告诉您如何做，包括应用本身收费还是应用内收费。</dd> -</dl> - -<h2 class="Tools" id="Tools" name="Tools">应用开发工具</h2> - -<ul> - <li><a href="/zh-CN/Firefox_OS/Using_the_App_Manager">Firefox OS应用管理器</a></li> - <li><a href="/zh-CN/Apps/App_developer_tools">应用开发工具</a></li> -</ul> - -<h2 id="来自己建一个应用商场吧">来自己建一个应用商场吧</h2> - -<dl> - <dt><a href="/zh-CN/Marketplace/Creating_a_store">创建一个商店</a></dt> - <dd>您完全可以不借助火狐应用商场来发布您的应用。</dd> -</dl> -</div> -</div> - -<h2 id="Subnav">Subnav</h2> - -<ol> - <li><a href="/zh-CN/Marketplace/Prepare">做好准备</a> - - <ol> - <li><a href="/zh-CN/Marketplace/Prepare/Introduction">简介</a></li> - <li><a href="/zh-CN/Marketplace/Prepare/Deciding_what_to_build">做个什么应用呢？</a></li> - <li><a href="/zh-CN/Marketplace/Prepare_For_Success/Getting_to_know_your_users">您的应用面向哪些群体？</a></li> - <li><a href="/zh-CN/Marketplace/Prepare/Choosing_your_business_model">选择合适的商业模式</a></li> - <li><a href="/zh-CN/Marketplace/Prepare_For_Success/Quality_and_your_app">开发一款优质的应用</a></li> - <li><a href="/zh-CN/Marketplace/Prepare/Localizing_your_apps">本地化您的应用</a></li> - <li><a href="/zh-CN/Marketplace/Prepare/Promoting_your_app">推广您的应用</a></li> - <li><a href="/zh-CN/Marketplace/Prepare/Creating_your_community">创建一个社区</a></li> - </ol> - </li> - <li><a href="/zh-CN/Marketplace/Options">应用发布选项</a> - <ol> - <li><a href="/zh-CN/Marketplace/Options/Introduction">简介</a></li> - <li><a href="/zh-CN/Marketplace/Options/Packaged_apps">打包应用</a></li> - <li><a href="/zh-CN/Marketplace/Options/Hosted_apps">主机应用</a></li> - <li><a href="/zh-CN/Marketplace/Options/Packaged_or_hosted_">如何在两者之间选择</a></li> - <li><a href="/zh-CN/Marketplace/Options/Open_web_apps_for_android">面向安卓的开放Web应用</a></li> - <li><a href="/zh-CN/Marketplace/Options/Open_web_apps_for_desktop">面向桌面的开放Web应用</a></li> - <li><a href="/zh-CN/Marketplace/Options/Self_publishing">发布您的应用吧</a></li> - <li><a href="/zh-CN/Marketplace/Options/Creating_a_store">建一个属于自己的商店</a></li> - </ol> - </li> - <li><a href="/zh-CN/Marketplace/Submission">应用提交与审核</a> - <ol> - <li><a href="/zh-CN/Marketplace/Submission/Submitting_an_app" title="这条指引会详细地告诉您如何向火狐应用市场提交应用">向火狐应用工场提交一个应用</a></li> - <li><a href="/zh-CN/Marketplace/Submission/Rating_Your_Content">获取您应用的排名</a></li> - <li><a href="/zh-CN/Marketplace/Submission/Marketplace_review_criteria" title="向火狐应用市场提交应用必须达到的要求">应用工场审核标准</a></li> - <li><a href="/zh-CN/Marketplace/Publishing/Marketplace_screenshot_criteria" title="关于如何在提交应用时创建有效的截图的一些指引">应用工场截图要求</a></li> - <li><a href="/zh-CN/Marketplace/Publishing/Privacy_policies" title="用户隐私非常重要，您有必要整理并遵守一些用户隐私条款以获取他们的信任。这篇文章会告诉您如何整理用户隐私条款。">隐私条款</a></li> - <li><a href="/zh-CN/Marketplace/Submission/Testing_and_troubleshooting">应用测试与排错</a></li> - </ol> - </li> - <li><a href="/zh-CN/Marketplace/Publishing">应用推广</a> - <ol> - <li><a href="/zh-CN/Marketplace/Publishing/Pricing">应用定价以及应用内购买</a> - <ol> - <li><a href="/zh-CN/Marketplace/Publishing/Pricing/Introduction">简介</a></li> - <li><a href="/zh-CN/Marketplace/Publishing/Pricing/Providers">支付提供商</a> - <ol> - <li><a href="/zh-CN/Marketplace/Publishing/Pricing/Providers/Bango">Bango</a></li> - </ol> - </li> - </ol> - </li> - <li><a href="/zh-CN/Marketplace/Publishing/Updating_apps" title="Information about how both hosted and packaged app updates are handled, and what you need to do to ensure that your app properly supports updating.">更新应用</a></li> - <li><a href="/zh-CN/Marketplace/Publishing/Adding_a_subdomain" title="For security reasons, each app must have its own domain (or subdomain) on the Web. This article covers how to go about creating a subdomain for your app.">为应用添加子域</a></li> - </ol> - </li> - <li><a href="/zh-CN/Marketplace/Monetization">应用获利</a> - <ol> - <li><a href="/zh-CN/Marketplace/Monetization/Profiting_from_your_app" title="This guide contains introductory materials on how to monetize your apps, including tools needed, and a monetization calculator.">从你的应用中获利</a></li> - <li><a href="/zh-CN/Marketplace/Monetization/App_payments_guide">应用付款指南</a></li> - <li><a href="/zh-CN/Marketplace/Monetization/In-app_payments" title="为你的应用提供导入内购支持的指南。">应用内购</a></li> - <li><a href="/zh-CN/Marketplace/Monetization/validating_a_receipt" title="何时如何确认应用购买的指南。">确认购买Validating a receipt</a></li> - <li><a href="/zh-CN/Marketplace/Monetization/App_pricing" title="A round up of fixed price points you can choose for your paid apps, and how these vary across different currencies, along with useful supporting information on dealing with app payments.">应用价格</a></li> - <li><a href="/zh-CN/Marketplace/Monetization/Payments_Status" title="An at-a-glance summary of what countries have got our app payment services set up in them — where paid apps can be distributed">付款状态</a></li> - </ol> - </li> - <li><a href="/zh-CN/Marketplace/APIs">火狐商场APIs</a> - <ol> - <li><a href="/zh-CN/Marketplace/APIs/Marketplace_utility_library" title="我们提供了一个JavaScript库来帮助开发者更容易的在火狐工场中控制内购和确认购买。">火狐商场公共库</a></li> - <li><a href="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/submission.html" title="The Submission API lets you validate your app, update your app, and fetch information about the apps available to be installed.">提交应用API</a></li> - <li><a href="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/payment.html" title="The Payment API lets you get information about and process in-app purchases as well as to simply get information about what pricing tiers are available.">付款API</a></li> - <li><a href="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/overview.html" title="All Marketplace-related documentation is centered here.">火狐商场API</a></li> - </ol> - </li> - <li><a href="/zh-CN/Marketplace/FAQ">火狐商场FAQ</a></li> -</ol> diff --git a/files/zh-cn/archive/mozilla/marketplace/marketplace_apis/index.html b/files/zh-cn/archive/mozilla/marketplace/marketplace_apis/index.html deleted file mode 100644 index 821b22afdf..0000000000 --- a/files/zh-cn/archive/mozilla/marketplace/marketplace_apis/index.html +++ /dev/null @@ -1,68 +0,0 @@ ---- -title: Firefox Marketplace APIs -slug: Archive/Mozilla/Marketplace/Marketplace_APIs -tags: - - API - - Apps - - Firefox OS Marketplace - - Marketplace -translation_of: Archive/Mozilla/Marketplace/Marketplace_APIs ---- -<div class="summary"> -<p><span class="seoSummary">Links to the main references covering Mozilla's Firefox Marketplace APIs, with which you can handle app submissions, configure a payment account for an app, and more.</span></p> -</div> - -<div class="row topicpage-table"> -<div class="section"> -<dl> - <dt><a href="/en-US/docs/Web/Apps/Publishing/Marketplace_utility_library">Marketplace utility library</a></dt> - <dd>To help you work with the Firefox Marketplace, we provide a JavaScript library you can use in your apps to make it easier to handle in-app payments and verify payment receipts.</dd> - <dt><a href="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/app_submission.html" title="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/app_submission.html">上架API</a></dt> - <dd>The Submission API lets you validate your app, update your app, and fetch information about the apps available to be installed.</dd> - <dt><a href="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/payment.html" title="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/payment.html">支付API</a></dt> - <dd> </dd> - <dd>The Payment API lets you do things like get information about in-app purchases and get information about pricing tiers for various countries.</dd> - <dt><a href="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/overview.html" title="http://firefox-marketplace-api.readthedocs.org/en/latest/topics/overview.html">其他应用市场API</a></dt> - <dd>The full documentation for the Firefox Marketplace APIs.</dd> -</dl> -</div> - -<div class="section"> -<h5 class="Tools" id="Tools" name="Tools">面向应用开发者的工具</h5> -<ul> - <li><a href="https://marketplace.firefox.com/developers/">访问 Firefox 应以市场开发者中心</a></li> - <li><a href="/zh-CN/docs/Mozilla/Firefox_OS/Using_Firefox_OS_Simulator">Firefox OS 模拟器</a></li> - <li><a href="/zh-CN/docs/Apps/App_developer_tools">应用开发者工具</a></li> -</ul> -<h5 class="Documentation" id="Documentation" name="Documentation">技术参考文档</h5> -<div class="twocolumns"> - <ul> - <li><a href="/zh-CN/docs/Web/CSS">CSS</a></li> - <li><a href="/zh-CN/docs/DOM">DOM</a></li> - <li><a href="/zh-CN/docs/Web/HTML">HTML</a></li> - <li><a href="/zh-CN/docs/JavaScript">JavaScript</a></li> - <li><a href="/zh-CN/docs/WebAPI">WebAPI</a></li> - <li><a href="/zh-CN/docs/Web/WebGL">WebGL</a></li> - <li><a href="/zh-CN/docs/SVG">SVG</a></li> - <li><a href="https://www.mozilla.org/zh-CN/apps/">开放网络应用 概览网站</a></li> - <li><a href="https://wiki.mozilla.org/Apps">应用项目 wiki 页面</a></li> - </ul> -</div> -<h5 class="Community" id="Community" name="Community">从社区获取帮助</h5> -<p>如果您还不确定该做的事，欢迎随时加入讨论。</p> -<ul> - <li>咨询 webapps 论坛：<ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-webapps"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.webapps"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.webapps/feeds"> Web feed</a></li> -</ul> - <ul> - <li>在 Open Web Apps IRC 频道上提问和讨论：<a class="link-irc" href="irc://irc.mozilla.org/openwebapps">#openwebapps</a></li> - </ul> - </li> -</ul> -<p><span class="alllinks"><a href="http://www.catb.org/~esr/faqs/smart-questions.html" rel="external">别忘记<em>网络礼仪</em>...</a></span></p> -</div> -</div> diff --git a/files/zh-cn/archive/mozilla/marketplace/options/self_publishing/index.html b/files/zh-cn/archive/mozilla/marketplace/options/self_publishing/index.html deleted file mode 100644 index 0421e01082..0000000000 --- a/files/zh-cn/archive/mozilla/marketplace/options/self_publishing/index.html +++ /dev/null @@ -1,144 +0,0 @@ ---- -title: 自主发布应用 -slug: Archive/Mozilla/Marketplace/Options/Self_publishing -translation_of: Archive/Mozilla/Marketplace/Options/Self_publishing ---- -<div class="summary"> - <p>可能会出现这样一种情况，你不想让你的应用可以在火狐市场上得到，比如，你可能想要把应用分发给你组织中的成员，进行beta版本测试或者只是单纯的做你自己的事。这种情况下你可以直接使用应用源文件在Firefox OS设备上安装和使用应用，而不是发布到火狐市场。</p> -</div> -<p>安装到 Firefox OS 上的 Open Web Apps， 使用 {{ domxref("Apps.install") }} or {{ domxref("Apps.installPackage") }} 运行在设备上或桌面版中。 这两种情况下， 这些 API 都是通过发送描述要安装的 app 的 manifest URL 来安装的。因此自行发布应用的基本要求如下：</p> -<ol> - <li>服务器中包含 app 的manifest</li> - <li>服务器中包含 app （对 host app 而言) 或 app 的打包 zip 文件</li> - <li>在网站上的代码会合适的调用 {{ domxref("Apps.install") }} or {{ domxref("Apps.installPackage") }}</li> -</ol> -<h2 id="局限性">局限性</h2> -<p>在利用自主发布 web 应用之前，你应该了解以下局限性：</p> -<ul> - <li>自主发布应用不可以使用<a href="/en-US/Apps/Build/App_permissions">特殊和认证权限API</a>。要使用这些API需要签名使用火狐市场的提交流程。</li> - <li>你的应用不可以使用火狐市场的应用内购买功能。</li> - <li>你需要实现你自己的搜索技术，因为你借助火狐市场列表中完成。</li> -</ul> -<h2 id="自主发布打包型应用（packed_apps）">自主发布打包型应用（packed apps）</h2> -<p>你可以通过在一个服务器上托管应用的 ZIP 文件及 min-manifest 的方式自己发布一个 package App。mini-manifest 文件必须和 ZIP 在同一目录下，用于识别 app 的安装过程。你可以创建一个脚本来调用 {{ domxref("Apps.installPackage") }}从而传递 mini-manifest 的具体信息。我们来看一下这个过程：</p> -<h3 id="步骤">步骤</h3> -<ol> - <li> - <p>压缩你的应用内容并命名为<code>package.zip。这个文件应该包含所有的应用资源，包括应用清单。</code></p> - <div class="warning"> - <p>注意：你必须要小心你希望出现在打包应用中的压缩内容，不是包含这些内容的目录。如果你压缩的是父目录，应用清单文件将会无法找到，导致打包型应用不可用。</p> - </div> - </li> - <li>创建一个名称为 <code>manifest.webapp</code> 的文件，添加内容如下。这个文件也称为 mini-manifest, 因为它是 manifest 文件的裁剪版本，放置在 Packaged App ZIP 文件中。 它会被{{ domxref("Apps.installPackage") }}所调用以承接 app 的安装任务。要获得更多的细节，请查看下面的 <a href="https://developer.mozilla.org/zh-CN/docs/Mozilla/Marketplace/Options/Self_publishing$edit#Mini-manifest_fields">Mini-manifest 字段</a> 。<br> - <pre class="brush: js language-js"><code class="language-js"><span class="token punctuation">{</span> - <span class="token string">"name"</span><span class="token punctuation">:</span> <span class="token string">"My sample app"</span><span class="token punctuation">,</span> - <span class="token string">"package_path"</span> <span class="token punctuation">:</span> <span class="token string">"http://my-server.com/my-app-directory/package.zip"</span><span class="token punctuation">,</span> - <span class="token string">"version"</span><span class="token punctuation">:</span> <span class="token string">"1"</span><span class="token punctuation">,</span> - <span class="token string">"developer"</span><span class="token punctuation">:</span> <span class="token punctuation">{</span> - <span class="token string">"name"</span><span class="token punctuation">:</span> <span class="token string">"A. Developer"</span><span class="token punctuation">,</span> - <span class="token string">"url"</span><span class="token punctuation">:</span> <span class="token string">"http://my-server.com"</span> - <span class="token punctuation">}</span> -<span class="token punctuation">}</span></code></pre> - </li> - <li>创建安装 app 的脚本文件。此处我们使用了简单的 HTML 文件 <code>index.html</code>,但是你可以将脚本添加到按钮或使用其他合适的方法来在你的站点上调用。 这个页面的JavaScript 会调用 the Packaged App installer API ({{ domxref("Apps.installPackage") }}) 而且还包括了一些回调函数，用于提供安装是否成功的提示信息。 - <pre class="brush: html language-html"><code class="language-html"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>html</span><span class="token punctuation">></span></span> - <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>body</span><span class="token punctuation">></span></span> - <span class="token tag"><span class="token tag"><span class="token punctuation"><</span>p</span><span class="token punctuation">></span></span>Packaged app installation page<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>p</span><span class="token punctuation">></span></span> - <span class="token script"><span class="token tag"><span class="token tag"><span class="token punctuation"><</span>script</span><span class="token punctuation">></span></span> - <span class="token comment"> // This URL must be a full url. -</span> <span class="token keyword">var</span> manifestUrl <span class="token operator">=</span> <span class="token string">'http://my-server.com/my-app-directory/manifest.webapp'</span><span class="token punctuation">;</span> - <span class="token keyword">var</span> req <span class="token operator">=</span> navigator<span class="token punctuation">.</span>mozApps<span class="token punctuation">.</span><span class="token function">installPackage<span class="token punctuation">(</span></span>manifestUrl<span class="token punctuation">)</span><span class="token punctuation">;</span> - req<span class="token punctuation">.</span>onsuccess <span class="token operator">=</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> - <span class="token function">alert<span class="token punctuation">(</span></span><span class="token keyword">this</span><span class="token punctuation">.</span>result<span class="token punctuation">.</span>origin<span class="token punctuation">)</span><span class="token punctuation">;</span> - <span class="token punctuation">}</span><span class="token punctuation">;</span> - req<span class="token punctuation">.</span>onerror <span class="token operator">=</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span> - <span class="token function">alert<span class="token punctuation">(</span></span><span class="token keyword">this</span><span class="token punctuation">.</span>error<span class="token punctuation">.</span>name<span class="token punctuation">)</span><span class="token punctuation">;</span> - <span class="token punctuation">}</span><span class="token punctuation">;</span> - <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>script</span><span class="token punctuation">></span></span></span> - <span class="token tag"><span class="token tag"><span class="token punctuation"></</span>body</span><span class="token punctuation">></span></span> -<span class="token tag"><span class="token tag"><span class="token punctuation"></</span>html</span><span class="token punctuation">></span></span></code></pre> - </li> - <li>通过拷贝 <code>package.zip</code>, <code>package.manifest</code>, 和<code>index.html</code> 到你选定目录(<code> 本例中是 my-app-directory</code> )在你的服务器或站点上配置文件。</li> - <li>现在你就可以使用一个兼容的设备（如 Firefox OS 手机）来安装 app 了。打开 <code>index.html</code> 文件后 (本例中的路径是 <code> <a class="LinkyMobile-ext" href="http://my-server.com/my-app-directory/package.manifest" title="Linkification: http://my-server.com/my-app-directory/package.manifest">http://my-server.com/my-app-directory/index.html</a></code>) 你就会得到一个弹出框，询问你是否想要安装应用。继续安装过程，一旦完成，你的 Web 页面就会提供一个安装成功或失败的提示信息。</li> -</ol> -<div class="note"> - <p>提示: 你可以将 Package App 托管在本地，并在设备上测试。Web Server 和设备必须网络相同，服务器必须能够处理本地网络的请求。你只需要在 mini-manifest 的 <code>package_path </code>中包含绝对路径（如下所示）。如果你使用了非标准端口，记得要包含端口信息，例如 <code><a class="LinkyMobile-ext" href="http://10.10.12.1:8080/package.zip" title="Linkification: http://10.10.12.1:8080/package.zip">http://10.10.12.1:8080/package.zip</a></code>.</p> -</div> -<h3 id="Mini-manifest_字段">Mini-manifest 字段</h3> -<p>当火狐市场为你的应用生成一个迷你清单，它会从你的应用清单中取出信息填充一些字段。你可以在<a href="/en-US/docs/Web/Apps/Manifest">应用清单</a>中找到这些字段的说明。而迷你清单中独有的字段有<code>package_path</code>, <code>release_notes和</code> <code>size</code>。<code>而迷你清单中的name</code>, <code>version</code>, <code>developer</code>和<code>locales字段必须和应用清单相同。</code></p> -<p>这里有一些关于在本地调试时，迷你清单相关的信息：</p> -<dl> - <dt> - <code>name</code></dt> - <dd> - (必须) 应用名称，最大长度128个字符。</dd> - <dt> - <code>package_path</code></dt> - <dd> - (必须) 可以找到应用zip文件的URL。确保<code>package_path是zip文件所在的绝对路径</code></dd> - <dt> - <code>version</code></dt> - <dd> - 应用的版本号。</dd> - <dt> - <code>size</code></dt> - <dd> - 应用zip文件的字节数。这对于本地测试不是必须，但是会在安装过程中提供一个进度条。</dd> -</dl> -<pre class="brush: js language-js"><code class="language-js"><span class="token punctuation">{</span> - <span class="token string">"name"</span><span class="token punctuation">:</span> <span class="token string">"My app"</span><span class="token punctuation">,</span> - <span class="token string">"package_path"</span><span class="token punctuation">:</span> <span class="token string">"http://thisdomaindoesnotexist.org/myapp.zip"</span><span class="token punctuation">,</span> - <span class="token string">"version"</span><span class="token punctuation">:</span> <span class="token string">"1.0"</span><span class="token punctuation">,</span> - <span class="token string">"size"</span><span class="token punctuation">:</span> <span class="token number">172496</span><span class="token punctuation">,</span> - <span class="token string">"release_notes"</span><span class="token punctuation">:</span> <span class="token string">"First release"</span><span class="token punctuation">,</span> - <span class="token string">"developer"</span><span class="token punctuation">:</span> <span class="token punctuation">{</span> - <span class="token string">"name"</span><span class="token punctuation">:</span> <span class="token string">"Developer Name"</span><span class="token punctuation">,</span> - <span class="token string">"url"</span><span class="token punctuation">:</span> <span class="token string">"http://thisdomaindoesnotexist.org/"</span> - <span class="token punctuation">}</span><span class="token punctuation">,</span> - <span class="token string">"locales"</span><span class="token punctuation">:</span> <span class="token punctuation">{</span> - <span class="token string">"fr-FR"</span><span class="token punctuation">:</span> <span class="token punctuation">{</span> - <span class="token string">"name"</span><span class="token punctuation">:</span> <span class="token string">"Mon application"</span> - <span class="token punctuation">}</span><span class="token punctuation">,</span> - <span class="token string">"se-SE"</span><span class="token punctuation">:</span> <span class="token punctuation">{</span> - <span class="token string">"name"</span><span class="token punctuation">:</span> <span class="token string">"Min balla app"</span> - <span class="token punctuation">}</span> - <span class="token punctuation">}</span><span class="token punctuation">,</span> - <span class="token string">"icons"</span><span class="token punctuation">:</span> <span class="token punctuation">{</span> - <span class="token string">"16"</span><span class="token punctuation">:</span> <span class="token string">"/icons/16.png"</span><span class="token punctuation">,</span> - <span class="token string">"32"</span><span class="token punctuation">:</span> <span class="token string">"/icons/32.png"</span><span class="token punctuation">,</span> - <span class="token string">"256"</span><span class="token punctuation">:</span> <span class="token string">"/icons/256.png"</span> - <span class="token punctuation">}</span> -<span class="token punctuation">}</span></code></pre> -<dl> - <dt> - </dt> - <dt> - <code>release_notes</code></dt> - <dd> - 应用发行的相关信息。在火狐市场中，这些信息会出现在提交过程中的一个页面中。</dd> - <dt> - <code>developer</code></dt> - <dd> - 开发者相关信息，包括<code>name</code>和 <code>url字段。开发者信息需要迷你清单和zip中的主要清单一致。</code></dd> - <dt> - <code>locales</code></dt> - <dd> - 本地化信息。值应该是<code>xx-YY格式。</code></dd> - <dt> - <code>icons</code></dt> - <dd> - 应用图标。</dd> -</dl> -<div class="note"> - <p><strong>注意：</strong>在迷你清单和应用清单中的许多值需要一致，否则会导致安装失败。最安全的方式是把应用清单中的内容拷贝到迷你清单中然后加上<code>package_path</code>。</p> -</div> -<h2 id="自行发布托管应用_Hosted_Apps">自行发布托管应用 Hosted Apps</h2> -<p>与 Packaged Apps 相比, 自行发布 Hosted App 是更直接的方式。is more straightforward, if you create its content in the same way as you would for Firefox Marketplace publication. This basically means creating the <a href="https://developer.mozilla.org/en-US/Apps/Build/Manifest" title="Manifest documentation">manifest file</a> for your app. You then need to add the code to invoke {{ domxref("Apps.install") }}. This code is essentially the same as that you would use for a Packaged App, shown above, the only difference being that you can make relative reference to the location of the manifest file if you wish.</p> -<h2 id="参考">参考</h2> -<ul> - <li><a href="https://developer.mozilla.org/en-US/Apps/Build/JavaScript_API">App Installation and Management APIs</a></li> - <li>{{ domxref("Apps.install") }}</li> - <li>{{ domxref("Apps.installPackage") }}</li> - <li><a href="https://developer.mozilla.org/en-US/Apps/Build/Manifest" title="Manifest documentation">App manifest</a></li> - <li><a href="https://developer.mozilla.org/en-US/Apps/Build/App_permissions">App permissions</a></li> -</ul> diff --git a/files/zh-cn/archive/mozilla/marketplace/options/打包_应用程序/index.html b/files/zh-cn/archive/mozilla/marketplace/options/打包_应用程序/index.html deleted file mode 100644 index 87dfaf1675..0000000000 --- a/files/zh-cn/archive/mozilla/marketplace/options/打包_应用程序/index.html +++ /dev/null @@ -1,71 +0,0 @@ ---- -title: 封装的应用程序 -slug: Archive/Mozilla/Marketplace/Options/打包_应用程序 -tags: - - 封装应用程序 - - 应用市场 - - 应用程序发布 - - 应用程序种类 -translation_of: Archive/Mozilla/Marketplace/Options/Packaged_apps ---- -<div class="summary"> - <p><span class="seoSummary">一个封装的应用程序app就是把开放式Web应用程序的所有资源（HTML，CSS，JavaScript，应用程序的manifest，等等）<span class="seoSummary">封装</span>进一个ZIP文件，而不是将这些资源放在一个Web服务器上。这篇文档从一个开发者的视角提供了<span class="seoSummary">封装</span>应用程序的介绍，并且链接了你需要知道的有关<span class="seoSummary">封装</span>应用程序app的一切。 </span></p> -</div> -<p>一个<span class="seoSummary">封装</span>的应用程序就是一个zip文件， 它包含了能够使Web应用程序运行的所有资源， 并且在zip文件的根目录下包含有应用程序的<a href="/en-US/docs/Web/Apps/Manifest">manifest</a> 文件。应用程序的manifest提供了应用程序的详细信息，如：程序的描述, 图标等。如此<span class="seoSummary">封装</span>的应用程序然后才能够安装到Firefox OS设备, <a href="/en-US/Marketplace/Options/Open_web_apps_for_android">Android设备</a>,以及<a href="/en-US/Marketplace/Options/Open_web_apps_for_desktop">电脑桌面</a>。安装的应用程序在设备上运行时，仍然能够访问Web上面的资源，如在一个Web服务器上的数据库。</p> -<p><a href="#types_of_packaged_apps"><span class="seoSummary">封装</span>的应用程序分三种类型</a>: Web应用程序, 特权应用程序和认证的应用程序。虽然<span class="seoSummary">封装</span>应用程序能够发布任何开放的Web应用，但是特权应用和认证应用需要数字签名才能使用<a href="/en-US/Apps/Build/App_permissions">特权和认证API</a>。特权应用程序签名是应用市场审查流程的一部分，而认证应用程序签名是由设备厂商和运营商完成的。</p> -<p>除了使用特权和认证API的能力之外，<span class="seoSummary">封装</span>应用程序安装到设备上之后，所有应用程序的资源都位于设备中，这也为用户提供了更快速的程序启动及响应。基于这些特征，<span class="seoSummary">封装</span>应用程序是开放Web应用程序发布到Firefox OS设备，<a href="/en-US/Marketplace/Options/Open_web_apps_for_android">Android设备</a>以及<a href="/en-US/Marketplace/Options/Open_web_apps_for_desktop">桌面</a>的推荐方法。</p> -<div class="note"> - <p><strong>注意:</strong> 当前的Firefox应用市场支持Web和特权<span class="seoSummary">封装的</span>应用。另外，Firefox应用市场仅仅支持Firefox OS的付费应用，并且支持Firefox OS, Android Firefox以及桌面Firefox的免费应用程序。 支持所有平台的的付费应用正在开发当中。</p> -</div> -<h2 id="封装应用程序的种类"><strong><span class="seoSummary">封装</span>应用程序的种类</strong></h2> -<p>共有三种类型的<span class="seoSummary">封装</span>应用程序：Web应用程序，特权应用程序及认证应用程序。每种类型的<span class="seoSummary">封装</span>应用程序分别对应于Firefox OS中实现的<a href="https://developer.mozilla.org/en-US/Firefox_OS/Security/Security_model#App_Security">应用程序安全</a>模型的一个等级，本章接下来提供每个种类应用程序的更多信息。</p> -<h3 id="Web应用程序">Web应用程序</h3> -<p>web应用程序是没有使用特权和内置(认证的)API的程序, 当提交到应用市场的<span class="seoSummary">封装</span>应用程序被签注时，使用特殊的授权进程来保证特权和内置应用不被执行，因此Web应用程序不能使用特权和内置的APIs，这些应用程序也不需要特权和认证应用程序所要求的<a href="/en-US/Apps/CSP">内容安全政策</a>。</p> -<p>Web应用在他的manifest.webapp文件中没有要求一定要有type域，因为type的默认值web就是正确的值。</p> -<div class="note"> - <p><strong>注意</strong>: Web应用可以 <a href="/en-US/Marketplace/Options/Self_publishing">自行发布</a> 或者通过Firefox应用市场来发布。</p> -</div> -<div class="note"> - <p><strong>注意</strong>: Web应用也可以使用<a href="https://developer.mozilla.org/en-US/Marketplace/Options/Hosted_apps">托管应用程序（Hosted App）</a>机制来发布。</p> -</div> -<h3 id="特权应用程序"><strong>特权应用程序</strong></h3> -<p>特权应用是使用了特权APIs的应用程序，与iOS和Android平台上的原生应用程序类似。当特权应用被提交到Firefox应用市场时，通过一个特别的进程来审核。这个审核进程给了应用程序用户一定程度的保障，潜在的安全，隐私及性能问题等都得到了仔细的审查。</p> -<p>要指定一个应用为特权应用程序，只要在他的manifest.webapp文件中增加<a href="/en-US/docs/Web/Apps/Manifest#type"><code>type域</code></a>，并设定他的值为privileged。你的应用程序要访问的每个特权API都必须添加到应用程序<a href="/en-US/docs/Web/Apps/Manifest">manifest</a>中的permissions域中。</p> -<p>Firefox OS和Android运行环境以及desktop对于特权应用程序强行使用下面的内容安全政策<a href="/en-US/docs/Security/CSP/Introducing_Content_Security_Policy">（CSP）</a>：</p> -<pre class="brush: js">"default-src *; script-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline'"</pre> -<div class="note"> - <p><strong>注意</strong>: 特权应用程序只能通过Firefox应用市场来发布。</p> -</div> -<h3 id="内置应用程序"><strong>内置应用程序</strong></h3> -<div class="geckoVersionNote"> - <p>内置应用程序不像第三方开发者创建的应用程序，内置应用程序通常不是总是可用的，并且不能通过Firefox应用市场发布。内置APIs长期的目标是加强（harden）内置API的认证，使他们像特权程序一样可用。如果你有兴趣了解如何使一个特殊API可用，请在<a href="https://lists.mozilla.org/listinfo/dev-webapps">dev-webapps</a>邮件列表中提供反馈。</p> -</div> -<p>内置应用是使用了内置认证API的应用程序，他提供了访问设备上诸如默认的拨号器，系统设置应用这些关键系统功能。相对于特权应用程序，内置应用程序中的API权限许可都是隐含的，就是说他们不需要用户明确的核准即可使用。内置应用程序必须要设备厂商或运营商核准。</p> -<p>要指定一个程序为内置应用程序，在manifest.webapp中设定<a href="/en-US/docs/Web/Apps/Manifest#type"><code>type</code></a>域为certified。你的应用程序要访问的每个特权API和内置API都必须添加到应用程序<a href="/en-US/docs/Web/Apps/Manifest">manifest</a>中的permissions域中。</p> -<p>Firefox OS为内置应用程序实现了下面的内容安全政策CSP：</p> -<pre class="brush: js">"default-src *; script-src 'self'; object-src 'none'; style-src 'self'"</pre> -<p>相对特权应用程序，内置应用为CSP实现了更严格的规则。如果你想要了解背后的原因，请查阅 <a href="https://wiki.mozilla.org/Apps/Security#Default_CSP_policy">默认CSP政策</a> 和 <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=768029">Bug 768029。</a></p> -<div class="note"> - <p><strong>注意</strong>: 内置应用程序只能通过设备制造商或运营商来预装到设备中，不能透过其他任何方式发布。</p> -</div> -<div class="note"> - <p><strong>注意</strong>: 内置应用程序的内部代号是认证应用程序。</p> -</div> -<h2 id="测试封装的应用程序"><strong>测试<span class="seoSummary">封装</span>的应用程序</strong></h2> -<p>为了测试目的，要安装<span class="seoSummary">封装</span>的应用程序到Firefox OS模拟器或设备，请参考<a href="/en-US/Firefox_OS/Using_the_App_Manager">应用程序管理器</a>。 另外，你能够从Web服务器上面安装一个<span class="seoSummary">封装</span>应用程序到设备上，参考<a href="/en-US/Marketplace/Options/Self_publishing">自行发布应用程序</a>中描述的步骤。 记住当你要自行发布应用程序时，只有<span class="seoSummary">封装</span>的应用程序才能被安装。</p> -<h2 id="发布应用程序"><strong>发布应用程序</strong></h2> -<p align="left">你有两种选择来发布你的应用程序：一个是在Firefox应用市场，另一个是自行发布。</p> -<h3 id="Firefox应用市场发布程序"><strong>Firefox应用市场发布程序</strong></h3> -<p align="left">提交<span class="seoSummary">封装</span>的应用程序到Firefox应用市场的过程在<a href="/en-US/Marketplace/Publishing"> 应用发布</a> 章节有已经有描述。</p> -<p align="left">当你提交你的<span class="seoSummary">封装</span>的应用程序时， ZIP文件存储在Firefox应用市场的服务器里面，并且应用市场基于你ZIP文件中的应用程序manifest生成一个新的叫做mini-manifest的manifest。当用户安装你的应用程序时，mini-manifest被传递给<a href="/en-US/docs/Web/API/Apps.installPackage"><code>Apps.installPackage()</code></a><u>函数</u> 来安装应用程序。mini-manifest的存在是为了安装和升级的目的，并不在你运行应用程序时使用。</p> -<h3 id="自行发布">自行发布</h3> -<p>自行发布应用程序到Firefox应用市场外也是可能的，如在你自己的web服务器上面发布。详细内容请参考<a href="/en-US/Marketplace/Options/Self_publishing"> 自行发布应用程序</a>。</p> -<h2 id="更新封装的应用程序">更新<span class="seoSummary">封装</span>的应用程序</h2> -<p>更多有关更新应用程序的信息，请参考<a href="/en-US/docs/Web/Apps/Updating_apps"> 跟新应用程序 </a>章节。</p> -<h2 id="更多信息">更多信息</h2> -<ul> - <li><a href="/en-US/Firefox_OS/Security/Security_model">Firefox OS安全概要</a></li> - <li><a href="/en-US/Firefox_OS/Security/Application_security">应用程序安全</a></li> - <li><a href="https://github.com/robnyman/Firefox-OS-Boilerplate-App" title="https://github.com/robnyman/Firefox-OS-Boilerplate-App">Firefox OS样板应用程序</a></li> -</ul> -<p> </p> diff --git a/files/zh-cn/archive/mozilla/marketplace/options/简介/index.html b/files/zh-cn/archive/mozilla/marketplace/options/简介/index.html deleted file mode 100644 index 383e510b48..0000000000 --- a/files/zh-cn/archive/mozilla/marketplace/options/简介/index.html +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: 简介 — 你的发布选项 -slug: Archive/Mozilla/Marketplace/Options/简介 -tags: - - Firefox OS - - 应用市场 - - 应用程序 - - 简介 -translation_of: Archive/Mozilla/Marketplace/Options/Introduction ---- -<div class="summary"> - <p>Firefox应用市场提供了直达你发布的应用程序的通道，并且使他们能够被Firefox OS，安卓Firefox以及Desktop用户很容易地发现。无论如何，它不是你应用程序发布的唯一选择。在这章节里，你将会发现你能够投递你的应用程序的形式，以及在安卓设备和PC桌面的Firefox浏览器中启用应用程序的机制，你能够发现在Firefox OS设备上的可用内存是如何影响你的应用程序，自行发布应用程序的选项和创建你自己的应用市场的方法。</p> -</div> -<h2 id="你的发布选项">你的发布选项</h2> -<div class="twocolumns"> - <dl> - <dt> - <a href="/en-US/Marketplace/Options/Packaged_apps">封装的应用程序</a></dt> - <dd> - 找到有关投递应用程序的首选方法，这个方法为你提供了访问特权和安全应用程序接口（APIs）。</dd> - <dt> - <a href="/en-US/Marketplace/Options/Hosted_apps">托管应用程序</a></dt> - <dd> - 找到如何使你的应用程序从服务器上运行，而给用户本地安装应用程序一样的体验。</dd> - <dt> - <a href="/en-US/Marketplace/Options/Packaged_or_hosted_">封装还是托管 ?</a></dt> - <dd> - 使用这个检查表来决定哪一个投递格式最适合你的应用程序。</dd> - <dt> - <a href="/en-US/Marketplace/Options/Open_web_apps_for_android">Android平台开放Web应用</a></dt> - <dd> - Firefox市场应用程序现在已经以APK的形式发布给了安卓用户，你能够启动它来安装并使用你的应用程序，像你使用其他安卓应用成成一样。你能够在这儿发现这是如何做到的。</dd> - <dt> - <a href="/en-US/Marketplace/Options/Open_web_apps_for_desktop">桌面开放Web应用</a></dt> - <dd> - 你的web应用程序现在通过Firefox桌面浏览器安装到了Windows、Mac以及Linux 个人电脑。使用户能够像运行其他桌面应用程序一样运行你的Web应用程序。找出它是如何做到的。</dd> - <dt> - 内存事项</dt> - <dd> - Firefox OS devices come with a range of memory configurations, find out how this affects your apps and how to make sure they will run on all Firefox OS devices.</dd> - <dt> - <a href="/en-US/Marketplace/Options/Self_publishing">自行发布应用程序</a></dt> - <dd> - 在一些场合，如你想要在Firefox市场外的地方发布应用程序，或者为了测试，或在你的企业内分发。找到有关你的选项及如何实现他们。</dd> - <dt> - <a href="/en-US/Marketplace/Options/Creating_a_store">创建你自己的应用市场</a></dt> - <dd> - 不管你是否是在Firefox应用市场发布你的应用程序，亦或自行发布，你有很多在商店里呈现他们的选项。本章节聚焦在这些选项和你怎样实现他们。</dd> - <dt> - </dt> - <dd> - </dd> - </dl> -</div> -<p> </p> diff --git a/files/zh-cn/archive/mozilla/marketplace/prepare/introduction/index.html b/files/zh-cn/archive/mozilla/marketplace/prepare/introduction/index.html deleted file mode 100644 index 9e23e87760..0000000000 --- a/files/zh-cn/archive/mozilla/marketplace/prepare/introduction/index.html +++ /dev/null @@ -1,57 +0,0 @@ ---- -title: 简介 — 为成功而准备 -slug: Archive/Mozilla/Marketplace/Prepare/Introduction -translation_of: Archive/Mozilla/Marketplace/Prepare/Introduction ---- -<div class="summary"> -<p><span class="seoSummary">学习关于如何创建优质Firefox Marketplace应用或人们所爱的游戏的相关知识，基于你的粉丝建立全球用户网。</span></p> -</div> - -<p>Creating a successful Open Web App isn't just about great coding for a great open platform. Whether you’re coding for pleasure and the joy of sharing your ideas, or you want to build a business from your coding activities, you’ll want users to download and use your apps.</p> - -<p>This section contains the advice you need to achieve your goals in terms of app downloads, revenue and use.</p> - -<dl> - <dt> - <p><a href="/zh-CN/Marketplace/Prepare/Deciding_what_to_build">决定制作什么</a></p> - </dt> - <dd> - <p>一个伟大的应用由一个伟大的点子开始。指导你如何选择开发什么样的应用。</p> - </dd> - <dt> - <p><a href="/zh-CN/Marketplace/Prepare_For_Success/Getting_to_know_your_users">了解你的用户</a></p> - </dt> - <dd> - <p>Understanding your users and what they are looking for in your apps is critical to success.</p> - </dd> - <dt> - <p><a href="/zh-CN/Marketplace/Prepare/Choosing_your_business_model">选择你的商业模式</a></p> - </dt> - <dd> - <p>为你的应用或游戏寻找合适的商业模式，如何运用他们。</p> - </dd> - <dt> - <p><a href="/zh-CN/Marketplace/Prepare/Localizing_your_apps">应用本地化</a></p> - </dt> - <dd> - <p>把你的应用带给全世界意味着为全球用户进行应用本地化。了解如何本地化你的应用。</p> - </dd> - <dt> - <p><a href="/zh-CN/Marketplace/Prepare/Promoting_your_app">推广你的应用</a></p> - </dt> - <dd> - <p>Firefox Marketplace is a great way for users to discover apps, but to achieve the downloads you deserve you’ll need to shout about your app. Find out how to make a noise.</p> - </dd> - <dt> - <p><a href="/zh-CN/Marketplace/Prepare/Creating_your_community">Creating your community</a></p> - </dt> - <dd> - <p>Nurture and grow a vibrant community around your apps and tap into their enthusiasm and expertise.</p> - </dd> -</dl> - -<dl> -</dl> - -<dl> -</dl> diff --git a/files/zh-cn/archive/mozilla/marketplace/publishing/submit/index.html b/files/zh-cn/archive/mozilla/marketplace/publishing/submit/index.html deleted file mode 100644 index a6e3468169..0000000000 --- a/files/zh-cn/archive/mozilla/marketplace/publishing/submit/index.html +++ /dev/null @@ -1,10 +0,0 @@ ---- -title: Submit -slug: Archive/Mozilla/Marketplace/Publishing/Submit -tags: - - NeedsTranslation - - TopicStub -translation_of: Archive/Mozilla/Marketplace/Publishing/Submit ---- -<p>This section describes the process for submitting an app to Firefox Marketplace</p> -<p>Residual details: <a href="/en-US/Marketplace/Publishing/Submit/Submitting_an_app">https://developer.mozilla.org/en-US/Marketplace/Publishing/Submit/Submitting_an_app</a></p> diff --git a/files/zh-cn/archive/mozilla/rdf_datasource_how-to/index.html b/files/zh-cn/archive/mozilla/rdf_datasource_how-to/index.html deleted file mode 100644 index a75e5268f2..0000000000 --- a/files/zh-cn/archive/mozilla/rdf_datasource_how-to/index.html +++ /dev/null @@ -1,231 +0,0 @@ ---- -title: RDF 数据源 How-To -slug: Archive/Mozilla/RDF_Datasource_How-To -tags: - - RDF -translation_of: Archive/Mozilla/RDF_Datasource_How-To ---- -<p> </p> -<div class="warning"> - <p>This article is at least partially outdated. Help bring it up to date, if you can. <span class="comment">The XPCOM registration parts and the "As of this writing, it is not currently possible to implement JavaScript XPCOM components" comment seem outdated didn't check the whole article.</span></p> -</div> -<p>This document is a cookbook that describes how to create a - <i> - native, client-side datasource</i> - that works with Mozilla's <a href="cn/RDF">RDF</a> implementation. It supercedes (and borrows from) the <a class="external" href="http://www.mozilla.org/rdf/doc/rdfdatasources.html">original document</a> put together by <a class="link-mailto" href="mailto:rjc@netscape.com">Robert Churchill</a>.</p> -<h3 id="What_is_a_datasource.3F" name="What_is_a_datasource.3F">What is a datasource?</h3> -<p>The "RDF universe" consists of a set of - <i> - statements</i> - about Internet - <i> - resources</i> - ; for example, "my home page was last modified April 2nd", or "that news article was sent by Bob". In the most abstract sense, a - <i> - datasource</i> - is a collection of such statements.</p> -<p>More concretely, a datasource is a - <i> - translator</i> - that can present information as a collection of RDF statements. For example, a "file system datasource" would translate the file system into statements like "/tmp is a directory" and "/tmp/foo is contained within /tmp". An "IMAP datasource" would use the IMAP protocol to translate your mail server's inbox as a collection of statements like "message number 126's subject is 'make money fast on the Internet'" and "message number 126 was sent by <a class="link-mailto" href="mailto:'spammer128@hotmail.com" rel="freelink">'spammer128@hotmail.com</a>'". An "address book" datasource could translate a database file into statements like "<a class="link-mailto" href="mailto:spammer128@hotmail.com's" rel="freelink">spammer128@hotmail.com's</a> real name is 'Billy Dumple'" and "<a class="link-mailto" href="mailto:spammer128@hotmail.com" rel="freelink">spammer128@hotmail.com</a> is considered an 'important friend'."</p> -<p>Statements from one datasource can be combined with statements from another datasource using a - <i> - composite datasource</i> - . By combining statements from the IMAP datasource and address book datasource, above, we'd be able to identify the sender of "message 126" as an "important friend".</p> -<h3 id="Deciding_on_a_vocabulary" name="Deciding_on_a_vocabulary">Deciding on a vocabulary</h3> -<p>The - <i> - vocabulary</i> - is the set of properties that you will use to express relationships between elements (resources and literals) in your data model. The first question that you must answer is "should I use an existing vocabulary, or invent my own?" A reasonable answer is, "use an existing vocabulary unless you - <i> - absolutely must</i> - invent your own." This will allow your datasource to be integrated with other datasources with a minimum of effort.</p> -<p>There are several existing vocabularies of note, including:</p> -<ul> - <li><a class="external" href="http://www.w3.org/TR/PR-rdf-schema/">The RDF Schema Specification</a>. This vocabulary is a "meta vocabulary" that is used to specify other vocabularies.</li> - <li><a class="external" href="http://purl.oclc.org/dc/">The Dublin Core</a>. This vocabulary is useful for describing electronic resources. It contains elements for authorship, subject, publication date, etc.</li> -</ul> -<h3 id="Mapping_your_data_to_nodes_and_arcs" name="Mapping_your_data_to_nodes_and_arcs">Mapping your data to nodes and arcs</h3> -<p><b>[write me!]</b></p> -<h3 id="Implementing_the_nsIRDFDataSource_interface" name="Implementing_the_nsIRDFDataSource_interface">Implementing the <tt>nsIRDFDataSource</tt> interface</h3> -<p>Your first chore will be to implement the <tt><a class="external" href="http://lxr.mozilla.org/seamonkey/source/rdf/base/idl/nsIRDFDataSource.idl">nsIRDFDataSource</a></tt> interface. There are basically two approaches that you can take in this endeavor:</p> -<ol> - <li> - <p> - <i> - Delegate to an inner proxy</i> - . For example, you may choose to delegate to the - <i> - in-memory datasource</i> - , which is a generic datasource that implements <tt>nsIRDFDataSource</tt>.</p> - <p>Typically, you provide a parser for reading in some sort of static storage (e.g., a data file); the parser translates the datafile into a series of calls to <tt>Assert()</tt> to set up the in-memory datasource. When <tt>Flush()</tt> is called, or the last reference to the datasource is released, a routine walks the in-memory datasource and re-serializes the graph back to the original file format. For examples of an implementation like this, look at the <a class="external" href="http://lxr.mozilla.org/seamonkey/source/rdf/base/src/nsRDFXMLDataSource.cpp">RDF/XML datasource</a> or the <a class="external" href="http://lxr.mozilla.org/seamonkey/source/xpfe/components/bookmarks/src/nsBookmarksService.cpp">bookmarks datasource</a>.</p> - <p>You may want to choose this implementation if your primary goal is to "wrap" a legacy data store. This implementation may cause problems if your data store can be modified "on the fly" by other agents.</p> - </li> - <li> - <p> - <i> - Aggregate the in-memory datasource</i> - . This is an extreme case of delegation, where you use XPCOM - <i> - aggregation</i> - to implement the <tt>nsIRDFDataSource</tt> interface. See <a href="cn/Aggregating_the_In-Memory_Datasource">Aggregating the In-Memory Datasource</a> for technical details.</p> - <p>If you take this approach, you won't be able to selectively implement methods of the <tt>nsIRDFDataSource</tt> interface; instead, - <i> - all</i> - of the methods will be "forwarded" to the in-memory datasource. This can be useful if your datasource is "read-only", and you aren't worried about modification using <tt>Assert()</tt>, etc.</p> - </li> - <li> - <p> - <i> - Implement the interface yourself</i> - . If you choose this route, you'll need to implement each of the <tt>nsIRDFDataStore</tt> methods "by hand". Although this is more work, it is really the only way to create a "live" datasource that may be changed by some outside agent.</p> - <p>The <a class="external" href="http://lxr.mozilla.org/seamonkey/source/rdf/datasource/src/nsFileSystemDataSource.cpp">file system datasource</a> and <a class="external" href="http://lxr.mozilla.org/seamonkey/source/mailnews/base/src/nsMsgFolderDataSource.cpp">local mail datasource</a> are good examples of datasources that have been implemented this way.</p> - <p>You'll probably need to choose this implementation if your datasource is "live", and may be modified or altered by some outside agent (e.g., new mail arriving). You may also need to choose this implementation if the data set which your datasource is modeling is too large to fit in to memory (e.g., the entire file system structure).</p> - </li> -</ol> -<p><b>[More info on what each method needs to do - <i> - here</i> - ]</b></p> -<h4 id="RDF_Commands" name="RDF_Commands">RDF Commands</h4> -<p><b>[Describe what commands are, and why you'd implement them.]</b></p> -<h3 id="Registering_the_datasource_component" name="Registering_the_datasource_component">Registering the datasource component</h3> -<p>A datasource is an <a href="cn/XPCOM">XPCOM</a> component. As such, it must (currently, see <a href="#footnote1">[1]</a>) have:</p> -<ol> - <li>An XPCOM - <i> - CLSID</i> - to identify the data source implementation</li> - <li>An implementation class (that corresponds to the CLSID) whose code lives in a DLL. The DLL must be located in the XPCOM <tt>components</tt> directory</li> - <li>A - <i> - factory</i> - that is - <i> - registered</i> - to an XPCOM - <i> - ProgID</i> - in order to be instantiated from the repository.</li> -</ol> -<p>Constructing a DLL for a component is beyond the scope of this document; the reader is referred to <a class="external" href="http://lxr.mozilla.org/seamonkey/source/rdf/build/nsRDFFactory.cpp">the RDF factory</a> as a guideline.</p> -<p>Registering an RDF datasource is fairly simple: in the DLL's <tt>NSRegisterSelf()</tt> method, you simply call the - <i> - component manager'</i> - s <tt>RegisterComponent()</tt> method:</p> -<pre class="eval">extern "C" PR_IMPLEMENT(nsresult) -NSRegisterSelf(nsISupports* aServiceManager, const char* aPath) -{ - nsresult rv; - ... - // Assume compMgr refers to the component manager - rv = compMgr->RegisterComponent(kMyDataSourceCID, - "My Data Source", - NS_RDF_DATASOURCE_PROGID_PREFIX "my-datasource", - aPath, PR_TRUE, PR_TRUE); - ... -} -</pre> -<p>Replace <tt>kMyDataSourceCID</tt> with your datasource's CLSID. Replace <tt>"My Data Source"</tt> with a descriptive string that should appear in the registry. Finally, replace <tt>"my-datasource"</tt> with a value appropriate for your datasource. This value, when prefixed with <tt>"rdf:"</tt>, is a - <i> - datasource identifier</i> - , and may be used with <tt><a class="external" href="http://lxr.mozilla.org/seamonkey/source/rdf/base/idl/nsRDFInterfaces.idl#384">nsIRDFService::GetDataSource()</a></tt> to retrieve your datasource from the RDF service. For example, the above datasource would be accessable as follows:</p> -<pre class="eval">nsIRDFService* rdf; -rv = nsServiceManager::GetService(kRDFServiceCID, - kIRDFServiceIID, - (nsISupports**) &rdf); - -if (NS_SUCCEEDED(rv)) { - nsIRDFDataSource* myDataSource; - rv = rdf->GetDataSource("rdf:my-datasource", - &myDataSource); - - if (NS_SUCCEEDED(rv)) { - // ...do something to myDataSource here... - NS_RELEASE(myDataSource); - } - nsServiceManager::ReleaseService(kRDFServiceCID, rdf); -} -</pre> -<h3 id="Displaying_RDF_as_content" name="Displaying_RDF_as_content">Displaying RDF as content</h3> -<p>Now that you've gone through all this pain to expose your information as a datasource, you probably want to - <i> - see</i> - it. Using <a class="external" href="http://www.mozilla.org/xpfe/languageSpec.html">XUL</a>, you can display the contents of your datasource in a - <i> - tree</i> - control - <i> - , a</i> - menu - <i> - , or a</i> - toolbar - <i> - . In fact, you can</i> - convert RDF to an - <i> - arbitrary</i> - content model using <a href="cn/XUL/Template_Guide">XUL Templates</a>.</p> -<p>The following XUL fragment illustrates how to instantiate a tree control whose body is "rooted" to a resource (<tt><a class="external" href="http://foo.bar.com/" rel="freelink">http://foo.bar.com/</a></tt>) that your datasource describes:</p> -<pre class="eval"><window - xmlns:html="<a class="external" href="http://www.w3.org/1999/xhtml" rel="freelink">http://www.w3.org/1999/xhtml</a>" - xmlns:rdf="<a class="external" href="http://www.w3.org/TR/WD-rdf-syntax#" rel="freelink">http://www.w3.org/TR/WD-rdf-syntax#</a>" - xmlns="<a class="external" href="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" rel="freelink">http://www.mozilla.org/keymaster/gat...re.is.only.xul</a>"> - - <tree <b>datasources="rdf:my-datasource" ref="<a class="external" href="http://foo.bar.com/" rel="freelink">http://foo.bar.com/</a>"</b>> - <b><template></b> - <b><treechildren></b> - <b><treeitem uri="..."></b> - <b><treerow></b> - <b><treecell></b> - <b><text value="rdf:<a class="external" href="http://home.netscape.com/NC-rdf#Name" rel="freelink">http://home.netscape.com/NC-rdf#Name</a>" /></b> - <b></treecell></b> - <b><treecell></b> - <b><text value="rdf:<a class="external" href="http://home.netscape.com/NC-rdf#URL" rel="freelink">http://home.netscape.com/NC-rdf#URL</a>" /></b> - <b></treecell></b> - <b></treerow></b> - <b></treeitem></b> - <b></treechildren></b> - <b></template></b> - - <treehead> - <treeitem> - <treecell>Name</treecell> - <treecell>URL</treecell> - </treeitem> - </treehead> - - <!-- treechildren built _here_ --> - </tree> - -</window> -</pre> -<p>The important "magic attributes" have been called out in bold, above:</p> -<ul> - <li> - <p><tt>datasources="rdf:my-datasource"</tt>. This is a space-separated list that may include internal XPCOM datasource "identifiers" (as described above) and URIs for local or remote RDF/XML documents. Each datasource that is listed will be loaded, and the assertions contained in the datasource will be made available to the tree control for display.</p> - </li> - <li> - <p><tt>ref="<a class="external" href="http://foo.bar.com/" rel="freelink">http://foo.bar.com/</a>"</tt>. This roots the graph in your content model. The <tt>tree</tt> tag will be treated as if it has the <tt>ID</tt> attribute with a value <tt><a class="external" href="http://foo.bar.com/" rel="freelink">http://foo.bar.com/</a></tt>.</p> - </li> - <li> - <p><tt><template>...</template></tt>. The XUL - <i> - template</i> - that is used to build content from the graph. Starting with the resource that corresponds to the <tt>tree</tt> element, <tt><a class="external" href="http://foo.bar.com/" rel="freelink">http://foo.bar.com/</a></tt>, the graph will be traversed and content will be constructed using the pattern specified within the <tt>template</tt> tags.</p> - </li> -</ul> -<p>For a complete description of how content is built from RDF, see the <a href="cn/XUL/Template_Guide">XUL:Template Guide</a>.</p> -<hr> -<p><small><sup>1</sup> As of this writing, it is not currently possible to implement JavaScript XPCOM components; however, it may soon be possible to do so via <a href="cn/XPConnect">XPConnect</a>. <strong>Update:</strong> JavaScript XPCOM should now be possible. </small></p> -<p>Contact: <a class="link-mailto" href="mailto:waterson@netscape.com">Chris Waterson</a> <a class="link-mailto" href="mailto:(waterson@netscape.com)" rel="freelink">(waterson@netscape.com)</a></p> -<div class="originaldocinfo"> - <h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2> - <ul> - <li>Author(s): <a class="link-mailto" href="mailto:waterson@netscape.com">Chris Waterson</a></li> - <li>Last Updated Date: June 19, 2000</li> - <li>Copyright Information: Copyright (C) <a class="link-mailto" href="mailto:waterson@netscape.com">Chris Waterson</a></li> - </ul> -</div> -<p> </p> diff --git a/files/zh-cn/archive/mozilla/tamarin/index.html b/files/zh-cn/archive/mozilla/tamarin/index.html deleted file mode 100644 index e13f983f5d..0000000000 --- a/files/zh-cn/archive/mozilla/tamarin/index.html +++ /dev/null @@ -1,104 +0,0 @@ ---- -title: Tamarin -slug: Archive/Mozilla/Tamarin -tags: - - JavaScript - - Landing - - NeedsTranslation - - Tamarin - - TopicStub -translation_of: Archive/Mozilla/Tamarin ---- -<p> </p> - -<div> -<p><strong>Tamarin</strong> is a <a href="/en/JavaScript" title="en/JavaScript">JavaScript</a> engine written in C++. It currently implements Adobe ActionScript™ 3 (a superset of ECMAScript Edition 3) and is embedded within the Adobe® Flash® Player versions 9 and later. Tamarin's jit-compiler, NanoJIT, is also used in <a class="link-https" href="https://wiki.mozilla.org/JavaScript:TraceMonkey" title="https://wiki.mozilla.org/JavaScript:TraceMonkey">TraceMonkey</a> ergo SpiderMonkey, which is Mozilla’s JavaScript engine in Firefox.</p> - -<p>Tamarin is available under the MPL/GPL/LGPL tri-license.</p> -</div> - -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h4 id="Roadmap" name="Roadmap">Releases</h4> - - <dl> - <dt><a class="internal" href="/En/Tamarin/Tamarin_Releases" title="En/Tamarin/Tamarin Releases">Release Tracking</a></dt> - <dd><small>Information on current, past, and upcoming releases of Tamarin.</small></dd> - </dl> - - <h4 id="Documentation" name="Documentation">Documentation</h4> - - <dl> - <dt><a class="external" href="http://www.adobe.com/content/dam/Adobe/en/devnet/actionscript/articles/avm2overview.pdf" title="http://www.adobe.com/content/dam/Adobe/en/devnet/actionscript/articles/avm2overview.pdf">Adobe ActionScript Virtual Machine 2 (AVM2) Overview <small>(PDF, 400K)</small></a></dt> - <dd><small>The instructions, architecture, and file format supported by the AVM2. See also the <a class="link-https" href="https://wiki.mozilla.org/Tamarin::AVM2_Overview_Errata">possible errata.</a></small></dd> - </dl> - - <dl> - <dt><a href="/En/Tamarin/Tamarin_Build_Documentation" title="en/Tamarin_Build_Documentation">Tamarin Build Documentation</a></dt> - <dd><small>How to get, build, and use Tamarin.</small></dd> - <dt style="font-style: normal; font-weight: bold;"> </dt> - <dt style="font-style: normal; font-weight: bold;"><a class="internal" href="/En/Tamarin/Tamarin_Build_System_Documentation" style="text-decoration: none; color: rgb(4, 137, 183) ! important; cursor: default;" title="En/Tamarin/Tamarin Build System Documentation">Tamarin Build System Documentation</a></dt> - <dd style="margin-left: 0px; margin-bottom: 0.5em; padding-left: 15px;"><small>Documentation on how the Tamarin build system works and how to modify.</small></dd> - <dt style="font-style: normal; font-weight: bold;"><a class="internal" href="/en/Tamarin/Tamarin_mercurial_commit_hook" style="text-decoration: none; color: rgb(4, 137, 183) ! important; cursor: default;" title="en/Tamarin/Tamarin mercurial commit hook">Tamarin commit hook</a></dt> - <dd style="margin-left: 0px; margin-bottom: 0.5em; padding-left: 15px;"><small>Instructions for installing and using the mercurial hook for Tamarin.</small></dd> - <dt style="font-style: normal; font-weight: bold;"><a class="internal" href="/En/Tamarin/Tamarin_Acceptance_Testing" style="text-decoration: none; color: rgb(4, 137, 183) ! important; cursor: default;" title="En/Tamarin/Tamarin Tests">Tamarin Acceptance Testing</a></dt> - <dd style="margin-left: 0px; margin-bottom: 0.5em; padding-left: 15px;"><small>Instructions on how to validate changes to the Tamarin source code.</small></dd> - </dl> - - <dl> - <dt><a class="link-https" href="https://wiki.mozilla.org/Tamarin">Tamarin pages at wiki.mozilla.org</a></dt> - <dd><small>More documentation.</small></dd> - </dl> - - <dl> - <dt><a href="/en/MMgc" title="en/MMgc">MMgc overview</a></dt> - <dd><small>An overview of the Tamarin garbage collector.</small></dd> - </dl> - - <dl> - <dt><a href="/En/Nanojit/LIR" title="en/Nanojit/Nanojit_LIR">Nanojit LIR </a></dt> - <dd><small>In Nanojit, LIR is the source language for compilation to machine code.</small></dd> - </dl> - - <dl> - <dt><a class="link-https" href="https://wiki.mozilla.org/Tamarin:Strings" title="https://wiki.mozilla.org/Tamarin:Strings">Tamarin strings documentation</a></dt> - <dd><small>The implementation of Tamarin strings has changed. This page is a how-to about the changes, and what can be done to adapt source code to the changes. </small></dd> - </dl> - - <dl> - <dt><a class="external" href="http://tamarin-builds.mozilla.org/doxygen/html/index.html" title="http://tamarin-builds.mozilla.org/doxygen/html/index.html">Tamarin doxygen documentation</a></dt> - <dd><small>Documentation for the latest release.</small></dd> - </dl> - - <p><span class="alllinks"><a href="/Special:Tags?tag=Tamarin&language=en" title="Special:Tags?tag=Tamarin&language=en">View All...</a></span></p> - </td> - <td> - <h4 id="Community" name="Community">Get Involved!</h4> - - <ul> - <li>log a bug against <a href="https://bugzilla.mozilla.org/enter_bug.cgi?product=Tamarin">Tamarin</a></li> - <li><a class="link-https" href="https://mail.mozilla.org/listinfo/tamarin-devel" title="https://mail.mozilla.org/listinfo/tamarin-devel">tamarin-devel</a> mailing list</li> - <li><a class="link-irc" href="irc://irc.mozilla.org/tamarin" title="irc://irc.mozilla.org/tamarin">#tamarin</a> channel on irc.mozilla.org</li> - </ul> - - <h4 id="Related_Topics" name="Related_Topics">Blogroll</h4> - - <ul> - <li><a class="external" href="http://masonchang.com/search/label/Tamarin">Mason Chang</a></li> - <li>David Mandelin</li> - </ul> - - <h4 id="Related_Topics" name="Related_Topics">Related Topics</h4> - - <dl> - <dd><a href="/en/JavaScript" title="en/JavaScript">JavaScript</a></dd> - <dd><a href="/en/SpiderMonkey" title="en/SpiderMonkey">SpiderMonkey</a></dd> - <dd><a class="external" href="http://wiki.mozilla.org/JavaScript:ActionMonkey">ActionMonkey</a></dd> - <dd><a class="external" href="http://www.mozilla.org/projects/tamarin/">Tamarin on mozilla.org</a></dd> - </dl> - </td> - </tr> - </tbody> -</table> diff --git a/files/zh-cn/archive/mozilla/tamarin/tamarin_build_documentation/index.html b/files/zh-cn/archive/mozilla/tamarin/tamarin_build_documentation/index.html deleted file mode 100644 index 3841a0565c..0000000000 --- a/files/zh-cn/archive/mozilla/tamarin/tamarin_build_documentation/index.html +++ /dev/null @@ -1,416 +0,0 @@ ---- -title: Tamarin 编译文档 -slug: Archive/Mozilla/Tamarin/Tamarin_Build_Documentation -translation_of: Archive/Mozilla/Tamarin/Tamarin_Build_Documentation ---- -<h2 id="Tamarin_Source_Versions" name="Tamarin_Source_Versions">Tamarin 源码版本</h2> - -<p>以下说明用于获取和构建 Tamarin Central 源码.</p> - -<p>Tamarin Tracing 的相关说明, 请查看 <a href="/en/Tamarin_Tracing_Build_Documentation" title="en/Tamarin_Tracing_Build_Documentation">Tamarin Tracing Build Documentation</a>.</p> - -<h2 id="Supported_platforms" name="Supported_platforms">支持平台</h2> - -<p>Tamarin 目前支持以下操作系统/架构.</p> - -<ul> - <li>Windows 32 and 64 bit</li> - <li>Mac OSX 10.4, 10.5 on PPC</li> - <li>Mac OSX 10.5, 10.6 on Intel</li> - <li>Linux 32 and 64 bit</li> - <li>Solaris 10 on SPARC</li> - <li>Android 2.2 on ARM</li> - <li>Windows Mobile 6.5</li> - <li>MIPS (Linux)</li> - <li>SH4 (Linux)</li> -</ul> - -<h2 id="Getting_the_Tamarin_source" name="Getting_the_Tamarin_source">获取 Tamarin 源码</h2> - -<p>Tamarin 源码位于 <a class="external" href="http://hg.mozilla.org/tamarin-central">Tamarin Central</a> 的 <a class="external" href="http://www.selenic.com/mercurial/wiki/">Mercurial</a> . 目前开发中的源码位于 <a class="external" href="http://hg.mozilla.org/tamarin-redux" title="http://hg.mozilla.org/tamarin-redux">Tamarin Redux</a>. 在本文中 replace instances of tamarin-central with tamarin-redux to operate in the redux repository. 使用以下命令克隆一个 Tamarin 仓库:</p> - -<pre class="eval"><span class="nowiki">$ hg clone http://hg.mozilla.org/tamarin-central tamarin-central</span> -</pre> - -<p>Tips for working with Mercurial can be found <a href="/en/Mercurial_FAQ" title="en/Mercurial_FAQ">here.</a></p> - -<h2 id="Building_Tamarin" name="Building_Tamarin">构建 Tamarin</h2> - -<p>构建 Tamarin 将创建 AVMPlus 和 garbage collector (MMgc) 的所有库, 并创建一个独立的可执行文件(shell)，用于以ABC文件格式执行文件. 不附加任何参数运行shell将列出可用的选项. 注意其他的命令行参数仅在调试配置中可用.</p> - -<p><a href="/en/Tamarin" title="en/Tamarin">Tamarin</a> 的代码库包含一个Mozilla开发者的跨平台构建系统. 该跨平台构建系统用于日常自动化构建测试, 因此是非常可靠的系统.</p> - -<p>The Tamarin codebase has the ability to build additional code which supports debugging hooks. 在 XCode 项目中, 这是 <code>Debug_Debugger</code> 和 <code>Release_Debugger</code> 配置. The Flash Player builds Tamarin with the debugging hooks off for codesize reasons, but the Mozilla client will build Tamarin with the debugging hooks on.</p> - -<h3 id="Cross-platform_build" name="Cross-platform_build">跨平台构建 (general instructions - 非安卓)</h3> - -<p><strong>预备条件(环境):</strong> 你需要 Python 2.5 或更高版本和 GNU <code>make</code> 3.81 或更高版本. (<strong>GNU <code>make</code> 3.80 does not work.</strong> Nor does any other brand of <code>make</code>.)</p> - -<p>预备条件达成后, 使用这些命令构建 Tamarin:</p> - -<pre class="eval"> $ hg clone <a class="external" href="http://hg.mozilla.org/tamarin-redux/" rel="freelink">http://hg.mozilla.org/tamarin-redux/</a> - $ cd tamarin-redux - $ mkdir objdir-release - $ cd objdir-release - $ python ../configure.py - $ make - ... - $ shell/avmshell - shell 1.0 build cyclone - ... -</pre> - -<p>AVMPlus 的可执行文件是 <code>avmshell</code>.</p> - -<p>可选项:</p> - -<ul> - <li><code>--enable-debugger</code> - 调试器构建</li> - <li><code>--enable-debug</code> - 调试构建</li> -</ul> - -<p>对于详细的构建Tamarin, 你可以通过 CPPFLAGS 进行.</p> - -<pre class="eval"> $ make CPPFLAGS=-DAVMPLUS_VERBOSE -</pre> - -<h4 id="在_OSX_10.6_(Snow_Leopard)_构建的非安卓跨平台_Tamarin-redux_的其他说明">在 OSX 10.6 (Snow Leopard) 构建的非安卓跨平台 Tamarin-redux 的其他说明</h4> - -<p>(要在Mac上构建 Tamarin-central 请参阅此处的跨平台说明: <a href="/En/Tamarin/Tamarin_Build_Documentation?revision=21" title="https://developer.mozilla.org/index.php?title=En/Tamarin/Tamarin_Build_Documentation&revision=21">https://developer.mozilla.org/index.php?title=En/Tamarin/Tamarin_Build_Documentation&revision=21</a></p> - -<p>The bug when building on Snow Leopard (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=537817" title="https://bugzilla.mozilla.org/show_bug.cgi?id=537817">Bug 537817</a>) has been fixed in the Tamarin-redux repo. The work for that fix also included some changes to the configure.py default behavior to decouple the --target switch from sdk choice: </p> - -<ul> - <li>There is a new switch, --mac-sdk, that selects the 10.4u, 10.5 or 10.6 sdk. Its options are '104u', '105' or '106' (Note: no '.')</li> - <li>If you don't pass the --mac-sdk switch you will get no sdk in your build.</li> - <li>If you pass '--mac-sdk=104u' you will also get gcc/g++ 4.0.</li> - <li>If you pass '--mac-sdk=105' or '--mac-sdk=106' you will get the gcc/g++ default for the machine you're building on.</li> -</ul> - -<p>Example call to build on an x86_64 machine with the 10.5 sdk:</p> - -<pre>$ ../configure.py --mac-sdk=105 --target=x86_64-darwin -</pre> - -<p>If ASC is not set, you will need to add ASC.jar to the utils directory in Tamarin-redux (<a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=631641" title="https://bugzilla.mozilla.org/show_bug.cgi?id=631641">Bug 631641</a>).</p> - -<ul> - <li>下载<a class="link-ftp" href="ftp://ftp.mozilla.org/pub/js/tamarin/builds/asc/latest/asc.jar " title="ftp://ftp.mozilla.org/pub/js/tamarin/builds/asc/latest/asc.jar">ftp://ftp.mozilla.org/pub/js/tamarin/builds/asc/latest/asc.jar </a></li> - <li>把它放到 utils/</li> -</ul> - -<p> </p> - -<h3 id="在Mac上构建_Tamarin_的安卓_2.3.3_版本">在Mac上构建 Tamarin 的安卓 2.3.3 版本</h3> - -<h4 id="公共_sdkndk_安装">公共 sdk/ndk 安装</h4> - -<p>To build Tamarin for Android you will need an sdk/ndk. The setup procedure below creates an android sdk/ndk entirely from publicly available sources. This sdk/ndk *must* be used if you've cloned tamarin at changeset 5844:92ad3ca84a0b or later <strong>and</strong> will be using the cross-compile build method.</p> - -<p>Steps to create a public sdk/ndk tree on a Mac:</p> - -<p>- Create an sdk/ndk top folder under your main volume named /android-public.</p> - -<p>- 下载 Android 2.3.3 的Mac sdk zip 文件自 <a class="external" href="http://developer.android.com/sdk/index.html" title="http://developer.android.com/sdk/index.html">http://developer.android.com/sdk/index.html</a>. 解压到你的 sdk/ndk 顶级文件夹. Make sure it's named 'android-sdk-mac_86'.</p> - -<p>- Download the r5b Mac ndk zip file from <a class="external" href="http://developer.android.com/sdk/ndk/index.html" title="http://developer.android.com/sdk/ndk/index.html">http://developer.android.com/sdk/ndk/index.html</a>. Unzip to your sdk/ndk top folder. Rename this folder to 'android-ndk'.</p> - -<p>- Run the Android SDK/AVD Manager at /android-public/android-sdk-mac_86/tools/android and add Android SDK Platform-tools (to get adb), SDK Platform Android 2.3.3, and API 10 (samples and docs are optional). If you have trouble starting the app try this:</p> - -<p><code>$ export ANDROID_SWT=$ANDROID_BUILD_TOP/android-sdk-mac_86/tools/lib/x86_64</code></p> - -<p>where $ANDROID_BUILD_TOP is the full path to your sdk/ndk top folder</p> - -<p>- Get the openssl-0.9.8r.tar (openssl-1.0.0c.tar.gz won't work) openssl files from <a class="external" href="http://www.openssl.org" title="http://www.openssl.org/">http://www.openssl.org</a> (use the Source link on the left). Unzip the file and put the /openssl main folder under your sdk/ndk top folder. Make sure its name is just "openssl". Then build as follows:</p> - -<p>- Replace the Makefile in the main folder with the one attached to this page.</p> - -<p>- Change the variable ANDROID_DEVICE in the makefile (near line 65) to point to your sdk/ndk top folder.</p> - -<p>- Find the two instances of "android-ndk" and make sure they match your ndk's name (they should already).</p> - -<p>- In a terminal window change to your /openssl folder and run <code>make build_libs</code> to create the necessary '<code>libcrypto.a</code>' and '<code>libssl.a</code>' static libraries.</p> - -<p>Alternatively, run make, in which case the process will complete with errors when it tries to create the shared lib crt0.o:</p> - -<pre>$ /android-public/android-ndk/toolchains/arm-eabi-4.4.0/prebuilt/darwin-x86/bin/../lib/gcc/arm-eabi/4.4.0/../../../../arm-eabi/bin/ld: crt0.o: -No such file: No such file or directory collect2: ld returned 1 exit status -make[2]: *** [link_app.] Error 1 -make[1]: *** [openssl] Error 2 -make: *** [build_apps] Error 1</pre> - -<p>You can ignore these errors. The necessary static files 'libcrypto.a' and 'libssl.a' are made correctly and are present in the /openssl folder. More information on why this happens on Mac OS is here: <a class="external" href="http://developer.apple.com/library/mac/#qa/qa2001/qa1118.html" title="http://developer.apple.com/library/mac/#qa/qa2001/qa1118.html">http://developer.apple.com/library/mac/#qa/qa2001/qa1118.html</a></p> - -<p>- Create a /frameworks/base/opengl/include/EGL folder under your sdk/ndk top folder. Get the ersion 1.4 EGL header files (egl.h, eglext.h and eglplatform.h) from <a class="external" href="http://www.khronos.org/registry/egl/" title="http://www.khronos.org/registry/egl/">http://www.khronos.org/registry/egl/</a> and save or copy them there. </p> - -<h4 id="构建_Tamarin_Release_Shell">构建 Tamarin Release Shell</h4> - -<p>- Get tamarin-redux</p> - -<p>- Export the following variables into the environment</p> - -<p> </p> - -<pre>$ export ANDROID_TOOLCHAIN=<full path to your android sdk/ndk top folder> -$ export ANDROID_NDK=$ANDROID_TOOLCHAIN/android-ndk -$ export ANDROID_NDK_BIN=$ANDROID_NDK/toolchains/arm-linux-androideabi-4.4.3/prebuilt/darwin-x86/bin -$ export ANDROID_SDK=$ANDROID_TOOLCHAIN/android-sdk-mac_86 -$ export PATH=$PATH:$ANDROID_SDK/platform-tools:$ANDROID_NDK_BIN</pre> - -<div>- Example commands to build Tamarin: </div> - -<pre>$ hg clone http://hg.mozilla.org/tamarin-redux -$ cd tamarin-redux -$ mkdir objdir-release -$ cd objdir-release -$ ../configure.py --arm-arch=armv7-a --target=arm-android -$ make</pre> - -<p>使用此命令制作一个调试shell:</p> - -<p><code>../configure.py --enable-debug --arm-arch=armv7-a --target=arm-android</code></p> - -<p> </p> - -<h3 id="在Windows上使用CYGWIN的跨平台脚本">在Windows上使用CYGWIN的跨平台脚本:</h3> - -<p><strong>预备条件(环境):</strong> 你需要 Python 2.5 或更高版本和 GNU <code>make</code> 3.81 或更高版本. (<strong>GNU <code>make</code> 3.80 does not work.</strong> Nor does any other brand of <code>make</code>.)</p> - -<p><strong>设置:</strong></p> - -<ul> - <li>If you normally work in a cygwin mounted place (eg /home/user/...) then you must cd around to the cygdrive path equivalent (eg /cygdrive/c/cygwin/home/user/).</li> - <li>使用以下环境变量设置shell环境:</li> -</ul> - -<pre style="margin-left: 40px;"># NOTE: The INCLUDE, LIB and LIBPATH must contain windows path information and separator and not cygwin paths. -VS_HOME_PATH="/cygdrive/c/Program Files/Microsoft Visual Studio 9.0" -VS_HOME="c:\Program Files\Microsoft Visual Studio 9.0" - -export PATH="$VS_HOME_PATH/Common7/IDE:$VS_HOME_PATH/VC/bin:$VS_HOME_PATH/Common7/Tools:$VS_HOME_PATH/VC/VCPackages:$PATH" -export INCLUDE="$VS_HOME\VC\atlmfc\include;$VS_HOME\VC\include;C:\Program Files\Microsoft SDKs\Windows\v6.0A\Include;" -export LIB="$VS_HOME\VC\atlmfc\lib;$VS_HOME\VC\lib;C:\Program Files\Microsoft SDKs\Windows\v6.0A\Lib" -export LIBPATH="$VS_HOME\VC\atlmfc\lib;$VS_HOME\VC\lib;C:\Program Files\Microsoft SDKs\Windows\v6.0A\Lib" -</pre> - -<p>完成上方的条件后, 你现在应该可以通过这些命令进行构建:</p> - -<pre style="margin-left: 40px;">$ hg clone http://hg.mozilla.org/tamarin-central/ -$ cd tamarin-central -$ mkdir objdir-release -$ cd objdir-release -$ python ../configure.py -$ make -... -$ shell/avmshell.exe -shell 1.0 build cyclone -... -</pre> - -<p> </p> - -<h3 id="Microsoft_Visual_Studio" name="Microsoft_Visual_Studio">微软 Visual Studio</h3> - -<p>Visual Studio 2008 (VS2008) 是首选的Windows构建环境. Visual Studio 2003 和 2005 不再被支持. 构建 Tamarin:</p> - -<ol> - <li>copy tamarin/platform/win32/armasm.rules to c:/Program Files/Microsoft Visual Studio 9.0/VC/VCProjectDefaults</li> - <li>Build "builtin.h" following the instructions below in the section "Compiling and running applications"</li> - <li>Do the same for shell_toplevel.h, starting in avmplus/shell, using the command "python shell_toplevel.py"</li> - <li>open the Tamarin project file "platform/win32/avmplus2008.sln".</li> - <li>Choose your desired configuration and target, and build.</li> - <li>Note: now that bug 478714 has been fixed, the name of the (shell) executable will always be "avm.exe" no matter which build configuration you select. The avm.exe file will be found in a directory reflecting your configuration choice. For example, if you chose the win32 Debug_Debugger configuration your build will be under \tamarin-redux\platform\win32\obj_9\shell\Debug_Debugger by default. Building the x64 Release_Debugger configuration will create avm.exe under \tamarin-redux\platform\win32\x64\Release_Debugger. Note the "\obj9" directory under \platform\win32 for the win32 builds and "\x64" directory under \platform\win32 for 64-bit builds; this looks a little odd but preserves previous behavior as much as possible to avoid initial disruption from the shell rename fix.</li> -</ol> - -<p>你必须安装支持x64的VS2008才能构建64位配置. </p> - -<p>如果你安装了 Windows Mobile 6 SDK, 你还可以用 Windows Mobile (ARM) 为目标构建.</p> - -<h3 id="Apple_XCode" name="Apple_XCode">Apple XCode</h3> - -<p>The project files are designed for XCode 3.0. Se "platform/mac/avmplus/avmplus.xcodeproj". XCode 2.2, 2.3, and 2.4 will not work.</p> - -<p>There are two targets in the XCode IDE, 'avm' for 32-bit builds and 'avm64' for 64-bit builds. There is also an aggregate target that will build both targets. Note that, whereas before when you selected the aggregate target you got a 'shell' 32-bit executable and a 'shell64' 64-bit executable in the same folder, now because of the fix to bug 478714 you will get an 'avm' executable in two separate folders, /Debug and /Debug64 respectively.</p> - -<p>The command to build from the Terminal is:</p> - -<pre class="eval"> $ cd tamarin-redux - $ xcodebuild ARCHS=ppc -project platform/mac/avmshell/avmshell.xcodeproj -</pre> - -<p>For a debug build, add '-configuration Debug' (note the capital D and no "="). Additional configurations are: Debug_Debugger, Release and Release_Debugger.</p> - -<p>The resulting Debug executable for the command above would be built at /platform/mac/avmshell/build/Debug/avm.</p> - -<p>Intel Macs build correctly by setting ARCHS=i386.</p> - -<h3 id="Eclipse_(目前只有Mac)">Eclipse (目前只有Mac)</h3> - -<p>Eclipse (Galileo) / CDT (6.0) project for Tamarin (also works with Helios).</p> - -<p>The configurations in this initial version cover 32- and 64-bit builds for Mac OS with the GCC 4.0 toolchain (installed with Xcode 3.x).</p> - -<h4 id="Preparing_your_Eclipse_workspace_and_perspective">Preparing your Eclipse workspace and perspective</h4> - -<ul> - <li>Open the C/C++ perspective</li> - <li>Open the 'C/C++ Projects' view (Window >> Show View >> C/C++ Projects)</li> - <li>Add view filter 'Non-C Elements' (In the top-right of the 'C/C++ Projects' view, click the down-arrow, click 'Filters...', check 'Non-C elements')</li> - <li>Increase the threshold for 'editor scalability mode' to 20000 lines. As some Tamarin source files have more than the Eclipse standard threshold of 5000, they do not appear as indexed. The threshold can be adjusted in Eclipse preferences >> C/C++ >> Editor >> Scalability.</li> - <li>*IMPORTANT* Project-specific settings for the CDT Indexer do not appear to work (it looks like a bug in Eclipse), so you have to set these manually/globally. What we want is to have the indexer track the currently selected build config (so the correct conditional compiles are highlighted in the editor). To enable this go to Eclipse preferences >> C/C++ >> Indexer, then select 'Use active build configuration' in the 'Build configuration for the indexer' section.</li> -</ul> - -<h4 id="将项目导入到_Eclipse">将项目导入到 Eclipse</h4> - -<ul> - <li>File >> Import >> General >> Existing Projects into Workspace</li> - <li>Click next</li> - <li>The root directory should be the full path to your top-level tamarin-redux directory</li> - <li>Ensure the 'avmshell-project' project is checked in the 'Projects' list</li> - <li>Uncheck 'Copy projects into workspace'</li> - <li>Click finish</li> -</ul> - -<h4 id="在_Eclipse_构建">在 Eclipse 构建</h4> - -<p>8 build configurations are included for MacOS with the GCC 4.0 toolchain:</p> - -<ul> - <li>Mac-32-Release</li> - <li>Mac-64-Release</li> - <li>Mac-32-Debug</li> - <li>Mac-64-Debug</li> - <li>Mac-32-Release-Debugger</li> - <li>Mac-64-Release-Debugger</li> - <li>Mac-32-Debug-Debugger</li> - <li>Mac-64-Debug-Debugger</li> -</ul> - -<p>The build location will be PROJECT_ROOT/BUILD_NAME/avm</p> - -<p>Note: As discussed above, the C++ indexer has been setup to track the current build config, so the correct conditional compiles are highlighted in the editor</p> - -<h4 id="从_Eclipse_运行调试">从 Eclipse 运行/调试</h4> - -<p>For test purposes, a launch config (running the HelloWorld test from esc) has been included for each of the build configs. All are available from the Run menu.</p> - -<p>Note: if you receive an error when trying to run/debug a newly imported project, try opening a file in the project first - Eclipse can sometimes get confused as to what the 'current project' actually is. Additional things to try are clicking on the project name then refreshing it (File/Refresh or right-click/Refresh) and/or quitting and restarting Eclipse.</p> - -<h3 id="Linux_and_Unix" name="Linux_and_Unix">Linux 和 Unix</h3> - -<p>Tamarin is tested on Linux but not on other Unix flavors. Nonetheless, it is possible to build Tamarin on Unix. </p> - -<p>Execute the following commands to build:</p> - -<pre class="eval"> $ cd tamarin-central/platform/unix - $ make -</pre> - -<p>The resulting executable "shell" is built in the current directory.</p> - -<h2 id="Compiling_and_running_applications" name="Compiling_and_running_applications">编译和运行应用程序</h2> - -<p>Currently the only compiler for Tamarin is the Adobe ActionScript compiler. The source code for the ActionScript compiler, <code>asc</code>, has been open sourced as part of Adobe Flex®. This compiler is written in Java and will require the installation of a Java™ 1.4 or later JDK.</p> - -<p>A prototype self-hosting ECMAScript Edition 4 compiler, <code>esc</code>, is provided with Tamarin but it is not yet capable of bootstrapping itself or building applications. <code>esc</code> is under active development and will be able to generate Tamarin applications later this year.</p> - -<p>Use the following steps to build and install the ActionScript compiler.</p> - -<ol> - <li>Download and build the asc source code using the subversion client</li> -</ol> - -<pre class="eval"> $ svn co <a class="external" href="http://opensource.adobe.com/svn/opensource/flex/sdk/sandbox/asc-redux/" rel="freelink">http://opensource.adobe.com/svn/open...box/asc-redux/</a> asc - $ cd asc/build/java - $ ant - ... - jar: - [jar] Building jar asc\lib\asc.jar - $ cd ../.. - $ java -jar lib/asc.jar # shows usage -</pre> - -<p>You may also download the latest asc.jar from <a class="link-ftp" href="ftp://ftp.mozilla.org/pub/js/tamarin/builds/asc/latest/asc.jar" rel="external nofollow" title="ftp://ftp.mozilla.org/pub/js/tamarin/builds/asc/latest/asc.jar">ftp://ftp.mozilla.org/pub/js/tamarin...latest/asc.jar</a> .</p> - -<p>You should now copy asc.jar into tamarin-central/utils.</p> - -<p><code>asc.jar</code> can be used to compile the <code>builtin.abc</code> file. The <code>builtin.abc</code> file provides internal information about the built-in classes (Object, Array, etc). This file is located in the <code>core</code> directory; you shouldn't normally need to rebuild it, unless you edit any of the ActionScript source for the built-in classes. To rebuild it, use the <code>builtin.py</code> script:</p> - -<pre class="eval"> $ cd tamarin-central/core - $ export ASC=../utils/asc.jar # builtin.py uses this to find asc.jar - $ python builtin.py - building builtin.abc, builtin.cpp, builtin.h - builtin: 26795 - Files: 6 Time: 1709ms -</pre> - -<p>You can now use</p> - -<p><code>asc.jar</code> to compile applications.</p> - -<pre class="eval"> $ cd tamarin-central - $ echo 'print("hello, world")' > hello.as - $ java -jar ./utils/asc.jar -import ./core/builtin.abc hello.as - hello.abc, 86 bytes written -</pre> - -<p>Use the AVMPlus standalone executable (<code>avmshell</code>) built previously to run the application:</p> - -<pre class="eval"> $ avmshell hello.abc - hello, world -</pre> - -<p>Use the <code>-help</code> options of <code>asc.jar</code> and <code>avmshell</code> for more details.</p> - -<h2 id="Running_Tamarin_compliance_tests" name="Running_Tamarin_compliance_tests">对 Tamarin 进行测试</h2> - -<p>See <a href="/En/Tamarin/Tamarin_Acceptance_Testing/Running_Tamarin_acceptance_tests" title="En/Tamarin/Tamarin Tests/Running Tamarin acceptance tests">Running Tamarin acceptance tests</a> and <a href="/En/Tamarin/Tamarin_Acceptance_Testing/Running_Tamarin_performance_tests" title="En/Tamarin/Tamarin Tests/Running Tamarin performance tests">Running Tamarin performance tests</a></p> - -<h2 id="Running_Tamarin_compliance_tests" name="Running_Tamarin_compliance_tests">构建 Tamarin Windows Mobile utilities</h2> - -<p>The Tamarin Windows Mobile utilities allows the existing acceptance and performance testsuites to be run on a Windows Mobile device connected to a Windows desktop machine by ActiveSync or Windows Mobile Device Center (for Windows Vista and Windows 7). </p> - -<ol> - <li>Setup and run ActiveSync or Windows Mobile Device Center. You should be connected and able to see the devices file system in Windows Explorer</li> - <li>in tamarin repository go to the utils/wmremote directory, open the ceremoteshell2008.sln file in Visual Studio 2008</li> - <li>Build all targets in Release mode (for more information see utils/wmremote/readme.txt)</li> - <li>copy Release/avmremote.dll to the device in the \Windows directory</li> - <li>export AVM=Release/ceremoteshell.exe, the ceremoteshell.exe behaves as a proxy copying and running abc files on the windows mobile device</li> - <li>build a windows mobile tamarin shell, copy the shell to the windows mobile device in \Program Files\shell\avmshell.exe</li> - <li>(optional) Can sanity check the windows mobile shell is functioning by running $AVM hello.abc (where hello.abc is a simple abc to print a string, or can substitute with any test abc)</li> - <li>Now any acceptance or performance tests can be run as on desktop using test/acceptance/runtests.py or tests/performance/runtests.py</li> -</ol> - -<h2 id="Running_Tamarin_compliance_tests" name="Running_Tamarin_compliance_tests">Tamarin BuildBot</h2> - -<p>Adobe maintains a <a class="external" href="http://tamarin-builds.mozilla.org/tamarin-redux/" title="http://tamarin-builds.mozilla.org/tamarin-redux/">continuous build and test system</a> for Tamarin Redux, similar to TinderBox.</p> - -<h2 id="Tamarin_BuildBot_TryServer" name="Tamarin_BuildBot_TryServer">Tamarin BuildBot TryServer</h2> - -<p>The TryServer/Sandbox is setup to allow users to push any code changes that they would like to have tested in the automated build/test process prior to actually pushing the changes. The Sandbox is setup so that it is able to build and test branches that are based on either tamarin-central or tamarin-tracing.</p> - -<p>Any comments, questions or problems can be directed to</p> - -<p><a class="link-mailto" href="mailto:actionscriptqe@adobe.com" title="mailto:actionscriptqe@adobe.com">ActionScript QE</a></p> - -<h3 id="How_To" name="How_To">How to</h3> - -<ol> - <li>Setup a user repository with the source and patches that will be compiled. Documentation on how to setup a user repository <a href="/../../../../En/Publishing_Mercurial_Clones" title="../../../../En/Publishing_Mercurial_Clones">http://developer.mozilla.org/En/Publishing_Mercurial_Clones</a>. Push any changes that you want to test into this repository.</li> - <li>Request a build via the form at <a class="external" href="http://tamarin-builds.mozilla.org/build_trigger/requestbuild.cfm" title="http://tamarin-builds.mozilla.org/build_trigger/requestbuild.cfm">http://tamarin-builds.mozilla.org/build_trigger/requestbuild.cfm</a> - <ul> - <li><strong>User Email:</strong> Your email address. An email with the build status will be sent to this address when a builder completes whether it is passes or fails.</li> - <li><strong>Mercurial Repository:</strong> Give the location of the repository that will be used for the build. NOTE: Only repositories hosted on <a class="external" href="http://hg.mozilla.org/" rel="freelink">http://hg.mozilla.org/</a> are accepted.</li> - <li><strong>Revision:</strong> Specify the revision number that will be built. Currently this only accepts the change number and not the hash.</li> - <li><strong>Branch:</strong> Which branch of tamarin the repository is based on, Tamarin-Central or Tamarin-Tracing.</li> - <li><strong>Description:</strong> Self explanatory</li> - </ul> - </li> - <li>Check the status of the build @ <a class="external" href="http://tamarin-builds.mozilla.org/tamarin-redux/" title="http://tamarin-builds.mozilla.org/tamarin-redux/">http://tamarin-builds.mozilla.org/tamarin-redux/</a> , you can also see your build request in the queue at <a class="external" href="http://tamarin-builds.mozilla.org/build_trigger/requestbuild.cfm" title="http://tamarin-builds.mozilla.org/build_trigger/requestbuild.cfm">http://tamarin-builds.mozilla.org/build_trigger/requestbuild.cfm</a>. If you no longer want you sandbox to build and it has not started yet, you can delete the build request from the queue from the request page.</li> -</ol> - -<h3 id="TryServer_Etiquette" name="TryServer_Etiquette">TryServer etiquette</h3> - -<p>The sandbox is not a good substitute for running the regression tests locally to catch obvious problems.</p> - -<p>This is a shared resource, each request takes approximately 2+ hours to run so please use wisely.</p> diff --git a/files/zh-cn/archive/mozilla/xbl/index.html b/files/zh-cn/archive/mozilla/xbl/index.html deleted file mode 100644 index 554771a049..0000000000 --- a/files/zh-cn/archive/mozilla/xbl/index.html +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: XBL -slug: Archive/Mozilla/XBL -tags: - - XBL -translation_of: Archive/Mozilla/XBL ---- -<p><strong>XML 绑定语言</strong> （<strong>XBL</strong>，有时也被称为可扩展绑定语言）是用于描述可以附加到其他文档中的元素的“绑定”（bindings）的语言。绑定所附加到的元素被称为<em>绑定元素</em>（bound element），会获取绑定中指定的新行为。</p> - -<p>绑定可以包含在绑定元素上注册的事件处理器（event handlers）、可从绑定元素访问的新方法（methods）和属性（properties）、以及插入到绑定元素下的匿名内容。</p> - -<p>Most <a href="/en/XUL" title="en/XUL">XUL</a> widgets are at least partially implemented using XBL. You can build your own reusable widgets from existing <a href="/en/XUL" title="en/XUL">XUL</a>, <a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/SVG" title="en/SVG">SVG</a>, and other primitives using XBL.</p> - -<h3 id="Specifications" name="Specifications">定义</h3> - -<ul> - <li>XBL 1.0 is specified in <a href="/en/XBL/XBL_1.0_Reference" title="en/XBL/XBL_1.0_Reference">XBL 1.0 Reference</a>. Unfortunately, the actual implementation in Mozilla is different from the specification, and there's no known document available describing the differences. Hopefully, the Reference will be updated to describe those differences.</li> -</ul> - -<p>XBL 1.0 是一个 Mozilla-specific technology，不是一个 <a class="external" href="http://w3.org/">W3C</a> 标准。至少两个基于它的标准已经被废弃：sXBL 和 XBL 2.0。</p> - -<div class="warning"> -<p>警告！sXBL 和 XBL 2.0 已被废弃。</p> -</div> - -<ul> - <li>W3C <a class="external" href="http://w3.org/TR/sXBL/">sXBL</a> (currently a working draft, 2005) stands for <em>SVG's XML Binding Language</em>. It is supposed to include a subset of XBL 2.0 features needed for <a href="/en/SVG" title="en/SVG">SVG</a>. It's similar in spirit to Mozilla's XBL, but there are a few subtle (and not-so-subtle) differences. For example, names of the elements are different. Also sXBL lacks some features of XBL, such as bindings inheritance and defining methods/properties on bound elements.</li> - <li><a class="external" href="http://www.mozilla.org/projects/xbl/xbl2.html">XBL 2.0</a> (<a class="external" href="http://w3.org/TR/XBL/">W3C Candidate Recommendation</a>) is being developed to address problems found in XBL 1.0 and to allow for implementations in a broader range of Web browsers. Mozilla plans to implement XBL2 in future versions of <a href="/en/Gecko" title="en/Gecko">Gecko</a> with <a class="external" href="http://groups.google.com/group/mozilla.dev.tech.xbl/msg/d7d4f279ebdad65f" title="http://groups.google.com/group/mozilla.dev.tech.xbl/msg/d7d4f279ebdad65f">initial stages</a> started in June 2009.</li> -</ul> - -<p>Some differences between sXBL and XBL2 are listed in <a class="external" href="http://annevankesteren.nl/2005/11/xbl">an article by Anne van Kesteren</a> (November, 2005).</p> - -<p>An overview of differences between Mozilla XBL and XBL2 is in a <a class="external" href="http://groups.google.com/group/mozilla.dev.tech.xbl/msg/af3d4e37cce1d907">newsgroup posting by Jonas Sicking</a> (April, 2007).</p> - -<div class="geckoVersionNote"> -<p>Still living "Shadow DOM" related specs</p> -</div> - -<ul> - <li><a href="http://www.w3.org/TR/shadow-dom/">Shadow DOM</a> (<a href="http://w3c.github.io/webcomponents/spec/shadow/">Editor's Draft</a>)</li> - <li><a href="http://dev.w3.org/csswg/css-scoping/#shadow-dom">CSS Scoping » Shadow Encapsulation</a></li> -</ul> - -<h3 id="See_also" name="See_also">参见</h3> - -<ul> - <li><a href="/en/XUL_Tutorial/Introduction_to_XBL" title="en/XUL_Tutorial/Introduction_to_XBL">Introduction to XBL</a> from the <a href="/en/XUL_Tutorial" title="en/XUL_Tutorial">XUL Tutorial</a>.</li> - <li><a href="/en-US/docs/XUL/School_tutorial/Custom_XUL_Elements_with_XBL" title="/en-US/docs/XUL/School_tutorial/Custom_XUL_Elements_with_XBL">Custom XUL Elements with XBL [en-US]</a> from the <a href="/en-US/docs/XUL/School_tutorial" title="/en-US/docs/XUL/School_tutorial">XUL School Tutorial [en-US]</a> for add-on developers</li> - <li><a class="external" href="http://mb.eschew.org/15.php">XBL chapter</a> of <a class="external" href="http://mb.eschew.org/">"Rapid Application Development with Mozilla"</a></li> - <li><a class="external" href="http://www.w3.org/TR/xbl-primer/">XBL 2.0 Primer</a> (draft)</li> - <li><a class="external" href="http://code.google.com/p/xbl/" title="http://code.google.com/p/xbl/">XBL 2.0 Cross-browser implementation in JavaScript</a></li> -</ul> - -<ul> - <li><a href="/en-US/docs/tag/XBL">更多 XBL 资源…</a></li> -</ul> - -<h3 id="Community" name="Community">社区</h3> - -<ul> - <li>查看 Mozilla 论坛上的讨论…</li> -</ul> - -<p></p><ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-tech-xbl"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.tech.xbl"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.tech.xbl/feeds"> Web feed</a></li> -</ul><p></p> diff --git a/files/zh-cn/archive/mozilla/xbl/xbl_1.0_reference/dom_interfaces/index.html b/files/zh-cn/archive/mozilla/xbl/xbl_1.0_reference/dom_interfaces/index.html deleted file mode 100644 index 6e926d52b5..0000000000 --- a/files/zh-cn/archive/mozilla/xbl/xbl_1.0_reference/dom_interfaces/index.html +++ /dev/null @@ -1,122 +0,0 @@ ---- -title: DOM Interfaces -slug: Archive/Mozilla/XBL/XBL_1.0_Reference/DOM_Interfaces -translation_of: Archive/Mozilla/XBL/XBL_1.0_Reference/DOM_Interfaces ---- -<p> </p> -<h2 id="The_DocumentXBL_Interface" name="The_DocumentXBL_Interface">The nsIDOMDocumentXBL Interface</h2> -<p>The <code>nsIDOMDocumentXBL</code> interface contains methods for manipulating XBL bindings. The interface is implemented by all DOM documents.</p> -<h3 id="IDL_Definition" name="IDL_Definition">IDL Definition</h3> -<pre>interface nsIDOMDocumentXBL { - NodeList getAnonymousNodes(in Element elt); - Element getAnonymousElementByAttribute(in Element elt, - in DOMString attrName, - in DOMString attrValue); - /* NOT IMPLEMENTED - void addBinding(in Element elt, - in DOMString bindingURL); - void removeBinding(in Element elt, - in DOMString bindingURL); - */ - - Element getBindingParent(in Node node); - void loadBindingDocument(in DOMString documentURL); -}; -</pre> -<h3 id="Methods" name="Methods">Methods</h3> -<h4 id="getAnonymousNodes" name="getAnonymousNodes">getAnonymousNodes</h4> -<p>The <code>getAnonymousNodes</code> method retrieves the anonymous children of the specified element.</p> -<ul> - <li><em>Parameters</em> - <ul> - <li><code>elt</code> - The element to retrieve anonymous children for.</li> - </ul> - </li> - <li><em>Return Value</em> - <ul> - <li><code>NodeList</code> - The return value of <code>getAnonymousNodes</code> is a <code>NodeList</code> that represents the children of an element after insertion points from its own binding have been applied. This means that, depending on the details regarding the insertion points of the binding, it's possible that some non-anonymous nodes appear in the list. See <a class="external" href="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/d89ed07aea746c50" title="http://groups.google.com/group/mozilla.dev.platform/browse_thread/thread/d89ed07aea746c50">"Not so anonymous nodes" on mozilla.dev.platform</a> for some discussion about this.</li> - </ul> - </li> -</ul> -<h4 id="getAnonymousElementByAttribute" name="getAnonymousElementByAttribute">getAnonymousElementByAttribute</h4> -<p>The <code>getAnonymousElementByAttribute</code> methods retrieves an anonymous descendant with a specified attribute value. Typically used with an (arbitrary) <code>anonid</code> attribute to retrieve a specific anonymous child in an XBL binding.</p> -<ul> - <li><em>Parameters</em> - <ul> - <li><code>elt</code> - The element to retrieve anonymous children for.</li> - <li><code>attrName</code> - The attribute name to look up.</li> - <li><code>attrValue</code> - The attribute value to match.</li> - </ul> - </li> - <li><em>Return Value</em> - <ul> - <li><code>Element</code> - The return value of <code>getAnonymousElementByAttribute</code> is an anonymous descendant of the given element with matching attribute name and value.</li> - </ul> - </li> -</ul> -<h4 id="addBinding" name="addBinding">addBinding</h4> -<p><em>NOT IMPLEMENTED</em> The <code>addBinding</code> method attaches the specified binding (and any bindings that the binding inherits from) to an element. This call is not necessarily synchronous. The binding may not be attached yet when the call completes. See <a href="/zh-CN/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#Attachment_using_the_DOM" title="zh-CN/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#Attachment_using_the_DOM">here</a> for more information.</p> -<ul> - <li><em>Parameters</em> - <ul> - <li><code>elt</code> - The element to attach a binding to.</li> - <li><code>bindingURL</code> of type <code>DOMString</code> - A URI that specifies the location of a specific binding to attach.</li> - </ul> - </li> - <li><em>No Return Value</em></li> -</ul> -<h4 id="removeBinding" name="removeBinding">removeBinding</h4> -<p><em>NOT IMPLEMENTED</em> The <code>removeBinding</code> method detaches the specified binding (and any bindings that the binding inherits from explicitly using the <code>extends</code> attribute) from the element. See <a href="/zh-CN/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#The_bindingdetached_Event" title="zh-CN/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#The_bindingdetached_Event">here</a> for more information.</p> -<ul> - <li><em>Parameters</em> - <ul> - <li><code>elt</code> - The element to remove a binding from.</li> - <li><code>bindingURL</code> of type <code>DOMString</code> - A URI that specifies the location of a specific binding to detach.</li> - </ul> - </li> - <li><em>No Return Value</em></li> -</ul> -<h4 id="getBindingParent" name="getBindingParent">getBindingParent</h4> -<p>The <code>getBindingParent</code> method is used to obtain the bound element with the binding attached that is responsible for the generation of the specified anonymous node. This method enables an author to determine the scope of any content node. When content at the document-level scope is passed in as an argument, the property's value is <code>null</code>.</p> -<ul> - <li><em>Parameters</em> - <ul> - <li><code>node</code> - The node for which the bound element responsible for generation is desired.</li> - </ul> - </li> - <li><em>Return Value</em> - <ul> - <li><code>Element</code> - The return value of <code>getBindingParent</code> is the element responsible for the given anonymous node.</li> - </ul> - </li> -</ul> -<h4 id="loadBindingDocument" name="loadBindingDocument">loadBindingDocument</h4> -<p>The <code>loadBindingDocument</code> method can be used to synchronously obtain the specified binding document for use within a particular document (the one on which the <code>loadBindingDocument </code> method was invoked). The binding document can then be modified programmatically using the DOM. Any subsequent bindings that are attached to elements within the document will be constructed from the modified binding document.</p> -<ul> - <li><em>Parameters</em> - <ul> - <li><code>documentURL</code> of type <code><a class="external" href="http://www.w3.org/TR/2000/CR-DOM-Level-2-20000510/core.html#DOMString">DOMString</a></code> - The URL of a binding document.</li> - </ul> - </li> - <li><em>Return Value</em> - <ul> - <li><code>Document</code> - The return value of <code>loadBindingDocument</code> is the binding document used by the calling document to attach bindings that are defined in the binding document.</li> - </ul> - </li> -</ul> -<h3 id="Example">Example</h3> -<p>The following snippet checks to see if any anonymous child of "element" is itself an element.</p> -<pre>if (element.ownerDocument instanceof Ci.nsIDOMDocumentXBL) -{ - var anonChildren = element.ownerDocument.getAnonymousNodes(element); - if (anonChildren) - { - for (var i = 0; i < anonChildren.length; i++) - { - if (anonChildren[i].nodeType == 1) - return false; - } - } -} -return true; -</pre> diff --git a/files/zh-cn/archive/mozilla/xbl/xbl_1.0_reference/index.html b/files/zh-cn/archive/mozilla/xbl/xbl_1.0_reference/index.html deleted file mode 100644 index b891778907..0000000000 --- a/files/zh-cn/archive/mozilla/xbl/xbl_1.0_reference/index.html +++ /dev/null @@ -1,117 +0,0 @@ ---- -title: XBL 1.0 Reference -slug: Archive/Mozilla/XBL/XBL_1.0_Reference -tags: - - NeedsTranslation - - TopicStub - - XBL -translation_of: Archive/Mozilla/XBL/XBL_1.0_Reference ---- -<p> </p> -<h2 id="Abstract" name="Abstract">Abstract</h2> -<p>This document describes Extensible Binding Language (<a href="/en/XBL" title="en/XBL">XBL</a>) 1.0 as implemented in <a href="/en/Gecko" title="en/Gecko">Gecko</a> browsers.</p> -<p>Extensible Binding Language is a <a href="/en/XML" title="en/XML">XML</a>-based markup language to implement reusable components (<em>bindings</em>) that can be bound to elements in other documents. The element with a binding specified, called the <em>bound element</em>, acquires the new behavior specified by the binding. Bindings can be bound to elements using Cascading Style Sheets (<a href="/en/CSS" title="en/CSS">CSS</a>) or <a href="/en/DOM" title="en/DOM">DOM</a>. One element can be bound to several bindings at once.</p> -<p>Functionally bindings should be correlated with <a class="external" href="http://msdn.microsoft.com/workshop/components/htc/reference/htcref.asp">Behaviors</a> and <a class="external" href="http://msdn.microsoft.com/workshop/author/behaviors/overview/viewlink_ovw.asp">Viewlink</a> but being implemented as one integrated XML solution.</p> -<p>Bindings can contain event handlers that are registered on the bound element, an implementation of new methods and properties that become accessible from the bound element, and anonymous content that is inserted around the bound element.</p> -<div class="note"> - <p>There are numerous adjustments in the current implementation in comparison of <a class="external" href="http://www.w3.org/TR/xbl/">earlier XBL proposals</a>, and not all of them are reflected yet in this document. The documentation process is still in progress: please keep it in your mind while using the provided information.</p> -</div> -<h2 id="XBL_Elements" name="XBL_Elements"><a href="/en/XBL/XBL_1.0_Reference/Elements">XBL Elements</a></h2> -<p>XBL 1.0 elements are in the <code><span class="nowiki">http://www.mozilla.org/xbl</span></code> namespace.</p> -<ul> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#bindings">bindings</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#binding">binding</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#_content">content</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#children">children</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#implementation">implementation</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#constructor">constructor</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#destructor">destructor</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#field">field</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#property">property</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#getter">getter</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#setter">setter</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#method">method</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#parameter">parameter</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#body">body</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#handlers">handlers</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#handler">handler</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#resources">resources</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#stylesheet">stylesheet</a></code></li> - <li><code><a href="/en/XBL/XBL_1.0_Reference/Elements#image">image</a></code></li> -</ul> -<h2 id="Binding_Attachment_and_Detachment" name="Binding_Attachment_and_Detachment"><a href="/en/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment">Binding Attachment and Detachment</a></h2> -<ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#Attachment_using_CSS">Attachment using CSS</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#Attachment_using_element.style_property">Attachment using element.style property</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#.3Cconstructor.3E_call"><constructor> call</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#.3Cdestructor.3E_call"><destructor> call</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Attachment_and_Detachment#Binding_Documents">Binding Documents</a></li> -</ul> -<h2 id="DOM_Interfaces" name="DOM_Interfaces"><a href="/en/XBL/XBL_1.0_Reference/DOM_Interfaces" title="en/XBL/XBL_1.0_Reference/DOM_Interfaces">DOM Interfaces</a></h2> -<ul> - <li><a href="/en/XBL/XBL_1.0_Reference/DOM_Interfaces#The_nsIDOMDocumentXBL_Interface" title="en/XBL/XBL 1.0 Reference/DOM Interfaces#The nsIDOMDocumentXBL Interface">The nsIDOMDocumentXBL Interface</a></li> -</ul> -<h2 id="Anonymous_Content" name="Anonymous_Content"><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content">Anonymous Content</a></h2> -<ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Introduction">Introduction</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Scoping_and_Access_Using_the_DOM">Scoping and Access Using the DOM</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Content_Generation">Content Generation</a> - <ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Rules_for_Generation">Rules for Generation</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#The_contentgenerated_Event">The contentgenerated Event</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#The_contentdestroyed_Event">The contentdestroyed Event</a></li> - </ul> - </li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Attribute_Forwarding">Attribute Forwarding</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Insertion_Points">Insertion Points</a> - <ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#.3Cchildren.3E_and_.3Celement.3E"><children> and <element></a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Handling_DOM_Changes">Handling DOM Changes</a></li> - </ul> - </li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Event_Flow_and_Targeting">Event Flow and Targeting</a> - <ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Flow_and_Targeting_Across_Scopes">Flow and Targeting Across Scopes</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Focus_and_Blur_Events">Focus and Blur Events</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Mouseover_and_Mouseout_Events">Mouseover and Mouseout Events</a></li> - </ul> - </li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Anonymous_Content_and_CSS">Anonymous Content and CSS</a> - <ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Selectors_and_Scopes">Selectors and Scopes</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Anonymous_Content#Binding_Stylesheets">Binding Stylesheets</a></li> - </ul> - </li> -</ul> -<h2 id="Binding_Implementations" name="Binding_Implementations"><a href="/en/XBL/XBL_1.0_Reference/Binding_Implementations">Binding Implementations</a></h2> -<ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Implementations#Introduction">Introduction</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Implementations#Methods">Methods</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Implementations#Properties">Properties</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Binding_Implementations#Inheritance_of_Implementations">Inheritance of Implementations</a></li> -</ul> -<h2 id="Event_Handlers" name="Event_Handlers"><a href="/en/XBL/XBL_1.0_Reference/Event_Handlers">Event Handlers</a></h2> -<h2 id="Example_-_Sticky_Notes" name="Example_-_Sticky_Notes"><a href="/en/XBL/XBL_1.0_Reference/Example_Sticky_Notes">Example - Sticky Notes</a></h2> -<p>Updated and adjusted for the current Firefox implementation.</p> -<div class="note"> - <p>This example is targeted to demonstrate the XBL usage rather than to be a practically useful application. For this reason it contains many comments and some blocks could be avoided in a more compact solution yet used here for demonstration purposes.</p> -</div> -<ul> - <li><a href="/en/XBL/XBL_1.0_Reference/Example_Sticky_Notes#notes.html">notes.html</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Example_Sticky_Notes#notes.xml">notes.xml</a></li> - <li><a href="/en/XBL/XBL_1.0_Reference/Example_Sticky_Notes#notes.css">notes.css</a></li> -</ul> -<p><a class="external" href="http://www.cogjam.com/external/xbl/notes.html">View this example</a></p> -<p><br> - <span class="comment"><a class="external" href="http://www.nskom.com/external/xbl/notes.zip" title="http://www.nskom.com/external/xbl/notes.zip">Download all files (.zip archive)</a> need to ask to adjust the server - it gives "Access denied" for zip files (?)</span></p> -<h2 id="References" name="References">References</h2> -<ul> - <li><a class="external" href="http://www.w3.org/TR/xbl/">Initial XBL 1.0 proposal submitted as a Note to W3C</a> (does not reflect Mozilla implementation, nor future plans)</li> - <li><a class="external" href="http://www.mozilla.org/projects/xbl/xbl2.html">XBL 2.0 Project</a></li> -</ul> -<div class="originaldocinfo"> - <h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2> - <ul> - <li>Last Updated Date: April 24, 2006</li> - </ul> -</div> diff --git a/files/zh-cn/archive/mozilla/xpinstall/index.html b/files/zh-cn/archive/mozilla/xpinstall/index.html deleted file mode 100644 index b1d122e53b..0000000000 --- a/files/zh-cn/archive/mozilla/xpinstall/index.html +++ /dev/null @@ -1,83 +0,0 @@ ---- -title: XPInstall -slug: Archive/Mozilla/XPInstall -tags: - - XPInstall - - XPInstall_API_reference -translation_of: Archive/Mozilla/XPInstall ---- -<p></p><div class="warning"><p>Parts of this page show the use of the <a href="https://developer.mozilla.org/zh-CN/docs/XPInstall_API_Reference">XPInstall API</a>. The majority of this API is now deprecated and as of Gecko 1.9 no longer available. <a href="https://developer.mozilla.org/zh-CN/docs/Extensions">Extension</a>, <a href="https://developer.mozilla.org/zh-CN/docs/Themes">Theme</a>, and <a href="https://developer.mozilla.org/zh-CN/docs/Plugins">plug-in</a> developers must switch away from <code>install.js</code> based packages to the new <a href="https://developer.mozilla.org/zh-CN/docs/Bundles">packaging scheme</a> with an <code><a href="https://developer.mozilla.org/zh-CN/docs/Install_Manifests">install.rdf</a></code> manifest. In particular plugin developers should see <a class="new" href="https://developer.mozilla.org/zh-CN/docs/Shipping_a_plugin_as_a_Toolkit_bundle" rel="nofollow">how to package a plugin as an extension</a>.</p></div><p></p> - -<div><strong>Cross-Platform Install (XPInstall)</strong> is a technology used by Mozilla Application Suite, Mozilla Firefox, Mozilla Thunderbird and other <a href="cn/XUL">XUL</a>-based applications for installing <a href="cn/Extensions">extensions</a>. An <a href="cn/XPI">XPI</a> (pronounced "zippy" and derived from XPInstall) installer module is a ZIP file that contains an install script or manifest (entitled install.js or <a href="cn/Install_Manifests">install.rdf</a>) at the root of the file.<br> -<strong>跨平台安装(XPInstall)</strong>是被Mozilla应用程序套件(Firefox, Thunderbird, 其它一些基于<a href="cn/XUL">XUL</a>的应用程序)所使用的一项安装扩展的技术. <a href="cn/XPI">XPI</a>安装模块是一个ZIP文件, 它包括一个位于根路径的安装脚本文件或者清单(符合规定格式的install.js或者<a href="cn/Install_Manifests">install.ref</a>)文件</div> - -<p>.</p> - -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h4 id="Documentation" name="Documentation"><a>Documentation</a></h4> - - <dl> - <dt><a href="cn/XPInstall_API_Reference">XPInstall API 参考</a></dt> - </dl> - - <dl> - <dt><a href="cn/Learn_XPI_Installer_Scripting_by_Example">通过实例学习XPI安装脚本</a></dt> - <dd><small>This article uses the installer script from <code>browser.xpi</code> install package as the basis for discussing XPI installations in general. </small></dd> - <dd>这篇文章使用了取至于<code>browser.xpi</code>安装包中的安装脚本来讨论XPI安装的基本原理.</dd> - </dl> - - <dl> - <dt><a href="cn/Creating_XPI_Installer_Modules">创建XPI安装模块</a></dt> - <dd><small>This article describes the packaging scheme of the Mozilla and offers a tutorial for creating a new package that can then be redistributed, installed, and made available to users. </small></dd> - <dd>这篇文件描述了Mozilla安装模块的打包方案, 并提供了一个关于创建一个新的可用来分发, 安装和用户可用的安装包的教程.</dd> - </dl> - - <dl> - <dt><a href="cn/Install_Wizards_(aka/Stub_Installers)">安装向导 (aka: Stub Installers)</a></dt> - </dl> - - <p><span class="alllinks"><a>View All...</a></span></p> - </td> - <td> - <h4 id="Community" name="Community">Community</h4> - - <ul> - <li>View Mozilla forums...</li> - </ul> - - <p></p><ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-platform"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.platform"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.platform/feeds"> Web feed</a></li> -</ul><p></p> - - <h4 id="Tools" name="Tools">Tools</h4> - - <ul> - <li><a class="external" href="http://www.mozilla.org/quality/smartupdate/xpinstall-trigger.html">XPInstall trigger page</a></li> - </ul> - - <h4 id="Related_Topics" name="Related_Topics">Related Topics</h4> - - <dl> - <dd><a href="cn/Extensions">Extensions</a>, <a href="cn/XUL">XUL</a>, <a href="cn/XPI">XPI</a></dd> - </dl> - </td> - </tr> - </tbody> -</table> - -<p><span class="comment">Categories</span></p> - -<p><span class="comment">Interwiki Language Links</span></p> - -<p> </p> - -<div class="noinclude"> </div> - -<p></p> diff --git a/files/zh-cn/archive/mozilla/xpinstall/reference/index.html b/files/zh-cn/archive/mozilla/xpinstall/reference/index.html deleted file mode 100644 index 5111ad1a6b..0000000000 --- a/files/zh-cn/archive/mozilla/xpinstall/reference/index.html +++ /dev/null @@ -1,189 +0,0 @@ ---- -title: XPInstall API reference -slug: Archive/Mozilla/XPInstall/Reference -translation_of: Archive/Mozilla/XPInstall/Reference ---- -<p></p><div class="warning"><p>Parts of this page show the use of the <a href="https://developer.mozilla.org/zh-CN/docs/XPInstall_API_Reference">XPInstall API</a>. The majority of this API is now deprecated and as of Gecko 1.9 no longer available. <a href="https://developer.mozilla.org/zh-CN/docs/Extensions">Extension</a>, <a href="https://developer.mozilla.org/zh-CN/docs/Themes">Theme</a>, and <a href="https://developer.mozilla.org/zh-CN/docs/Plugins">plug-in</a> developers must switch away from <code>install.js</code> based packages to the new <a href="https://developer.mozilla.org/zh-CN/docs/Bundles">packaging scheme</a> with an <code><a href="https://developer.mozilla.org/zh-CN/docs/Install_Manifests">install.rdf</a></code> manifest. In particular plugin developers should see <a class="new" href="https://developer.mozilla.org/zh-CN/docs/Shipping_a_plugin_as_a_Toolkit_bundle" rel="nofollow">how to package a plugin as an extension</a>.</p></div><p></p> - - -<h3 id="Objects" name="Objects">Objects</h3> - -<h4 id="Install" name="Install"><a href="/en-US/docs/XPInstall_API_Reference/Install_Object">Install</a></h4> - -<dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Properties">Properties</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods">Methods</a></dd> -</dl> - -<dl> - <dd> - <dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/addDirectory">addDirectory</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/addFile">addFile</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/alert">alert</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/cancelInstall">cancelInstall</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/confirm">confirm</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/deleteRegisteredFile">deleteRegisteredFile</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/execute">execute</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/gestalt">gestalt</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/getComponentFolder">getComponentFolder</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/getLastError">getLastError</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/getWinProfile">getWinProfile</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/getWinRegistry">getWinRegistry</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/loadResources">loadResources</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/logComment">logComment</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/patch">patch</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/performInstall">performInstall</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/refreshPlugins">refreshPlugins</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/registerChrome">registerChrome</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/resetError">resetError</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Install_Object/Methods/setPackageFolder">setPackageFolder</a></dd> - </dl> - </dd> -</dl> - -<h4 id="InstallTrigger" name="InstallTrigger"><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a></h4> - -<dl> - <dd><em>No properties</em></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object/Methods">Methods</a></dd> -</dl> - -<dl> - <dd> - <dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object/Methods/compareVersion">compareVersion</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object/Methods/enabled">enabled</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object/Methods/getVersion">getVersion</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object/Methods/install">install</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object/Methods/installChrome">installChrome</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallTrigger_Object/Methods/startSoftwareUpdate">startSoftwareUpdate</a></dd> - </dl> - </dd> -</dl> - -<h4 id="InstallVersion" name="InstallVersion"><a href="/en-US/docs/XPInstall_API_Reference/InstallVersion_Object">InstallVersion</a></h4> - -<dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallVersion_Object/Properties">Properties</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallVersion_Object/Methods">Methods</a></dd> -</dl> - -<dl> - <dd> - <dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallVersion_Object/Methods/compareTo">compareTo</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallVersion_Object/Methods/init">init</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/InstallVersion_Object/Methods/toString">toString</a></dd> - </dl> - </dd> -</dl> - -<h4 id="File" name="File"><a href="/en-US/docs/XPInstall_API_Reference/File_Object">File</a></h4> - -<dl> - <dd><em>No properties</em></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods">Methods</a></dd> -</dl> - -<dl> - <dd> - <dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/copy">copy</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/dirCreate">dirCreate</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/dirGetParent">dirGetParent</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/dirRemove">dirRemove</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/dirRename">dirRename</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/diskSpaceAvailable">diskSpaceAvailable</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/execute">execute</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/exists">exists</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/isDirectory">isDirectory</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/isFile">isFile</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/macAlias">macAlias</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/modDate">modDate</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/modDateChanged">modDateChanged</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/move">move</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/remove">remove</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/rename">rename</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/size">size</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/windowsGetShortName">windowsGetShortName</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/windowsRegisterServer">windowsRegisterServer</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/File_Object/Methods/windowsShortcut">windowsShortcut</a></dd> - </dl> - </dd> -</dl> - -<h4 id="WinProfile" name="WinProfile"><a href="/en-US/docs/XPInstall_API_Reference/WinProfile_Object">WinProfile</a></h4> - -<dl> - <dd><em>No properties</em></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinProfile_Object/Methods">Methods</a></dd> -</dl> - -<dl> - <dd> - <dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinProfile_Object/Methods/getString">getString</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinProfile_Object/Methods/writeString">writeString</a></dd> - </dl> - </dd> -</dl> - -<h4 id="WinReg" name="WinReg"><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object">WinReg</a></h4> - -<dl> - <dd><em>No properties</em></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods">Methods</a></dd> -</dl> - -<dl> - <dd> - <dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/createKey">createKey</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/deleteKey">deleteKey</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/deleteValue">deleteValue</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/enumKeys">enumKeys</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/enumValueNames">enumValueNames</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/getValue">getValue</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/getValueNumber">getValueNumber</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/getValueString">getValueString</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/isKeyWritable">isKeyWritable</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/keyExists">keyExists</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/setRootKey">setRootKey</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/setValue">setValue</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/setValueNumber">setValueNumber</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/setValueString">setValueString</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/Methods/valueExists">valueExists</a></dd> - </dl> - </dd> -</dl> - -<dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/WinReg_Object/WinRegValue">WinRegValue constructor</a></dd> -</dl> - -<h3 id="Other_Information" name="Other_Information">Other Information</h3> - -<h4 id="Return_Codes" name="Return_Codes">Return Codes</h4> - -<p><a href="/en-US/docs/XPInstall_API_Reference/Return_Codes">See complete list</a></p> - -<h4 id="Examples" name="Examples"><a href="/en-US/docs/XPInstall_API_Reference/Examples">Examples</a></h4> - -<dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts">Trigger Scripts and Install Scripts</a></dd> -</dl> - -<h5 id="Code_Samples" name="Code_Samples">Code Samples</h5> - -<dl> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/File.macAlias">File.macAlias</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/File.windowsShortcut">File.windowsShortcut</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/Install.addDirectory">Install.addDirectory</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/Install.addFile">Install.addFile</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/InstallTrigger.installChrome">InstallTrigger.installChrome</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/InstallTrigger.startSoftwareUpdate">InstallTrigger.startSoftwareUpdate</a></dd> - <dd><a href="/en-US/docs/XPInstall_API_Reference/Examples/Windows_Install">Windows Install</a></dd> -</dl> diff --git a/files/zh-cn/archive/mozilla/xpinstall/reference/install_object/index.html b/files/zh-cn/archive/mozilla/xpinstall/reference/install_object/index.html deleted file mode 100644 index 0a4a02a30a..0000000000 --- a/files/zh-cn/archive/mozilla/xpinstall/reference/install_object/index.html +++ /dev/null @@ -1,50 +0,0 @@ ---- -title: Install Object -slug: Archive/Mozilla/XPInstall/Reference/Install_Object -tags: - - XPInstall_API_reference -translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object ---- -<p></p><div class="warning"><p>Parts of this page show the use of the <a href="https://developer.mozilla.org/zh-CN/docs/XPInstall_API_Reference">XPInstall API</a>. The majority of this API is now deprecated and as of Gecko 1.9 no longer available. <a href="https://developer.mozilla.org/zh-CN/docs/Extensions">Extension</a>, <a href="https://developer.mozilla.org/zh-CN/docs/Themes">Theme</a>, and <a href="https://developer.mozilla.org/zh-CN/docs/Plugins">plug-in</a> developers must switch away from <code>install.js</code> based packages to the new <a href="https://developer.mozilla.org/zh-CN/docs/Bundles">packaging scheme</a> with an <code><a href="https://developer.mozilla.org/zh-CN/docs/Install_Manifests">install.rdf</a></code> manifest. In particular plugin developers should see <a class="new" href="https://developer.mozilla.org/zh-CN/docs/Shipping_a_plugin_as_a_Toolkit_bundle" rel="nofollow">how to package a plugin as an extension</a>.</p></div><p></p> - -<h2 id="Install_.28Install_.E5.AF.B9.E8.B1.A1.29" name="Install_.28Install_.E5.AF.B9.E8.B1.A1.29">Install (Install 对象)</h2> - -<p>Use the <code>Install</code> object to manage the downloading and installation of software with the XPI Installation Manager.<br> - 译:使用<code>Install</code>对象协同XPI安装管理器操纵软件的下载和安装.</p> - -<h3 id="Overview" name="Overview">Overview</h3> - -<p>The Install object is used primarily in installation scripts. In all cases, the <code>Install</code> object is implicit--like the <code>window</code> object in regular web page scripts--and needn't be prefixed to the object methods. The following two lines, for example, are equivalent:<br> - Install对象首先会被安装脚本所使用. Install对象总是隐式的, 如同在规则的web页脚本中的<code>window</code>对象一样, 你并不需要将其作为其方法的调用前缀. 例如, 以下两行代码功能是完全一样的:</p> - -<pre>f = getFolder("Program"); -f = Install.getFolder("Program"); -</pre> - -<p>An installation script is composed of calls to the Install object, and generally takes the following form:<br> - 一个安装脚本被书写为调用Install对象, 并且通常采取以下形式:</p> - -<dl> - <dt>Initialize the installation (初始化安装)</dt> - <dd>Call <a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall"> initInstall</a> with the name of the installation and the necessary registry and version information.</dd> - <dd>调用<a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall(函数)</a>, 和安装的名称, 必须的注册以及版本信息.</dd> - <dt>Add the files to the installation (添加文件到安装)</dt> - <dd>Add files to the installation by calling <a href="cn/XPInstall_API_Reference/Install_Object/Methods/getFolder"> getFolder</a> to get file objects and passing those object refs to <a href="cn/XPInstall_API_Reference/Install_Object/Methods/addFile"> addFile</a> as many times as necessary.</dd> - <dd>添加文件到安装, 通过调用<a href="cn/XPInstall_API_Reference/Install_Object/Methods/getFolder"> getFolder(函数)</a>取得文件对象并传递那些对象引用到<a href="cn/XPInstall_API_Reference/Install_Object/Methods/addFile"> addFile(函数)</a>, 多数时候这样做还是有必要的.</dd> - <dt>Perform installation (执行安装)</dt> - <dd>Check that the files have been added successfully (e.g., by checking the error <a href="cn/XPInstall_API_Reference/Return_Codes"> Return Codes</a> from many of the main installation methods, and go ahead with the install if everything is in order:</dd> - <dd>检查那些文件是否被添加成功(比如通过检查<a href="cn/XPInstall_API_Reference/Return_Codes"> Return Codes</a>从多数主要安装函数所返回的错误代码), 并且如果所有函数的执行都是正确的, 那么就可以进行后继安装步骤:</dd> -</dl> - -<pre>performOrCancel(); -function performOrCancel() -{ - if (0 == getLastError()) - performInstall(); - else - cancelInstall(); -} -</pre> - -<p>For complete script examples, see <a href="cn/XPInstall_API_Reference/Examples"> Script Examples</a>.<br> - 完事的脚本实例, 参见<a href="cn/XPInstall_API_Reference/Examples"> Script Examples</a>.</p> diff --git a/files/zh-cn/archive/mozilla/xpinstall/reference/install_object/properties/index.html b/files/zh-cn/archive/mozilla/xpinstall/reference/install_object/properties/index.html deleted file mode 100644 index 76804ce8cd..0000000000 --- a/files/zh-cn/archive/mozilla/xpinstall/reference/install_object/properties/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: Properties -slug: Archive/Mozilla/XPInstall/Reference/Install_Object/Properties -translation_of: Archive/Mozilla/XPInstall/Reference/Install_Object/Properties ---- -<p> </p> -<h3 id="Properties" name="Properties">Properties</h3> -<dl> - <dt> - <code>archive</code></dt> - <dd> - Full local path of the archive after it is downloaded to the platform specific temp folder. (e.g. <code>C:\TEMP\argstest.xpi</code>)</dd> - <dt> - <code>arguments</code></dt> - <dd> - args can be passed in through the triggering APIs by attaching a ? and then the rg string to the xpi URL: (e.g. <code>startSoftwareUpdate(<span class="nowiki">"http://webserver/argstest.xpi?ARGUMENT_STRING"</span>)</code> will result in the value of <code>Install.arguments</code> being <code>ARGUMENT_STRING</code> #). Note that spaces in the arg string are legal. Everything after the question mark is treated as one string which becomes the <code>Install.arguments</code> property.</dd> - <dt> - <code>buildID</code></dt> - <dd> - The application build ID in the form 20041231. Note that due to branching (different versions of Gecko with different feature sets might be built on the same day), using this property to "detect" the application version may produce false results. Additionally, the build ID can be 0 for custom builds.</dd> - <dt> - <code>jarfile</code></dt> - <dd> - Alias for <code>archive</code></dd> - <dt> - <code>platform</code></dt> - <dd> - Contains information about the platform XPInstall was compiled for/runs on. For example, the value could begin with "Windows", "Macintosh" or "X11" (for Unix/Linux). For more details, see the corresponding code living in the <a class="external" href="http://lxr.mozilla.org/mozilla/ident?i=GetInstallPlatform">GetInstallPlatform method of class nsInstall</a>.</dd> - <dt> - <code>url</code></dt> - <dd> - The fully qualified URL of the xpi (file URL, http URL, ftp URL, etc.) (e.g. <code><span class="nowiki">http://dolfin/sgehani/zzz/ip.xpi</span></code>). Note, even if triggered using relative URLs this will show the full URL (after qualification).</dd> -</dl> diff --git a/files/zh-cn/archive/mozilla/xpinstall/scripting_by_example/index.html b/files/zh-cn/archive/mozilla/xpinstall/scripting_by_example/index.html deleted file mode 100644 index fb43c1237c..0000000000 --- a/files/zh-cn/archive/mozilla/xpinstall/scripting_by_example/index.html +++ /dev/null @@ -1,246 +0,0 @@ ---- -title: Learn XPI Installer Scripting by Example -slug: Archive/Mozilla/XPInstall/Scripting_by_example -tags: - - XPInstall - - XPInstall_API_reference -translation_of: Archive/Mozilla/XPInstall/Scripting_by_example ---- -<p></p><div class="warning"><p>Parts of this page show the use of the <a href="https://developer.mozilla.org/zh-CN/docs/XPInstall_API_Reference">XPInstall API</a>. The majority of this API is now deprecated and as of Gecko 1.9 no longer available. <a href="https://developer.mozilla.org/zh-CN/docs/Extensions">Extension</a>, <a href="https://developer.mozilla.org/zh-CN/docs/Themes">Theme</a>, and <a href="https://developer.mozilla.org/zh-CN/docs/Plugins">plug-in</a> developers must switch away from <code>install.js</code> based packages to the new <a href="https://developer.mozilla.org/zh-CN/docs/Bundles">packaging scheme</a> with an <code><a href="https://developer.mozilla.org/zh-CN/docs/Install_Manifests">install.rdf</a></code> manifest. In particular plugin developers should see <a class="new" href="https://developer.mozilla.org/zh-CN/docs/Shipping_a_plugin_as_a_Toolkit_bundle" rel="nofollow">how to package a plugin as an extension</a>.</p></div><p></p> - -<p>This article uses the installer script from browser.xpi install package as the basis for discussing XPI installations in general. This <code><a href="cn/Learn_XPI_Installer_Scripting_by_Example/Installer_Script">installer script</a></code> is relatively short, but it exercises most of the important features of the XPInstall API, and it can easily be used as a template for other more general software installations. In this article, we use the unix install file, but the installers for all the platforms are quite similar, and you can easily take what you learn here and apply it to installations on any platform that mozilla supports.</p> - -<h2 id="About_browser.xpi" name="About_browser.xpi">About <code>browser.xpi</code></h2> - -<p><code>browser.xpi</code> is the XPI archive in which the main components of the Mozilla browser are archived for installation. Mozilla cross-platform installations use the XPI format as a way to organize, compress, and automate software installations and software updates. A XPI is a PKZIP-compressed archive (like ZIP and JAR files) with a special script at the highest level that manages the installation. That <code><a href="cn/Learn_XPI_Installer_Scripting_by_Example/Installer_Script">installer script</a></code> , usually named <code>install.js</code>, is the subject of this article.</p> - -<p>First, a quick scan of the contents of the XPI file (which you can open using with any unzip utility) reveals the following high-level directory structure:</p> - -<pre>install.js -bin\ - chrome\ - components - defaults\ - icons\ - plugins\ - res\ -</pre> - -<p>Note that this high-level structure parallels the directory structure of the installed browser very closely:</p> - -<p><img alt="mozilla directory on linux"></p> - -<p>As you will see in the installation script, the contents of the archive are installed onto the file system in much the same way that they are stored in the archive itself, though it's possible to rearrange things arbitrarily upon installation--to create new directories, to install files in system folders and other areas.</p> - -<h2 id="Overview_of_the_Install_Script" name="Overview_of_the_Install_Script">Overview of the Install Script</h2> - -<p>XPI install scripts are written in JavaScript using XPInstall Engine syntax defined in the <a href="cn/XPInstall_API_Reference">XPInstall API Reference</a>.</p> - -<p>Most installation scripts, including the one discussed here, take the following basic form (in pseudo-code and with links to the sections in which these installation steps are documented):</p> - -<pre>initInstall(); -if (verify_space()) { - err = add_dirs_and_files; - register_files; - - if (err==SUCCESS) { performInstall() }; - else { cancelInstall() }; -} -</pre> - -<p>As you can see in the <a href="cn/Learn_XPI_Installer_Scripting_by_Example/Installer_Script">code listing</a>, the verification process at the top is on lines 1 to 18; the file addition process, here part of the main installation block, is on lines 24 to 41; the registration part of the main installation block is on lines 42-58; and the execution at the end of the main block is on lines 59 to 71. If you choose not to register the installed software or do the verifications at the front end of the installation, then at a minimum, the install scripts must<em>initialize, add the files to be installed, and execute.</em></p> - -<p>Note also that when you call methods on the <code>Install</code>--as you do so often in installation scripts (<code>getFolder</code>, <code>initInstall</code>, <code>addFile</code>, and <code>performInstall</code> are all examples of common <code>Install</code> object methods)--the <code>Install</code> object is implicit; like the <code>window</code> object in regular web page scripts, the Install object does not need to be prefixed to the method.</p> - -<h3 id="Initializing_the_Installation" name="Initializing_the_Installation">Initializing the Installation</h3> - -<p>All installations must begin with <code>initInstall()</code>. The <code>initInstall()</code> method on the Install object creates a new installation for the specified software and version. In the browser.xpi installation, this function appears at line 20: <code> var err = initInstall("Netscape Seamonkey", "Browser", "6.0.0.2000110807"); </code></p> - -<p>If you call a method on the <code>Install</code> object before <code>initInstall()</code>, you will get an error.</p> - -<p>The <code>initInstall</code> method takes the following parameters: the display name of the package, the name of the package as it appears in the client registry, and the version, which can be expressed as a number or as an InstallVersion object. In the example above, "Netscape Seamonkey" is the display name, "Browser" is the registry name, and the version is "6.0.0.2000110807." See <code><a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a></code> in the <a href="cn/XPInstall_API_Reference">XPInstall API Reference</a> for more information on the initialization process.</p> - -<h3 id="Verifying_the_Target" name="Verifying_the_Target">Verifying the Target</h3> - -<p>The first thing the installation script does when it's executed is to check that there is adequate disk space for the software to be installed, where the <code>verifyDiskSpace</code> function is called as a condition of the main installation block that starts at line 24).</p> - -<pre> // this function verifies disk space in kilobytes - function verifyDiskSpace(dirPath, spaceRequired) - { - var spaceAvailable; - // Get the available disk space on the given path - spaceAvailable = fileGetDiskSpaceAvailable(dirPath); - - // Convert the available disk space into kilobytes - spaceAvailable = parseInt(spaceAvailable / 1024); - // do the verification - if(spaceAvailable < spaceRequired) - { - logComment("Insufficient disk space: " + dirPath); - logComment(" required : " + spaceRequired + " K"); - logComment(" available: " + spaceAvailable + " K"); - return(false); - } - return(true); - } -</pre> - -<p>In the <code>verifyDiskSpace</code> block, <code>fileGetDiskSpaceAvailable</code> is called with <code>dirPath</code> as its expected input. This input is defined in line 22, where <code>getFolder()</code> is used to assign a value to the communicatorFolder variable representing the "Program" folder on the local system:</p> - -<pre>var communicatorFolder = getFolder("Program"); -spaceAvailable = fileGetDiskSpaceAvailable(dirPath); -</pre> - -<p><code>spaceRequired</code>, the other expected input to the <code>verifyDiskSpace</code> function, is given as 17311 kilobytes on line 19. Inside the function, the two sizes are compared and if the available space is larger than the required space, the installation proceeds.</p> - -<h3 id="Adding_Files_and_Directories_.28Full_of_Files.29_to_the_Install" name="Adding_Files_and_Directories_.28Full_of_Files.29_to_the_Install">Adding Files and Directories (Full of Files) to the Install</h3> - -<p>Once you have verified that the target can accomodate the software to be installed and initialized the actual installation, you must add files and directories to the installation in order to have them installed. In the <code>browser.xpi</code> install script, the files are added in lines 26-41:</p> - -<pre> err = addDirectory("Program", - "6.0.0.2000110807", - "bin", // jar source folder - communicatorFolder, // target folder - "", // target subdir - true ); // force flag - - logComment("addDirectory() returned: " + err); - - // create the plugins folder next to mozilla - var pluginsFolder = getFolder("Plugins"); - if (!fileExists(pluginsFolder)) - { - var ignoreErr = dirCreate(pluginsFolder); - logComment("dirCreate() returned: " + ignoreErr); - } - else - logComment("Plugins folder already exists"); -</pre> - -<p>In this case, the files are contained within a single directory, so calling the <code>Install</code> object's <code>addDirectory</code> method is sufficient to queue all the files in the archive for installation. The <code>addDirectory</code>, like <code>addFile</code>, handles both the source file location and the target location. In the example above, all of the contents of the "bin" directory in the archive are queued for installation, and the target of that installation (when the installation is actually begun with a call to <code>performInstall</code> at the end), is the <code>communicatorFolder</code> directory defined at line 22 as "Program."</p> - -<p>"Program" is one of a short list of keywords that can be used in place of full path names in methods such as <code>addFile</code>. "Program" represents the directory where software itself is installed (e.g., <code>C:\Program Files\</code> on win32 systems), as opposed to supporting directories like "Components", "Chrome", or "Temporary" (see <code><a href="cn/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a></code> in the <a href="cn/XPInstall_API_Reference">XPInstall API Reference</a> for a list of keywords).</p> - -<h3 id="Registering_the_Software" name="Registering_the_Software">Registering the Software</h3> - -<p>Registering software is sometimes a requirement of both the operating system and of the Netscape 6 platform. When you install new chrome, for example, like the <code>browser.xpi</code> install does, you need to alert the chrome registry to these changes, so that skins, user preferences, packaging lists, and localization bundles will all track the new software.</p> - -<p>For registering software with the win32 operating system, the XPInstall API provides two special Install objects, <code>WinProfile</code> and <code>WinReg</code>. These two objects provide programmatic access to the Windows user profile and the Windows registry, respectively. The <code>browser.xpi</code> install script does not demonstrate the use of these objects, but see the XPInstall API Reference for more information about registering software with the win32 operating systems and other operating systems.</p> - -<p>To register new Netscape 6-based software (e.g., plug-ins, new components, new themes, new packages) with the chrome registry, you must use the registerChrome function of the Install object. If successful, this function returns a "0" and makes entries into the<em>installed-chrome.txt</em> file in the <code>chrome</code> subdirectory, which is then used to regenerate the various RDF files that make up the chrome registry.</p> - -<pre> var cf = getFolder("Chrome"); - registerChrome(CONTENT | DELAYED_CHROME, getFolder(cf,"toolkit.xpi"),"content/global/"); - registerChrome(CONTENT | DELAYED_CHROME, getFolder(cf,"browser.xpi"),"content/communicator/"); - registerChrome(CONTENT | DELAYED_CHROME, getFolder(cf,"browser.xpi"),"content/editor/"); - registerChrome(CONTENT | DELAYED_CHROME, getFolder(cf,"browser.xpi"),"content/navigator/"); - registerChrome(SKIN | DELAYED_CHROME, getFolder(cf,"modern.jar"),"skin/modern/communicator/"); - registerChrome(SKIN | DELAYED_CHROME, getFolder(cf,"modern.jar"),"skin/modern/editor/"); - ... -</pre> - -<p>In lines 42-58, <code>registerChrome</code> is called as many times as there are different directories that contain content that needs to be registered with the chrome registry. Note that in the first few lines of this process, new content from the XPI is being registered, and in the remainder, it is new skin information. In this most common form of the <code>registerChrome</code> function (it can also be used to support the now-deprecated<em>manifest.rdf</em> style of installation archive), the three parameters represent, in order, the chrome <code>SWITCH</code> used to indicate what kind of software is being registered, the target destination of the software (e.g., the "Chrome" folder in the example above), and the path within the XPI (or JAR theme archive) where the contents.rdf file is located.</p> - -<p>See <code><a href="cn/XPInstall_API_Reference/Install_Object/Methods/registerChrome">registerChrome</a></code> in the XPInstall API Reference for more information about registering new packages with the chrome registry.</p> - -<h3 id="Executing_the_Installation" name="Executing_the_Installation">Executing the Installation</h3> - -<p>Once you have added all the files to the installation, the final step is to actually execute the installation. Note that until this point, the install calls you have been making on the Install object are preliminary only. Recall that an install process takes the following general form:</p> - -<pre>initInstall(); -if (verify_space()) { - err = add_dirs_and_files; - register_files; - - if (err==SUCCESS) { performInstall() }; - else { cancelInstall() }; -} -</pre> - -<p>In this arrangement, the actual execution of the installation is checked against the errors returned from the addition of files to the installation, which may itself have been conditioned on some verification of version and necessary disk space.</p> - -<p>The actual install code used to execute the installation appears in the<em>install.js</em> file as follows:</p> - -<pre>if (err==SUCCESS) - { - err = performInstall(); - logComment("performInstall() returned: " + err); - } - - else - { - cancelInstall(err); - logComment("cancelInstall() due to error: " + err); - } -} -else - cancelInstall(INSUFFICIENT_DISK_SPACE); -</pre> - -<p><code>performInstall</code> is the function used to execute the install once it has been initialized and loaded, and it is the last step to installing the software. Note that in the example above, the installation is cancelled if the error code from the file addition process returns success (0), and also cancelled outside the main block if the earlier verification process is not successful.</p> - -<p>Note also the comments that indicate the success of various steps in the process--including the performInstall and cancelInstall steps--are written to the install log using the <code>logComment</code>, described in the following section.</p> - -<h2 id="Installation_Logging" name="Installation_Logging">Installation Logging</h2> - -<p>Logging is an important feature of the XPInstall API that can help you streamline and debug your installations. In the example in the <a href="#Executing_the_Installation">Executing the Installation</a> section and in many places in the installation script, the <code>logComment</code> API is used to write data to a log file that can then be reviewed when things don't go as planned.</p> - -<p>The install log is created in the product directory by default (where the browser executable is). If the installation doesn't have proper permission, the install log is written to the user's profile directory. Respectively, these directories correspond to the "Program" and "Current User" keywords for the getFolder method.</p> - -<h2 id="Extending_the_Example" name="Extending_the_Example">Extending the Example</h2> - -<p>What does all this mean to you? How can this information be adapted for your own installations? In this final section, we describe the application of the XPInstall technology described here in the creation and deployment of a very simple installation script and installation archive (XPI).</p> - -<p>Say you have a simple executable and a README file that goes with it, and you want to make it available for installation from a XPI. After putting these two files in a XPI (which, as described above, is simply a ZIP file with an install.js script at the top and a suffix of '.xpi'), the next step is to add an installation script to the XPI.</p> - -<p>Minimally, the installation script must:</p> - -<ul> - <li>Call <code>initInstall</code> with the name and version of the executable (the version is not optional, though you may or may not use the version in subsequent installations or updates)</li> - <li>Find somewhere to put the installed files. In the example below, <code>getFolder</code> is used with the "Program" keyword to specify the browser's program directory as the target for installation. Since I am using NS6 right now on a Windows machine, that target directory is "C:\Program Files\Netscape\Netscape 6\".</li> - <li>Add files to the initialized installation using <code>addFile</code>.</li> - <li>Call performInstall to execute the installation.</li> -</ul> - -<p>Here is an example of small but complete installation script.</p> - -<pre>var xpiSrc = "cd_ripper.exe"; -var xpiDoc = "README_cdrip"; - -initInstall("My CD Ripper", "cdrip", "1.0.1.7"); -f = getFolder("Program"); -setPackageFolder(f); -addFile(xpiSrc); -addFile(xpiDoc); - -if (0 == getLastError()) - performInstall(); -else - cancelInstall(); -</pre> - -<p>The example above shows this minimal installation. This install script does not include any version or disk space checking, very little error checking, only a single executable, no registration, and no commenting. It does, however, take the executable and the README file and install them on the user's system. Note also that for the installation script in a XPI to be automatically triggered from a web page, you must use a "trigger script." The following InstallTrigger function, called from an event handler on a regular web page, will point to the remotely-hosted XPI (called here 'cdrip.xpi') and trigger its installation:</p> - -<pre>function putIt() -{ - xpi={'CD_Ripper':'cdrip.xpi'}; - InstallTrigger.install(xpi); -} -... - -<a href="#" onclick="putIt();">install the CD Ripper Now!</a> -</pre> - -<p>See the <a href="cn/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> object in the XPInstall API Reference for more information on triggering installations.</p> - -<div class="originaldocinfo"> -<h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2> - -<ul> - <li>Author(s): <a class="link-mailto" href="mailto:mailto:oeschger@netscape.com">Ian Oeschger</a></li> - <li>Last Updated Date: 01/26/2006</li> - <li>Copyright Information: Copyright (C) <a class="link-mailto" href="mailto:mailto:oeschger@netscape.com">Ian Oeschger</a></li> -</ul> -</div> - -<p></p> diff --git a/files/zh-cn/archive/mozilla/xpinstall/using_xpinstall_to_install_plugins/index.html b/files/zh-cn/archive/mozilla/xpinstall/using_xpinstall_to_install_plugins/index.html deleted file mode 100644 index 7df82abc04..0000000000 --- a/files/zh-cn/archive/mozilla/xpinstall/using_xpinstall_to_install_plugins/index.html +++ /dev/null @@ -1,227 +0,0 @@ ---- -title: Using XPInstall to Install Plugins -slug: Archive/Mozilla/XPInstall/Using_XPInstall_to_Install_Plugins -tags: - - Plugins - - XPInstall -translation_of: Archive/Mozilla/XPInstall/Installing_plugins ---- -<p><a href="cn/XPInstall">XPInstall</a> is a JavaScript-based installer technology that works across all the platforms that <a class="external" href="http://mozilla.org">Mozilla</a> and Netscape browsers based on Mozilla (such as Netscape 7) are deployed. It can be a way to ensure a smooth user-experience when obtaining plugins, without obliging the user to exit the browsing environment to launch a binary installer (the classic setup.exe experience on Windows) or obliging the user to restart their browser. For plugin vendors who have already written a native code (e.g. EXE) installer, XPInstall can wrap this native installer and run it so that the user never has to leave the browsing environment and click on the EXE to run it. This article presents a guideline for improving the plugin installation experience for Netscape Gecko browsers using <a href="cn/XPInstall_API_Reference">XPInstall</a>. XPInstall是基于js的安装plugin插件的跨平台技术。其包*.xpi,同扩展／主题｜皮肤(*.jar)是一样的(zip包)。</p> -<h3 id="A_Definition_of_Terms" name="A_Definition_of_Terms">A Definition of Terms</h3> -<p>XPInstall is an installer technology, and the name itself stands for "Cross Platform Install" (hence "XP" -- an abbreviation for "Cross Platform"). An XPInstall package is usually called an XPI package for short (and often pronounced "zippy"). This article is about how you can use XPInstall to install plugins to the browsers that support XPInstall.</p> -<p>An XPI Package is in fact a ZIP file with the XPI file extension (e.g. myPluginInstaller.xpi), and can be created on Windows by utilities such as WinZip. XPI Packages, like ZIP files, "contain" other files, typically: 典型的插件包结构：</p> -<ul> - <li>The software component to be installed. In our case, this is the plugin software.</li> -</ul> -<p>1。插件本身(动态库：如office.so or office.dll等，另外常见的为各种多媒体插件)。</p> -<ul> - <li>A JavaScript file called install.js, which is the install logic that drives the installation. This includes instructions on where to install the software, and what messages to feed to the user.</li> -</ul> -<p>2。install.js：如何安装该插件的javascript脚本。 You can create an XPInstall file by first zipping all the items you want installed with WinZip (create a ZIP archive) and then renaming it with the XPI file extension instead of the ZIP file extension.</p> -<p>Unlike native code installers (for example, files called setup.exe), the programming language for install operations in XPI is JavaScript. Since the file format that contains the software and the install.js JavaScript file is a cross-platform file (Zip) and since JavaScript is understood by Mozilla browsers on all platforms, often one single XPI package can be deployed on all platforms. This is, in fact, <a class="external" href="http://www.mozilla.org/docs/xul/xulnotes/xulnote_packages.html">how skins and themes are installed to Mozilla browsers</a>, changing their look and feel. This article focuses on how to install plugins.</p> -<h3 id="Which_Browsers_Support_XPInstall.3F" name="Which_Browsers_Support_XPInstall.3F">Which Browsers Support XPInstall?</h3> -<p>哪些浏览器支持XPInstall安装方式？ Currently, all <a class="external" href="http://mozilla.org/releases/stable.html">Mozilla browsers released by mozilla.org</a> support XPInstall, and a family of browsers based on Mozilla code support XPInstall. In particular, this includes:</p> -<ul> - <li>Recent Netscape browsers such as Netscape 6.2.x and Netscape 7.0, which are both based on Netscape Gecko, which is at the core of the Mozilla browser</li> - <li>Recent <b>beta-only</b> versions of the AOL software based on Netscape Gecko, the layout engine of the Mozilla project.</li> -</ul> -<p><b>Caveats:</b></p> -<ul> - <li>AOL Time Warner's <a class="external" href="http://www.compuserve.com/">CompuServe browser</a>, also based on Netscape Gecko, does not support XPInstall.</li> - <li>Netscape Communicator 4.x does not support XPInstall.</li> -</ul> -<h3 id="What_Does_a_Plugin_Consist_Of.3F" name="What_Does_a_Plugin_Consist_Of.3F">What Does a Plugin Consist Of?</h3> -<p>一个插件通常包含什么内容？ Plugins can consist of the following types of files, all of which can be installed via an XPI Package:</p> -<ul> - <li><b>动态共享链接库</b> （例如，在Windows中，有DLL文件；在Unix中有*.so文件）。 These files are native code files made with the <a href="cn/Gecko_Plugin_API_Reference">Netscape Plugin API</a>.</li> -</ul> -<p>1。遵从Gecko Plugin API或Netscape Plugin API接口的动态库。[cada:也可能only ln连接文件]</p> -<ul> - <li>If the plugin is scriptable, then it will also consist of an <a href="cn/Gecko_Plugin_API_Reference/Plug-in_Development_Overview">XPT file</a>. Examples would be Flash 6r47 on Windows, which consists of a DLL (called npswf32.dll) and an XPT file for scriptability (called flashplayer.xpt). If you are developing a plugin and wish to <a href="cn/Gecko_Plugin_API_Reference/Plug-in_Development_Overview">make it scriptable</a>, read the relevant portions of the <a href="cn/Gecko_Plugin_API_Reference">Plugin API</a>.</li> -</ul> -<p>2。可选文件：xpt文件(该文件用来暴露该插件对外的接口描述--通常用javascript脚本可以访问)--新的插件API无须xpt文件也可以支持同样功能了！</p> -<ul> - <li><b>Additional software.</b> Many plugins are part of additional software for media types. For example, RealPlayer on Windows consists of a plugin DLL, but also the RealPlayer application (EXE) which the plugin DLL is a subset of. In this case, the plugin is the part of the software package that is browser-specific, as a mechanism to give the application additional "hooks" into the browser.</li> -</ul> -<p>3。这种情形也特别多：即某个插件还是某个应用程序的一部分，即该插件必须依赖该应用程序才能在browser中运行，即此时插件依赖的其他文件就是该应用程序的其他相关模块。例如openoffice插件也是这样的。</p> -<p>XPInstall can be used to install any combination of these files on an end-user's machine. For those familiar with Netscape Communicator 4.x's SmartUpdate technology, this will be a familiar idea.</p> -<h3 id="A_Brief_History_of_Netscape_Installer_Technologies" name="A_Brief_History_of_Netscape_Installer_Technologies">A Brief History of Netscape Installer Technologies</h3> -<p>Netscape 安装技术的简要历史： This section is relevant if you are familiar with Netscape Communicator 4.x's SmartUpdate installer technology.［智能update安装技术］ The use of JavaScript as the install logic is not unprecedented in Netscape browsers. Netscape Communicator 4.x uses the notion of SmartUpdate to install software, particularly plugins and Java applets to be run locally. SmartUpdate is - <i> - <b>not supported</b></i> - by Mozilla browsers (and Netscape/AOL browsers based on Mozilla such as Netscape 7), but because of the similarity between the two installer technologies, it is easy to convert your SmartUpdate files to XPInstall files. SmartUpdate involves a digitally signed JAR file which contained the software components to be installed as well as a JavaScript install.js file (called the install script安装脚本) as the installer logic. Downloads and installs would be initiated with a security dialog box naming the certificate authority and the signer(签名安装包的验证). Often, the SmartUpdate download was triggered via the pluginurl attribute of the embed tag:</p> -<pre><embed type="application/x-randomtype" src="myfile.typ" width="50" height="50" -pluginurl="http://mytypecompany.xyz/jarpacks/mytypeplugin.jar"></embed> -</pre> -<p>在上面的例子中， the pluginurl attribute points to the signed JAR file, which Netscape Communicator 4.x would then download (subject to the security dialog boxes) <b>if</b> the plugin was not located on the user's machine. SmartUpdate differs from XPInstall in that:以上是Netscape Communicator的插件包(签名的jar包)安装技术概要，他与XPInstall的区别如下：</p> -<ul> - <li>XPInstall uses ZIP files named XPI files (*.xpi) and SmartUpdate uses JAR files (*.jar)一个是zip包一个是jar包--cada:jar包仅仅比zip包多一个自动生成的manifest文件，所以jar包通常比zip包大一点点（对同样内容而言）</li> - <li>Unlike a SmartUpdate JAR file, XPI Packages do not have to be digitally signed with a code-signing certificate.XPI包可以不签名</li> - <li>XPI Packages make use of <a href="cn/XPInstall_API_Reference">different APIs</a> from within install.js(该js中大量使用XPInstall API去实现安装逻辑), although the concept is the same.</li> -</ul> -<p>XPInstall for Mozilla-based browsers is analogous to SmartUpdate in Netscape Communicator 4.x browsers. Porting SmartUpdate deployments to XPInstall is trivial after gaining some familiarity with the <a href="cn/XPInstall_API_Reference">new XPInstall API</a>. 二者移植比较琐碎!详细请查看XPInstall API。</p> -<h3 id="The_Recommended_Installation_Process" name="The_Recommended_Installation_Process">The Recommended Installation Process</h3> -<p>XPInstall provides a cohesive API to accomplish rapid installation and setup of plugin software for end-users. The benefit of using XPInstall is to provide a streamlined installation mechanism. This section discusses what an ideal XPInstall Package will do, as well as points out some of the JavaScript API calls that you will make to accomplish these install tasks. An ideal XPI Package will:</p> -<ol> - <li>Install to the current browser that is initiating the XPInstall installation via HTML or triggering an XPInstall installation via a Trigger Script. We will use the term current browser to refer to the browser that initiates the XPInstall download by visiting a site which requires a plugin that the current browser can not find locally. This step will involve the use of the <a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> API call to start everything off, and also the <a href="cn/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a> API call, which helps to locate the current browser's plugin directory.</li> - <li>Install the plugin software to another location on the user's hard disk, so that other Mozilla-based browsers that the user may install later can find the plugin (the browser specific components) and pick it up. The goal is to ensure that future Netscape Gecko browsers that the user may install later can benefit from the installation that the user initiated with the current browser. An example might be that the current browser is Netscape 7, but later, the user downloads a beta of the AOL software using Netscape Gecko. Rather than re-initiate the download of the plugin with the yet another browser, the second Netscape Gecko browser can detect that an installation has already occurred. This discovery mechanism hinges on making the secondary install location available from looking at a common repository of metadata. On Windows, this is the Windows System Registry. Once again, this step involves calls to <a href="cn/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a> to locate a "well known" directory in which to install to as a secondary install location.</li> - <li>On Windows: write Windows Registry keys that Netscape Gecko browsers (that get installed after the current browser) can parse to discover where the plugin is installed on the machine. In particular, the Windows Registry keys should point to the secondary install location so that future Netscape Gecko browsers can find and add to their list of available plugin locations. The exact format of these registry keys and how they should be written is covered in the section on the first install problem. To actually create and write keys to the Windows System Registry, you'll use the functions of the <a href="cn/XPInstall_API_Reference/WinReg_Object">WinReg object</a>.</li> - <li>Ensure that the plugin that has just been installed is refreshed by correctly invoking the <a href="cn/XPInstall_API_Reference/Install_Object/Methods/refreshPlugins">refreshPlugins API</a>. By refreshing your plugin, you're ensuring that the plugin is available for use immediately, without obliging the user to restart their browser. This is one of the chief advantages of a smooth XPInstall experience.</li> -</ol> -<h3 id="The_First_Install_Problem" name="The_First_Install_Problem">The First Install Problem</h3> -<p>The First Install Problem refers to the conditions arising when a plugin arrives on a user's machine before a browser arrives. The recommended install process addresses this issue, which is to install to a secondary location after installing to the current browser. In a nutshell, the first install problem can be summed up by the question: how can a browser which is installed on a user's machine after a given plugin has already been installed by the user benefit from the existing installation rather than download the same plugin again? In order to address this issue, plugin vendors are encouraged to:</p> -<ul> - <li>Install the plugin software components for the browser (e.g. DLLs on Windows, and XPT files if applicable) to a secondary location, in addition to that of the plugins directory of the current browser.</li> - <li>Write keys in the Windows registry which store information about this secondary location, in particular the Plugin Path and the XPT Path (if applicable) so that Netscape Gecko browsers can pick up the plugin from the secondary location if they are installed after the plugin is (and thus, if a particular Netscape Gecko browser follows or replaces the current browser). The keys to write and the information they should contain is <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">discussed in detail in the specification posted on mozilla.org</a>. There is also a <a class="external" href="http://www.mozilla.org/projects/plugins/example-scobe.txt">sample registry entry</a> created by an imaginary company that is illustrative of what is discussed in the <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">specification for these registry keys</a>.</li> - <li>On Windows, the Windows Registry keys mentioned above follow a nomenclature using the concept of a <a class="external" href="http://www.mozilla.org/projects/plugins/plugin-identifier.html">Plugin Identifier</a> as the name of the key under the MozillaPlugins subkey. The <a class="external" href="http://www.mozilla.org/projects/plugins/plugin-identifier.html">Plugin Identifier (or PLID)</a> is a useful concept that is also applicable when initializing the installation via the <a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall API</a>.</li> -</ul> -<h3 id="A_Breakdown_of_the_APIs_Used" name="A_Breakdown_of_the_APIs_Used">A Breakdown of the APIs Used</h3> -<p>The recommended plugin installation process makes use of the XPInstall APIs to install to the current browser's Plugins directory, install to a secondary location, and to <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">write to the Windows System Registry to disclose this secondary location</a>. This section traces some of the XPInstall APIs that can do this. A complete template of an XPI Package is also presented in this section. Not all the work needs to be done in JavaScript -- if you have a native installer (EXE) that <a class="external" href="http://mozilla.org/projects/plugins/install-scheme.html">recognizes Netscape Gecko browsers</a>, and you merely wish to wrap the EXE installer in an XPI Package for a streamlined delivery to the client, you can easily do so. This section refers extensively to the <a href="cn/XPInstall_API_Reference">XPInstall API Documentation</a>.</p> -<h4 id="Initializing_Installation_with_Plugin_Identifier" name="Initializing_Installation_with_Plugin_Identifier">Initializing Installation with Plugin Identifier</h4> -<p>All XPInstall installations are initiated with the <a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall method of the Install Object</a>. Since the Install Object is available to the install script, it need not be mentioned in the install script (e.g. there is no need to invoke Install.initInstall; simply invoking <a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> will suffice). The initInstall method is polymorphic, but here is a recommended invocation mechanism:</p> -<pre>initInstall("My Plugin Software", "@myplugin.com/MyPlugin,version=2.5", "2.5.0.0"); -</pre> -<p>在上面的一段代码中， the <a href="cn/XPInstall_API_Reference/Install_Object/Methods/initInstall">initInstall</a> method is invoked with three parameters:</p> -<ul> - <li>A String for the name of the application</li> - <li>A String signifying the <a class="external" href="http://mozilla.org/projects/plugins/plugin-identifier.html">Plugin Identifier</a> associated with the plugin. This value is actually entered in the Client Version Registry upon installation, a Mozilla-browser file that stores metadata about the software that has just been installed. This value can be queried via web-page delivered JavaScript, and is useful for initiating XPInstall downloads via <a href="cn/XPInstall_API_Reference/InstallTrigger_Object">Trigger Scripts</a>. You can determine the version of the software that has been installed, and determine whether to update it, all via JavaScript in a web-page.</li> - <li>A String representing the four digit version of the software.</li> -</ul> -<p><b>Caveat:</b> Certain versions of Mozilla-based browsers (such as Netscape 6.x) treat the use of the equals character ("=") as an illegal token and thus do not allow invocation of initInstall with strings containing "=". A workaround to this would be to detect if initInstall has failed, and then invoke it again without the "=" string. Here is an example:</p> -<pre>var PLID = "MyPlugin.plug/version=6.5"; -err = initInstall(SOFTWARE_NAME, PLID, VERSION); - -if (err != 0) -{ - // install may have failed because of N6 and = - // replace PLID with a simple string - err = initInstall(SOFTWARE_NAME, "MyPluginString", VERSION); - if (err != 0) - cancelInstall(err); -} -</pre> -<p>Note that above, the PLID contains an "=" and in case the XPI package is running on browsers that treat "=" as an illegal token, the workaround is to handle the error and invoke initInstall again.</p> -<h3 id="Using_XPInstall_to_Run_an_EXE_.28Native_Code.29_Installer" name="Using_XPInstall_to_Run_an_EXE_.28Native_Code.29_Installer">Using XPInstall to Run an EXE (Native Code) Installer</h3> -<p>If you wish to run a native installer (EXE) to install plugin software, but wish to make the delivery of this native installer streamlined and within the browser's process, then you ought to consider wrapping it in an XPI Package. From JavaScript, you can call XPInstall's <a href="cn/XPInstall_API_Reference/Install_Object/Methods/execute">execute method of the Install Object</a> to execute the binary. You can also call the <a href="cn/XPInstall_API_Reference/File_Object/Methods/execute">execute method of the File object</a> if you wish to actually install the file you are executing, rather than have it deleted. You can pass command line parameters to the executable. An example of calling the execute method from the Install Object on an executable that has a temporary life span (and is not needed after one execution) is:</p> -<pre>// Initialize the installation .... - -// initInstall(..... ) has already been called - -// Using the Install Object's execute method to block on a native installer - -execute("setup.exe", "-s", true); - -// In the above sample, assume that running "setup -s" from the -// Command Prompt runs the setup executable, and that "-s" is some -// invocation parameter defined by the setup.exe file, perhaps to force -// the installer to run silently. We are passing "-s" to the setup file. -// By passing 'true' we are telling the Install Script to block -// on the execution of the installable, and do it synchronously - -// Must call performInstall to make it all happen... - -err = getLastError(); -if (!err) - performInstall(); -else - cancelInstall(err); -</pre> -<h4 id="Installing_Plugin_Files_To_the_Current_Browser" name="Installing_Plugin_Files_To_the_Current_Browser">Installing Plugin Files To the Current Browser</h4> -<p>Installing to the current browser is the task that is the most important for the XPI Package to succeed in. Here is a code snippet that accomplishes this:</p> -<pre>// Name of the files to be installed -var PLUGIN_FILE = "NPMyPlugin.dll"; -var COMPONENT_FILE = "NPMyPluginScriptablePeer.xpt"; - -// invoke initInstall to start the installation - -.... - -var pluginFolder = getFolder("Plugins"); - -// verify disk space is appropriate - -.... - -err = addFile("@myplugin.com/MyPlugin,version=2.5.0.0", - "2.5.0.0", PLUGIN_FILE, pluginsFolder, null); - if (err != 0) - { - //alert("Installation of MyPlugin plug-in failed. Error code "+err); - logComment("adding file "+PLUGIN_FILE+" failed. Errror conde: " + err); - return err; - } - -err = addFile(null, CULT_VERSION, COMPONENT_FILE, componentsFolder, null); - if (err != 0) - { - alert("Installation of MyPlugin component failed. Error code "+err); - logComment("adding file "+COMPONENT_FILE+" failed. Error conde: " + err); - return err; - } -</pre> -<h4 id="Installing_to_a_Secondary_Location" name="Installing_to_a_Secondary_Location">Installing to a Secondary Location</h4> -<p>For the purposes of solving the <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">First Install Problem</a>, it is necessary to install to a secondary location to ensure discoverability of the plugin by other Netscape Gecko browser in addition to the current browser. A good choice for this secondary location might be the Windows directory on Windows machines. <b>Caveat:</b> Because of possible administrator issues, handle errors carefully!</p> -<pre>// Get the Windows System directory e.g. C:\WINNT\system32\ directory - -var winDirectory = getFolder("Win System"); - -// Create the Folder C:\WINNT\system32\MyPlugin - -var dllWin32Folder = getFolder("file:///", winDirectory+"\\MyPlugin\\"); -//Install DLL to C:\Windows Folder - copyErr = addFile("", VERSION, PLUGIN_FILE, dllWin32Folder, null); - if (copyErr != 0) - { - logComment("First Install:"+copyErr); - return copyErr; - } - -// Install the XPT file to C:\WINNT\system32\MyPlugin folder - -var xptWin32Folder = getFolder("file:///", winDirectory+"\\MyPlugin\\"); - copyErr = addFile("", VERSION, COMPONENT_FILE, xptWin32Folder, null); - if (copyErr != 0) - { - logComment("First Install:"+copyErr); - return copyErr; - } -</pre> -<p>Once the secondary installation has taken place, the <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">Win32 Registry keys have to be updated</a> to indicate information about where the secondary install location is, so that browsers can discover it. This is accomplished with the <a href="cn/XPInstall_API_Reference/WinReg_Object">WinReg</a> object that is exposed to XPInstall. The pieces all come together in the template below.</p> -<h3 id="An_XPInstall_Template" name="An_XPInstall_Template">An XPInstall Template</h3> -<p>We have provided you with <a href="cn/Using_XPInstall_to_Install_Plugins/Install_script_template">a template for an install script</a> which you might want to open in another tab or window. This install script does all of the following:</p> -<ul> - <li>It installs both a DLL and an XPT file to the browser's plugins directory. The plugin itself is an imaginary one: MyPlugin. The variables that determine the plugin name, however, can be easily modified. This install.js file assumes that the plugin software that is to be installed consists of both a DLL and an XPT file, which is not always true. Many plugins may involve more than one DLL, or perhaps additional native code. It is, however, a safe assumption for most plugins, especially <a class="external" href="http://www.macromedia.com/go/getflashplayerbutton/">Macromedia's Flash Plugin</a> which consists of a single DLL (on Windows this is npswf32.dll) and a single XPT file for scriptability (called flashplayer.xpt).</li> - <li>It further installs to a secondary location on the user's desktop. In particular, like many OCX files (ActiveX controls) it installs to a special directory within C:\WINNT\System32\, called C:\WINNT\System32\MyPlugin. XPInstall is able to determine what directory this is by the <a href="cn/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder</a> API call. We have written our own JavaScript function to contain all the secondary installation code -- function createSecondaryInstall()</li> - <li>And finally, it writes the <a class="external" href="http://www.mozilla.org/projects/plugins/first-install-problem.html">required registry keys to Windows</a>. This is done via the created function, called function registerPLID().</li> -</ul> -<p>Certainly, this script is Windows-centric, but it is easy to port it to any other platform. Easier, perhaps, since the lengthy Win32 Registry manipulation need not occur on Linux or Mac OSX. The <a href="cn/XPInstall_API_Reference/Install_Object/Methods/getFolder">getFolder API</a> provides you with enough "syntactic sugar" to determine other locations on the user's computer on different platforms and OS's. A single install.js is often capable of running on many different platforms.</p> -<h3 id="Some_Installation_Concerns" name="Some_Installation_Concerns">Some Installation Concerns</h3> -<p>This section gathers together some of the chief concerns about deploying XPI packages, notably: how ought a plugin download via XPI be initiated? And what about uninstalling plugins?</p> -<h3 id="Triggering_an_XPInstall_Download_with_a_TriggerScript" name="Triggering_an_XPInstall_Download_with_a_TriggerScript">Triggering an XPInstall Download with a TriggerScript</h3> -<p>A <a href="cn/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts">Trigger Script</a> is web-page delivered piece of JavaScript that can automatically initiate an XPInstall download. This can be done conditionally, since <a href="cn/XPInstall_API_Reference/Examples/Trigger_Scripts_and_Install_Scripts">Trigger Scripts</a> can also detect what software has already been installed to the user's machine via XPInstall. This feature is useful for Web sites because:</p> -<ul> - <li>HTML pages and JavaScript already have a way of detecting what plugins are installed. Additionally, via the <a href="cn/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> object which is exposed in Web pages, they can find out what the last version of the XPI Package was.</li> - <li>The <a href="cn/XPInstall_API_Reference/InstallTrigger_Object">InstallTrigger</a> object can also start an XPI download automatically. This is useful because users can visit a Web site, and conditionally get served software (in a streamlined manner) that the Web site wants the user to have.</li> -</ul> -<p>Trigger Scripts are a recommended way of initiating an XPInstall download.</p> -<h3 id="Triggering_an_XPInstall_Download_from_HTML" name="Triggering_an_XPInstall_Download_from_HTML">Triggering an XPInstall Download from HTML</h3> -<p>In a manner analogous to how SmartUpdate downloads were initiated by the pluginurl attribute of the embed tag, XPInstall downloads can also be initiated by HTML tags invoking plugins, notably via the <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#adef-codebase-OBJECT">codebase</a> attribute of the <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-OBJECT">object</a> tag. This is analogous to how Internet Explorer downloads CAB files pointed to by the <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#adef-codebase-OBJECT">codebase</a> attribute of the <a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-OBJECT">object</a> tag. Here's an example of a hypothetical object tag used to invoke MyPlugin (an imaginary application):</p> -<pre> <object id="thePlugin" type="application/x-myplugin" width="100" - height="100" codebase="http://location/XPI/myplugin.xpi"> - -<param .... > -</pre> -<p>In the above case, the codebase attribute points directly to the XPI Package, and if the browser can not identify any plugin to handle the (imaginary) application/x-myplugin MIME type, it will download the XPI Package.</p> -<p><b>Note:</b> XPI Packages (files with the xpi extension) use the application/x-xpinstall MIME type. When serving XPI Packages from servers to clients, make sure that XPI Packages are served with this MIME type in the HTTP headers. Associate the application/x-xpinstall MIME type with XPI Packages.</p> -<h3 id="The_Uninstall_Problem" name="The_Uninstall_Problem">The Uninstall Problem</h3> -<p>In its current iteration, XPInstall does not have an affiliated uninstall technology. It can therefore only be used to install files or deliver native code installers to the client, and if uninstall is a legitimate concern, it might be wise to write a native code (EXE) uninstaller to remove the software. XPInstall can therefore be the "agent of delivery" to streamline the download of the EXE software, but ultimately, the logic of installation and uninstallation will be handled by EXE, which can then create files and registry entries and also clean up after itself upon removal.</p> -<div class="originaldocinfo"> - <h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3> - <ul> - <li>Author(s): Arun K. Ranganathan, Netscape Communications</li> - <li>Last Updated Date: 05 Aug 2002</li> - <li>Copyright Information: Copyright © 2001-2003 Netscape. All rights reserved.</li> - <li>Link: <a class="external" href="http://devedge-temp.mozilla.org/viewsource/2002/xpinstall-guidelines/index_en.html" rel="freelink">http://devedge-temp.mozilla.org/view.../index_en.html</a></li> - </ul> -</div> -<p> </p> diff --git a/files/zh-cn/archive/rss/article/index.html b/files/zh-cn/archive/rss/article/index.html deleted file mode 100644 index 58862fc363..0000000000 --- a/files/zh-cn/archive/rss/article/index.html +++ /dev/null @@ -1,6 +0,0 @@ ---- -title: Article -slug: Archive/RSS/Article -translation_of: Archive/RSS/Article ---- -<p>This page was auto-generated because a user created a sub-page to this page.</p> diff --git a/files/zh-cn/archive/rss/article/why_well-formed_web_rss_module_is_popular_-_syndicating_your_comments/index.html b/files/zh-cn/archive/rss/article/why_well-formed_web_rss_module_is_popular_-_syndicating_your_comments/index.html deleted file mode 100644 index 8ea13bb58d..0000000000 --- a/files/zh-cn/archive/rss/article/why_well-formed_web_rss_module_is_popular_-_syndicating_your_comments/index.html +++ /dev/null @@ -1,8 +0,0 @@ ---- -title: 文章：为什么"Well-Formed Web RSS"模块会流行——对你的评论进行同步 -slug: >- - Archive/RSS/Article/Why_Well-Formed_Web_RSS_Module_is_Popular_-_Syndicating_Your_Comments -translation_of: >- - Archive/RSS/Article/Why_Well-Formed_Web_RSS_Module_is_Popular_-_Syndicating_Your_Comments ---- -<p>为什么"Well-Formed Web RSS"模块会流行</p> diff --git a/files/zh-cn/archive/rss/index.html b/files/zh-cn/archive/rss/index.html deleted file mode 100644 index 0fe628088e..0000000000 --- a/files/zh-cn/archive/rss/index.html +++ /dev/null @@ -1,69 +0,0 @@ ---- -title: RSS -slug: Archive/RSS -tags: - - RSS -translation_of: Archive/RSS ---- -<p> </p> -<div class="callout-box"> - <b><a href="cn/RSS/%e4%bb%8e%e8%bf%99%e9%87%8c%e5%bc%80%e5%a7%8b">从这里开始</a></b><br> - 一份指导教程将会帮助您开始使用RSS。</div> -<div> - <b>简单同步工具 (RSS)</b>采用流行的<a href="cn/HTML">HTML</a>-类<a href="cn/XML">XML</a>语言格式进行同步工作。 RSS的发展历史十分混杂，衍生出了一些彼此不兼容的版本<a href="cn/RSS/Version">RSS versions</a>（其中一些基于<a href="cn/RDF">RDF</a>，但大部分只是基于<a href="cn/XML">XML</a>。）尽管如此，RSS作为一种非常流行的同步数据格式广泛应用于新闻、博客、IP广播、IPTV等领域，而且表现出了惊人的能力。 Nonetheless, RSS is an extremely popular format that is used for syndicating news, blog posts, IPradio, and IPTV, with an amazing amount of momentum.</div> -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h4 id=".E6.96.87.E6.A1.A3" name=".E6.96.87.E6.A1.A3"><a>文档</a></h4> - <dl> - <dt> - <a href="cn/RSS/%e6%96%87%e7%ab%a0%ef%bc%9a%e4%b8%ba%e4%bb%80%e4%b9%88%22RSS_Slash%22%e4%bc%9a%e6%b5%81%e8%a1%8c_%e2%80%94%e2%80%94_%e6%95%b0%e4%b8%80%e4%b8%8b%e4%bd%a0%e7%9a%84%e8%af%84%e8%ae%ba">为什么RSS Slash会流行 —— 数一下你的评论</a></dt> - <dd> - <small>Charles Iliya Krmpeaux谈论RSS Slash模块：为什么它在一些人中会流行？怎么用它对你的评论进行”计数“？</small></dd> - </dl> - <dl> - <dt> - <a href="cn/RSS/%e6%96%87%e7%ab%a0%ef%bc%9a%e4%b8%ba%e4%bb%80%e4%b9%88%22Well-Formed_Web_RSS%22%e6%a8%a1%e5%9d%97%e4%bc%9a%e6%b5%81%e8%a1%8c%e2%80%94%e2%80%94%e5%af%b9%e4%bd%a0%e7%9a%84%e8%af%84%e8%ae%ba%e8%bf%9b%e8%a1%8c%e5%90%8c%e6%ad%a5">为什么"Well-Formed Web RSS"模块会流行——对你的评论进行同步</a></dt> - <dd> - <small>Charles Iliya Krempeaux谈论RSS Well-Formed Web模块： 它为什么在一些人中流行？怎样使用它来链接到你的评论？</small></dd> - </dl> - <dl> - <dt> - <a class="external" href="http://diveintomark.org/archives/2004/02/04/incompatible-rss">RSS兼容性的迷思</a></dt> - <dd> - <small>Mark Pilgrim将告诉你RSS混杂的历史故事以及不同版本将的细节差别。</small></dd> - </dl> - <dl> - <dt> - <a class="external" href="http://www.tbray.org/ongoing/When/200x/2005/07/27/Atomic-RSS">Atomic RSS</a></dt> - <dd> - <small>Tim Bray谈论的内容有，将Atom 1.0作为RSS2.0的一种微小模式和拓展模块来使用；继续使用RSS2.0作为你的同步数据格式，同时选用Atom1.0的某些组件</small></dd> - </dl> - <p><span class="alllinks"><a>查看所有……</a></span></p> - </td> - <td> - <h4 id=".E7.A4.BE.E5.8C.BA" name=".E7.A4.BE.E5.8C.BA">社区</h4> - <ul> - <li>查看Mozilla XML论坛... - <ul> - <li><a class="link-https" href="https://lists.mozilla.org/listinfo/dev-tech-xml">邮件列表</a></li> - <li><a class="link-news" href="news://news.mozilla.org/mozilla.dev.tech.xml">新闻组</a></li> - <li><a class="external" href="http://groups.google.com/group/mozilla.dev.tech.xml">Google论坛</a></li> - <li><a class="external" href="http://groups.google.com/group/mozilla.dev.tech.xml/feeds">订阅</a></li> - </ul> - </li> - </ul> - <h4 id=".E7.9B.B8.E5.85.B3.E4.B8.BB.E9.A2.98" name=".E7.9B.B8.E5.85.B3.E4.B8.BB.E9.A2.98">相关主题</h4> - <dl> - <dd> - <a href="cn/RDF">RDF</a>, <a href="cn/XML">XML</a></dd> - </dl> - </td> - </tr> - </tbody> -</table> -<p><span class="comment">Categories</span></p> -<p><span class="comment">Interwiki Language Links</span></p> -<p> </p> -<p></p> diff --git a/files/zh-cn/archive/security/digital_signatures/index.html b/files/zh-cn/archive/security/digital_signatures/index.html deleted file mode 100644 index a6bbd73af1..0000000000 --- a/files/zh-cn/archive/security/digital_signatures/index.html +++ /dev/null @@ -1,38 +0,0 @@ ---- -title: Digital Signatures -slug: Archive/Security/Digital_Signatures -translation_of: Archive/Security/Digital_Signatures ---- -<p>加密和解密解决了窃听问题，这是本文开头提到的三个互联网安全问题之一。但加密和解密本身并不能解决另一个问题：篡改。</p> - -<p>本节描述公钥加密如何解决篡改问题。</p> - -<p>篡改检测和相关的身份验证技术依赖于一个称为单向哈希（也称为消息摘要）的数学函数。单向哈希是具有以下特征的固定长度数：</p> - -<ul> - <li>哈希值对于哈希数据是唯一的。数据中的任何更改，甚至删除或更改单个字符，都会导致不同的值。</li> - <li>出于所有实际目的，哈希数据的内容不能从哈希中推断出来，这就是为什么它被称为“单向”的原因。</li> -</ul> - -<p>类似地，在公钥加密中，生成用于数字签名的密钥对。密钥对由<span style="line-height: 1.5;"> </span><strong>私有签名密钥</strong><span style="line-height: 1.5;">和</span><strong>公共验证密钥</strong><span style="line-height: 1.5;">组成. </span>公钥被广泛分发，而私钥只有其所有者知道。这些密钥在数学上是相关的，但是选择这些参数是为了从公钥中计算私钥是不可能的，或者是非常昂贵的。加密的散列以及其他信息，如散列算法，被称为数字签名。</p> - -<p>图1显示了使用数字签名来验证签名数据完整性的简化视图。</p> - -<p><img alt="Figure 3. Using a Digital Signature to Validate Data Integrity" class="internal" src="https://mdn.mozillademos.org/files/10307/04digsgn.png" style="height: 223px; width: 652px;"></p> - -<p>图1显示了传输给某些签名数据的接收者的两个项目：原始数据和数字签名，这基本上是一个单向散列（原始数据的散列），已经用签名者的私钥加密。 为了验证数据的完整性，接收软件首先使用签名者的公钥来解密散列。然后使用生成原始散列的相同散列算法生成相同数据的新单向散列。（有关使用的散列算法的信息与数字签名一起发送，但图中未显示。） 最后，接收软件将新散列与原始散列进行比较。 如果两个散列匹配，则数据自签名后没有更改。如果它们不匹配，则数据可能在签名后被篡改，或者签名可能是使用与签名者提供的公钥不对应的私钥创建的。</p> - -<p>如果两个散列匹配，则收件人可以确定用于解密数字签名的公钥与用于创建数字签名的私钥相对应。 但是，要确认签名者的身份，还需要某种方式来确认公钥确实属于某个特定的人或其他实体。For a discussion of the way this works, see "<a href="/en-US/docs/Introduction_to_Public-Key_Cryptography">Introduction to Public-Key Cryptography</a>."</p> - -<p>数字签名的重要性与手写签名的重要性相当。 一旦您签署了一些数据，就很难拒绝以后这样做，假设私钥没有被泄露或超出了所有者的控制。一旦您签署了一些数据，就很难拒绝以后这样做，假设私钥没有被泄露或超出了所有者的控制。在某些情况下，数字签名可能与手写签名一样具有法律约束力。</p> - -<div class="originaldocinfo"> -<h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3> - -<ul> - <li>Author(s): Ella Deon Lackey</li> - <li>Last Updated Date: 2012</li> - <li>Copyright Information: © 2012 Red Hat, Inc.</li> - <li>Link: <a href="https://access.redhat.com/documentation/en-US/Red_Hat_Certificate_System_Common_Criteria_Certification/8.1/html/Deploy_and_Install_Guide/index.html">Red Hat Certificate System Common Criteria Certification 8.1: Deployment, Planning, and Installation</a></li> -</ul> -</div> diff --git a/files/zh-cn/archive/security/encryption_and_decryption/index.html b/files/zh-cn/archive/security/encryption_and_decryption/index.html deleted file mode 100644 index 8154ffdffa..0000000000 --- a/files/zh-cn/archive/security/encryption_and_decryption/index.html +++ /dev/null @@ -1,73 +0,0 @@ ---- -title: Encryption and Decryption -slug: Archive/Security/Encryption_and_Decryption -translation_of: Archive/Security/Encryption_and_Decryption ---- -<p>加密是使预期参与者外的仍何人不可知的的信息转换过程。解密是加密的反过程以便让信息可理解。一个加密算法也被称作暗号，是一个数学函数用于加解密。大多数情况使用两个相关联函数，一个用于加密一个用于解密。</p> - -<p>凭借大多数现代密码学，保障加密信息的隐秘不是基于加密算法，这是被广泛认知的，而是通过一个被称为密钥的数字它将必须被用到算法过程中去产生一个加密后或解密后的结果。通过正确的密钥解密很简单。没有正确的密钥解密是非常困难的，并且在某些情况下所有的尝试都是不能解密的。</p> - -<p>以下部分是对密钥来加密和解密的进一步介绍</p> - -<ul> - <li><a href="#Symmetric-Key_Encryption">对称密钥加密</a></li> - <li><a href="#Public-Key_Encryption">公开密钥加密</a></li> - <li><a href="#Key_Length_and_Encryption_Strength">密钥长度和加密强度</a></li> -</ul> - -<h3 id="Symmetric-Key_Encryption" name="Symmetric-Key_Encryption">对称密钥加密</h3> - -<p>使用对称密钥加密，加密密钥可以通过加密密钥运算得出，反之亦然。大多数的对称加密算法中，使用的是相同的密钥，如图一所示。</p> - -<p><img alt="Figure 1. Symmetric-Key Encryption" class="internal" src="https://mdn.mozillademos.org/files/10303/05scrypt2.png" style="height: 125px; width: 443px;"></p> - -<p>对称密钥加密的实现可以是非常高效的，以至于使用者不会体验到非常大的延时就得到加密或解密的结果。对称密钥加密还提供了一定程度的认证机制，自从信息被一个对称密钥加密后不可被另一个对称密钥解密。因此，在加密通信中只要对称密钥隐秘的保存在通信双方，并能确认其通信另一方（的真实性）解密后的消息就存在意义。</p> - -<p>对称密钥加密仅仅当涉及到的双方秘密的保存对称密钥才是有效的。如果任何人发现了密钥，它会影响保密性和身份验证。拥有未经授权的对称密钥的人（虚假的第三方）不仅可以解密与该密钥一起发送的消息，还可以加密新消息并将它们发送，就好像它们来自最初使用密钥的两方中的一方。</p> - -<p>对称密钥加密在SSL协议中具有极其重要的作用，它被用于认证，篡改检测和在TCP/IP网络上的加密。SSL也使用到了公开密钥技术，它将在下一节中描述。</p> - -<h3 id="Public-Key_Encryption" name="Public-Key_Encryption">公开密钥加密</h3> - -<p>最常见实现公开密钥加密是基于RSA Data Security专利的算法。因此，这一节介绍RSA公钥加密方法。</p> - -<p>公开密钥加密（也被称作非对称加密）包含一对密 - 公钥和私钥与需要以电子方式验证其身份或签署或加密数据的实体相关联。任何公钥是可以公开的与之对应的私钥需要隐秘保存。使用公钥加密的数据仅能被你的私钥解密。<a href="#Figure2">图2 </a>展示了简化的使用公钥加密是如何工作的。</p> - -<p><img alt="Figure 2. Public-Key Encryption" class="internal" src="https://mdn.mozillademos.org/files/15760/06pcrypt-corrected.png" style="height: 125px; width: 443px;"></p> - -<p>图2所示的方案可让您自由分发公钥，只有您将能够读取使用此密钥加密的数据。通常，要将加密数据发送给某人，需要使用该人的公钥对数据进行加密，接收加密数据的人员使用相应的私钥对其进行解密。</p> - -<p>与对称密钥加密相比，公钥加密需要更多的计算，因此并不总是适用于大量数据。但是，可以使用公钥加密来发送对称密钥，然后可以使用该对称密钥来加密其他数据。这是SSL协议使用的方法。</p> - -<p>碰巧，图2所示方案的反面也适用：用您的私钥加密的数据只能用您的公钥解密。然而，这不会是加密敏感数据的理想方式，因为这意味着任何使用公钥定义的公开密钥都可以解密数据。不过，私钥加密很有用，因为这意味着您可以使用私钥对数据签名，这对于电子商务和其他密码学商业应用来说是一个重要要求。客户端软件例如Firefox接着可以使用你的公钥去确认这消息是否是被你的私钥签名和是否在签名之后被篡改。“数字签名”描述了此确认过程的工作原理。</p> - -<h3 id="Key_Length_and_Encryption_Strength" name="Key_Length_and_Encryption_Strength">密钥长度和加密强度</h3> - -<p>打破加密算法基本上是找到以纯文本访问加密数据的关键。对于对称算法，打破算法通常意味着试图确定用于加密文本的密钥。对于公钥算法，打破算法通常意味着获取两个接收者之间的共享秘密信息。</p> - -<p>破坏对称算法的一种方法是简单地尝试整个算法中的每个密钥，直到找到正确的密钥。对于公开密钥算法，由于密钥对的一半是公开的，所以另一半（私钥）可以使用发布的，但复杂的数学计算来导出。手工找到破解算法的关键就是蛮力攻击。</p> - -<p>打破算法引入了拦截，甚至模仿和欺骗性验证私人信息的风险。</p> - -<p>算法的关键优势在于找到最快的方法来破解算法并将其与蛮力攻击相比较。</p> - -<p>对于对称密钥，加密强度通常以用于执行加密的密钥的大小或长度来描述：通常，较长的密钥提供更强的加密。密钥长度以位为单位进行测量。例如，与SSL支持的RC4对称密钥密码一起使用的128位密钥提供比用于相同密码的40位密钥更好的加密保护。大致来讲，128位RC4加密比40位RC4加密强 3 x 10<sup>26</sup>倍。（有关用于SSL的RC4和其他密码的更多信息，参见“<a href="/en/Introduction_to_SSL" title="en/Introduction_to_SSL">SSL介绍</a>.") 如果最有名的破解密钥的攻击速度不比蛮力试图测试每个关键可能性的速度快，那么加密密钥就被认为是完备性密钥。</p> - -<p>不同的密码可能需要不同的密钥长度才能达到相同级别的加密强度。例如，用于公钥加密的RSA密码，由于其所基于的数学问题的性质，对于给定长度的密钥只能使用所有可能值的子集。其他密码，例如那些用于对称密钥加密的密码，可以为给定长度的密钥使用所有可能的值，而不是这些值的子集。</p> - -<p>因为破解RSA密钥相对简单，RSA公钥加密密码必须有一个非常长的密钥（至少1024位）被认为是密码强的。另一方面，对于大多数算法，对称密钥密码可以达到与80位密钥大致相同的强度水平。</p> - - - -<div class="originaldocinfo"> -<h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3> - -<ul> - <li>Author(s): Ella Deon Lackey</li> - <li>Translator: Tommy White</li> - <li>Last Updated Date: 2012</li> - <li>Last Translated Date: 2018</li> - <li>Copyright Information: © 2012 Red Hat, Inc.</li> - <li>Link: <a href="https://access.redhat.com/documentation/en-US/Red_Hat_Certificate_System_Common_Criteria_Certification/8.1/html/Deploy_and_Install_Guide/index.html">Red Hat Certificate System Common Criteria Certification 8.1: Deployment, Planning, and Installation</a></li> -</ul> -</div> diff --git a/files/zh-cn/archive/security/index.html b/files/zh-cn/archive/security/index.html deleted file mode 100644 index 63e3a0821e..0000000000 --- a/files/zh-cn/archive/security/index.html +++ /dev/null @@ -1,14 +0,0 @@ ---- -title: Security -slug: Archive/Security -tags: - - NeedsTranslation - - TopicStub -translation_of: Archive/Security ---- -<p><strong><span class="seoSummary">Relying on these obsolete security articles is highly discouraged. Doing so may put your systems at risk.</span></strong></p> - -<p></p><div class="row topicpage-table"> - <div class="section"><dl><dl><dt></dt></dl></dl></div> - <div class="section"><dl><dt class="landingPageList"><a href="/zh-CN/docs/Archive/Security/Encryption_and_Decryption">Encryption and Decryption</a></dt><dd class="landingPageList">加密是使预期参与者外的仍何人不可知的的信息转换过程。解密是加密的反过程以便让信息可理解。一个加密算法也被称作暗号，是一个数学函数用于加解密。大多数情况使用两个相关联函数，一个用于加密一个用于解密。</dd></dl></div> - </div><p></p> diff --git a/files/zh-cn/archive/security/introduction_to_public-key_cryptography/index.html b/files/zh-cn/archive/security/introduction_to_public-key_cryptography/index.html deleted file mode 100644 index b96f91ddd0..0000000000 --- a/files/zh-cn/archive/security/introduction_to_public-key_cryptography/index.html +++ /dev/null @@ -1,475 +0,0 @@ ---- -title: Introduction to Public-Key Cryptography -slug: Archive/Security/Introduction_to_Public-Key_Cryptography -translation_of: Archive/Security/Introduction_to_Public-Key_Cryptography ---- -<p>公钥密码及相关标准和技术是许多产品（如签名和加密电子邮件、单点登录和安全套接字层（SSL）通信）安全功能的基础。本文介绍了公钥密码的基本概念。For an overview of SSL, see "<a href="/en-US/docs/Archive/Security/Introduction_to_SSL" title="en/Introduction_to_SSL">Introduction to SSL</a>." For an overview of encryption and decryption, see "<a href="/en-US/docs/Encryption_and_Decryption">Encryption and Decryption</a>." Information on digital signatures is available from "<a href="/en-US/docs/Digital_Signatures">Digital Signatures</a>."</p> - -<p>公钥密码是一套成熟的技术和标准，用于保护通信免受窃听、篡改和模拟攻击.</p> - -<ul> - <li>加密和解密允许两个通信方伪装他们发送给对方的信息. 发送者在发送信息之前对其进行加密. 接收者在接收到信息后对其进行解密. 在传输过程中，入侵者无法理解加密信息.</li> - <li>篡改检测允许信息接收者验证信息在传输过程中没有被修改. 任何修改数据或替换假消息的尝试都将被检测到.</li> - <li>身份验证允许信息的接收者确定其来源，即确认发送者的身份.</li> - <li>不可否认性防止信息发送者在以后的日期声称信息从未被发送.</li> -</ul> - -<p>以下各节介绍了构成这些功能基础的公钥加密的概念.</p> - -<ul> - <li><a href="#Certificates_and_Authentication">证书和认证</a></li> - <li><a href="#Managing_Certificates">管理证书</a></li> -</ul> - -<p><font face="x-locale-heading-primary, zillaslab, Palatino, Palatino Linotype, x-locale-heading-secondary, serif"><span style="font-size: 37.33327865600586px;"><strong>证书和认证</strong></span></font></p> - -<ul> - <li><a href="#A_Certificate_Identifies_Someone_or_Something">证书证明某人或某事</a></li> - <li><a href="#Authentication_Confirms_an_Identity">身份验证</a></li> - <li><a href="#How_Certificates_Are_Used">证书应用</a></li> - <li><a href="#Contents_of_a_Certificate">证书内容</a></li> - <li><a href="#How_CA_Certificates_Are_Used_to_Establish_Trust">如何使用CA证书建立信任</a></li> -</ul> - -<h3 id="A_Certificate_Identifies_Someone_or_Something" name="A_Certificate_Identifies_Someone_or_Something">证书证明某人或某事</h3> - -<p>A <em>certificate</em> is an electronic document used to identify an individual, a server, a company, or some other entity and to associate that identity with a public key. Like a driver's license, a passport, or other commonly used personal IDs, a certificate provides generally recognized proof of a person's identity. Public-key cryptography uses certificates to address the problem of impersonation.</p> - -<p>To get a driver's license, you typically apply to a government agency, such as the Department of Motor Vehicles, which verifies your identity, your ability to drive, your address, and other information before issuing the license. To get a student ID, you apply to a school or college, which performs different checks (such as whether you have paid your tuition) before issuing the ID. To get a library card, you may need to provide only your name and a utility bill with your address on it.</p> - -<p>Certificates work much the same way as any of these familiar forms of identification. 证书颁发机构（CA）是验证身份并颁发证书的实体. 它们可以是独立的第三方，也可以是运行自己的证书颁发服务器软件（如红帽证书系统）的组织. 验证身份所用的方法因给定CA的策略而异，正如验证其他形式的身份所用的方法因颁发ID的人和使用ID的目的而异. In general, before issuing a certificate, the CA must use its published verification procedures for that type of certificate to ensure that an entity requesting a certificate is in fact who it claims to be.</p> - -<p>CA颁发的证书将特定的公钥绑定到证书标识的实体的名称（例如雇员或服务器的名称）. 证书有助于防止使用假公钥进行模拟. 只有经过证书认证的公钥才能与证书标识的实体所拥有的相应私钥一起使用.</p> - -<p>除了公钥之外，证书还始终包括它标识的实体的名称、过期日期、颁发证书的CA的名称、序列号和其他信息. 最重要的是，证书总是包含颁发CA的数字签名. CA的数字签名允许证书作为“介绍信”使用，这些用户知道并信任CA，但不知道证书标识的实体.</p> - -<p>For more information about the role of CAs, see "<a href="#How_CA_Certificates_Are_Used_to_Establish_Trust">How CA Certificates Are Used to Establish Trust</a>".</p> - -<h3 id="Authentication_Confirms_an_Identity" name="Authentication_Confirms_an_Identity">身份验证</h3> - -<p><em>Authentication</em> is the process of confirming an identity. In the context of network interactions, authentication involves the confident identification of one party by another party. Authentication over networks can take many forms. Certificates are one way of supporting authentication.</p> - -<p>Network interactions typically take place between a client, such as browser software running on a personal computer, and a server, such as the software and hardware used to host a Web site. <em>Client authentication</em> refers to the confident identification of a client by a server (that is, identification of the person assumed to be using the client software). <em>Server authentication</em> refers to the confident identification of a server by a client (that is, identification of the organization assumed to be responsible for the server at a particular network address).</p> - -<p>Client and server authentication are not the only forms of authentication that certificates support. For example, the digital signature on an email message, combined with the certificate that identifies the sender, provide strong evidence that the person identified by that certificate did indeed send that message. Similarly, a digital signature on an HTML form, combined with a certificate that identifies the signer, can provide evidence, after the fact, that the person identified by that certificate did agree to the contents of the form. In addition to authentication, the digital signature in both cases ensures a degree of nonrepudiation-that is, a digital signature makes it difficult for the signer to claim later not to have sent the email or the form.</p> - -<p>Client authentication is an essential element of network security within most intranets or extranets. The sections that follow contrast two forms of client authentication:</p> - -<ul> - <li><strong>Password-Based Authentication.</strong> Almost all server software permits client authentication by means of a name and password. For example, a server might require a user to type a name and password before granting access to the server. The server maintains a list of names and passwords; if a particular name is on the list, and if the user types the correct password, the server grants access.</li> - <li><strong>Certificate-Based Authentication.</strong> 基于证书的客户端身份验证是SSL协议的一部分. 客户端对随机生成的数据进行数字签名，并通过网络发送证书和签名数据. 服务器使用公钥密码技术验证签名并确认证书的有效性.</li> -</ul> - -<h4 id="Password-Based_Authentication" name="Password-Based_Authentication">Password-Based Authentication</h4> - -<p>Figure 4 shows the basic steps involved in authenticating a client by means of a name and password. Figure 4 assumes the following:</p> - -<ul> - <li>The user has already decided to trust the server, either without authentication or on the basis of server authentication via SSL.</li> - <li>The user has requested a resource controlled by the server.</li> - <li>The server requires client authentication before permitting access to the requested resource.</li> -</ul> - -<p><img alt="Figure 4. Using a Password to Authenticate a Client to a Server" class="internal" src="https://mdn.mozillademos.org/files/10319/01pswd.png" style="height: 189px; width: 451px;"></p> - -<p>These are the steps shown in Figure 4<span class="nowiki">:</span></p> - -<ol> - <li>In response to an authentication request from the server, the client displays a dialog box requesting the user's name and password for that server. The user must supply a name and password separately for each new server the user wishes to use during a work session.</li> - <li>The client sends the name and password across the network, either in the clear or over an encrypted SSL connection.</li> - <li>The server looks up the name and password in its local password database and, if they match, accepts them as evidence authenticating the user's identity.</li> - <li>The server determines whether the identified user is permitted to access the requested resource, and if so allows the client to access it.</li> -</ol> - -<p>With this arrangement, the user must supply a new password for each server, and the administrator must keep track of the name and password for each user, typically on separate servers.</p> - -<p>Proper implementation does not store passwords in plaintext. Instead it concatenates the password with a random per-user value (so called "salt") and stores the hash value of the result along with the salt. This makes certain kinds of brute-force atacks more difficult.</p> - -<p>As shown in the next section, one of the advantages of certificate-based authentication is that it can be used to replace the first three steps in Figure 4 with a mechanism that allows the user to supply just one password (which is not sent across the network) and allows the administrator to control user authentication centrally.</p> - -<h4 id="Certificate-Based_Authentication" name="Certificate-Based_Authentication">Certificate-Based Authentication</h4> - -<p>图5显示了如何使用证书和SSL协议进行客户端身份验证. 为了向服务器验证用户身份，客户端对随机生成的数据进行数字签名，并通过网络发送证书和签名数据.在本讨论中，可以将与某些数据相关联的数字签名视为客户端向服务器提供的证据. 服务器根据此证据验证用户的身份.</p> - -<p>与图4一样，图5假设用户已经决定信任服务器并请求了资源，并且服务器在评估是否授予对请求的资源的访问权限的过程中请求了客户端身份验证.</p> - -<p><img alt="Figure 5. Using a Certificate to Authenticate a Client to a Server" class="internal" src="https://mdn.mozillademos.org/files/10321/02cert.png" style="height: 248px; width: 479px;"></p> - -<p>与图4所示的过程不同，图5所示的过程需要使用SSL. 图5还假设客户端有一个有效的证书，可以用来向服务器标识客户端. 基于证书的身份验证通常被认为比基于密码的身份验证更可取，因为它基于用户所拥有的（私钥）以及用户所知道的（保护私钥的密码）. 但是，需要注意的是，只有在未经授权的人员没有访问用户的机器或密码、设置了客户端软件的私钥数据库的密码以及设置软件以合理的频繁间隔请求密码的情况下，这两个假设才是真的.</p> - -<div class="note">基于密码的身份验证或基于证书的身份验证都不能解决与对单个计算机或密码的物理访问相关的安全问题. 公钥密码只能验证用于签名某些数据的私钥是否与证书中的公钥对应. 用户有责任保护机器的物理安全并对私钥密码保密.</div> - -<p>These are the steps shown in Figure 5<span class="nowiki">:</span></p> - -<ol> - <li>客户端软件（如Communicator）维护私钥数据库，这些私钥对应于为该客户端颁发的任何证书中发布的公钥. 客户端在给定会话期间第一次需要访问该数据库时（例如，用户第一次尝试访问需要基于证书的客户机身份验证的启用了SSL的服务器时），会请求该数据库的密码. 输入此密码一次后，用户在会话的其余部分不需要再次输入，即使在访问其他启用SSL的服务器时也是如此.</li> - <li>客户端解锁私钥数据库，检索用户证书的私钥，并使用该私钥对根据客户端和服务器的输入随机生成的一些数据进行数字签名. 这些数据和数字签名构成了私钥有效性的“证据”. 数字签名只能使用该私钥创建，并且可以使用对应的公钥针对已签名的数据进行验证，该数据对于SSL会话是唯一的.</li> - <li>客户端通过网络发送用户证书和证据（随机生成的经过数字签名的数据片段）.</li> - <li>服务器使用证书和证据来验证用户的身份. (For a detailed discussion of the way this works, see "<a href="/en-US/docs/Archive/Security/Introduction_to_SSL" title="en/Introduction_to_SSL">Introduction to SSL</a>.")</li> - <li>At this point the server may optionally perform other authentication tasks, such as checking that the certificate presented by the client is stored in the user's entry in an LDAP directory. The server then continues to evaluate whether the identified user is permitted to access the requested resource. This evaluation process can employ a variety of standard authorization mechanisms, potentially using additional information in an LDAP directory, company databases, and so on. If the result of the evaluation is positive, the server allows the client to access the requested resource.</li> -</ol> - -<p>As you can see by comparing Figure 5 to Figure 4, certificates replace the authentication portion of the interaction between the client and the server. Instead of requiring a user to send passwords across the network throughout the day, single sign-on requires the user to enter the private-key database password just once, without sending it across the network. For the rest of the session, the client presents the user's certificate to authenticate the user to each new server it encounters. Existing authorization mechanisms based on the authenticated user identity are not affected.</p> - -<h3 id="How_Certificates_Are_Used" name="How_Certificates_Are_Used">证书应用</h3> - -<p>证书有一个目的：建立信任. 它们的使用取决于它们用于确保的信任类型. 某些类型的证书用于验证演示者的身份; 其他用于验证对象或项未被篡改.</p> - -<ul> - <li><a href="#SSL_Protocol">SSL Protocol</a></li> - <li><a href="#Signed_and_Encrypted_Email">Signed and Encrypted Email</a></li> - <li><a href="#Signle_Sign-On">Single Sign-On</a></li> - <li><a href="#Object_Signing">Object Signing</a></li> -</ul> - -<h4 id="SSL_Protocol" name="SSL_Protocol">SSL Protocol</h4> - -<p>安全套接字层（SSL）协议是一组规则，用于管理服务器身份验证、客户端身份验证以及服务器和客户端之间的加密通信. SSL在Internet上广泛使用，特别是用于涉及交换机密信息（如信用卡号码）的交互.</p> - -<p>SSL至少需要一个服务器SSL证书. 作为初始“握手”过程的一部分，服务器向客户机提供其证书以验证服务器的身份. 身份验证过程使用公钥加密和数字签名来确认服务器实际上就是它声称的服务器. 一旦服务器经过身份验证，客户机和服务器就使用对称密钥加密技术（这是非常快速的），对它们在会话剩余时间内交换的所有信息进行加密，并检测可能发生的任何篡改.</p> - -<p>可以选择将服务器配置为需要客户端身份验证和服务器身份验证. 在这种情况下，在成功完成服务器身份验证之后，客户端还必须向服务器提供其证书，以便在建立加密的SSL会话之前验证客户端的身份.</p> - -<p>For an overview of client authentication over SSL and how it differs from password-based authentication, see "<a href="#Authentication_Confirms_an_Identity">Authentication Confirms an Identity</a>". For more detailed information about SSL, see "<a href="/en-US/docs/Archive/Security/Introduction_to_SSL" title="en/Introduction_to_SSL">Introduction to SSL</a>."</p> - -<h4 id="Signed_and_Encrypted_Email" name="Signed_and_Encrypted_Email">Signed and Encrypted Email</h4> - -<p>Some email programs support digitally signed and encrypted email using a widely accepted protocol known as Secure Multipurpose Internet Mail Extension (S/MIME). Using S/MIME to sign or encrypt email messages requires the sender of the message to have an S/MIME certificate.</p> - -<p>An email message that includes a digital signature provides some assurance that it was in fact sent by the person whose name appears in the message header, thus providing authentication of the sender. If the digital signature cannot be validated by the email software on the receiving end, the user will be alerted.</p> - -<p>The digital signature is unique to the message it accompanies. If the message received differs in any way from the message that was sent-even by the addition or deletion of a comma-the digital signature cannot be validated. Therefore, signed email also provides some assurance that the email has not been tampered with. As discussed at the beginning of this document, this kind of assurance is known as nonrepudiation. In other words, signed email makes it very difficult for the sender to deny having sent the message. This is important for many forms of business communication. (For information about the way digital signatures work, see "<a href="#Digital_Signatures">Digital Signatures</a>".)</p> - -<p>S/MIME also makes it possible to encrypt email messages. This is also important for some business users. However, using encryption for email requires careful planning. If the recipient of encrypted email messages loses his or her private key and does not have access to a backup copy of the key, for example, the encrypted messages can never be decrypted.</p> - -<h4 id="Single_Sign-On" name="Single_Sign-On">Single Sign-On</h4> - -<p>Network users are frequently required to remember multiple passwords for the various services they use. For example, a user might have to type a different password to log into the network, collect email, use directory services, use the corporate calendar program, and access various servers. Multiple passwords are an ongoing headache for both users and system administrators. Users have difficulty keeping track of different passwords, tend to choose poor ones, and tend to write them down in obvious places. Administrators must keep track of a separate password database on each server and deal with potential security problems related to the fact that passwords are sent over the network routinely and frequently.</p> - -<p>Solving this problem requires some way for a user to log in once, using a single password, and get authenticated access to all network resources that user is authorized to use-without sending any passwords over the network. This capability is known as <em>single sign-on.</em></p> - -<p>Both client SSL certificates and S/MIME certificates can play a significant role in a comprehensive single sign-on solution. For example, one form of single sign-on relies on SSL client authentication (see "<a href="#Certificate-Based_Authentication">Certificate-Based Authentication</a>"). A user can log in once, using a single password to the local client's private-key database, and get authenticated access to all SSL-enabled servers that user is authorized to use-without sending any passwords over the network. This approach simplifies access for users, because they don't need to enter passwords for each new server. It also simplifies network management, since administrators can control access by controlling lists of certificate authorities (CAs) rather than much longer lists of users and passwords.</p> - -<p>In addition to using certificates, a complete single-sign on solution must address the need to interoperate with enterprise systems, such as the underlying operating system, that rely on passwords or other forms of authentication.</p> - -<h4 id="Object_Signing" name="Object_Signing">Object Signing</h4> - -<p>通信器支持一组称为对象签名的工具和技术. 对象签名使用公钥加密的标准技术，使用户可以获得关于他们下载的代码的可靠信息，就像他们可以获得关于收缩包装软件的可靠信息一样.</p> - -<p>最重要的是，对象签名帮助用户和网络管理员实现有关通过内部网或Internet分发的软件的决策，例如，是否允许由给定实体签名的Java小程序在特定用户的计算机上使用特定的计算机功能.</p> - -<p>使用对象签名技术签名的“对象”可以是applet或其他Java代码、JavaScript脚本、插件或任何类型的文件. “签名”是数字签名. 签名对象及其签名通常存储在一个称为JAR文件的特殊文件中.</p> - -<p>希望使用对象签名技术对文件进行签名的软件开发人员和其他人员必须首先获得对象签名证书.</p> - -<h3 id="Contents_of_a_Certificate" name="Contents_of_a_Certificate">证书类型</h3> - -<p>常见的证书类型包括:</p> - -<ul> - <li><strong>Client SSL certificates.</strong> 用于通过SSL（客户端身份验证）将客户端标识到服务器. 通常，假定客户的身份与人类的身份相同，例如企业中的员工. See "<a href="#Certificate-Based_Authentication">Certificate-Based Authentication</a>" for a description of the way client SSL certificates are used for client authentication. Client SSL certificates can also be used as part of a single sign-on solution.</li> -</ul> - -<dl> - <dt>示例：银行向客户提供一个客户端SSL证书，该证书允许银行的服务器识别该客户并授权访问该客户的帐户. 公司可能会给新员工一个客户端SSL证书，允许公司的服务器识别该员工并授权访问公司的服务器.</dt> -</dl> - -<ul> - <li><strong>Server SSL certificates.</strong> 用于通过SSL（服务器身份验证）向客户端标识服务器. 服务器身份验证可以与客户端身份验证一起使用，也可以不使用客户端身份验证. 服务器身份验证是加密SSL会话的要求. For more information, see "<a href="#SSL_Protocol">SSL Protocol</a>".</li> -</ul> - -<dl> - <dt><strong>Example:</strong> Internet sites that engage in electronic commerce (commonly known as e-commerce) usually support certificate-based server authentication, at a minimum, to establish an encrypted SSL session and to assure customers that they are dealing with a web site identified with a particular company. The encrypted SSL session ensures that personal information sent over the network, such as credit card numbers, cannot easily be intercepted.</dt> -</dl> - -<ul> - <li><strong>S/MIME certificates.</strong> Used for signed and encrypted email. As with client SSL certificates, the identity of the client is typically assumed to be the same as the identity of a human being, such as an employee in an enterprise. A single certificate may be used as both an S/MIME certificate and an SSL certificate (see "<a href="#Signed_and_Encrypted_Email">Signed and Encrypted Email</a>"). S/MIME certificates can also be used as part of a single sign-on solution.</li> -</ul> - -<dl> - <dt><strong>Examples:</strong> A company deploys combined S/MIME and SSL certificates solely for the purpose of authenticating employee identities, thus permitting signed email and client SSL authentication but not encrypted email. Another company issues S/MIME certificates solely for the purpose of both signing and encrypting email that deals with sensitive financial or legal matters.</dt> -</dl> - -<ul> - <li><strong>Object-signing certificates.</strong> Used to identify signers of Java code, JavaScript scripts, or other signed files. For more information, see "<a href="#Object_Signing">Object Signing</a>".</li> -</ul> - -<dl> - <dt><strong>Example:</strong> A software company signs software distributed over the Internet to provide users with some assurance that the software is a legitimate product of that company. Using certificates and digital signatures in this manner can also make it possible for users to identify and control the kind of access downloaded software has to their computers.</dt> -</dl> - -<ul> - <li><strong>CA certificates.</strong> 用于识别CA. 客户端和服务器软件使用CA证书来确定哪些其他证书可以被信任. For more information, see "<a href="#How_CA_Certificates_Are_Used_to_Establish_Trust">How CA Certificates Are Used to Establish Trust</a>".</li> -</ul> - -<dl> - <dt>示例：存储在Firefox中的CA证书决定了Firefox副本可以验证的其他证书。管理员可以通过控制存储在每个用户的Firefox副本中的CA证书来实现公司安全策略的某些方面。</dt> -</dl> - -<h3 id="证书内容">证书内容</h3> - -<p>The contents of certificates are organized according to the X.509 v3 certificate specification, which has been recommended by the International Telecommunications Union (ITU), an international standards body, since 1988.</p> - -<p>Users don't usually need to be concerned about the exact contents of a certificate. However, system administrators working with certificates may need some familiarity with the information provided here.</p> - -<h4 id="Certificate_Data_Formats">Certificate Data Formats</h4> - -<p>Certificate requests and certificates can be created, stored, and installed in multiple formats: binary and text. All of these formats conform to X.509 standards. Three examples of binary formats are DER-encoded certificates, PKCS #7 certificate chains, and Netscape Certificate Sequence. Any of the binary formats can be imported in text form, which begins with the line:</p> - -<p><code>-----BEGIN CERTIFICATE-----</code></p> - -<p>Following this line is the certificate data, which can be in any of the binary formats described. This data should be base-64 encoded, as described by RFC 1113. The certificate information is followed by this line:</p> - -<p><code>-----END CERTIFICATE-----</code></p> - -<h4 id="Distinguished_Names" name="Distinguished_Names">Distinguished Names</h4> - -<p>An X.509 v3 certificate binds a distinguished name (DN) to a public key. A DN is a series of name-value pairs, such as <code>uid=doe</code>, that uniquely identify an entity-that is, the certificate <em>subject.</em></p> - -<p>For example, this might be a typical DN for an employee of Example Corp:</p> - -<pre class="eval">uid=doe,e=doe@<code>example.net</code>,cn=John Doe,o=Example Corp.,c=US -</pre> - -<p>The abbreviations before each equal sign in this example have these meanings:</p> - -<ul> - <li><code>uid</code><span class="nowiki">: user ID</span></li> - <li><code>e</code><span class="nowiki">: email address</span></li> - <li><code>cn</code><span class="nowiki">: the user's common name</span></li> - <li><code>o</code><span class="nowiki">: organization</span></li> - <li><code>c</code><span class="nowiki">: country</span></li> -</ul> - -<p>DNs may include a variety of other name-value pairs. They are used to identify both certificate subjects and entries in directories that support the Lightweight Directory Access Protocol (LDAP).</p> - -<p>The rules governing the construction of DNs can be quite complex and are beyond the scope of this document. For comprehensive information about DNs, see <em><a class="external" href="https://www.ietf.org/rfc/rfc1485.txt">A String Representation of Distinguished Names</a>]</em> at the following URL:</p> - -<pre class="eval"><a class="external" href="https://www.ietf.org/rfc/rfc1485.txt" rel="freelink">https://www.ietf.org/rfc/rfc1485.txt</a> -</pre> - -<h4 id="A_Typical_Certificate" name="A_Typical_Certificate">A Typical Certificate</h4> - -<p>Every X.509 certificate consists of two sections:</p> - -<ul> - <li>The data section includes the following information: - <ul> - <li>The version number of the X.509 standard supported by the certificate.</li> - <li>The certificate's serial number. Every certificate issued by a CA has a serial number that is unique among the certificates issued by that CA.</li> - <li>Information about the user's public key, including the algorithm used and a representation of the key itself.</li> - <li>The DN of the CA that issued the certificate.</li> - <li>The period during which the certificate is valid (for example, between 1:00 p.m. on November 15, 1999 and 1:00 p.m. November 15, 2000)</li> - <li>The DN of the certificate subject (for example, in a client SSL certificate this would be the user's DN), also called the subject name.</li> - <li>Optional <em>certificate extensions,</em> which may provide additional data used by the client or server. For example, the certificate type extension indicates the type of certificate-that is, whether it is a client SSL certificate, a server SSL certificate, a certificate for signing email, and so on. Certificate extensions can also be used for a variety of other purposes.</li> - </ul> - </li> - <li>The signature section includes the following information: - <ul> - <li>The cryptographic algorithm, or cipher, used by the issuing CA to create its own digital signature.</li> - <li>The CA's digital signature, obtained by hashing all of the data in the certificate together and encrypting it with the CA's private key.</li> - </ul> - </li> -</ul> - -<p>Here are the data and signature sections of a certificate in human-readable format:</p> - -<pre class="eval">Certificate: -Data: - Version: v3 (0x2) - Serial Number: 3 (0x3) - Signature Algorithm: PKCS #1 MD5 With RSA Encryption - Issuer: OU=Ace Certificate Authority, O=Ace Industry, C=US - Validity: - Not Before: Fri Oct 17 18:36:25 1997 - Not After: Sun Oct 17 18:36:25 1999 - Subject: CN=Jane Doe, OU=Finance, O=Ace Industry, C=US - Subject Public Key Info: - Algorithm: PKCS #1 RSA Encryption - Public Key: - Modulus: - 00:ca:fa:79:98:8f:19:f8:d7:de:e4:49:80:48:e6:2a:2a:86: - ed:27:40:4d:86:b3:05:c0:01:bb:50:15:c9:de:dc:85:19:22: - 43:7d:45:6d:71:4e:17:3d:f0:36:4b:5b:7f:a8:51:a3:a1:00: - 98:ce:7f:47:50:2c:93:36:7c:01:6e:cb:89:06:41:72:b5:e9: - 73:49:38:76:ef:b6:8f:ac:49:bb:63:0f:9b:ff:16:2a:e3:0e: - 9d:3b:af:ce:9a:3e:48:65:de:96:61:d5:0a:11:2a:a2:80:b0: - 7d:d8:99:cb:0c:99:34:c9:ab:25:06:a8:31:ad:8c:4b:aa:54: - 91:f4:15 - Public Exponent: 65537 (0x10001) - Extensions: - Identifier: Certificate Type - Critical: no - Certified Usage: - SSL Client - Identifier: Authority Key Identifier - Critical: no - Key Identifier: - f2:f2:06:59:90:18:47:51:f5:89:33:5a:31:7a:e6:5c:fb:36: - 26:c9 - Signature: - Algorithm: PKCS #1 MD5 With RSA Encryption - Signature: - 6d:23:af:f3:d3:b6:7a:df:90:df:cd:7e:18:6c:01:69:8e:54:65:fc:06: - 30:43:34:d1:63:1f:06:7d:c3:40:a8:2a:82:c1:a4:83:2a:fb:2e:8f:fb: - f0:6d:ff:75:a3:78:f7:52:47:46:62:97:1d:d9:c6:11:0a:02:a2:e0:cc: - 2a:75:6c:8b:b6:9b:87:00:7d:7c:84:76:79:ba:f8:b4:d2:62:58:c3:c5: - b6:c1:43:ac:63:44:42:fd:af:c8:0f:2f:38:85:6d:d6:59:e8:41:42:a5: - 4a:e5:26:38:ff:32:78:a1:38:f1:ed:dc:0d:31:d1:b0:6d:67:e9:46:a8: - d:c4 -</pre> - -<p>Here is the same certificate displayed in the 64-byte-encoded form interpreted by software:</p> - -<pre class="eval"><span class="nowiki"> - -----BEGIN CERTIFICATE----- - MIICKzCCAZSgAwIBAgIBAzANBgkqhkiG9w0BAQQFADA3MQswCQYDVQQGEwJVUzER - MA8GA1UEChMITmV0c2NhcGUxFTATBgNVBAsTDFN1cHJpeWEncyBDQTAeFw05NzEw - MTgwMTM2MjVaFw05OTEwMTgwMTM2MjVaMEgxCzAJBgNVBAYTAlVTMREwDwYDVQQK - EwhOZXRzY2FwZTENMAsGA1UECxMEUHViczEXMBUGA1UEAxMOU3Vwcml5YSBTaGV0 - dHkwgZ8wDQYJKoZIhvcNAQEFBQADgY0AMIGJAoGBAMr6eZiPGfjX3uRJgEjmKiqG - 7SdATYazBcABu1AVyd7chRkiQ31FbXFOGD3wNktbf6hRo6EAmM5/R1AskzZ8AW7L - iQZBcrXpc0k4du+2Q6xJu2MPm/8WKuMOnTuvzpo+SGXelmHVChEqooCwfdiZywyZ - NMmrJgaoMa2MS6pUkfQVAgMBAAGjNjA0MBEGCWCGSAGG+EIBAQQEAwIAgDAfBgNV - HSMEGDAWgBTy8gZZkBhHUfWJM1oxeuZc+zYmyTANBgkqhkiG9w0BAQQFAAOBgQBt - I6/z07Z635DfzX4XbAFpjlRl/AYwQzTSYx8GfcNAqCqCwaSDKvsuj/vwbf91o3j3 - UkdGYpcd2cYRCgKi4MwqdWyLtpuHAH18hHZ5uvi00mJYw8W2wUOsY0RC/a/IDy84 - hW3WWehBUqVK5SY4/zJ4oTjx7dwNMdGwbWfpRqjd1A== - -----END CERTIFICATE----- - </span> -</pre> - -<h3 id="How_CA_Certificates_Are_Used_to_Establish_Trust" name="How_CA_Certificates_Are_Used_to_Establish_Trust">如何使用CA证书建立信任</h3> - -<p>证书颁发机构（CA）是验证身份并颁发证书的实体。它们可以是独立的第三方，也可以是运行自己的证书颁发服务器软件的组织。</p> - -<p>任何支持证书的客户端或服务器软件都维护一组受信任的CA证书。 这些CA证书确定软件可以验证哪些其他证书，换句话说，软件可以信任哪些证书的颁发者。 在最简单的情况下，软件只能验证由其中一个拥有证书的CA颁发的证书。 受信任的CA证书也可能是CA证书链的一部分，每个证书链都是由其上面的CA在证书层次结构中颁发的。</p> - -<p>以下各节说明了证书层次结构和证书链如何确定软件可以信任哪些证书。</p> - -<ul> - <li><a href="#CA_Hierarchies">CA Hierarchies</a></li> - <li><a href="#Certificate_Chains">Certificate Chains</a></li> - <li><a href="#Verifying_a_Certificate_Chain">Verifying a Certificate Chain</a></li> -</ul> - -<h4 id="CA_Hierarchies" name="CA_Hierarchies">CA Hierarchies</h4> - -<p>在大型组织中，可以将颁发证书的责任委派给多个不同的证书颁发机构。 例如，所需的证书数量可能太多，单个CA无法维护； 不同的组织单元可能有不同的政策要求；或者，对于CA来说，其实际位置可能与它向其颁发证书的人位于同一地理区域中是很重要的。</p> - -<p>可以将颁发证书的职责委托给下级CA。X.509标准包括一个用于建立如图6所示的CA层次结构的模型。</p> - -<p><img alt="Figure 6. Example of a Hierarchy of Certificate Authorities" class="internal" src="https://mdn.mozillademos.org/files/10309/14HIER.png" style="height: 317px; width: 394px;"></p> - -<p>在这个模型中，根CA位于层次结构的顶部。 根CA的证书是一个自签名证书：也就是说，该证书由证书标识的根CA所在的同一实体进行数字签名。 直接隶属于根CA的CA具有由根CA签名的CA证书。 层次结构中下级CA下的CA的CA证书由上级下级CA签名。</p> - -<p>组织在建立CA层次结构方面有很大的灵活性。 图6只显示了一个示例；还有许多其他安排是可能的。</p> - -<h4 id="Certificate_Chains" name="Certificate_Chains">Certificate Chains</h4> - -<p>CA层次结构反映在证书链中。 证书链是由连续的ca颁发的一系列证书。图7显示了一个证书链，从通过两个从属CA证书标识某个实体的证书到根CA的CA证书（基于图6所示的CA层次结构）。</p> - -<p><img alt="Figure 7. Example of a Certificate Chain" class="internal" src="https://mdn.mozillademos.org/files/10311/15chn.png" style="height: 435px; width: 439px;"></p> - -<p>证书链跟踪证书从层次结构中的分支到层次结构的根的路径。 I在证书链中，会发生以下情况：</p> - -<ul> - <li>每个证书后面都有其颁发者的证书。</li> - <li>每个证书都包含该证书颁发者的名称（DN），该名称与链中下一个证书的使用者名称相同。</li> -</ul> - -<p>在图7中，工程CA证书包含颁发该证书的CA（即USA CA）的DN。 USA CA的DN也是链中下一个证书的使用者名称。</p> - -<ul> - <li>每个证书都用其颁发者的私钥签名。签名可以使用颁发者证书中的公钥进行验证，该证书是链中的下一个证书。</li> -</ul> - -<p>在图7中，美国CA证书中的公钥可用于验证美国CA在工程CA证书上的数字签名。</p> - -<h4 id="Verifying_a_Certificate_Chain" name="Verifying_a_Certificate_Chain">Verifying a Certificate Chain</h4> - -<p>Certificate chain verification is the process of making sure a given certificate chain is well-formed, valid, properly signed, and trustworthy. Red Hat software uses the following procedure for forming and verifying a certificate chain, starting with the certificate being presented for authentication:</p> - -<ol> - <li>The certificate validity period is checked against the current time provided by the verifier's system clock.</li> - <li>The issuer's certificate is located. The source can be either the verifier's local certificate database (on that client or server) or the certificate chain provided by the subject (for example, over an SSL connection).</li> - <li>The certificate signature is verified using the public key in the issuer's certificate.</li> - <li>If the issuer's certificate is trusted by the verifier in the verifier's certificate database, verification stops successfully here. Otherwise, the issuer's certificate is checked to make sure it contains the appropriate subordinate CA indication in the Red Hat certificate type extension, and chain verification returns to step 1 to start again, but with this new certificate. Figure 8 presents an example of this process.</li> -</ol> - -<p><img alt="Figure 8. Verifying a Certificate Chain All the Way to the Root CA" class="internal" src="https://mdn.mozillademos.org/files/10313/16chver.png" style="height: 412px; width: 460px;"></p> - -<p>Figure 8 shows what happens when only Root CA is included in the verifier's local database. If a certificate for one of the intermediate CAs shown in Figure 8, such as Engineering CA, is found in the verifier's local database, verification stops with that certificate, as shown in Figure 9.</p> - -<p><img alt="Figure 9. Verifying a Certificate Chain to an Intermediate CA" class="internal" src="https://mdn.mozillademos.org/files/10315/19chver.png" style="height: 233px; width: 446px;"></p> - -<p>Expired validity dates, an invalid signature, or the absence of a certificate for the issuing CA at any point in the certificate chain causes authentication to fail. For example, Figure 10 shows how verification fails if neither the Root CA certificate nor any of the intermediate CA certificates are included in the verifier's local database.</p> - -<p><img alt="Figure 10. A Certificate Chain That Can't Be Verified" class="internal" src="https://mdn.mozillademos.org/files/10317/20chver.png" style="height: 406px; width: 456px;"></p> - -<p>For general information about the way digital signatures work, see "<a href="#Digital_Signatures">Digital Signatures</a>". For a more detailed description of the signature verification process in the context of SSL client and server authentication, see "<a href="/en-US/docs/Archive/Security/Introduction_to_SSL" title="en/Introduction_to_SSL">Introduction to SSL</a>."</p> - -<h2 id="Managing_Certificates" name="Managing_Certificates">Managing Certificates</h2> - -<p>从加密电子邮件到访问网站，许多应用程序都使用证书。 证书的生命周期分为两个主要阶段：颁发证书的时间点（颁发和注册）和证书不再有效的时间段（续订或吊销）。 还有一些方法可以在证书的生命周期中对其进行管理。 使有关证书的信息可用于其他应用程序是发布证书，然后备份密钥对，以便在证书丢失时可以恢复。</p> - -<ul> - <li><a href="#Issuing_Certificates">颁发证书</a></li> - <li><a href="#Certificates_and_the_LDAP_Directory">证书和LDAP目录</a></li> - <li><a href="#Key_Management">密钥管理</a></li> - <li><a href="#Renewing_and_Revoking_Certificates">更新和撤销证书</a></li> - <li><a href="#Registration_Authorities">Registration Authorities</a></li> -</ul> - -<h3 id="Issuing_Certificates" name="Issuing_Certificates">颁发证书</h3> - -<p>颁发证书的过程取决于颁发证书的证书颁发机构及其使用目的。 签发非数字身份证明的程序也有类似的变化。 例如，如果你想从加州机动车辆管理局（Department of Motor Vehicles in California）拿到一张普通身份证（而不是驾照），要求很简单：你需要出示一些身份证明，比如一张写有你地址的公用事业账单和一张学生身份证。 如果你想获得一张正规的驾驶执照，你还需要参加一次考试——第一次拿到驾照时要参加一次驾驶考试，续签驾照时要参加一次笔试。 如果你想得到一个18轮的商业许可证，要求要严格得多。 如果您居住在其他州或国家，对各种许可证的要求将有所不同。</p> - -<p>同样，不同的ca对于颁发不同类型的证书有不同的过程。 在某些情况下，唯一的要求可能是你的电子邮件地址。在其他情况下，您的UNIX或Windows登录名和密码可能就足够了。 在比额表的另一端，对于证明可以批准大额支出或作出其他敏感决定的人的证书，签发过程可能需要公证文件、背景调查和个人面谈。</p> - -<p>根据组织的策略，颁发证书的过程可以从对用户完全透明到需要大量用户参与和复杂的过程不等。 一般来说，颁发证书的过程应该高度灵活，因此组织可以根据其不断变化的需要对其进行调整。</p> - -<p>颁发证书是可以由单独的注册机构处理的几种管理任务之一。</p> - -<h3 id="Certificates_and_the_LDAP_Directory" name="Certificates_and_the_LDAP_Directory">证书和LDAP目录</h3> - -<p>The Lightweight Directory Access Protocol (LDAP) for accessing directory services supports great flexibility in the management of certificates within an organization. System administrators can store much of the information required to manage certificates in an LDAP-compliant directory. For example, a CA can use information in a directory to prepopulate a certificate with a new employee's legal name and other information. The CA can leverage directory information in other ways to issue certificates one at a time or in bulk, using a range of different identification techniques depending on the security policies of a given organization. Other routine management tasks, such as key management and renewing and revoking certificates, can be partially or fully automated with the aid of the directory.</p> - -<p>Information stored in the directory can also be used with certificates to control access to various network resources by different users or groups. Issuing certificates and other certificate management tasks can thus be an integral part of user and group management.</p> - -<p>In general, high-performance directory services are an essential ingredient of any enterprise certificate management strategy.</p> - -<h3 id="Key_Management" name="Key_Management">密钥管理</h3> - -<p>在颁发证书之前，必须生成证书中包含的公钥和相应的私钥。 有时，为一个人颁发一个证书和密钥对（用于签名操作）和另一个证书和密钥对（用于加密操作）可能是有用的。单独的签名和加密证书使得只在本地计算机上保留私有签名密钥成为可能，从而提供最大的不可否认性，并在某个中心位置备份私有加密密钥，在用户丢失原始密钥或离开公司时可以在该位置检索该密钥。</p> - -<p>密钥可以由客户端软件生成，也可以由CA集中生成，并通过LDAP目录分发给用户。 在本地密钥生成和集中密钥生成之间进行选择时需要权衡。例如，本地密钥生成提供了最大的不可否认性，但可能需要用户更多地参与发布过程。灵活的密钥管理能力对于大多数组织来说是必不可少的。</p> - -<p>密钥恢复，或者在精心定义的条件下检索加密密钥备份的能力，可能是证书管理的关键部分（取决于组织如何使用证书）。Key recovery schemes usually involve an <em>m of n</em> mechanism: for example, <em>m</em> of <em>n</em> managers within an organization might have to agree, and each contribute a special code or key of their own, before a particular person's encryption key can be recovered. 这种机制确保在恢复加密密钥之前，必须有几个授权人员同意。</p> - -<h3 id="Renewing_and_Revoking_Certificates" name="Renewing_and_Revoking_Certificates">Renewing and Revoking Certificates</h3> - -<p>Like a driver's license, a certificate specifies a period of time during which it is valid. Attempts to use a certificate for authentication before or after its validity period will fail. Therefore, mechanisms for managing certificate renewal are essential for any certificate management strategy. For example, an administrator may wish to be notified automatically when a certificate is about to expire, so that an appropriate renewal process can be completed in plenty of time without causing the certificate's subject any inconvenience. The renewal process may involve reusing the same public-private key pair or issuing a new one.</p> - -<p>A driver's license can be suspended even if it has not expired-for example, as punishment for a serious driving offense. Similarly, it's sometimes necessary to revoke a certificate before it has expired-for example, if an employee leaves a company or moves to a new job within the company.</p> - -<p>Certificate revocation can be handled in several different ways. For some organizations, it may be sufficient to set up servers so that the authentication process includes checking the directory for the presence of the certificate being presented. When an administrator revokes a certificate, the certificate can be automatically removed from the directory, and subsequent authentication attempts with that certificate will fail even though the certificate remains valid in every other respect. Another approach involves publishing a certificate revocation list (CRL)-that is, a list of revoked certificates-to the directory at regular intervals and checking the list as part of the authentication process. For some organizations, it may be preferable to check directly with the issuing CA each time a certificate is presented for authentication. This procedure is sometimes called real-time status checking.</p> - -<h3 id="Registration_Authorities" name="Registration_Authorities">Registration Authorities</h3> - -<p>由证书标识的实体（有时称为最终实体）和ca之间的交互是证书管理的一个重要部分。 这些交互包括证书注册、证书检索、证书续订、证书吊销以及密钥备份和恢复等操作。一般来说，CA必须能够在响应请求之前验证最终实体的身份。 此外，有些请求需要经过授权的管理员或经理的批准才能提供服务。</p> - -<p>如前所述，不同的ca在颁发证书之前用于验证身份的方法可能有很大的不同，这取决于证书的使用组织和目的。 为了提供最大的操作灵活性，与终端实体的交互可以与CA的其他功能分离，并由一个称为注册机构（RA）的单独服务处理。</p> - -<p>An RA acts as a front end to a CA by receiving end entity requests, authenticating them, and forwarding them to the CA. After receiving a response from the CA, the RA notifies the end entity of the results. RAs can be helpful in scaling an PKI across different departments, geographical areas, or other operational units with varying policies and authentication requirements.</p> - -<div class="originaldocinfo"> -<h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3> - -<ul> - <li>Author(s): Ella Deon Lackey</li> - <li>Last Updated Date: 2012</li> - <li>Copyright Information: © 2012 Red Hat, Inc.</li> - <li>Link: <a href="https://access.redhat.com/documentation/en-US/Red_Hat_Certificate_System_Common_Criteria_Certification/8.1/html/Deploy_and_Install_Guide/index.html">Red Hat Certificate System Common Criteria Certification 8.1: Deployment, Planning, and Installation</a></li> -</ul> -</div> diff --git a/files/zh-cn/archive/web/e4x/index.html b/files/zh-cn/archive/web/e4x/index.html deleted file mode 100644 index af364a3208..0000000000 --- a/files/zh-cn/archive/web/e4x/index.html +++ /dev/null @@ -1,49 +0,0 @@ ---- -title: E4X -slug: Archive/Web/E4X -translation_of: Archive/Web/E4X ---- -<div> - <div class="overheadIndicator obsolete obsoleteHeader"><p><strong><span title="This is an obsolete API and is no longer guaranteed to work."><i class="icon-trash"> </i></span> 已废弃</strong><br>This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.</p></div></div> -<div> - </div> -<div> - <div class="warning warningHeader"> - <p><strong>Warning:</strong> E4X已经过时.从Firefox 17开始,E4X在普通网页中被默认禁用,从Firefox 20开始,E4X在浏览器界面中被默认禁用,从Firefox 21开始,E4X被完全删除.使用DOMParser/DOMSerializer或者其他算法来代替.</p> -</div></div> -<p><strong>ECMAScript for XML</strong> (<strong>E4X</strong>) is a programming language extension that adds native XML support to <a href="/zh-CN/JavaScript" title="zh-CN/JavaScript">JavaScript</a>. It does this by providing access to the XML document in a form that feels natural for ECMAScript programmers. The goal is to provide an alternative, simpler syntax for accessing XML documents than via <a href="/zh-CN/DOM" title="zh-CN/DOM">DOM</a> interfaces. A valid alternative to E4X is a non-native <a href="/zh-CN/JXON" title="zh-CN/JXON">JXON algorithm</a>.</p> -<p>E4X is standardized by Ecma International in <a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-357.htm">ECMA-357 standard</a> (currently in its second edition, December 2005).</p> -<p>E4X is implemented (at least partially) in <a href="/zh-CN/SpiderMonkey" title="zh-CN/SpiderMonkey">SpiderMonkey</a> (<a href="/zh-CN/Gecko" title="zh-CN/Gecko">Gecko</a>'s JavaScript engine) and in <a href="/zh-CN/Rhino" title="zh-CN/Rhino">Rhino</a> (JavaScript engine written in Java).</p> -<p> </p> -<div class="note"> - <strong>Note:</strong> In Gecko 1.8 based browsers such as Firefox 1.5, E4X is already partially enabled for web page authors. To fully enable E4X, the <code><script></code> element needs to have the MIME type "text/javascript;e4x=1" (i.e. have an attribute of the form <code>type="text/javascript;e4x=1"</code>). The difference between the two modes is that without the "e4x=1" MIME type, any statement-level XML/HTML comment literals (<code><span class="nowiki"><!--...--></span></code>) are ignored for backwards compatibility with the comment hiding trick, and CDATA sections (<code><![CDATA[...]]></code>) are not parsed as CDATA literals (which leads to a JS syntax error in HTML since HTML's <code><script></code> element produces an implicit CDATA section, and therefore cannot contain explicit CDATA sections). - <p><span class="comment">someone verify the above</span></p> -</div> -<h3 id="Known_bugs_and_limitations" name="Known_bugs_and_limitations">已经的bug和限制</h3> -<ul> - <li>It is not currently possible to access a DOM object through E4X (<a href="https://bugzilla.mozilla.org/show_bug.cgi?id=270553" title="E4x<->DOM">bug 270553</a>)</li> - <li>E4X doesn't support parsing XML declaration (</li> - <li><?xml version=...?>) (see <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=336551" title='E4X: Implement ability to process new XML("&amp;lt;?xml...?> ...")'>bug 336551</a>). You may get SyntaxError "xml is a reserved identifier" (despite the XML being in a string).</li> -</ul> -<p>Workaround:</p> -<pre class="brush: js">var response = xmlhttprequest.responseText; // bug 270553 -response = response.replace(/^<\?xml\s+version\s*=\s*(["'])[^\1]+\1[^?]*\?>/, ""); // bug 336551 -var e4x = new XML(response); -</pre> -<h3 id="Resources" name="Resources">资源</h3> -<ul> - <li><a href="/zh-CN/E4X_Tutorial" title="zh-CN/E4X_Tutorial">E4X Tutorial</a> <a class="internal" href="/zh-CN/E4X/Processing_XML_with_E4X" title="zh-CN/E4X/Processing XML with E4X">Processing XML with E4X</a> on MDN.</li> - <li><a href="/zh-CN/E4X_for_templating" title="zh-CN/E4X for templating">E4X for templating</a></li> - <li>See the list of<a href="/Special:Tags?tag=E4X&language=en" title="Special:Tags?tag=E4X&language=en"> E4X-related pages</a> on MDN:</li> - <li><a class="external" href="http://www.ecma-international.org/publications/standards/Ecma-357.htm">ECMA-357 standard</a></li> - <li><a class="external" href="/presentations/xtech2005/e4x" title="presentations/xtech2005/e4x">Brendan's presentation</a></li> - <li><a class="external" href="http://web.archive.org/web/20080703182907/http://www.faqts.com/knowledge_base/index.phtml/fid/1762" title="http://web.archive.org/web/20080703182907/http://www.faqts.com/knowledge_base/index.phtml/fid/1762">E4X at faqts.com</a></li> - <li><a class="external" href="http://rephrase.net/days/07/06/e4x">E4X quick reference at rephrase.net</a></li> -</ul> -<h2 id="相关链接">相关链接</h2> -<ul> - <li><a class="internal" href="/zh-CN/JXON" title="zh-CN/JXON">JXON</a></li> - <li><a class="internal" href="/zh-CN/XPath" title="zh-CN/XPath">XPath</a></li> - <li><a class="internal" href="/zh-CN/XML" title="zh-CN/XML">XML</a></li> - <li><a class="internal" href="/zh-CN/Parsing_and_serializing_XML" title="zh-CN/Parsing_and_serializing_XML">XML的解析和序列化</a></li> -</ul> diff --git a/files/zh-cn/archive/web/e4x_tutorial/accessing_xml_children/index.html b/files/zh-cn/archive/web/e4x_tutorial/accessing_xml_children/index.html deleted file mode 100644 index 16b4cf8139..0000000000 --- a/files/zh-cn/archive/web/e4x_tutorial/accessing_xml_children/index.html +++ /dev/null @@ -1,111 +0,0 @@ ---- -title: Accessing XML children -slug: Archive/Web/E4X_tutorial/Accessing_XML_children -translation_of: Archive/Web/E4X_tutorial/Accessing_XML_children ---- -<h2 id="访问_XML_子节点">访问 XML 子节点</h2> -<p>JavaScript 对象通常使用 . 或 [] 来设置性质。</p> -<pre class="brush: js">var a = {}; -a.foo = 1; -a["bar"] = 2;</pre> -<p>在 E4X 中，点（.）和中括号（[]）操作符用来访问 E4X 元素的子节点。</p> -<pre class="brush: js">var element1 = <foo> - <bar/> - </foo>; -var element2 = <baz/>; -element1.bar.appendChild(element2); -element1["bar"].appendChild(<quux/>);</pre> -<p>往 element1 中的 bar 节点添加子节点，生成如下 XML 文档：</p> -<p><code><foo><br> - <bar><br> - <baz/><br> - <quux/><br> - </bar><br> - </foo></code></p> -<p>但是要注意，给一个不存在的子元素赋值会创建这个元素。</p> -<pre class="brush: js">var element1 = <foo/> -element1.bar = 1;</pre> -<p>生成</p> -<p><code><foo><br> - <bar>1</bar><br> - </foo></code></p> -<p>如果子节点已经存在，点（.）操作符允许你更改它的值。</p> -<pre class="brush: js">var elem = <foo> - <bar>1</bar> - </foo> -elem.bar = 2;</pre> -<p>会将原来的值 1 改成 2。</p> -<p>你可以用 delete 命令删除一个子节点。</p> -<pre class="brush: js">var elem = <foo> - <bar/> - <baz/> - </foo> -delete elem.bar;</pre> -<p>只剩下</p> -<p><code><foo><br> - <baz/><br> - </foo></code></p> -<p>点（.）操作符还能用于替换特定的子节点。</p> -<pre class="brush: js">var elem1 = <foo> - <bar/> - </foo>; -var elem2 = <red> - <blue/> - </red>; -elem1.bar = elem2;</pre> -<p>用 elem2 的全部内容替换 <bar/> 元素。</p> -<p><code><foo><br> - <red><br> - <blue/><br> - </red><br> - <foo></code></p> -<h2 id="XML_列表">XML 列表</h2> -<p>许多时候，一个元素会有两个或多个相同类型的子节点。在这种情况下，访问 foo.bar 将返回一个XML 列表对象，包含所有类型为“bar”的子节点。注意：在使用 . 操作符时，判断它是返回单个元素还是一个 XML 列表，这是你的责任。在返回这些性质时，E4X 的行为并没有区别。</p> -<p>XML 列表的行为就像是一个数组。</p> -<pre class="brush: js">var element = <foo> - <bar baz="1">red</bar> - <bar baz="2">blue</bar> - </foo>; -var list = element.bar; -list.length(); // returns 2 -list[0]; // the first bar element -list[1]; // the second bar element -</pre> -<p>需要注意，这个列表时可修改的，在它上面做的修改都会反映到原始的 XML 文档中。</p> -<pre class="brush: js">list[1] = "green";</pre> -<p>XML 文档被修改为：</p> -<p><code><foo><br> - <bar baz="1">red</bar><br> - <bar baz="2">green</bar><br> - </foo></code></p> -<h2 id="特殊类型的节点">特殊类型的节点</h2> -<p>XML 对象有一些方法可以访问 XML 列表中的通用类型节点。</p> -<pre class="brush: js">var a = <foo> Some text <bar>not text</bar> More text </foo>; -var list = a.text(); -list.length(); // returns 2 -list[0]; // returns " Some text " -list[1]; // returns " More text "</pre> -<p>你同样可以访问注释节点：</p> -<pre class="brush: js">XML.ignoreComments = false; -var a = <foo> Some <!-- abc --> text </foo>; -var comments = a.comments(); -alert(comments[0]); // Returns <!-- abc --></pre> -<p>星号（*）选择器将返回 XML 列表的所有子节点。</p> -<pre class="brush: js">var a = <foo> - <bar/> - <baz/> - </foo>; -var list = a.*; -list.length(); // returns 2 -</pre> -<p>元素属性</p> -<p>很多 XML 元素都有赋有特定值的属性。例如：</p> -<p><code><pets><br> - <dog color="brown">Fido</dog><br> - <cat color="grey">Fluffy</cat><br> - </pets></code></p> -<p>E4X 运行你用 .@ 操作符来反问这些特定元素的属性。最基本的情况如下例所示：</p> -<pre class="brush: js"> var element = <foo bar="1"/> - element.@bar = 2;</pre> -<p>它将生成：</p> -<p><code><foo bar="2"/></code></p> diff --git a/files/zh-cn/archive/web/e4x_tutorial/descendants_and_filters/index.html b/files/zh-cn/archive/web/e4x_tutorial/descendants_and_filters/index.html deleted file mode 100644 index fbf89a871f..0000000000 --- a/files/zh-cn/archive/web/e4x_tutorial/descendants_and_filters/index.html +++ /dev/null @@ -1,27 +0,0 @@ ---- -title: Descendants and Filters -slug: Archive/Web/E4X_tutorial/Descendants_and_Filters -translation_of: Archive/Web/E4X_tutorial/Descendants_and_Filters ---- -<h2 id="访问后代节点">访问后代节点</h2> -<p>很多时候，你感兴趣的节点往往不是 XML 根节点的子节点，而是嵌套在多层下的后代节点。你可以使用 .. 操作符访问任意深度的节点，或者使用 descendants 性质。例如：</p> -<pre class="brush: js">var element = <pets> - <dogs> - <fido color="red"/> - <spike color="blue"/> - </dogs> - </pets>; -element..fido.@color = "green"; -element..spike.@color = "purple"; -</pre> -<p>两只宠物狗的颜色都做了改变。</p> -<p>点（.）操作符的所有规则都适用于 .. 操作符。那就是说，如果有多个请求的类型，就会返回一个 XML 后代的列表。星号（*）选择器会返回 XML 列表的所有后代。</p> -<h2 id="过滤器">过滤器</h2> -<p>在很多情况下，尤其是用 * 选择器时，你并不想要处理 . 或 .. 操作符返回的所有节点。为了只处理其中特定的子集，可以将筛选条件放到 . 操作符后面的圆括号里。</p> -<pre class="brush: js">var element = <dogs> - <fido color="brown"/> - <spike color="black"/> - <killer color="brown"/> - </dogs>; -var list = element.*.(@color == "brown");</pre> -<p>本来，element.* 返回一个包含三只狗的列表。但其中只有 fido 和 killer 的颜色是褐色的。因此，该过来条件创建了一个只包含 fido 和 killer 的列表。</p> diff --git a/files/zh-cn/archive/web/e4x_tutorial/index.html b/files/zh-cn/archive/web/e4x_tutorial/index.html deleted file mode 100644 index 4dac9ce0e8..0000000000 --- a/files/zh-cn/archive/web/e4x_tutorial/index.html +++ /dev/null @@ -1,39 +0,0 @@ ---- -title: E4X教程 -slug: Archive/Web/E4X_tutorial -translation_of: Archive/Web/E4X_tutorial ---- -<p></p><div class="prevnext" style="text-align: right;"> - <p><a href="/zh-CN/docs/cn/E4X_Tutorial/Introduction">下一页 »</a></p> -</div><p></p> - -<div class="warning"> -<p>警告：E4X已废弃。 默认情况下，Firefox 16中的内容将禁用它，Firefox 17中的Chrome默认禁用，Firefox 18中将其删除。请使用DOMParser / DOMSerializer或非本机JXON算法。</p> -</div> - -<h2 id="Overview" name="Overview">概述</h2> - -<p>本教程带你走入<strong>E4X (EcmaScript for XML)基本语法</strong>. 通过使用E4X，程序员可以通过一个类似JavaScript编程的语法来操作XML文档。</p> - -<h2 id="Subjects" name="Subjects">科目</h2> - -<ul> - <li><a href="/cn/E4X_Tutorial/Introduction" title="cn/E4X Tutorial/Introduction">简介</a></li> - <li><a href="/cn/E4X_Tutorial/Accessing_XML_children" title="cn/E4X_Tutorial/Accessing_XML_children">访问XML子节点</a></li> - <li><a href="/cn/E4X_Tutorial/Descendants_and_Filters" title="cn/E4X_Tutorial/Descendants_and_Filters">子孙和过滤器</a></li> - <li><a href="/cn/E4X_Tutorial/Namespaces" title="cn/E4X Tutorial/Namespaces">命名空间</a></li> - <li><a href="/cn/E4X_Tutorial/The_global_XML_object" title="cn/E4X_Tutorial/The_global_XML_object">全局XML对象</a></li> -</ul> - -<h2 id="See_also" name="See_also">另请参阅</h2> - -<ul> - <li><a href="/cn/E4X" title="cn/E4X">E4X</a></li> - <li><a href="/cn/E4X/Processing_XML_with_E4X" title="cn/E4X/Processing_XML_with_E4X">使用E4X处理XML</a></li> -</ul> - -<p></p><div class="prevnext" style="text-align: right;"> - <p><a href="/zh-CN/docs/E4X_Tutorial:Introduction">下一页 »</a></p> -</div><p></p> - -<p></p> diff --git a/files/zh-cn/archive/web/e4x_tutorial/introduction/index.html b/files/zh-cn/archive/web/e4x_tutorial/introduction/index.html deleted file mode 100644 index 2c0a2f7a76..0000000000 --- a/files/zh-cn/archive/web/e4x_tutorial/introduction/index.html +++ /dev/null @@ -1,64 +0,0 @@ ---- -title: Introduction -slug: Archive/Web/E4X_tutorial/Introduction -tags: - - E4X - - JavaScript - - Tutorial -translation_of: Archive/Web/E4X_tutorial/Introduction ---- -<h2 id="基本语法">基本语法</h2> -<p>如果启用了 E4X，基本的 XML 元素就是有效的语法。例如：</p> -<pre class="brush: js">var element = <foo/> - </pre> -<p>在开启了 E4X 的浏览器里完全有效。</p> -<p>变量的声明也不局限于单个元素，并且和 JavaScript 一样可以扩多行。</p> -<pre class="brush: js">var element2 = <foo> - <bar/> - </foo> -</pre> -<p>此外，和一般的 XML 文档一样，你能给一个元素指定属性。</p> -<pre class="brush: js">var element3 = <foo baz="1"/> - </pre> -<p>操作元素</p> -<p>E4X 的目标是为 JavaScript 程序员提供一个简单的方法来操作 XML 文档，而无需通过 DOM 接口。不过，很多你在 DOM 中用过的函数也能用到 E4X 中。最基本的就是 appendChild：</p> -<pre class="brush: js">var element1 = <foo/> -var element2 = <bar/> -element1.appendChild(element2); -</pre> -<p>它会产生你期望的正确的 XML 文档：</p> -<p><code><foo><br> - <bar/><br> - </foo> </code></p> -<p><code>JavaScript 变量</code></p> -<p><code>当 XML 文档需要和 JavaScript 做紧密交互时，E4X 真正强大的地方才得以彰显。通过特定的语法，我们能将 JavaScript 变量的值赋给 E4X 元素。这是用大括号（{}）标记。</code></p> -<pre class="brush: js"><code>var a = 2; -var b = <foo>{a}</foo>; -</code></pre> -<p><code>创建了一段 XML 文档，内容为 <foo>2</foo>。</code></p> -<p><code>你也可以将大括号标记用于元素的属性（名字或值）。例如：</code></p> -<pre class="brush: js"><code>var a = 2; -var b = 'bar'; -var c = <foo {b}={a}>"hi"</foo>;</code></pre> -<p><code>创建的 XML 稍有不同：<foo bar="2">"hi"</foo>。</code></p> -<p><code>注意：XML 元素只接受文本作为他们的值。大括号标记真正发生的是调用变量的 toString 方法，并将返回值填到相应位置。例如：</code></p> -<pre class="brush: js"><code>var a = {foo: 1}; -var b = <bar>{a}</bar></code></pre> -<p><code>实际上产生的文档是 <bar>[object Object]</bar>。</code></p> -<h2 id="在内容中使用内联函数"><code>在内容中使用内联函数</code></h2> -<p><code>虽然大括号限定执行单条语句，但通过匿名函数内联可以执行一些额外的处理：</code></p> -<pre class="brush: js"><code>var a = 'foo'; -var b = <bar>{function () {var c = a.toUpperCase(); var d = 5 * 5; return c + d;}()}</bar></code></pre> -<p><code>上述代码产生：<bar>FOO25</bar></code></p> -<p><code>该用法更多的讨论请参加 <a href="/en/E4X_for_templating#Inline_functions" title="en/E4X_for_templating#Inline_functions">E4X for templating</a> 。</code></p> -<h2 id="序列化"><code>序列化</code></h2> -<p><code>E4X 最强大的工具就是简单地调用 .toXMLString() 就可以将整个 XML 文档（或其中部分）序列化到字符串中。</code></p> -<pre class="brush: js"><code>var element1 = <foo/>; -var element2 = <bar/>; -element1.apppendChild(element2); -element1.toXMLString();</code></pre> -<p><code>输出为：</code></p> -<p><code><code><foo><br> - <bar/><br> - </foo></code></code></p> -<p><code>本例使用 toString() 也能达到相同效果，不过在一个只有文本内容的元素上调用 toString() 将之产生文本内容（例如，<foo>abc</foo>.toString(); 会只产生 'abc'）。</code></p> diff --git a/files/zh-cn/archive/web/e4x_tutorial/namespaces/index.html b/files/zh-cn/archive/web/e4x_tutorial/namespaces/index.html deleted file mode 100644 index 8a2fc96063..0000000000 --- a/files/zh-cn/archive/web/e4x_tutorial/namespaces/index.html +++ /dev/null @@ -1,33 +0,0 @@ ---- -title: Namespaces -slug: Archive/Web/E4X_tutorial/Namespaces -translation_of: Archive/Web/E4X_tutorial/Namespaces ---- -<h2 id="E4X_与_命令空间">E4X 与 命令空间</h2> -<p>通常情况下，XML 文档包含来自多种命令空间的元素。你可以通过声明为你的 E4X 对象设置默认的命名空间。</p> -<pre class="brush: js">default xml namespace = "http://www.w3.org/1999/xhtml"; -</pre> -<p>通过重复的声明，你可以随时更改相同范围内 E4X 的命名空间。</p> -<pre class="brush: js">default xml namespace = "http://www.w3.org/1999/xhtml"; -var a = <p>Some text</p>; -default xml namespace = "http://www.mozilla.org/keymaster/gat...re.is.only.xul"; -var b = <label>More text</label>; -a.appendChild(b); -</pre> -<p>得出</p> -<p><code><p xmlns="<a class="external" href="http://www.w3.org/1999/xhtml" rel="freelink">http://www.w3.org/1999/xhtml</a>"><br> - Some text<br> - <label xmlns="<a class="external" href="http://www.mozilla.org/keymaster/gat...re.is.only.xul" rel="freelink">http://www.mozilla.org/keymaster/gat...re.is.only.xul</a>">More text</label><br> - </p> </code></p> -<h2 id="name()">name()</h2> -<p>在 XML 对象上调用 name() 会返回一个 QName 对象（Qualified Name）。QName 在支持 E4X 的 JavaScript 实现中是一个全局的构造函数。QName 对象有两个特别重要的属性：localName 返回元素的名字，且没有任何命名空间前缀；uri 返回元素所在的命名空间。</p> -<pre class="brush: js">var info = a.name(); -info.localName; // returns 'p'. -info.uri; // returns "http://www.w3.org/1999/xhtml"</pre> -<p>没有在任何命令空间的元素，他们的 uri 是一个空字符串。</p> -<p>Namespace 全局构造函数和 QName 非常相似。Namespace 的不同之处是 toString 方法，以及 Namespace 用 prefix 属性来代替 localName 属性<sup>[1]</sup> 。</p> -<p>关于 E4X 的命名空间，更多的内容请参见 <a href="/cn/E4X/Processing_XML_with_E4X#Handling_namespaces" title="cn/E4X/Processing_XML_with_E4X#Handling_namespaces">Processing XML with E4X</a> 。</p> -<h2 id="译者注">译者注</h2> -<ol> - <li>原文中没有详细讲，获得 Namespace 对象的方法是调用 .namespace()。其中 QName 的 toString 方法会输出 Namespace::name 的形式，而 Namespace 的 toString 只会输出命名空间。</li> -</ol> diff --git a/files/zh-cn/archive/web/e4x_tutorial/the_global_xml_object/index.html b/files/zh-cn/archive/web/e4x_tutorial/the_global_xml_object/index.html deleted file mode 100644 index 910b422ada..0000000000 --- a/files/zh-cn/archive/web/e4x_tutorial/the_global_xml_object/index.html +++ /dev/null @@ -1,55 +0,0 @@ ---- -title: The global XML object -slug: Archive/Web/E4X_tutorial/The_global_XML_object -translation_of: Archive/Web/E4X_tutorial/The_global_XML_object ---- -<h2 id="全局_XML_对象">全局 XML 对象</h2> -<p>E4X-capable JavaScript 引擎在全局对象上放了一个新的属性。XML 对象有许多属性允许你定制解析和序列化 E4X。XML 元素从他们创建开始就记住 XML 对象的设置。</p> -<h2 id="扩展_XML.prototype">扩展 XML.prototype</h2> -<p>XML.prototype 和 XMLList.prototype（XMLList.prototype 实际上就是 XML.prototype）不能像其他构造器（例如 Object）一样扩展。你只能在 XML.prototype 里定义方法，而不能定义字段。要向 XML.prototype 添加一个方法，则要定义 XML.prototype.function::methodName 或 XML.prototype.funciton::[methodNameString]。下例定义 fooCount() 方法，返回 XML 中 <foo> 元素的个数：</p> -<p> </p> -<pre class="brush: js">XML.prototype.function::fooCount = function fooCount() { - return this..foo.length(); -}; -<foobar><foo/><foo/><foo/></foobar>.fooCount() // returns 3</pre> -<p> </p> -<h2 id="ignoreComments">ignoreComments</h2> -<p>默认为 true。该属性告诉 E4X 在序列化和筛选时忽略注释节点。即当 ignoreComments 为 ture 时 .comments() 返回空。观察如下例子：</p> -<p> </p> -<pre class="brush: js">var element = <foo> - <!-- my comment --> - <bar/> - </foo>; -element.comments().length(); // returns 0 -element.toXMLString(); // returns <foo><bar/></foo> -XML.ignoreComments = false; -element = <foo> - <!-- my comment --> - <bar/> - </foo>; -element.comments().length(); // returns 1 -element.toXMLString(); // returns <foo><!-- my comment --><bar/></foo></pre> -<p> </p> -<h2 id="ignoreProcessingInstructions">ignoreProcessingInstructions</h2> -<p>默认为 ture。该属性告诉 E4X 在序列化和筛选时忽略 XML 中的处理指令。例如：</p> -<p> </p> -<pre class="brush: js">var element = <foo> - <?process x="true"?> - <bar/> - <?process x="false"?> - </foo>; -element.toXMLString(); // returns <foo><bar/></foo> -XML.ignoreProcessingInstructions = false; -var element = <foo> - <?process x="true"?> - <bar/> - <?process x="false"?> - </foo>; -element.toXMLString(); // returns <foo><?process x="true"?><bar/><?process x="false"?></foo></pre> -<p> </p> -<h2 id="ignoreWhitespace">ignoreWhitespace</h2> -<p>默认为 true。忽略节点之间以及节点文本头尾两端的空白，而其他的则被解析为文本节点或作为文本节点的一部分。</p> -<h2 id="prettyPrinting">prettyPrinting</h2> -<p>默认是 true。为 true 时，toXMLString() 序列化 E4X 对象时会包含换行和缩进。</p> -<h2 id="prettyIndent">prettyIndent</h2> -<p>默认值是 2。代表 XML 树每层缩进的空格数。如果 prettyPrinting 是 false 则忽略。</p> diff --git a/files/zh-cn/archive/web/index.html b/files/zh-cn/archive/web/index.html deleted file mode 100644 index a6edb0c862..0000000000 --- a/files/zh-cn/archive/web/index.html +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: Archived open Web documentation -slug: Archive/Web -tags: - - Archived - - NeedsTranslation - - TopicStub - - Web -translation_of: Archive/Web ---- -<p>The documentation listed below is archived, obsolete material about open Web topics.</p> -<p></p><dl><dt class="landingPageList"><a href="/zh-CN/docs/E4X-840092-dup">E4X</a></dt><dd class="landingPageList"><strong>ECMAScript for XML</strong> (<strong>E4X</strong>) is a programming language extension that adds native XML support to <a href="/zh-CN/JavaScript" title="zh-CN/JavaScript">JavaScript</a>. It does this by providing access to the XML document in a form that feels natural for ECMAScript programmers. The goal is to provide an alternative, simpler syntax for accessing XML documents than via <a href="/zh-CN/DOM" title="zh-CN/DOM">DOM</a> interfaces. A valid alternative to E4X is a non-native <a href="/zh-CN/JXON" title="zh-CN/JXON">JXON algorithm</a>.</dd><dt class="landingPageList"><a href="/zh-CN/docs/Archive/Web/E4X_tutorial">E4X教程</a></dt><dd class="landingPageList">本教程带你走入<strong>E4X (EcmaScript for XML)基本语法</strong>. 通过使用E4X，程序员可以通过一个类似JavaScript编程的语法来操作XML文档。</dd><dt class="landingPageList"><a href="/zh-CN/docs/Archive/Web/LiveConnect">LiveConnect概述</a></dt><dd class="landingPageList">这一章描述了使用 <a href="/zh-CN/docs/LiveConnect" title="zh-CN/docs/LiveConnect">LiveConnect </a>技术来使JavaScript和Java能够互相通信。本章假设你熟悉Java编程。</dd></dl><p></p> diff --git a/files/zh-cn/archive/web/indexeddb_api_using_javascript_generators_in_firefox/index.html b/files/zh-cn/archive/web/indexeddb_api_using_javascript_generators_in_firefox/index.html deleted file mode 100644 index 33fb51b750..0000000000 --- a/files/zh-cn/archive/web/indexeddb_api_using_javascript_generators_in_firefox/index.html +++ /dev/null @@ -1,60 +0,0 @@ ---- -title: 在 Firefox 中使用 JavaScript Generators -slug: Archive/Web/IndexedDB_API_Using_JavaScript_Generators_in_Firefox -translation_of: Archive/Web/IndexedDB_API_Using_JavaScript_Generators_in_Firefox ---- -<div class="warning"><strong>警告：</strong> 此项技术仅对 Firefox 浏览器生效，而对 IE、 Chrome、 Safari 等浏览器无效。</div> - -<p>生成器（generators）可用于简化 Firefox 浏览器中的异步代码，需使用 JavaScript 1.7 或更高版本。 您可以按下列方式引入 HTML：</p> - -<pre class="brush: js"><script type="text/javascript;version=1.7" src="myScript.js"></script></pre> - -<p>一个 <code>myScript.js</code> 文件可能是像这样的：</p> - -<pre class="brush: js">// 需要将生成器（generator）存储在全局变量中。 -var generator; - -// 通过简单的事件侦听器将接收到的事件传递给生成器。 -function grabEvent(event) { - generator.send(event); -} - -// 关闭生成器，但必须在生成器外部进行，所以我们使用 setTimeout 函数 -function closeGenerator() { - setTimeout(function() { - generator.close(); - }, 0); -} - -// 主函数 -function databaseOperation() { - mozIndexedDB.open("MyTestDatabase").onsuccess = grabEvent; - var event = yield; - - var db = event.target.result; - - if (db.version != "1.0") { - db.setVersion("1.0").onsuccess = grabEvent; - event = yield; - - var transaction = event.transaction; - db.createObjectStore("stuff"); - - transaction.oncomplete = grabEvent; - yield; - } - - db.transaction(["stuff"]).objectStore("stuff").get("foo").onsuccess = grabEvent; - event = yield; - - alert("Got result: " + event.target.result); - - // 完成。 - closeGenerator(); - - // 始终在末尾额外使用一次 yield ，否则您将看到 StopIteration 异常。 - yield; -} - -generator = databaseOperation(); -generator.next();</pre> diff --git a/files/zh-cn/archive/web/javascript/handler.enumerate/index.html b/files/zh-cn/archive/web/javascript/handler.enumerate/index.html deleted file mode 100644 index 9a68adbf65..0000000000 --- a/files/zh-cn/archive/web/javascript/handler.enumerate/index.html +++ /dev/null @@ -1,114 +0,0 @@ ---- -title: handler.enumerate() -slug: Archive/Web/JavaScript/handler.enumerate -translation_of: Archive/Web/JavaScript/handler.enumerate ---- -<div>{{JSRef}} {{obsolete_header}}</div> - -<p>代理方法<strong><code>handler.enumerate()</code></strong>决定了被代理对象在{{jsxref("Statements/for...in", "for...in")}}中的行为。不过这个方法已经在ES2016标准中被移除了。</p> - -<h2 id="语法">语法</h2> - -<pre class="brush: js notranslate">var p = new Proxy(target, { - enumerate(target) { - } -}); -</pre> - -<h3 id="参数">参数</h3> - -<p>下列参数将会被用以调用 <code>enumerate</code> 方法。this将会指向处理器对象。</p> - -<dl> - <dt><code>target</code></dt> - <dd>被代理的目标对象。</dd> -</dl> - -<h3 id="Return_value">Return value</h3> - -<p>该方法应当返回一个<a href="/zh-CN/docs/Web/JavaScript/Guide/The_Iterator_protocol">迭代器</a>对象。</p> - -<h2 id="描述">描述</h2> - -<p><code><strong>handler.enumerate</strong></code> 方法决定了被代理对象在{{jsxref("Statements/for...in", "for...in")}}时的行为。</p> - -<h3 id="触发条件">触发条件</h3> - -<p>这些操作可以触发这个方法。</p> - -<ul> - <li>for...in: <code>for (var name in proxy) {...}</code></li> - <li>{{jsxref("Reflect.enumerate()")}}</li> -</ul> - -<h3 id="Invariants">Invariants</h3> - -<p>If the following invariants are violated, the proxy will throw a {{jsxref("TypeError")}}:</p> - -<ul> - <li>The <code>enumerate</code> method must return an object.</li> -</ul> - -<h2 id="Examples">Examples</h2> - -<p>The following code traps {{jsxref("Statements/for...in", "for...in")}} statements.</p> - -<pre class="brush: js notranslate">var p = new Proxy({}, { - enumerate(target) { - console.log('called'); - return ['a', 'b', 'c'][Symbol.iterator](); - } -}); - -for (var x in p) { // "called" - console.log(x); // "a" -} // "b" - // "c" -</pre> - -<p>The following code violates the invariant.</p> - -<pre class="brush: js notranslate">var p = new Proxy({}, { - enumerate(target) { - return 1; - } -}); - -for (var x in p) {} // TypeError is thrown -</pre> - -<p>Note: Both examples make use of the shorthand syntax for <a href="/en-US/docs/Web/JavaScript/Reference/Functions/Method_definitions">method definitions</a>.</p> - -<h2 id="Specifications">Specifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES2015', '#sec-proxy-object-internal-methods-and-internal-slots-enumerate', '[[Enumerate]]')}}</td> - <td>{{Spec2('ES2015')}}</td> - <td>Initial definition. Removed in ECMAScript 2016.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Browser compatibility</h2> - -<div> - - -<p>{{Compat("javascript.builtins.Proxy.handler.enumerate")}}</p> -</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li>{{jsxref("Proxy")}}</li> - <li>{{jsxref("Proxy.handler", "handler")}}</li> - <li>{{jsxref("Statements/for...in", "for...in")}} statements</li> - <li>{{jsxref("Reflect.enumerate()")}}</li> -</ul> diff --git a/files/zh-cn/archive/web/javascript/index.html b/files/zh-cn/archive/web/javascript/index.html deleted file mode 100644 index 4687b7bf23..0000000000 --- a/files/zh-cn/archive/web/javascript/index.html +++ /dev/null @@ -1,12 +0,0 @@ ---- -title: JavaScript -slug: Archive/Web/JavaScript -translation_of: Archive/Web/JavaScript ---- -<div class="hidden">{{JSRef}}</div> - -<p>{{Obsolete_Header}}</p> - -<p class="summary">Obsolete JavaScript features and unmaintained docs</p> - -<p>{{SubpagesWithSummaries}}</p> diff --git a/files/zh-cn/archive/web/javascript/legacy_generator_function/index.html b/files/zh-cn/archive/web/javascript/legacy_generator_function/index.html deleted file mode 100644 index d4d213cc98..0000000000 --- a/files/zh-cn/archive/web/javascript/legacy_generator_function/index.html +++ /dev/null @@ -1,54 +0,0 @@ ---- -title: 旧式生成器函数 -slug: Archive/Web/JavaScript/Legacy_generator_function -tags: - - 生成器函数 -translation_of: Archive/Web/JavaScript/Legacy_generator_function ---- -<div class="warning">.旧式生成器函数是一个SpiderMonkey专有特性，将在未来移除。从未来考虑，建议使用{{jsxref("Operators/function*", "function* 表达式")}}</div> - -<div>{{jsSidebar("Operators")}}</div> - -<p><strong><code>function</code></strong> 关键字可以用于在表达式中定义旧式的生成器函数。为使定义的函数为一个旧式的生成器函数，该函数的函数体中需要至少包含一个 {{jsxref("Operators/yield", "yield")}} 表达式。</p> - -<h2 id="语法">语法</h2> - -<pre class="syntaxbox">function [<em>name</em>]([<em>param1</em>[, <em>param2[</em>, ..., <em>paramN</em>]]]) { - <em>statements</em> -}</pre> - -<h3 id="参数">参数</h3> - -<dl> - <dt><code>name</code></dt> - <dd>函数名。 该参数可以被省略, 这种情况下将创建一个<em>匿名函数 (anonymous)</em>. 此名字仅可在函数体内部引用。</dd> - <dt><code>paramN</code></dt> - <dd>将被传入此函数的一个参数。一个函数可以最多拥有255个参数。</dd> - <dt><code>statements</code></dt> - <dd>构成函数体的表达式。在表达式中需要至少包含一个 {{jsxref("Operators/yield", "yield")}} 表达式。</dd> -</dl> - -<h2 id="描述">描述</h2> - -<p>关于此语法的用法说明，参见 <a href="/en-US/docs/JavaScript/Guide/Iterators_and_Generators">迭代器 (Iterators) 与生成器 (Generators)</a> 页面。</p> - -<h2 id="浏览器兼容性">浏览器兼容性</h2> - -<p>Supported nowhere</p> - -<h2 id="相关链接">相关链接</h2> - -<ul> - <li>{{jsxref("Generator","生成器 (Generator)")}}</li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/Legacy_generator_function">旧式生成器函数</a></li> - <li><a href="/en-US/docs/Web/JavaScript/Guide/The_legacy_Iterator_protocol">旧式迭代器协议</a></li> - <li>{{jsxref("Operators/yield", "yield")}}</li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Functions_and_function_scope">函数与函数作用域</a></li> - <li>{{jsxref("Statements/function", "function")}}</li> - <li>{{jsxref("Operators/function", "function 表达式")}}</li> - <li>{{jsxref("Function", "函数")}}</li> - <li>{{jsxref("Statements/function*", "function*")}}</li> - <li>{{jsxref("Operators/function*", "function* 表达式")}}</li> - <li>{{jsxref("GeneratorFunction","生成器 (Generator) 函数")}}</li> - <li><a href="/en-US/docs/Web/JavaScript/Guide/The_Iterator_protocol">迭代器 (Iterator) 协议 </a></li> -</ul> diff --git a/files/zh-cn/archive/web/javascript/legacy_generator_function_statement/index.html b/files/zh-cn/archive/web/javascript/legacy_generator_function_statement/index.html deleted file mode 100644 index e8c8f209a9..0000000000 --- a/files/zh-cn/archive/web/javascript/legacy_generator_function_statement/index.html +++ /dev/null @@ -1,65 +0,0 @@ ---- -title: 遗留的生成器函数 -slug: Archive/Web/JavaScript/Legacy_generator_function_statement -tags: - - JavaScript - - 参考 - - 过时 - - 非标准 -translation_of: Archive/Web/JavaScript/Legacy_generator_function_statement ---- -<div>{{JSSidebar("Statements")}}{{Non-standard_Header}}{{Obsolete_Header("gecko58")}} -<div class="warning"> -<p>遗留的生成器函数是 SpiderMonkey 专有特性，已在 Firefox 58+ 中被移除。请考虑使用 {{JSxRef("Statements/function*", "function*")}}。</p> -</div> - -<p><strong>遗留的生成器函数声明</strong>使用特殊的参数声明遗留的生成器函数。</p> - -<p>也可以使用带有 <code>functionBody</code>、至少一个 {{jsxref("Operators/yield", "yield")}} 表达式，和{{jsxref("Operators/Legacy_generator_function", "遗留的生成器函数表达式")}}，配合 {{JSxRef("Function")}} 构造器，来定义遗留的生成器函数。</p> - -<h2 id="语法">语法</h2> - -<pre class="syntaxbox">function <em>name</em>([<em>param</em>,[, <em>param</em>,[..., <em>param</em>]]]) { - [<em>statements</em>] -} -</pre> - -<dl> - <dt><code>name</code></dt> - <dd>函数名。</dd> -</dl> - -<dl> - <dt><code>param</code></dt> - <dd>传入函数的参数名，一个函数最多有 255 个参数。</dd> -</dl> - -<dl> - <dt><code>statements</code></dt> - <dd>构成函数体的语句。应至少含有一个 {{jsxref("Operators/yield", "yield")}} 表达式。</dd> -</dl> - -<h2 id="描述">描述</h2> - -<p>用法概述可在<a href="/zh-CN/docs/JavaScript/Guide/Iterators_and_Generators">迭代器和生成器</a>页面上查看。</p> - -<h2 id="浏览器兼容性">浏览器兼容性</h2> -Supported nowhere. - -<h2 id="参考">参考</h2> - -<ul> - <li>{{jsxref("Generator")}}</li> - <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Operators/Legacy_generator_function">遗留的函数生成器表达式</a></li> - <li><a href="/zh-CN/docs/Web/JavaScript/Guide/The_legacy_Iterator_protocol">遗留的迭代器协议</a></li> - <li>{{jsxref("Operators/yield", "yield")}}</li> - <li><a href="/zh-CN/docs/Web/JavaScript/Reference/Functions_and_function_scope">函数和函数作用域</a></li> - <li>{{jsxref("Statements/function", "function")}}</li> - <li>{{jsxref("Operators/function", "function 表达式")}}</li> - <li>{{jsxref("Function")}}</li> - <li>{{jsxref("Statements/function*", "function*")}}</li> - <li>{{jsxref("Operators/function*", "function* 表达式")}}</li> - <li>{{jsxref("GeneratorFunction")}}</li> - <li><a href="/zh-CN/docs/Web/JavaScript/Guide/The_Iterator_protocol">迭代器协议</a></li> -</ul> -</div> diff --git a/files/zh-cn/archive/web/javascript/microsoft_extensions/activexobject/index.html b/files/zh-cn/archive/web/javascript/microsoft_extensions/activexobject/index.html deleted file mode 100644 index b275c9676b..0000000000 --- a/files/zh-cn/archive/web/javascript/microsoft_extensions/activexobject/index.html +++ /dev/null @@ -1,92 +0,0 @@ ---- -title: ActiveXObject -slug: Archive/Web/JavaScript/Microsoft_Extensions/ActiveXObject -translation_of: Archive/Web/JavaScript/Microsoft_Extensions/ActiveXObject ---- -<div>{{JSRef}}</div> - -<div class="warning"><strong>警告</strong>: 该对象是微软的私有拓展名, 只在微软的IE浏览器上支持, 在win8的应用商店下载的其他浏览器应用也不被支持.</div> - -<p><strong><code>ActiveXObject</code> </strong>启用会返回一个自动化对象的引用</p> - -<p>这个对象只能用于实例化自动化对象，它没有任何成员对象.</p> - -<h2 id="语法">语法 </h2> - -<pre><code>let newObj = new ActiveXObject(<em>servername, </em><em>typename</em>[, <em>location</em>]) -</code></pre> - -<h3 id="参数">参数</h3> - -<dl> - <dt><code>servername</code></dt> - <dd>提供对象的应用程序的名称。</dd> - <dt><code>typename</code></dt> - <dd>要创建的对象的类型或类。</dd> - <dt><code>location</code> {{optional_inline}}</dt> - <dd>要创建对象的网络服务器的名称。</dd> -</dl> - -<h2 id="备注">备注</h2> - -<p>自动化服务器提供至少一种类型的对象。例如，文字处理应用程序可以提供应用程序对象、文档对象和工具栏对象。</p> - -<p>您可以在<code>HKEY_CLASSES_ROOT</code>注册注册表项中识别主机PC上的<code>servername.typename的</code>值。下面是您可以找到的一些示例，它们要取决于你的电脑安装了哪些程序:</p> - -<ul> - <li> - <p>Excel.Application</p> - </li> - <li> - <p>Excel.Chart</p> - </li> - <li> - <p>Scripting.FileSystemObject</p> - </li> - <li> - <p>WScript.Shell</p> - </li> - <li> - <p>Word.Document</p> - </li> -</ul> - -<div class="warning"> -<p><strong>注意:</strong> ActiveX 对象可能会出现安全问题。要使用<code>ActiveXObject</code>, 你可能需要调整IE浏览器的相关安全区域的安全设置。比如说，对于本地局域网，你通常需要将自定义设置更改为"对未标记为可安全执行脚本ActiveX控件执行初始化并执行脚本"。</p> -</div> - -<p>To identify members of an automation object that you can use in your code, you may need to use a COM object browser, such as the <a href="http://msdn.microsoft.com/library/d0kh9f4c.aspx">OLE/COM Object Viewer</a>, if no reference documentation is available for the Automation object.</p> - -<p>To create an Automation object, assign the new <code>ActiveXObject</code> to an object variable:</p> - -<pre class="brush: js">var ExcelApp = new ActiveXObject("Excel.Application"); -var ExcelSheet = new ActiveXObject("Excel.Sheet"); -</pre> - -<p>This code starts the application creating the object (in this case, a Microsoft Excel worksheet). Once an object is created, you refer to it in code using the object variable you defined. In the following example, you access properties and methods of the new object using the object variable <code>ExcelSheet</code> and other Excel objects, including the application object and the <code>ActiveSheet.Cells</code> collection.</p> - -<pre class="brush: js">// Make Excel visible through the Application object. -ExcelSheet.Application.Visible = true; -// Place some text in the first cell of the sheet. -ExcelSheet.ActiveSheet.Cells(1,1).Value = "This is column A, row 1"; -// Save the sheet. -ExcelSheet.SaveAs("C:\\TEST.XLS"); -// Close Excel with the Quit method on the Application object. -ExcelSheet.Application.Quit(); -</pre> - -<h2 id="Requirements">Requirements</h2> - -<p>Supported in the following document modes: Quirks, Internet Explorer 6 standards, Internet Explorer 7 standards, Internet Explorer 8 standards, Internet Explorer 9 standards, Internet Explorer 10 standards, Internet Explorer 11 standards. Not supported in Windows 8.x Store apps.</p> - -<div class="note"> -<p><strong>Note:</strong> Creating an <code>ActiveXObject</code> on a remote server is not supported in Internet Explorer 9 standards mode, Internet Explorer 10 standards mode, Internet Explorer 11 standards mode, and Windows Store apps or later.</p> -</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions">Microsoft JavaScript extensions</a></li> - <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/GetObject">GetObject Function</a></li> - <li><a href="http://code.msdn.microsoft.com/Unique-Authentication-f32d2da0">Unique authentication using Magic of HTML5/WCF sample app</a></li> -</ul> diff --git a/files/zh-cn/archive/web/javascript/microsoft_extensions/date.getvardate/index.html b/files/zh-cn/archive/web/javascript/microsoft_extensions/date.getvardate/index.html deleted file mode 100644 index 3587d44b2d..0000000000 --- a/files/zh-cn/archive/web/javascript/microsoft_extensions/date.getvardate/index.html +++ /dev/null @@ -1,40 +0,0 @@ ---- -title: Date.getVarDate() -slug: Archive/Web/JavaScript/Microsoft_Extensions/Date.getVarDate -translation_of: Archive/Web/JavaScript/Microsoft_Extensions/Date.getVarDate ---- -<div><font><font>{{JSRef（“ Global_Objects”，“ Date”）}} {{Non-standard_Header}} {{Obsolete_Header}}</font></font> -<div class="warning"><strong><font><font>警告： </font></font></strong><span style="font-size: 1.125rem;"><font><font>仅Internet Explorer支持此方法。</font></font></span></div> -</div> - -<p><font><font>该</font></font><strong><code>getVarDate</code><font><font>方法</font></font></strong><code>VT_DATE</code><font><font>从{{JSxRef（“ Date”）}}对象</font><font>返回</font><font>值。</font></font></p> - -<h2 id="句法"><font><font>句法</font></font></h2> - -<pre class="notranslate"><code>dateObj.getVarDate() -</code></pre> - -<h3 id="参量"><font><font>参量</font></font></h3> - -<p><font><font>必需的 </font></font><code>dateObj</code><font><font> 引用是一个 </font></font><code>Date</code><font><font> 对象。</font></font></p> - -<h3 id="返回值"><font><font>返回值</font></font></h3> - -<p><font><font>返回VT_DATE值。</font></font></p> - -<h3 id="备注"><font><font>备注</font></font></h3> - -<p><code>getVarDate()</code><font><font>当JavaScript代码与COM对象，ActiveX对象或其他接受并返回VT_DATE格式的日期值的对象交互时，使用</font><font>此 </font><font>方法。</font><font>这些包括Visual Basic和Visual Basic脚本版（VBScript）中的对象。</font><font>返回值的实际格式取决于区域设置。</font></font></p> - -<h2 id="要求"><font><font>要求</font></font></h2> - -<p><font><font>在以下文档模式中受支持：怪癖，Internet Explorer 6标准，Internet Explorer 7标准，Internet Explorer 8标准，Internet Explorer 9标准和Internet Explorer 10标准。</font><font>Windows 8.x商店应用程序不支持。</font></font></p> - -<p><strong><font><font>适用于</font></font></strong><font><font>： </font></font><a href="https://docs.microsoft.com/en-us/scripting/javascript/reference/date-object-javascript"><font><font>Date对象</font></font></a></p> - -<h2 id="也可以看看"><font><font>也可以看看</font></font></h2> - -<ul> - <li><font><font>{{JSxRef（“ Date.getDate（）”）}}</font></font></li> - <li><font><font>{{JSxRef（“ Date.parse（）”）}}</font></font></li> -</ul> diff --git a/files/zh-cn/archive/web/javascript/microsoft_extensions/index.html b/files/zh-cn/archive/web/javascript/microsoft_extensions/index.html deleted file mode 100644 index a128cb7caf..0000000000 --- a/files/zh-cn/archive/web/javascript/microsoft_extensions/index.html +++ /dev/null @@ -1,70 +0,0 @@ ---- -title: Microsoft JavaScript extensions -slug: Archive/Web/JavaScript/Microsoft_Extensions -tags: - - JavaScript - - 'JavaScript:Microsoft Extensions' - - NeedsTranslation - - Non-standard - - Reference - - TopicStub -translation_of: Archive/Web/JavaScript/Microsoft_Extensions ---- -<div>{{JSSidebar("Microsoft Extensions")}}{{Non-standard_Header}} -<div class="blockIndicator warning"> -<p><strong>Warning:</strong> These APIs will only work in Microsoft applications, and are not on a standards track.</p> -</div> -</div> - -<p>Microsoft browsers (Internet Explorer, and in a few cases, Microsoft Edge) support a number of special Microsoft extensions to the otherwise standard <a href="/en-US/docs/Web/JavaScript">JavaScript APIs</a>.</p> - -<h2 id="Objects">Objects</h2> - -<div class="index"> -<ul> - <li>{{jsxref("ActiveXObject")}} {{obsolete_inline}}</li> - <li>{{jsxref("Debug")}} {{deprecated_inline}}</li> - <li>{{jsxref("Enumerator")}} {{obsolete_inline}}</li> - <li>{{jsxref("VBArray")}} {{obsolete_inline}}</li> -</ul> -</div> - -<h2 id="Functions">Functions</h2> - -<div class="index"> -<ul> - <li>{{jsxref("GetObject")}} {{obsolete_inline}}</li> - <li>{{jsxref("ScriptEngine")}} {{deprecated_inline}}</li> - <li>{{jsxref("ScriptEngineBuildVersion")}} {{deprecated_inline}}</li> - <li>{{jsxref("ScriptEngineMajorVersion")}} {{deprecated_inline}}</li> - <li>{{jsxref("ScriptEngineMinorVersion")}} {{deprecated_inline}}</li> -</ul> -</div> - -<h2 id="Statements">Statements</h2> - -<div class="index"> -<ul> - <li><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/at-cc-on">@cc-on</a> {{obsolete_inline}}</li> - <li><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/at-if">@if</a> {{obsolete_inline}}</li> - <li><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/at-set">@set</a> {{obsolete_inline}}</li> -</ul> -</div> - -<h2 id="Other">Other</h2> - -<div class="index"> -<ul> - <li><code><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/Date.getVarDate">Date.getVarDate()</a></code> {{obsolete_inline}}</li> - <li><code><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/Error.description">Error.description</a></code> {{deprecated_inline}}</li> - <li><code><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/Error.number">Error.number</a></code> {{deprecated_inline}}</li> - <li><code><a href="/en-US/docs/Web/JavaScript/Microsoft_JavaScript_extensions/Error.stackTraceLimit">Error.stackTraceLimit</a></code> {{deprecated_inline}}</li> -</ul> -</div> - -<h2 id="See_also">See also</h2> - -<ul> - <li><a href="/en-US/docs/Web/CSS/Microsoft_Extensions">Microsoft CSS Extensions</a></li> - <li><a href="/en-US/docs/Web/API/Microsoft_API_extensions">Microsoft DOM Extensions</a></li> -</ul> diff --git a/files/zh-cn/archive/web/javascript/reflect.enumerate/index.html b/files/zh-cn/archive/web/javascript/reflect.enumerate/index.html deleted file mode 100644 index e8eb0bd103..0000000000 --- a/files/zh-cn/archive/web/javascript/reflect.enumerate/index.html +++ /dev/null @@ -1,120 +0,0 @@ ---- -title: Reflect.enumerate() -slug: Archive/Web/JavaScript/Reflect.enumerate -translation_of: Archive/Web/JavaScript/Reflect.enumerate ---- -<div>{{JSRef}} {{obsolete_header}}</div> - -<div><strong><code>Reflect.enumerate()</code></strong>静态方法通常返回目标对象自身和继承的可迭代属性的一个迭代器，在ECMAScript 2016中已被移除，在各浏览器中已被废弃。</div> - -<h2 id="语法">语法</h2> - -<pre class="syntaxbox notranslate">Reflect.enumerate(target) -</pre> - -<h3 id="参数">参数</h3> - -<dl> - <dt><code>target</code></dt> - <dd>获取属性的目标对象。</dd> -</dl> - -<h3 id="返回值">返回值</h3> - -<p>目标对象自身和继承的可迭代属性的一个迭代器。</p> - -<h3 id="Exceptions">Exceptions</h3> - -<p> {{jsxref("TypeError")}}, 如果目标不是一个 {{jsxref("Object")}}.</p> - -<h2 id="描述">描述</h2> - -<p><code>Reflect.enumerate()</code>方法返回目标对象自身和继承的可迭代属性的一个迭代器。</p> - -<h2 id="案例">案例</h2> - -<h3 id="使用_Reflect.enumerate">使用 <code>Reflect.enumerate()</code></h3> - -<pre class="brush: js notranslate">var obj = { x: 1, y: 2 }; - -for (var name of Reflect.enumerate(obj)) { - console.log(name); -} -// logs "x" and "y" -</pre> - -<h2 id="规范">规范</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Status</th> - <th scope="col">Comment</th> - </tr> - <tr> - <td>{{SpecName('ES2015', '#sec-reflect.enumerate', 'Reflect.enumerate')}}</td> - <td>{{Spec2('ES2015')}}</td> - <td>初始定义。ECMAScript 2016中已移除。</td> - </tr> - </tbody> -</table> - -<h2 id="浏览器兼容性">浏览器兼容性</h2> - -<p>{{CompatibilityTable}}</p> - -<div id="compat-desktop"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Chrome</th> - <th>Firefox (Gecko)</th> - <th>Internet Explorer</th> - <th>Opera</th> - <th>Safari</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<div id="compat-mobile"> -<table class="compat-table"> - <tbody> - <tr> - <th>Feature</th> - <th>Android</th> - <th>Chrome for Android</th> - <th>Firefox Mobile (Gecko)</th> - <th>IE Mobile</th> - <th>Opera Mobile</th> - <th>Safari Mobile</th> - </tr> - <tr> - <td>Basic support</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - <td>{{CompatNo}}</td> - </tr> - </tbody> -</table> -</div> - -<h2 id="参照">参照</h2> - -<ul> - <li>{{jsxref("Reflect")}}</li> - <li><a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...in">for...in</a></li> -</ul> diff --git a/files/zh-cn/archive/web/liveconnect/index.html b/files/zh-cn/archive/web/liveconnect/index.html deleted file mode 100644 index 34b25bd823..0000000000 --- a/files/zh-cn/archive/web/liveconnect/index.html +++ /dev/null @@ -1,800 +0,0 @@ ---- -title: LiveConnect概述 -slug: Archive/Web/LiveConnect -tags: - - Java - - JavaScript - - LiveConnect - - 高级 -translation_of: Archive/Web/LiveConnect/LiveConnect_Overview ---- -<p>这一章描述了使用 <a href="/zh-CN/docs/LiveConnect" title="zh-CN/docs/LiveConnect">LiveConnect </a>技术来使JavaScript和Java能够互相通信。本章假设你熟悉Java编程。</p> - -<h2 id="使用包装器(Working_with_Wrappers)">使用包装器(Working with Wrappers)</h2> - -<p>在JavaScript中，包装器(<em>wrapper</em>)是一个目标语言数据类型的对象，它包装了一个源语言的对象。当使用JavaScript编程的时候，你可以使用包装器(wrapper)对象来访问Java对象的方法和字段;调用包装器(wrapper)的方法或者访问它的属性都会作用在Java对象上。在Java端，JavaScript对象被包装在类netscape.javascript.JSObject的实例中，然后传递给Java。</p> - -<p>当Javascript对象被传递给Java，运行时引擎会创建一个JSObject类型的Java包装器(<em>wrapper</em>);当JSObject从Java传递到JavaScript, 运行时引擎将它解包成它原来的JavaScript对象类型。JSObject类提供了一个接口用来调用JavaScript的方法和检测JavaScript的属性。</p> - -<h2 id="JavaScript到Java通信">JavaScript到Java通信</h2> - -<p>当你引用一个Java包或者类，或者使用Java的对象和数组，你会使用某一个特别的LiveConnect对象。所有访问Java的JavaScript使用下面表格中总结的对象：</p> - -<table class="standard-table"> - <caption>Table 9.1 LiveConnect对象</caption> - <thead> - <tr> - <th scope="col">对象</th> - <th scope="col">描述</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>JavaArray</code></td> - <td>包装了Java数组，从JavaScript代码中访问。</td> - </tr> - <tr> - <td><code>JavaClass</code></td> - <td>引用Java类。</td> - </tr> - <tr> - <td><code>JavaObject</code></td> - <td>包装了Java对象，从JavaScript代码中访问。</td> - </tr> - <tr> - <td><code>JavaPackage</code></td> - <td>引用Java包。</td> - </tr> - </tbody> -</table> - -<p><strong>注意:</strong> 因为Java是强类型语言，而JavaScript是弱类型的语言，当你使用LiveConnect的时候，JavaScript运行时引擎会将参数值转换为其他语言中的合适数据类型。请参考 <a href="/zh-CN/docs/JavaScript/Guide/Values,_Variables,_and_Literals#Data_Type_Conversion" title="zh-CN/docs/JavaScript/Guide/Values, Variables, and Literals#Data Type Conversion">Data Type Conversion</a> 来获取完整信息。</p> - -<p>在某些情形下，LiveConnect对象的存在是透明的，因为你凭借一定的直觉来和Java交互。例如，你能够通过使用new操作符跟上Java构造器来像下面一样创建一个Java字符串(String)对象，并且将它赋值给JavaScript变量myString：</p> - -<pre class="brush: js">var myString = new java.lang.String("Hello world"); -</pre> - -<p>在上面的例子中，变量myString是一个JavaObject，因为它持有一个Java的String对象。作为<code>JavaObject</code>, <code>myString</code>可以获取java.lang.String及其父类java.lang.Object的公有实例方法。这些Java方法在JavaScript中作为JavaObject的方法使用，你可以像下面这样来使用它们：</p> - -<pre class="brush: js">myString.length(); // returns 11 -</pre> - -<p>静态成员可以通过JavaClass对象来调用。</p> - -<pre class="brush: js">alert(java.lang.Integer.MAX_VALUE); //alerts 2147483647 -</pre> - -<h3 id="包对象">包对象</h3> - -<p>如果一个Java类不是java, sun, 或者netscape包的一部分，你需要使用Packages对象来访问它。例如，假设Redwood公司使用一个叫redwood的java包来包含各种它实现的Java类。为了创建一个redwood中HelloWorld类的实例，你像下面这样访问类的构造器：</p> - -<pre class="brush: js">var red = new Packages.redwood.HelloWorld(); -</pre> - -<p>你也可以使用默认包中的类(就是说，类没有显式的命名包)。例如，如果HelloWorld类在CLASSPATH中，并且不在包中，你可以像下面这样使用它：</p> - -<pre class="brush: js">var red = new Packages.HelloWorld(); -</pre> - -<p>LiveConnect<code>中的java</code>, <code>sun</code>, 和<code>netscape</code>对象提供了常用Java包的快捷方式。例如，你可以像下面这样使用：</p> - -<pre class="brush: js">var myString = new java.lang.String("Hello world"); -</pre> - -<p>来替换下面长版本:</p> - -<pre class="brush: js">var myString = new Packages.java.lang.String("Hello world"); -</pre> - -<h3 id="使用Java数组">使用Java数组</h3> - -<p>当任何Java方法创建了一个数组，并且你在JavaScript中引用那个数组，你就会使用到JavaArray。例如，下面的代码创建了有十个int类型元素的JavaArray x对象：</p> - -<pre class="brush: js">var x = java.lang.reflect.Array.newInstance(java.lang.Integer, 10); -</pre> - -<p>跟JavaScript的Array对象类似， JavaArray有一个length属性用来返回数组元素的长度。不像<code>Array.length</code>, <code>JavaArray.length是一个只读属性</code>, 因为Java数组的元素长度在创建的时候就固定了。</p> - -<h3 id="包和类的引用">包和类的引用</h3> - -<p>Simple references to Java packages and classes from JavaScript create the <code>JavaPackage</code> and <code>JavaClass</code> objects. In the earlier example about the Redwood corporation, for example, the reference Packages.redwood is a JavaPackage object. Similarly, a reference such as <code>java.lang.String</code> is a <code>JavaClass</code> object.</p> - -<p>Most of the time, you don't have to worry about the <code>JavaPackage</code> and <code>JavaClass</code> objects—you just work with Java packages and classes, and LiveConnect creates these objects transparently. There are cases where LiveConnect will fail to load a class, and you will need to manually load it like this:</p> - -<pre class="brush: js">var Widgetry = java.lang.Thread.currentThread().getContextClassLoader().loadClass("org.mywidgets.Widgetry"); -</pre> - -<p>In JavaScript 1.3 and earlier, <code>JavaClass</code> objects are not automatically converted to instances of <code>java.lang.Class</code> when you pass them as parameters to Java methods—you must create a wrapper around an instance of <code>java.lang.Class</code>. In the following example, the <code>forName</code> method creates a wrapper object <code>theClass</code>, which is then passed to the <code>newInstance</code> method to create an array.</p> - -<pre class="brush: js">// JavaScript 1.3 -var theClass = java.lang.Class.forName("java.lang.String"); -var theArray = java.lang.reflect.Array.newInstance(theClass, 5); -</pre> - -<p>In JavaScript 1.4 and later, you can pass a <code>JavaClass</code> object directly to a method, as shown in the following example:</p> - -<pre class="brush: js">// JavaScript 1.4 -var theArray = java.lang.reflect.Array.newInstance(java.lang.String, 5); -</pre> - -<h3 id="Arguments_of_Type_char">Arguments of Type char</h3> - -<p>In JavaScript 1.4 and later, you can pass a one-character string to a Java method which requires an argument of type <code>char</code>. For example, you can pass the string "H" to the <code>Character</code> constructor as follows:</p> - -<pre class="brush: js">var c = new java.lang.Character("H"); -</pre> - -<p>In JavaScript 1.3 and earlier, you must pass such methods an integer which corresponds to the Unicode value of the character. For example, the following code also assigns the value "H" to the variable <code>c</code>:</p> - -<pre class="brush: js">var c = new java.lang.Character(72); -</pre> - -<h3 id="Handling_Java_Exceptions_in_JavaScript">Handling Java Exceptions in JavaScript</h3> - -<p>When Java code fails at run time, it throws an exception. If your JavaScript code accesses a Java data member or method and fails, the Java exception is passed on to JavaScript for you to handle. Beginning with JavaScript 1.4, you can catch this exception in a <code>try...catch</code> statement. (Although this functionality (along with some others) had been broken in Gecko 1.9 (see {{ bug("391642") }}) as the Mozilla-specific LiveConnect code had not been maintained inside Mozilla, with Java 6 update 11 and 12 building support for reliance on Mozilla's implementation of the generic (and cross-browser) <a href="/zh-CN/docs/Plugins" title="zh-CN/docs/Plugins">NPAPI</a> plugin code, this has again been fixed.)</p> - -<p>For example, suppose you are using the Java <code>forName</code> method to assign the name of a Java class to a variable called <code>theClass</code>. The <code>forName</code> method throws an exception if the value you pass it does not evaluate to the name of a Java class. Place the <code>forName</code> assignment statement in a <code>try</code> block to handle the exception, as follows:</p> - -<pre class="brush: js">function getClass(javaClassName) { - try { - var theClass = java.lang.Class.forName(javaClassName); - } catch (e) { - return ("The Java exception is " + e); - } - return theClass; -} -</pre> - -<p>In this example, if <code>javaClassName</code> evaluates to a legal class name, such as "java.lang.String", the assignment succeeds. If <code>javaClassName</code> evaluates to an invalid class name, such as "String", the <code>getClass</code> function catches the exception and returns something similar to the following:</p> - -<pre>The Java exception is java.lang.ClassNotFoundException: String -</pre> - -<p>For specialized handling based on the exception type, use the <code>instanceof</code> operator:</p> - -<pre class="brush: js">try { - // ... -} catch (e) { - if (e instanceof java.io.FileNotFound) { - // handling for FileNotFound - } else { - throw e; - } -} -</pre> - -<p>See <a href="/zh-CN/docs/JavaScript/Guide/Statements#Exception_Handling_Statements" title="zh-CN/docs/JavaScript/Guide/Statements#Exception Handling Statements">Exception Handling Statements</a> for more information about JavaScript exceptions.</p> - -<h2 id="Java_to_JavaScript_Communication">Java to JavaScript Communication</h2> - -<p>If you want to use JavaScript objects in Java, you must import the <code>netscape.javascript</code> package into your Java file. This package defines the following classes:</p> - -<ul> - <li><code><a href="/zh-CN/docs/JavaScript/Reference/LiveConnect/JSObject" title="zh-CN/docs/JavaScript/Reference/LiveConnect/JSObject">netscape.javascript.JSObject</a></code> allows Java code to access JavaScript methods and properties.</li> - <li><code><a href="/zh-CN/docs/JavaScript/Reference/LiveConnect/JSException" title="zh-CN/docs/JavaScript/Reference/LiveConnect/JSException">netscape.javascript.JSException</a></code> allows Java code to handle JavaScript errors.</li> -</ul> - -<p>See the <a href="/zh-CN/docs/JavaScript/Reference" title="zh-CN/docs/JavaScript/Reference">JavaScript Reference</a> for more information about these classes.</p> - -<h3 id="Locating_the_LiveConnect_classes" name="Locating_the_LiveConnect_classes">Locating the LiveConnect classes</h3> - -<p>In older versions of the Netscape browser, these classes were distributed along with the browser. Starting with JavaScript 1.2, these classes are delivered in a .jar file; in previous versions of JavaScript, these classes are delivered in a .zip file. For example, with Netscape Navigator 4 for Windows NT, the classes are delivered in the <code>java40.jar</code> file in the <code>Program\Java\Classes</code> directory beneath the Navigator directory.</p> - -<p>More recently, the classes have been distributed with Sun's Java Runtime; initially in the file "jaws.jar" in the "jre/lib" directory of the runtime distribution (for JRE 1.3), then in "plugin.jar" in the same location (JRE 1.4 and up).</p> - -<h3 id="Using_the_LiveConnect_classes_with_the_JDK" name="Using_the_LiveConnect_classes_with_the_JDK">Using the LiveConnect classes with the JDK</h3> - -<p>To access the LiveConnect classes, place the .jar or .zip file in the <code>CLASSPATH</code> of the JDK compiler in either of the following ways:</p> - -<ul> - <li>Create a <code>CLASSPATH</code> environment variable to specify the path and name of .jar or .zip file.</li> - <li>Specify the location of .jar or .zip file when you compile by using the <code>-classpath</code> command line parameter.</li> -</ul> - -<p>You can specify an environment variable in Windows NT by double-clicking the System icon in the Control Panel and creating a user environment variable called <code>CLASSPATH</code> with a value similar to the following:</p> - -<pre class="eval">C:\Program Files\Java\jre1.4.1\lib\plugin.jar -</pre> - -<p>See the Sun JDK documentation for more information about <code>CLASSPATH</code>.</p> - -<p><strong>Note:</strong> Because Java is a strongly typed language and JavaScript is weakly typed, the JavaScript runtime engine converts argument values into the appropriate data types for the other language when you use LiveConnect. See <a href="#Data_Type_Conversions">Data Type Conversions</a> for complete information.</p> - -<h3 id="Using_the_LiveConnect_Classes">Using the LiveConnect Classes</h3> - -<p>All JavaScript objects appear within Java code as instances of <code>netscape.javascript.JSObject</code>. When you call a method in your Java code, you can pass it a JavaScript object as one of its argument. To do so, you must define the corresponding formal parameter of the method to be of type <code>JSObject</code>.</p> - -<p>Also, any time you use JavaScript objects in your Java code, you should put the call to the JavaScript object inside a <code>try...catch</code> statement which handles exceptions of type <code>netscape.javascript.JSException</code>. This allows your Java code to handle errors in JavaScript code execution which appear in Java as exceptions of type <code>JSException</code>.</p> - -<h4 id="Accessing_JavaScript_with_JSObject" name="Accessing_JavaScript_with_JSObject">Accessing JavaScript with JSObject</h4> - -<p>For example, suppose you are working with the Java class called <code>JavaDog</code>. As shown in the following code, the <code>JavaDog</code> constructor takes the JavaScript object <code>jsDog</code>, which is defined as type <code>JSObject</code>, as an argument:</p> - -<pre class="brush: java">import netscape.javascript.*; - -public class JavaDog{ - public String dogBreed; - public String dogColor; - public String dogSex; - - // define the class constructor - public JavaDog(JSObject jsDog){ - // use try...catch to handle JSExceptions here - this.dogBreed = (String)jsDog.getMember("breed"); - this.dogColor = (String)jsDog.getMember("color"); - this.dogSex = (String)jsDog.getMember("sex"); - } -} -</pre> - -<p>Notice that the <code>getMember</code> method of <code>JSObject</code> is used to access the properties of the JavaScript object. The previous example uses <code>getMember</code> to assign the value of the JavaScript property <code>jsDog.breed</code> to the Java data member <code>JavaDog.dogBreed</code>.</p> - -<p><strong>Note:</strong> A more realistic example would place the call to <code>getMember</code> inside a <code>try...catch</code> statement to handle errors of type <code>JSException</code>. See Handling JavaScript Exceptions in Java for more information.</p> - -<p>To get a better sense of how <code>getMember</code> works, look at the definition of the custom JavaScript object <code>Dog</code>:</p> - -<pre class="brush: js">function Dog(breed,color,sex){ - this.breed = breed; - this.color = color; - this.sex = sex; -} -</pre> - -<p>You can create a JavaScript instance of <code>Dog</code> called <code>gabby</code> as follows:</p> - -<pre class="brush: js">var gabby = new Dog("lab", "chocolate", "female"); -</pre> - -<p>If you evaluate <code>gabby.color</code>, you can see that it has the value "chocolate". Now suppose you create an instance of <code>JavaDog</code> in your JavaScript code by passing the <code>gabby</code> object to the constructor as follows:</p> - -<pre class="brush: js">var javaDog = new Packages.JavaDog(gabby); -</pre> - -<p>If you evaluate <code>javaDog.dogColor</code>, you can see that it also has the value "chocolate", because the <code>getMember</code> method in the Java constructor assigns <code>dogColor</code> the value of <code>gabby.color</code>.</p> - -<h4 id="Handling_JavaScript_Exceptions_in_Java" name="Handling_JavaScript_Exceptions_in_Java">Handling JavaScript Exceptions in Java</h4> - -<p>When JavaScript code called from Java fails at run time, it throws an exception. If you are calling the JavaScript code from Java, you can catch this exception in a <code>try...catch</code> statement. The JavaScript exception is available to your Java code as an instance of <code>netscape.javascript.JSException</code>.</p> - -<p><code>JSException</code> is a Java wrapper around any exception type thrown by JavaScript, similar to the way that instances of <code>JSObject</code> are wrappers for JavaScript objects. Use <code>JSException</code> when you are evaluating JavaScript code in Java.</p> - -<p>When you are evaluating JavaScript code in Java, the following situations can cause run-time errors:</p> - -<ul> - <li>The JavaScript code is not evaluated, either due to a JavaScript compilation error or to some other error that occurred at run time. The JavaScript interpreter generates an error message that is converted into an instance of <code>JSException</code>.</li> - <li>Java successfully evaluates the JavaScript code, but the JavaScript code executes an unhandled <code>throw</code> statement. JavaScript throws an exception that is wrapped as an instance of <code>JSException</code>. Use the <code>getWrappedException</code> method of <code>JSException</code> to unwrap this exception in Java.</li> -</ul> - -<p>For example, suppose the Java object <code>eTest</code> evaluates the string <code>jsCode</code> that you pass to it. You can respond to either type of run-time error the evaluation causes by implementing an exception handler such as the following:</p> - -<pre class="brush: java">import netscape.javascript.JSObject; -import netscape.javascript.JSException; - -public class eTest { - public static Object doit(JSObject obj, String jsCode) { - try { - obj.eval(jsCode); - } catch (JSException e) { - if (e.getWrappedException() == null) - return e; - return e.getWrappedException(); - } - return null; - } -} -</pre> - -<p>In this example, the code in the <code>try</code> block attempts to evaluate the string <code>jsCode</code> that you pass to it. Let's say you pass the string "<code>myFunction()</code>" as the value of <code>jsCode</code>. If <code>myFunction</code> is not defined as a JavaScript function, the JavaScript interpreter cannot evaluate <code>jsCode</code>. The interpreter generates an error message, the Java handler catches the message, and the <code>doit</code> method returns an instance of <code>netscape.javascript.JSException</code>.</p> - -<p>However, suppose <code>myFunction</code> is defined in JavaScript as follows:</p> - -<pre class="brush: js">function myFunction() { - try { - if (theCondition == true) { - return "Everything's ok"; - } else { - throw "JavaScript error occurred"; - } - } catch (e) { - if (canHandle == true) { - handleIt(); - } else { - throw e; - } - } -} -</pre> - -<p>If <code>theCondition</code> is false, the function throws an exception. The exception is caught in the JavaScript code, and if <code>canHandle</code> is true, JavaScript handles it. If <code>canHandle</code> is false, the exception is rethrown, the Java handler catches it, and the <code>doit</code> method returns a Java string:</p> - -<pre>JavaScript error occurred -</pre> - -<p>See <a href="/zh-CN/docs/JavaScript/Guide/Statements#Exception_Handling_Statements" title="zh-CN/docs/JavaScript/Guide/Statements#Exception Handling Statements">Exception Handling Statements</a> for complete information about JavaScript exceptions.</p> - -<h4 id="Backward_Compatibility" name="Backward_Compatibility">Backward Compatibility</h4> - -<p>In JavaScript 1.3 and earlier versions, the <code>JSException</code> class had three public constructors which optionally took a string argument, specifying the detail message or other information for the exception. The <code>getWrappedException</code> method was not available.</p> - -<p>Use a <code>try...catch</code> statement such as the following to handle LiveConnect exceptions in JavaScript 1.3 and earlier versions:</p> - -<pre class="brush: js">try { - global.eval("foo.bar = 999;"); -} catch (Exception e) { - if (e instanceof JSException) { - jsCodeFailed(); - } else { - otherCodeFailed(); - } -} -</pre> - -<p>In this example, the <code>eval</code> statement fails if <code>foo</code> is not defined. The <code>catch</code> block executes the <code>jsCodeFailed</code> method if the <code>eval</code> statement in the <code>try</code> block throws a <code>JSException</code>; the <code>otherCodeFailed</code> method executes if the <code>try</code> block throws any other error.</p> - -<h2 id="Data_Type_Conversions">Data Type Conversions</h2> - -<p>Because Java is a strongly typed language and JavaScript is weakly typed, the JavaScript runtime engine converts argument values into the appropriate data types for the other language when you use LiveConnect. These conversions are described in the following sections:</p> - -<ul> - <li><a href="#JavaScript_to_Java_Conversions">JavaScript to Java Conversions</a></li> - <li><a href="#Java_to_JavaScript_Conversions">Java to JavaScript Conversions</a></li> -</ul> - -<h3 id="JavaScript_to_Java_Conversions">JavaScript to Java Conversions</h3> - -<p>When you call a Java method and pass it parameters from JavaScript, the data types of the parameters you pass in are converted according to the rules described in the following sections:</p> - -<ul> - <li><a href="#Number_Values">Number Values</a></li> - <li><a href="#Boolean_Values">Boolean Values</a></li> - <li><a href="#String_Values">String Values</a></li> - <li><a href="#Undefined_Values">Undefined Values</a></li> - <li><a href="#Null_Values">Null Values</a></li> - <li><a href="#JavaArray_and_JavaObject_objects">JavaArray and JavaObject objects</a></li> - <li><a href="#JavaClass_objects">JavaClass objects</a></li> - <li><a href="#Other_JavaScript_objects">Other JavaScript objects</a></li> -</ul> - -<p>The return values of methods of <code>netscape.javascript.JSObject</code> are always converted to instances of <code>java.lang.Object</code>. The rules for converting these return values are also described in these sections.</p> - -<p>For example, if <code>JSObject.eval</code> returns a JavaScript number, you can find the rules for converting this number to an instance of <code>java.lang.Object</code> in <a href="#Number_Values">Number Values</a>.</p> - -<h4 id="Number_Values" name="Number_Values">Number Values</h4> - -<p>When you pass JavaScript number types as parameters to Java methods, Java converts the values according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td>double</td> - <td> - <ul> - <li>The exact value is transferred to Java without rounding and without a loss of magnitude or sign.</li> - <li><code>NaN</code> is converted to NaN.</li> - </ul> - </td> - </tr> - <tr> - <td>java.lang.Double<br> - java.lang.Object</td> - <td>A new instance of <code>java.lang.Double</code> is created, and the exact value is transferred to Java without rounding and without a loss of magnitude or sign.</td> - </tr> - <tr> - <td>float</td> - <td> - <ul> - <li>Values are rounded to float precision.</li> - <li>Values which are too large or small to be represented are rounded to +infinity or -infinity.</li> - <li><code>NaN</code> is converted to <code>NaN</code>.</li> - </ul> - </td> - </tr> - <tr> - <td>byte - <p>char<br> - int<br> - long</p> - short</td> - <td> - <ul> - <li>Values are rounded using round-to-negative-infinity mode.</li> - <li>Values which are too large or small to be represented result in a run-time error.</li> - <li><code>NaN</code> can not be converted and results in a run-time error.</li> - </ul> - </td> - </tr> - <tr> - <td><code>java.lang.String</code></td> - <td>Values are converted to strings. For example: - <ul> - <li>237 becomes "237"</li> - </ul> - </td> - </tr> - <tr> - <td>boolean</td> - <td> - <ul> - <li>0 and <code>NaN</code> values are converted to false.</li> - <li>Other values are converted to true.</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p>When a JavaScript number is passed as a parameter to a Java method which expects an instance of <code>java.lang.String</code>, the number is converted to a string. Use the <code>equals()</code> method to compare the result of this conversion with other string values.</p> - -<h4 id="Boolean_Values" name="Boolean_Values">Boolean Values</h4> - -<p>When you pass JavaScript Boolean types as parameters to Java methods, Java converts the values according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td>boolean</td> - <td>All values are converted directly to the Java equivalents.</td> - </tr> - <tr> - <td><code>java.lang.Boolean</code><br> - <code>java.lang.Object</code></td> - <td>A new instance of <code>java.lang.Boolean</code> is created. Each parameter creates a new instance, not one instance with the same primitive value.</td> - </tr> - <tr> - <td><code>java.lang.String</code></td> - <td>Values are converted to strings. For example: - <ul> - <li>true becomes "true"</li> - <li>false becomes "false"</li> - </ul> - </td> - </tr> - <tr> - <td>byte - <p>char<br> - double<br> - float<br> - int<br> - long</p> - short</td> - <td> - <ul> - <li>true becomes 1</li> - <li>false becomes 0</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p>When a JavaScript Boolean is passed as a parameter to a Java method which expects an instance of <code>java.lang.String</code>, the Boolean is converted to a string. Use the == operator to compare the result of this conversion with other string values.</p> - -<h4 id="String_Values" name="String_Values">String Values</h4> - -<p>When you pass JavaScript string types as parameters to Java methods, Java converts the values according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>java.lang.String</code><br> - <code>java.lang.Object</code></td> - <td>JavaScript 1.4: - <ul> - <li>A JavaScript string is converted to an instance of <code>java.lang.String</code> with a Unicode value.</li> - </ul> - - <p>JavaScript 1.3 and earlier:</p> - - <ul> - <li>A JavaScript string is converted to an instance of <code>java.lang.String</code> with an ASCII value.</li> - </ul> - </td> - </tr> - <tr> - <td>byte - <p>double<br> - float<br> - int<br> - long</p> - short</td> - <td>All values are converted to numbers as described in ECMA-262. The JavaScript string value is converted to a number according to the rules described in ECMA-262.</td> - </tr> - <tr> - <td>char</td> - <td>JavaScript 1.4: - <ul> - <li>One-character strings are converted to Unicode characters.</li> - <li>All other values are converted to numbers.</li> - </ul> - - <p>JavaScript 1.3 and earlier:</p> - - <ul> - <li>All values are converted to numbers.</li> - </ul> - </td> - </tr> - <tr> - <td>boolean</td> - <td> - <ul> - <li>The empty string becomes false.</li> - <li>All other values become true.</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<h4 id="Undefined_Values" name="Undefined_Values">Undefined Values</h4> - -<p>When you pass undefined JavaScript values as parameters to Java methods, Java converts the values according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>java.lang.String</code><br> - <code>java.lang.Object</code></td> - <td>The value is converted to an instance of java.lang.String whose value is the string "undefined".</td> - </tr> - <tr> - <td>boolean</td> - <td>The value becomes false.</td> - </tr> - <tr> - <td>double<br> - float</td> - <td>The value becomes <code>NaN</code>.</td> - </tr> - <tr> - <td>byte - <p>char<br> - int<br> - long</p> - short</td> - <td>The value becomes 0.</td> - </tr> - </tbody> -</table> - -<p>The undefined value conversion is possible in JavaScript 1.3 and later versions only. Earlier versions of JavaScript do not support undefined values.</p> - -<p>When a JavaScript undefined value is passed as a parameter to a Java method which expects an instance of <code>java.lang.String</code>, the undefined value is converted to a string. Use the == operator to compare the result of this conversion with other string values.</p> - -<h4 id="Null_Values" name="Null_Values">Null Values</h4> - -<p>When you pass null JavaScript values as parameters to Java methods, Java converts the values according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td>Any class<br> - Any interface type</td> - <td>The value becomes null.</td> - </tr> - <tr> - <td>byte - <p>char<br> - double<br> - float<br> - int<br> - long</p> - short</td> - <td>The value becomes 0.</td> - </tr> - <tr> - <td>boolean</td> - <td>The value becomes false.</td> - </tr> - </tbody> -</table> - -<h4 id="JavaArray_and_JavaObject_objects" name="JavaArray_and_JavaObject_objects">JavaArray and JavaObject objects</h4> - -<p>In most situations, when you pass a JavaScript <code>JavaArray</code> or <code>JavaObject</code> as a parameter to a Java method, Java simply unwraps the object; in a few situations, the object is coerced into another data type according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td>Any interface or class that is assignment-compatible with the unwrapped object.</td> - <td>The object is unwrapped.</td> - </tr> - <tr> - <td><code>java.lang.String</code></td> - <td>The object is unwrapped, the <code>toString</code> method of the unwrapped Java object is called, and the result is returned as a new instance of <code>java.lang.String</code>.</td> - </tr> - <tr> - <td>byte - <p>char<br> - double<br> - float<br> - int<br> - long</p> - short</td> - <td>The object is unwrapped, and either of the following situations occur: - <ul> - <li>If the unwrapped Java object has a <code>doubleValue</code> method, the <code>JavaArray</code> or <code>JavaObject</code> is converted to the value returned by this method.</li> - <li>If the unwrapped Java object does not have a <code>doubleValue</code> method, an error occurs.</li> - </ul> - </td> - </tr> - <tr> - <td>boolean</td> - <td>In JavaScript 1.3 and later versions, the object is unwrapped and either of the following situations occur: - <ul> - <li>If the object is null, it is converted to false.</li> - <li>If the object has any other value, it is converted to true.</li> - </ul> - - <p>In JavaScript 1.2 and earlier versions, the object is unwrapped and either of the following situations occur:</p> - - <ul> - <li>If the unwrapped object has a booleanValue method, the source object is converted to the return value.</li> - <li>If the object does not have a booleanValue method, the conversion fails.</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<p>An interface or class is assignment-compatible with an unwrapped object if the unwrapped object is an instance of the Java parameter type. That is, the following statement must return true:</p> - -<pre class="brush: js">unwrappedObject instanceof parameterType; -</pre> - -<h4 id="JavaClass_objects" name="JavaClass_objects">JavaClass objects</h4> - -<p>When you pass a JavaScript <code>JavaClass</code> object as a parameter to a Java method, Java converts the object according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>java.lang.Class</code></td> - <td>The object is unwrapped.</td> - </tr> - <tr> - <td><code>netscape.javascript.JSObject</code><br> - <code>java.lang.Object</code></td> - <td>The <code>JavaClass</code> object is wrapped in a new instance of <code>netscape.javascript.JSObject</code>.</td> - </tr> - <tr> - <td><code>java.lang.String</code></td> - <td>The object is unwrapped, the <code>toString</code> method of the unwrapped Java object is called, and the result is returned as a new instance of <code>java.lang.String</code>.</td> - </tr> - <tr> - <td>boolean</td> - <td>In JavaScript 1.3 and later versions, the object is unwrapped and either of the following situations occur: - <ul> - <li>If the object is null, it is converted to false.</li> - <li>If the object has any other value, it is converted to true.</li> - </ul> - - <p>In JavaScript 1.2 and earlier versions, the object is unwrapped and either of the following situations occur:</p> - - <ul> - <li>If the unwrapped object has a booleanValue method, the source object is converted to the return value.</li> - <li>If the object does not have a booleanValue method, the conversion fails.</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<h4 id="Other_JavaScript_objects" name="Other_JavaScript_objects">Other JavaScript objects</h4> - -<p>When you pass any other JavaScript object as a parameter to a Java method, Java converts the object according to the rules described in the following table:</p> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Java parameter type</th> - <th scope="col">Conversion rules</th> - </tr> - </thead> - <tbody> - <tr> - <td><code>netscape.javascript.JSObject</code><br> - <code>java.lang.Object</code></td> - <td>The object is wrapped in a new instance of <code>netscape.javascript.JSObject</code>.</td> - </tr> - <tr> - <td><code>java.lang.String</code></td> - <td>The object is unwrapped, the <code>toString</code> method of the unwrapped object is called, and the result is returned as a new instance of <code>java.lang.String</code>.</td> - </tr> - <tr> - <td>byte - <p>char<br> - double<br> - float<br> - int<br> - long</p> - short</td> - <td>The object is converted to a value using the logic of the <code>ToPrimitive</code> operator described in ECMA-262. The <em>PreferredType</em> hint used with this operator is Number.</td> - </tr> - <tr> - <td>boolean</td> - <td>In JavaScript 1.3 and later versions, the object is unwrapped and either of the following situations occur: - <ul> - <li>If the object is null, it is converted to false.</li> - <li>If the object has any other value, it is converted to true.</li> - </ul> - - <p>In JavaScript 1.2 and earlier versions, the object is unwrapped and either of the following situations occur:</p> - - <ul> - <li>If the unwrapped object has a booleanValue method, the source object is converted to the return value.</li> - <li>If the object does not have a booleanValue method, the conversion fails.</li> - </ul> - </td> - </tr> - </tbody> -</table> - -<h3 id="Java_to_JavaScript_Conversions">Java to JavaScript Conversions</h3> - -<p>Values passed from Java to JavaScript are converted as follows:</p> - -<ul> - <li>Java byte, char, short, int, long, float, and double are converted to JavaScript numbers.</li> - <li>A Java boolean is converted to a JavaScript boolean.</li> - <li>An object of class <code>netscape.javascript.JSObject</code> is converted to the original JavaScript object.</li> - <li>Java arrays are converted to a JavaScript pseudo-Array object; this object behaves just like a JavaScript <code>Array</code> object: you can access it with the syntax <code>arrayName[index]</code> (where <code>index</code> is an integer), and determine its length with <code>arrayName.length</code>.</li> - <li>A Java object of any other class is converted to a JavaScript wrapper, which can be used to access methods and fields of the Java object: - <ul> - <li>Converting this wrapper to a string calls the <code>toString</code> method on the original object.</li> - <li>Converting to a number calls the <code>doubleValue</code> method, if possible, and fails otherwise.</li> - <li>Converting to a boolean in JavaScript 1.3 and later versions returns false if the object is null, and true otherwise.</li> - <li>Converting to a boolean in JavaScript 1.2 and earlier versions calls the <code>booleanValue</code> method, if possible, and fails otherwise.</li> - </ul> - </li> -</ul> - -<p>Note that instances of java.lang.Double and java.lang.Integer are converted to JavaScript objects, not to JavaScript numbers. Similarly, instances of java.lang.String are also converted to JavaScript objects, not to JavaScript strings.</p> - -<p>Java <code>String</code> objects also correspond to JavaScript wrappers. If you call a JavaScript method that requires a JavaScript string and pass it this wrapper, you'll get an error. Instead, convert the wrapper to a JavaScript string by appending the empty string to it, as shown here:</p> - -<pre class="brush: js">var JavaString = JavaObj.methodThatReturnsAString(); -var JavaScriptString = JavaString + "";</pre> diff --git a/files/zh-cn/archive/web_标准/index.html b/files/zh-cn/archive/web_标准/index.html deleted file mode 100644 index 19024fa1eb..0000000000 --- a/files/zh-cn/archive/web_标准/index.html +++ /dev/null @@ -1,76 +0,0 @@ ---- -title: Web 标准 -slug: Archive/Web_标准 -translation_of: Archive/Web_Standards ---- -<div> - <strong>Web标准</strong> Web标准经过精心设计，旨在让广大用户享有最佳的上网体验，同时也确保在网上发布的文件经久不衰。由这些标准设计、构建的网站简化并降低了开发成本，同时又可以让更多人访问，并适应更多的上网设备。随着传统桌面浏览器的进化、新型互联网设备进入市场，经由这些准则开发的网站将继续正常运作。 <sup><a href="https://developer.mozilla.org/zh-CN/docs/Archive/Web_%E6%A0%87%E5%87%86#endnote_1">[1]</a></sup></div> -<table class="topicpage-table"> - <tbody> - <tr> - <td> - <h4 id="Documentation" name="Documentation"><a href="/Special:Tags?tag=Web_Standards&language=en" title="Special:Tags?tag=Web_Standards&language=en">参考文章</a></h4> - <dl> - <dt> - <a href="/en/Migrate_apps_from_Internet_Explorer_to_Mozilla" title="en/Migrate_apps_from_Internet_Explorer_to_Mozilla">将应用从IE浏览器迁移到Mozilla浏览器</a></dt> - <dd> - <small>是否在迁移针对IE浏览器定制的应用到Mozilla浏览器时遇到了麻烦？本文涵盖了迁移应用到开源的基于Mozilla的浏览器的过程中相关的常见问题。</small></dd> - <dt> - <a href="/en/Using_Web_Standards_in_your_Web_Pages" title="en/Using_Web_Standards_in_your_Web_Pages">在您的网页中应用Web标准</a></dt> - <dd> - <small>本文概述了如何升级你的网页从而使之遵循 W3C Web标准。</small></dd> - <dt> - <a href="/en/Choosing_Standards_Compliance_Over_Proprietary_Practices" title="en/Choosing_Standards_Compliance_Over_Proprietary_Practices">为什么选择符合标准而不是私有实现？</a></dt> - <dd> - <small>应用通常是跨多个开发小组设计的，因此在开发过程中需要一个通用标准。</small></dd> - <dt> - <a href="/en/The_Business_Benefits_of_Web_Standards" title="en/The_Business_Benefits_of_Web_Standards">Web标准的商业价值</a></dt> - <dd> - <small>本文探讨了遵守Web标准、丢弃私有标记和技术是如何帮助一家公司实现其商业目标的。</small></dd> - </dl> - <p><span class="alllinks"><a href="/Special:Tags?tag=Web_Standards&language=en" title="Special:Tags?tag=Web_Standards&language=en">查看全部...</a></span></p> - </td> - <td> - <h4 id="Community" name="Community">社区</h4> - <ul> - <li>浏览 Mozilla 论坛...</li> - </ul> - <p></p><ul> - <li><a href="https://lists.mozilla.org/listinfo/dev-web-development"> 邮件列表</a></li> - - - <li><a href="http://groups.google.com/group/mozilla.dev.web-development"> 新闻组</a></li> - <li><a href="http://groups.google.com/group/mozilla.dev.web-development/feeds"> Web feed</a></li> -</ul><p></p> - <ul> - <li><a class="external" href="http://webstandards.org/">The Web Standards Project</a></li> - <li><a class="external" href="http://webdevfeedhouse.com/">WebDev FeedHouse</a></li> - <li><a href="/en/Web_Standards/Community" title="en/Web_Standards/Community">Other community links...</a></li> - </ul> - <h4 id="Tools" name="Tools">工具</h4> - <ul> - <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/1843">Firebug 扩展</a></li> - <li><a class="link-https" href="https://addons.mozilla.org/en-US/firefox/addon/60">Web Developer 扩展 </a></li> - <li><a class="external" href="http://validator.w3.org/">W3C 标记验证服务</a></li> - <li><a class="external" href="http://jigsaw.w3.org/css-validator/">W3C CSS 验证服务</a></li> - </ul> - <p><span class="alllinks"><a href="/Special:Tags?tag=Web_Standards:Tools&language=en" title="Special:Tags?tag=Web_Standards:Tools&language=en">查看全部...</a></span></p> - <h4 id="Examples" name="Examples">Examples</h4> - <ul> - <li><a class="external" href="http://www.mozilla.org/newlayout/demo/">Gecko Demos</a></li> - <li><a class="external" href="http://www.csszengarden.com/">css 禅意花园</a></li> - <li><a class="external" href="http://www.meyerweb.com/eric/css/edge/">Eric Meyers's css/edge</a></li> - <li><a class="external" href="http://dmoz.org/Computers/Programming/Languages/JavaScript/W3C_DOM/Demos/">W3C DOM Demos</a></li> - </ul> - <h4 id="Related_Topics" name="Related_Topics">Related Topics</h4> - <dl> - <dd> - <a href="/en/CSS" title="en/CSS">CSS</a>, <a href="/en/DHTML" title="en/DHTML">DHTML</a>, <a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/Web_Development" title="en/Web_Development">Web 开发</a>, <a href="/en/XHTML" title="en/XHTML">XHTML</a>, <a href="/en/XML" title="en/XML">XML</a></dd> - </dl> - </td> - </tr> - </tbody> -</table> -<hr> -<p><small><span id="endnote_1"><strong><a href="https://developer.mozilla.org/zh-CN/docs/Archive/Web_%E6%A0%87%E5%87%86#ref_1">^</a></strong></span> - <a class="external" href="http://webstandards.org/">The Web Standards Project</a></small></p> -<p></p> diff --git a/files/zh-cn/archive/web_标准/issues_arising_from_arbitrary-element_hover/index.html b/files/zh-cn/archive/web_标准/issues_arising_from_arbitrary-element_hover/index.html deleted file mode 100644 index c63ee0cc9e..0000000000 --- a/files/zh-cn/archive/web_标准/issues_arising_from_arbitrary-element_hover/index.html +++ /dev/null @@ -1,64 +0,0 @@ ---- -title: 发行任意元素的hover的起因 -slug: Archive/Web_标准/Issues_Arising_From_Arbitrary-Element_hover -tags: - - CSS - - 所有分类 -translation_of: Archive/Web_Standards/Issues_Arising_From_Arbitrary-Element_hover ---- -<p> </p> -<p><span class="comment">Summary: Thanks to long-standing limitations, we're used to thinking of hover styles as applying only to hyperlinks, which has led to some sloppy authoring practices that are now causing problems for some Web sites. This technote explains the source of the problems and how to avoid encountering them.</span> 很多设计者都使用CSS2伪类<code>:hover</code>装饰他们的链接。这个创新，首先被Microsoft® Internet Explorer引入，随后被CSS规范所采用，是非常受欢迎的文本链接样式，尤其是那些看起来和动起来像以JavaScript驱动的交互动态效果。除了推进浏览器对CSS的支持以外，还产生了一些出乎意料的hovering地活泼行为在一些页面。</p> -<h3 id="Hover.E5.92.8C.E9.9D.9E.E9.93.BE.E6.8E.A5.E5.85.83.E7.B4.A0" name="Hover.E5.92.8C.E9.9D.9E.E9.93.BE.E6.8E.A5.E5.85.83.E7.B4.A0">Hover和非链接元素</h3> -<p><a class="external" href="http://www.w3.org/TR/CSS2/selector.html#x36">Section 5.11.3 of CSS2</a>定义了三个动态的伪类(<code>:hover</code>, <code>:active</code>, and <code>:focus</code>)，然后继续表示：</p> -<blockquote> - CSS可能不会定义以上那几个状态的元素，或者状态为什么被加入的左派。脚本能否改变产生用户事件的元素，或者不同的设置和使用不同方法的指向以及活动的元素。（翻译的可能不准确，不明白可以看下原文。）</blockquote> -<p>这样，尽管设计者们习惯于过去的想法，将这些状态被应用在专有的超链接上，但它们不是那样有限在CSS2中。理论上任何元素都能达到这三种状态，和基于这样状态的样式。这不是传统上的使用情形。</p> -<h3 id=".E6.9C.AA.E6.8C.87.E5.AE.9A.E7.9A.84.E4.BC.AA.E7.B1.BB" name=".E6.9C.AA.E6.8C.87.E5.AE.9A.E7.9A.84.E4.BC.AA.E7.B1.BB">未指定的伪类</h3> -<p>第二篇的问题来自当我们在一个选择器上考虑使用未指定的伪类的效果时。例如：</p> -<pre>:hover {color: red;}</pre> -<p>这样等效于CSS2的标准：</p> -<pre>*:hover {color: red;}</pre> -<p>哪一个都被解释为“设置任何元素的hover前景色为红色。”所以，段落、表格、标题也在hover范围内，在一个页面中任何其它元素的文本将变成红色。</p> -<p>一个公用未指定的类和伪类的hover一起使用的变量，像这样：</p> -<pre>.nav:hover {color: red;}</pre> -<p>在这种情况，只有实例的<code>class</code>属性的值是<code>nav</code>位置的超链接时候，才能正常工作。无论如何，这种类型的规则经常看见在像这样的联合标记中：</p> -<pre><td class="nav"> -<a href="one.html" class="nav">one</a> | -<a href="two.html" class="nav">two</a> | -<a href="thr.html" class="nav">three</a> | -<a href="fou.html" class="nav">four</a> -</td></pre> -<p>因为装入的表格有一个<code>class</code>的值是<code>nav</code>，所以当用户的鼠标移动到那个单元里面，竖线字符将会变成红色。链接将会在它们hover的时候变成红色。</p> -<h3 id="Gecko.E7.9A.84.E8.A1.8C.E4.B8.BA" name="Gecko.E7.9A.84.E8.A1.8C.E4.B8.BA">Gecko的行为</h3> -<p>在基于Netscape Gecko的20020410(Netscape 6.1+)版本后构建的浏览器中，<code>:hover</code>样式可应用于页面中的任意标签。这样设计者们可以使用未限定的伪类，或者使用未限定的类伪类的这种结合，这样做会出现可见的hover样式的应用会多于它们应有链接的危险。最可靠的解决方法是为选择器添加一个锚元素，像这样：</p> -<pre>a:hover {color: red;} -a.nav:hover {color: red;}</pre> -<p>在基于Mozilla 1.0和更新版本(Netscape 7+)的浏览器中包含试图消除老文档遗留的问题的代码。如果页面运行在“转换显示”模式中，未限定的伪类将受限制只能用于链接。在基于Mozilla 1.3b及更新版本构建的浏览器中，这个转换显示被延伸包括了选择器，关于<code>:hover</code>伪类结合一个未限定的类选择器（详细资料可以查看Bugzilla上的#169078条目）。</p> -<h3 id=".E5.91.BD.E5.90.8D.E9.94.9A.E8.AE.B0.E7.9A.84.E9.97.AE.E9.A2.98" name=".E5.91.BD.E5.90.8D.E9.94.9A.E8.AE.B0.E7.9A.84.E9.97.AE.E9.A2.98">命名锚记的问题</h3> -<p>除了先前的描述效果之外，有两个其它的相关公共效果可能不是设计者期待的。其中一个被确认容易固定，但另一个有一些微妙。</p> -<p>首先，这个问题是设计者打开一个指定的锚记，但它没有关闭。例如：</p> -<pre><a name="pagetop"> -<h2>My Page</h2></pre> -<p>没有a <code></a></code>，这个锚记将在整个文档中有效。这样通常的意思是将获取页面中的hover样式。考虑到以下规则的效果：</p> -<pre>a:hover {color: red;}</pre> -<p>在一个文档中有一个未关闭的锚记，那么任何文本的样式将是设计者打开标记的前景颜色（除非其它CSS规则干涉）。</p> -<p>这里提出的第二个公用问题，哪一个锚记能接受hover样式。虽然，设计者们可能打算把选择器<code>a:hover</code>只应用于超链接，它也将应用于锚记，因为选择器只是规定所有的<code>a</code>元素应用哪一个hover样式。为了消除这个问题，设计者应该使用混合的伪类语法来描述CSS2：</p> -<pre>a:link:hover {color: red;} -a:visited:hover {color: maroon;}</pre> -<p>注意像这样的语法，问题是当它们hover时，visit和未visit时链接不同。以<code>a:hover</code>为基础时这不是一个问题。当然，这个选择器<code>a:link:hover</code>将只应用于未visit的链接，所以设计者需要一样的样式同时应用于visit和未visit的链接，应该组织把2个选择器放在单一的规则中。</p> -<h3 id=".E6.8E.A8.E8.8D.90" name=".E6.8E.A8.E8.8D.90">推荐</h3> -<p>为了避免未预料的问题，设计者们被鼓励在打算用于超链接的动态伪类中包含元素名，以提高<b>健壮性</b>。此外，混合伪类要预防hover样式被用于非链接的锚。因此，以a:hover的基础为首选<code>a:hover</code>应该总是代替刚才的<code>:hover</code>和<code>a:link:hover</code>（和<code>a:visited:hover</code>）。</p> -<h3 id=".E7.9B.B8.E5.85.B3.E9.93.BE.E6.8E.A5" name=".E7.9B.B8.E5.85.B3.E9.93.BE.E6.8E.A5">相关链接</h3> -<ul> - <li><a class="external" href="http://www.w3.org/TR/CSS2/selector.html#x36">The dynamic pseudo-classes: :hover, :active, and :focus</a></li> -</ul> -<div class="originaldocinfo"> - <h3 id=".E6.96.87.E7.AB.A0.E5.8E.9F.E5.A7.8B.E4.BF.A1.E6.81.AF" name=".E6.96.87.E7.AB.A0.E5.8E.9F.E5.A7.8B.E4.BF.A1.E6.81.AF">文章原始信息</h3> - <ul> - <li>作者: Eric A. Meyer, Netscape Communications</li> - <li>最后更新: Published 07 Mar 2003; Revised 21 Mar 2003</li> - <li>版权信息: Copyright © 2001-2003 Netscape. All rights reserved.</li> - <li>注意: This reprinted article was originally part of the DevEdge site.</li> - </ul> -</div> -<p> </p> diff --git a/files/zh-cn/archive/web_标准/rdf_in_mozilla_faq/index.html b/files/zh-cn/archive/web_标准/rdf_in_mozilla_faq/index.html deleted file mode 100644 index d6df231e2d..0000000000 --- a/files/zh-cn/archive/web_标准/rdf_in_mozilla_faq/index.html +++ /dev/null @@ -1,320 +0,0 @@ ---- -title: RDF 问题集 -slug: Archive/Web_标准/RDF_in_Mozilla_FAQ -tags: - - RDF -translation_of: Archive/Web_Standards/RDF_in_Mozilla_FAQ ---- -<p> </p> -<h2 id="General" name="General">General</h2> -<h3 id="Where_do_I_start.3F" name="Where_do_I_start.3F">Where do I start?</h3> -<p><a href="cn/RDF">RDF</a> serves two primary purposes in Mozilla. First, it is a simple, cross-platform database for small data stores. Second, and more importantly, the RDF model is used along with <a href="cn/XUL/Template_Guide">XUL templates</a> as an abstract "API" for displaying information. <a href="cn/RDF_in_Fifty_Words_or_Less">RDF in Fifty Words or Less</a> is a quick, high-level description of what RDF does in Mozilla. The <a href="cn/RDF_Back-end_Architecture_(external)">RDF Back-end Architecture</a> document describes in more detail how Mozilla's RDF implementation works, and gives a quick overview of the interfaces that are involved.</p> -<h3 id="Where_do_I_find_information_on_Open_Directory_.28.22dmoz.22.29.3F" name="Where_do_I_find_information_on_Open_Directory_.28.22dmoz.22.29.3F">Where do I find information on Open Directory ("dmoz")?</h3> -<p>Unfortunately, <em>not here</em>! Well, here's a little... Start at <a class="external" href="http://www.dmoz.org/" rel="freelink">http://www.dmoz.org/</a> for more information on the Open Directory. The Open Directory dataset is available as a (huge) RDF/XML dump. It describes thousands of Web sites using a mix of the <a class="external" href="http://www.dublincore.org/">Dublin Core</a> metadata vocabulary and the DMoz taxonomy. See <a class="external" href="http://dmoz.org/rdf.html">their RDF pages</a> for more information, or <a class="external" href="http://groups.yahoo.com/group/odp-rdf-announce/">odp-rdf-announce</a> for updates relating to their exact data format. The <a class="external" href="http://chefmoz.org/">ChefMoz</a> site (collaborative restaurant guide) is also <a class="external" href="http://chefmoz.org/rdf.html">available in RDF</a>.</p> -<p>If you have problems with the DMoz and ChefMoz data, it's best to contact those projects directly. But if you do something interesting with this content (eg. have Mozilla use it, eg. by loading chunks of it into a XUL UI from a remote site), don't forget to let <a class="link-mailto" href="mailto:mozilla-rdf@mozilla.org">mozilla-rdf</a> and the <a class="link-mailto" href="mailto:www-rdf-interest@w3.org">RDF Interest Group</a> lists know. Those lists would probably also be interested in tools for cleaning / re-processing / storing the DMoz data too. See the <a class="external" href="http://dmoz.org/Computers/Internet/Searching/Directories/Open_Directory_Project/Use_of_ODP_Data/">sites using ODP data</a> pages for some directories based on the ODP RDF dumps.</p> -<h3 id="What_is_a_datasource.3F" name="What_is_a_datasource.3F">What is a datasource?</h3> -<p>RDF can generally be viewed in two ways: either as a graph with nodes and arcs, or as a "soup" of logical statements. A datasource is a subgraph (or collection of statements, depending on your viewpoint) that are for some reason collected together. Some examples of datasources that exist today are "browser bookmarks", "browser global history", "IMAP mail accounts", "NNTP news servers", and "RDF/XML files".</p> -<p>In Mozilla, datasources can be <em>composed</em> together using the <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFCompositeDataSource.idl">composite data source</a>. This is like overlaying graphs, or merging collections of statements ("microtheories") together. Statements about the same RDF <em>resource</em> can then be intermingled: for example, the "last visit date" of a particular website comes from the "browser global history" datasource, and the "shortcut keyword" that you can type to reach that website comes from the "browser bookmarks" datasource. Both datasources refer to "website" by URL: this is the "key" that allows the datasources to be "merged" effectively.</p> -<p>For a more detailed account of how to <em>write</em> a datasource, refer to the <a href="cn/RDF_Datasource_How-To">RDF Datasource How-To</a>.</p> -<h3 id="How_does_Mozilla_manage_datasources.3F" name="How_does_Mozilla_manage_datasources.3F">How does Mozilla manage datasources?</h3> -<p>The <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFService.idl">RDF service</a> manages a table of all loaded datasources. The table is keyed by the datasource's "URI", which is either the URL of an RDF/XML file, or a "special" URI starting with <code>rdf:</code> that refers to a built-in datasource.</p> -<p>Datasources may be loaded via the RDF service using the <code>GetDataSource()</code> method. If the URI argument refers to an RDF/XML file's URL, then the RDF service will create an <em>RDF/XML datasource</em> and asynchronously parse it. The datasource will remain "cached" until the last reference to the datasource is released.</p> -<p>If the URI argument refers to a built-in datasource, the RDF service will use the XPCOM <em>Component Manager</em> to load a component whose <em>ContractID</em> is constructed using the "special" URI and the well-known <a class="link-mailto" href="mailto:prefix@mozilla.org" rel="freelink">prefix@mozilla.org</a>/rdf/datasource;1?name=</code>.</p> -<p>For example,</p> -<pre class="eval">rdf:foo -</pre> -<p>Would load:</p> -<pre class="eval">@mozilla.org/rdf/datasource;1?name=foo -</pre> -<p>As with RDF/XML datasources, a datasource that is retrieved this way is "cached" by the RDF service until the last reference is dropped.</p> -<h3 id="How_do_I_create_a_datasource_from_an_RDF.2FXML_file.3F" name="How_do_I_create_a_datasource_from_an_RDF.2FXML_file.3F">How do I create a datasource from an RDF/XML file?</h3> -<p>You can either create an RDF/XML datasource using the <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFService.idl">RDF service</a>'s <code>GetDataSource()</code> method:</p> -<pre class="eval"><span class="highlightblue">// Get the RDF service</span> -var RDF = - Components - .classes["@mozilla.org/rdf/rdf-service;1"] - .getService(Components.interfaces.nsIRDFService); -<span class="highlightblue">// ...and from it, get the datasource. Make sure that your web server -// dishes it up as <b>text/xml</b> (recommended) or <b>text/rdf</b>!</span> -var ds = RDF.GetDataSource("<a class="external" href="http://www.mozilla.org/some-rdf-file.rdf" rel="freelink">http://www.mozilla.org/some-rdf-file.rdf</a>"); -<span class="highlightblue">// Note that <b>ds</b> will load asynchronously, so assertions will not -// be immediately available</span> -</pre> -<p>Alternatively, you can create one directly using the XPCOM Component Manager, as the following code fragment illustrates:</p> -<pre class="eval"><span class="highlightblue">// Create an RDF/XML datasource using the XPCOM Component Manager</span> -var ds = - Components - .classes["@mozilla.org/rdf/datasource;1?name=xml-datasource"] - .createInstance(Components.interfaces.nsIRDFDataSource); -<span class="highlightblue">// The <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFRemoteDataSource.idl">nsIRDFRemoteDataSource</a> interface has the interfaces -// that we need to setup the datasource.</span> -var remote = - ds.QueryInterface(Components.interfaces.nsIRDFRemoteDataSource); -<span class="highlightblue">// Be sure that your web server will deliver this as <b>text/xml</b> (recommended) or <b>text/rdf</b>!</span> -remote.Init("<a class="external" href="http://www.mozilla.org/some-rdf-file.rdf" rel="freelink">http://www.mozilla.org/some-rdf-file.rdf</a>"); -<span class="highlightblue">// Make it load! Note that this will happen asynchronously. By setting -// <b>aBlocking</b> to true, we could force it to be synchronous, but this -// is generally a bad idea, because your UI will completely lock up!</span> -remote.Refresh(false); -<span class="highlightblue">// Note that <b>ds</b> will load asynchronously, so assertions will not -// be immediately available</span> -</pre> -<p>You may decide that you need to "manually" create an RDF/XML datasource if you want to force it to load synchronously.</p> -<h3 id="How_do_I_reload_an_RDF.2FXML_datasource.3F" name="How_do_I_reload_an_RDF.2FXML_datasource.3F">How do I reload an RDF/XML datasource?</h3> -<p>You can force an RDF/XML datasource (or any datasource that supports <a class="external" href="http://lxr.mozilla.org/mozilla/source/source/rdf/base/idl/nsIRDFRemoteDataSource.idl"><code>nsIRDFRemoteDataSource</code></a>) using <code>Refresh()</code> method of <code>nsIRDFRemoteDataSource</code>. <code>Refresh()</code> takes a single parameter that indicates whether you'd like it to perform its operation synchronously ("blocking") or asynchrounously ("non-blocking"). You should <em>never</em> do a synchronous load unless you <em>really</em> know what you're doing: this will freeze the UI until the load completes!</p> -<h3 id="How_can_I_tell_if_an_RDF.2FXML_datasource_has_loaded.3F" name="How_can_I_tell_if_an_RDF.2FXML_datasource_has_loaded.3F">How can I tell if an RDF/XML datasource has loaded?</h3> -<p>Using the <a class="external" href="http://lxr.mozilla.org/mozilla/source/source/rdf/base/idl/nsIRDFRemoteDataSource.idl"><code>nsIRDFRemoteDataSource</code></a> interface, it is possible to immediately query the <code>loaded</code> property to determine if the datasource has loaded or not:</p> -<pre class="eval"><span class="highlightblue">// Get the RDF service</span> -var RDF = - Components - .classes["@mozilla.org/rdf/rdf-service;1"] - .getService(Components.interfaces.nsIRDFService); -<span class="highlightblue">// Get the datasource.</span> -var ds = RDF.GetDataSource("<a class="external" href="http://www.mozilla.org/some-rdf-file.rdf" rel="freelink">http://www.mozilla.org/some-rdf-file.rdf</a>"); -<span class="highlightblue">// Now see if it's loaded or not...</span> -var remote = - ds.QueryInterface(Components.interfaces.nsIRDFRemoteDataSource); - -if (remote.loaded) { - alert("the datasource was already loaded!"); -} -else { - alert("the datasource wasn't loaded, but it's loading now!"); -} -</pre> -<p>Say the datasource <em>wasn't</em> loaded, and is loading asynchronously. Using this API and JavaScript's <code>setTimeout()</code>, one could set up a <em>polling loop</em> that would continually check the <code>loaded</code> property. This is kludgy, and even worse, won't detect a <em>failed</em> load, for example, if there wasn't any data at the URL!</p> -<p>For this reason, there is an <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFXMLSink.idl">observer interface</a> that allows you to spy on a datasource's progress. The following code illustrates its usage:</p> -<pre class="eval"><span class="highlightblue">// This is the object that will observe the RDF/XML load's progress</span> -var Observer = { - onBeginLoad: function(aSink) - {}, - - onInterrupt: function(aSink) - {}, - - onResume: function(aSink) - {}, - - onEndLoad: function(aSink) - { alert("done!"); }, - - onError: function(aSink, aStatus, aErrorMsg) - { alert("error! " + aErrorMsg); } -}; -<span class="highlightblue">// Get the RDF service</span> -var RDF = - Components - .classes["@mozilla.org/rdf/rdf-service;1"] - .getService(Components.interfaces.nsIRDFService); -<span class="highlightblue">// Get the datasource.</span> -var ds = RDF.GetDataSource("<a class="external" href="http://www.mozilla.org/some-rdf-file.rdf" rel="freelink">http://www.mozilla.org/some-rdf-file.rdf</a>"); -<span class="highlightblue">// Now see if it's loaded or not...</span> -var remote = - ds.QueryInterface(Components.interfaces.nsIRDFRemoteDataSource); - -if (remote.loaded) { - alert("the datasource was already loaded!"); -} -else { - alert("the datasource wasn't loaded, but it's loading now!"); - <span class="highlightblue">// RDF/XML Datasources are all <b>nsIRDFXMLSink</b>s</span> - var sink = - ds.QueryInterface(Components.interfaces.nsIRDFXMLSink); - <span class="highlightblue">// Attach the observer to the datasource-as-sink</span> - sink.addXMLSinkObserver(Observer); - <span class="highlightblue">// Now <b>Observer'</b>s methods will be called-back as - // the load progresses.</span> -} -</pre> -<p>Note that the observer will remain attached to the RDF/XML datasource unless <code>removeXMLSinkObserver</code> is called.</p> -<h3 id="How_do_I_access_the_information_in_a_datasource.3F" name="How_do_I_access_the_information_in_a_datasource.3F">How do I access the information in a datasource?</h3> -<p>The <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFDataSource.idl"><code>nsIRDFDataSource</code></a> interface is the means by which you access and manipulate the assertions in a datasource.</p> -<ul> - <li><code>boolean HasAssertion(aSource, aProperty, aTarget, aTruthValue)</code>.<br> - This tests the datasource to see if it has the specified tuple.</li> - <li><code>nsIRDFNode GetTarget(aSource, aProperty, aTruthValue)</code>.</li> - <li><code>nsISimpleEnumerator GetTargets(aSource, aProperty, aTruthValue)</code>.</li> - <li><code>nsIRDFResource GetSource(aProperty, aTarget, aTruthValue)</code>.</li> - <li><code>nsISimpleEnumerator GetSources(aProperty, aTarget, aTruthValue)</code>.</li> - <li><code>nsISimpleEnumerator ArcLabelsIn(aTarget)</code>.</li> - <li><code>nsISimpleEnumerator ArcLabelsOut(aSource)</code>.</li> -</ul> -<p>You can also use the <a href="#How_do_I_manipulate_RDF_.22containers.22.3F">RDF container</a> interfaces to access information contained in RDF <em>containers</em>.</p> -<h3 id="How_do_I_change_information_in_the_datasource.3F" name="How_do_I_change_information_in_the_datasource.3F">How do I change information in the datasource?</h3> -<p>To use 'Assert' to add one assertion and 'Unassert' to remove one. Refer to <a class="external" href="http://www.mozilla.org/rdf/back-end-architecture.html">Mozilla RDF Back end Architecture</a></p> -<pre class="eval">ds.Assert(homepage, FV_quality, value, true); -ds.Unassert(homepage, FV_quality, value, true); -</pre> -<h3 id="How_do_I_save_changes_to_an_RDF.2FXML_datasource_back.3F" name="How_do_I_save_changes_to_an_RDF.2FXML_datasource_back.3F">How do I save changes to an RDF/XML datasource back?</h3> -<p>An RDF/XML datasource can be <code>QueryInterface()</code>'d to <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFRemoteDataSource.idl"><code>nsIRDFRemoteDataSource</code></a>. This interface has a <code>Flush()</code> method, which will attempt to write the contents of the datasource back to the URL from which they were loaded, using a protocol specific mechanism (e.g., a <code>file:</code> URL just writes the file; an <code>http:</code> URL might do an HTTP-POST). <code>Flush()</code> only writes the datasource if its contents have changed.</p> -<h3 id="How_do_I_merge_two_or_more_datasources_to_view_them_as_one.3F" name="How_do_I_merge_two_or_more_datasources_to_view_them_as_one.3F">How do I merge two or more datasources to view them as one?</h3> -<p>Use nsIRDFCompositeDataSource. This interface is derived from nsIRDFDataSource. An implementation of this interface will typically combine the statements from several datasources together as a collective. Because the nsIRDFCompositeDataSource interface is derived from nsIRDFDataSource, it can be queried and modified just like an individual data source.</p> -<h3 id="How_do_I_access_.22built-in.22_datasources.3F" name="How_do_I_access_.22built-in.22_datasources.3F">How do I access "built-in" datasources?</h3> -<p>A <em>built-in datasource</em> is a locally-installed component that implements <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFDataSource.idl">nsIRDFDataSource</a>. For example, the <a class="external" href="http://lxr.mozilla.org/mozilla/source/xpfe/components/bookmarks/src/nsBookmarksService.cpp">bookmarks service</a>. First, check <a href="#What_is_the_security_model_for_RDF.2FXML_in_XUL.3F">here</a> to make sure you will be <em>allowed</em> to access a built-in datasource. There are several security restrictions on accessing built-in datasources from "untrusted" XUL and JS.</p> -<p>Since a built-in datasource is just an XPCOM component, you can instantiate it directly using the XPConnect component manager.</p> -<pre class="eval">// Use the component manager to get the bookmarks service -<span class="highlightgreen">var bookmarks = - Components. - classes["@mozilla.org/rdf/datasource;1?name=bookmarks"]. - getService(Components.interfaces.nsIRDFDataSource);</span> - -// Now do something interesting with it... -if (bookmarks.HasAssertion( - RDF.GetResource("<a class="external" href="http://home.netscape.com/NC-rdf#BookmarksRoot" rel="freelink">http://home.netscape.com/NC-rdf#BookmarksRoot</a>"), - RDF.GetResource("<a class="external" href="http://home.netscape.com/NC-rdf#child" rel="freelink">http://home.netscape.com/NC-rdf#child</a>"), - RDF.GetResource("<a class="external" href="http://home.netscape.com/NC-rdf#PersonalToolbarFolder" rel="freelink">http://home.netscape.com/NC-rdf#PersonalToolbarFolder</a>"), - true) { - // ... -} -</pre> -<p>Alternatively, some datasources have "special" RDF-friendly ContractIDs that make it easy to instantiate the datasource using either the <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFService.idl"><code>nsIRDFSerivce</code></a>'s <code>GetDataSource()</code> method or the <code>datasources</code> attribute on a XUL template. These ContractIDs are of the form</p> -<pre class="eval">@mozilla.org/rdf/datasource;1?name=<i>name</i> -</pre> -<p>And are accessable via <code>GetDataSource()</code> and the <code>datasources</code> attribute using the shorthand <code>rdf: - <i> - name</i> - </code>. For example, the following XUL fragment illustrates how to add the bookmarks service as a datasource into a XUL template.</p> -<pre class="eval"><tree datasources="rdf:bookmarks"> - ... -</tree> -</pre> -<h3 id="How_do_I_manipulate_RDF_.22containers.22.3F" name="How_do_I_manipulate_RDF_.22containers.22.3F">How do I manipulate RDF "containers"?</h3> -<p>To manipulate an RDF "container" (an <code><rdf:Seq></code>, for example), you can use <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFContainerUtils.idl"><code>nsIRDFContainerUtils</code></a> which can be instantiated as a service with the following ContractID:</p> -<pre class="eval">@mozilla.org/rdf/container-utils;1 -</pre> -<p>You can use this service to detect if something is an RDF container using <code>IsSeq()</code>, <code>IsBag()</code>, and <code>IsAlt()</code>. You can "make a resource into a container" if it isn't one already using <code>MakeSeq()</code>, <code>MakeBag()</code>, or <code>MakeAlt()</code>. These methods return an <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFContainer.idl"><code>nsIRDFContainer</code></a> which allows you to do container-like operations without getting your hands too dirty.</p> -<p>Alternatively, if your datasource already has an object that <em>is</em> an RDF container, you can instantiate an <code>nsIRDFContainer</code> object with the</p> -<pre class="eval">@mozilla.org/rdf/container;1 -</pre> -<p>ContractID and <code>Init()</code> it with the datasource and resource as parameters. Note that this will fail if the resource isn't already a container.</p> -<h2 id="XUL_Templates" name="XUL_Templates">XUL Templates</h2> -<p>XUL templates are created by specifying a <code>datsources</code> attribute on an element in a XUL document.</p> -<p>There are two "forms" that XUL templates may be written in. The "simple" form, which is currently the most common form in the Mozilla codebase, and the "extended" form, which allows for sophisticated pattern matching against the RDF graph. See the <a href="cn/XUL/Template_Guide">XUL:Template Guide</a>. (These are bizarrely arranged because the <em>eventual</em> intent is to introduce templates using the extended form -- which in many ways is conceptually simpler, even if more verbose -- and then treat the "simple" form as a shorthand for the extended form.)</p> -<h3 id="What_can_I_build_with_a_XUL_template.3F" name="What_can_I_build_with_a_XUL_template.3F">What can I build with a XUL template?</h3> -<p>You can build <em>any</em> kind of content using a XUL template. You may use any kind of tag (including HTML, or arbitrary XML) in the <code><action></code> section of a <code><rule></code>.</p> -<h3 id="When_should_I_use_a_XUL_template.3F" name="When_should_I_use_a_XUL_template.3F">When should I use a XUL template?</h3> -<p>One alternative to using RDF and XUL templates is to use the <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/">W3C DOM APIs</a> to build up and manipulate a XUL (or HTML) content model. There are times, however, when doing so may be inconvenient:</p> -<ol> - <li><em>There are several "views" of the data</em>. For example, Mozilla mail/news reveals the folder hierarchy in the toolbar, the "folder pane", in several menus, and in some of the dialogs. Rather than writing three pieces of JS (or C++) code to construct the DOM trees each for <code><menubutton></code>, <code><menu></code>, and <code><tree></code> content models, you write three compact sets of rules for each content model.</li> - <li><em>The data can change</em>. For example, a mail/news user may add or remove IMAP folders. (Note how this requirement complicates the task of building a content model!) The XUL template builder uses the rules to automatically keep <em>all</em> content models in sync with your changes.</li> -</ol> -<p>In order to take advantage of this functionality, you must of course be able to express your information in terms of the <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFDataSource.idl">RDF datasource API</a>, either by using the built-in <em>memory datasource</em>, using RDF/XML to store your information, or writing your own implementation (possibly in JavaScript) of <code>nsIRDFDataSource</code>.</p> -<h3 id="What_gets_loaded_when_I_specify_.22datasources.3D.22" name="What_gets_loaded_when_I_specify_.22datasources.3D.22">What gets loaded when I specify "datasources="</h3> -<p>The <code>datasources</code> attribute on the "root" of a template specifies a whitespace-separated list of <em>datasource URIs</em> to load. But what is a "datasource URI"? It is either:</p> -<ul> - <li>An abbreviated ContractID for a locally installed component. By specifying <code>rdf: - <i> - name</i> - </code>, you instruct the template builder to load the XPCOM component with the ContractID <code>@mozilla.org/rdf/datasource;1?name= - <i> - name</i> - </code>.</li> - <li>The URL of an RDF/XML file. For example, - <pre>file:///tmp/foo.rdf -chrome://mycomponent/content/component-data.rdf -http://www.mysite.com/generate-rdf.cgi -ftp://ftp.somewhere.org/toc.rdf -</pre> - <p>The load will be processed <em>asynchronously</em>, and as RDF/XML arrives, the template builder will generate content.</p> - </li> -</ul> -<p>In either case, the datasource will be loaded using the <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFService.idl"><code>nsIRDFService</code></a>'s <code>GetDataSource()</code> method, so it will be <a href="#How_does_Mozilla_manage_datasources.3F">managed</a> similarly to all other datasources loaded this way.</p> -<h3 id="What_is_the_security_model_for_RDF.2FXML_in_XUL.3F" name="What_is_the_security_model_for_RDF.2FXML_in_XUL.3F">What is the security model for RDF/XML in XUL?</h3> -<p>XUL that is loaded from a "trusted" URL (currently, any <code>chrome:</code> URL) can specify <em>any</em> datasource URI in the <code>datasources</code> attribute of the XUL template.</p> -<p>XUL that is loaded from an "untrusted" URL can only specify an RDF/XML document from the same <em>codebase</em> (in the Java sense of the word) that the XUL document originated from. No "special" (i.e., <code>rdf:</code>) datasources may be loaded from untrusted XUL.</p> -<h3 id="How_do_I_add_a_datasource_to_a_XUL_template.3F" name="How_do_I_add_a_datasource_to_a_XUL_template.3F">How do I add a datasource to a XUL template?</h3> -<p>Although it's possible to create a XUL template with an "implicit" set of datasources by specifying the <code>datasources</code> attribute, there are often times when you won't know the datasource that you want to add until <em>after</em> the XUL is loaded. For example, your XUL may need compute the datasources that it wants to display in an <code>onload</code> handler. Or, it may need to add a datasource later based on some user action.</p> -<p>Here's a simple example that illustrates how to do this. Let's start with the following XUL.</p> -<pre class="eval"><window xmlns="<a class="external" href="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" rel="freelink">http://www.mozilla.org/keymaster/gat...re.is.only.xul</a>"> - ... - <span class="highlightgreen"><tree id="my-tree" datasources="rdf:null"> - ... - </tree></span> - ... -</window> -</pre> -<p>Assuming that we've aquired a datasource somehow (e.g., like <a href="#How_do_I_create_a_datasource_from_an_RDF.2FXML_file.3F">this</a>), the following sample code illustrates how to <em>add</em> that datasource to the template, and then force the template to rebuild itself based on the newly added datasource's contents.</p> -<pre class="eval">var ds = <span class="highlightblue">/* assume we got this somehow! */</span>; -<span class="highlightblue">// Get the DOM element for 'my-tree'</span> -var tree = document.getElementById('my-tree'); -<span class="highlightblue">// Add our datasource to it</span> -tree.database.AddDataSource(ds); -<span class="highlightblue">// Force the tree to rebuild *now*. You have to do this "manually"!</span> -tree.builder.rebuild(); -</pre> -<p>Any XUL element with a <code>datasources</code> attribute will "get" a <code>database</code> property and a <code>builder</code> property. The <code>database</code> property refers to an <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIRDFCompositeDataSource.idl"><code>nsIRDFCompositeDataSource</code></a> object, which is contains the datasources from which the template is built.</p> -<p>The <code>builder</code> property refers to an <a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/base/idl/nsIXULTemplateBuilder.idl"><code>nsIXULTemplateBuilder</code></a> object, which is a the "builder" that maintains the state of the template's contents.</p> -<p>Note the <code>rdf:null</code> datasource: this is a special datasource that says, "hey, I don't have a datasource for you yet, but I'm going to add one later, so set yourself up for it!" It causes the <code>database</code> and <code>builder</code> properties to get installed, but leaves the <code>database</code> empty of datasources: you've got to add these in yourself!</p> -<h3 id="Can_I_manipulate_a_XUL_template_using_the_DOM_APIs.3F" name="Can_I_manipulate_a_XUL_template_using_the_DOM_APIs.3F">Can I manipulate a XUL template using the DOM APIs?</h3> -<p>Yes: you can add rules, remove rules, change a rule's conditions, and change the content that is built by a rule. In fact, you can change <em>anything</em> about a template using the <a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/">W3C DOM APIs</a>.</p> -<p>The only caveat is that you must call <code>rebuild()</code> before the changes you've made will take effect (just as you must if you <a href="#How_do_I_add_a_datasource_to_a_XUL_template.3F">add a datasource</a> to the XUL template).</p> -<h3 id="How_do_I_insert_plaintext_from_a_template.3F" name="How_do_I_insert_plaintext_from_a_template.3F">How do I insert plaintext from a template?</h3> -<p>To insert plaintext in a template, use the <code><text></code> element.</p> -<pre class="eval"><template> - <rule> - <conditions>...</condition> - <bindings>...</bindings> - <action> - <span class="highlightgreen"><text value="?some-variable" /></span> - </action> - </rule> -</template> -</pre> -<p>The above template will create a content model that runs a series of text nodes together.</p> -<h2 id="Troubleshooting" name="Troubleshooting">Troubleshooting</h2> -<p>Tricks and tips from the field.</p> -<h3 id="My_RDF.2FXML_file_won.27t_load." name="My_RDF.2FXML_file_won.27t_load.">My RDF/XML file won't load.</h3> -<p>The most common cause for RDF/XML not to load from a web server is incorrect MIME type. Make sure your server is delivering the file as <code>text/xml</code> (recommended) or <code>text/rdf</code> (bogus).</p> -<p>Note that the W3C RDF Core WG are registering application/rdf+xml, though this isn't understood by any Mozilla code yet. (do we have a bug registered to track this? -- <a class="link-mailto" href="mailto:danbri-mozilla@rdfweb.org">danbri</a>)</p> -<p>Another possible problem: for remotely-loaded XUL and RDF, you might need to adjust Mozilla's security restrictions (see belowfor example code). If XUL isn't loading your RDF, and the mimetype is OK, this could well be your problem.</p> -<p>You can use the <code>rdfcat</code> and <code>rdfpoll</code> utilities to verify that the RDF/XML is actually valid. Both of these programs are built by default on Windows, and on Linux when the <code>configure --enable-tests</code> is specified.</p> -<ul> - <li><code><a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/tests/rdfcat/rdfcat.cpp">rdfcat</a> - <i> - url</i> - </code><br> - Takes as a parameter a URL from which to read an RDF/XML file, and will "cat" the file back to the console. You can use it to verify that the RDF/XML that you've written is being properly parsed by Mozilla.</li> - <li><code><a class="external" href="http://lxr.mozilla.org/mozilla/source/rdf/tests/rdfpoll/rdfpoll.cpp">rdfpoll</a> - <i> - url</i> - [ - <i> - interval</i> - ]</code><br> - Takes as a parameter a URL from which to read an RDF/XML file. It also accepts an optional <em>poll interval</em>, where it will re-load the URL. It outputs the assertions that are generated from each load. Note that a polling reload generates a set of <em>differences</em> between the current and previous contents of the RDF/XML file. This is useful for debugging generated RDF/XML that may change over time.</li> -</ul> -<p>Both these programs are slow to load and run (but they <em>will</em> run, eventually). They initialize XPCOM and bring up Necko to be able to load and process URLs just like Mozilla does.</p> -<h3 id="Nothing_happens_after_I_call_AddDataSource." name="Nothing_happens_after_I_call_AddDataSource.">Nothing happens after I call AddDataSource.</h3> -<p>Note that the template builder will <em>not</em> rebuild the contents of a template automatically after <code>AddDataSource</code> or <code>RemoveDataSource</code> have been called on the builder's <code>database</code>. To refresh the template's contents, you must manually call <code> - <i> - elt.</i> - builder.rebuild()</code> yourself.</p> -<p>Why? This was done to avoid multiple rebuilds when more than one datasource is added to the <code>database</code>.</p> -<h2 id="Examples" name="Examples">Examples</h2> -<h3 id="Where_can_I_find_some_.28working.29_examples.3F" name="Where_can_I_find_some_.28working.29_examples.3F">Where can I find some (working) examples?</h3> -<p>A few examples are posted <a class="external" href="http://www.mozilla.org/rdf/doc/examples.html">here</a>. Some of these are included in signed scripts, and are runnable from HTTP directly.</p> -<p>See also <a class="link-https" href="https://bugzilla.mozilla.org/data/duplicates.rdf"><code>duplicates.rdf</code></a> (for live RDF feed from Mozilla) alongside <a class="link-https" href="https://bugzilla.mozilla.org/duplicates.xul"><code>duplicates.xul</code></a>. Note that for these to work, you have to relax Mozilla's <a href="cn/Bypassing_Security_Restrictions_and_Signing_Code">security model</a>. To do this, add the following line to your preferences file. (Shut down Mozilla first since it overwrites your preferences file when you quit.)</p> -<pre class="eval">user_pref("signed.applets.codebase_principal_support", true); -</pre> -<p>Mozilla will ask you if you want to grant the scripts in <code>duplicates.xul</code> permission to access XPConnect; respond in the affirmative.</p> -<p>Currently, Mozilla does not allow unprivileged access to the RDF interfaces and services; see bug <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=122846">122846</a> for details.</p> -<p>Please mail <a class="external" href="http://rdfweb.org/people/danbri/">danbri</a>, mozilla-rdf or waterson with URLs if you are aware of other examples to which we ought to link!</p> -<h2 id="Notes" name="Notes">Notes</h2> -<ol> - <li>See also <a class="external" href="http://www.w3.org/RDF/">W3C RDF</a> and <a class="external" href="http://www.w3.org/2001/sw/">Semantic Web</a> pages for more information on RDF and related technologies.</li> -</ol> -<h2 id="Contributors" name="Contributors">Contributors</h2> -<ul> - <li>Examples section added 2002-07-02 by <a class="external" href="http://rdfweb.org/people/danbri/">danbri</a> </li></li> - <li>Thanks to Myk Melez for notes on remote XUL / security policy</li> -</ul> -<p>Author: <a class="link-mailto" href="mailto:waterson@netscape.com">Chris Waterson</a></p> -<div class="originaldocinfo"> - <h2 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h2> - <ul> - <li>Author(s): <a class="link-mailto" href="mailto:waterson@netscape.com">Chris Waterson</a></li> - <li>Last Updated Date: December 22, 2004</li> - <li>Copyright Information: Copyright (C) <a class="link-mailto" href="mailto:waterson@netscape.com">Chris Waterson</a></li> - </ul> -</div> -<p></p> diff --git a/files/zh-cn/archive/web_标准/using_the_right_markup_to_invoke_plugins/index.html b/files/zh-cn/archive/web_标准/using_the_right_markup_to_invoke_plugins/index.html deleted file mode 100644 index 2642ff72b1..0000000000 --- a/files/zh-cn/archive/web_标准/using_the_right_markup_to_invoke_plugins/index.html +++ /dev/null @@ -1,264 +0,0 @@ ---- -title: 用正确的标识来调用插件 -slug: Archive/Web_标准/Using_the_Right_Markup_to_Invoke_Plugins -tags: - - HTML - - Plugins - - 全部分类 -translation_of: Archive/Web_Standards/Using_the_Right_Markup_to_Invoke_Plugins ---- -<p><small>这篇文章介绍怎样使用正确的HTML来调用插件.讨论了对象元素及其嵌入元素,以及在网页中使用恰当的HTML来调用Java的细节.</small></p> - -<h3 id="The_Object_Element:_W3C_Standards_and_Cross-Browser_Issues" name="The_Object_Element:_W3C_Standards_and_Cross-Browser_Issues">对象元素 Object Element: W3C标准及跨浏览器问题</h3> - -<p>对象元素是HTML 4.01规范的一部分, 是被推荐的调用插件的机制. Its use is subject to a few caveats that this section outlines.</p> - -<p>Traditionally, the object element has been used differently by Microsoft Internet Explorer and by Mozilla-based browsers such as Netscape 7. In IE, the object element is used to invoke a plugin that is built on the ActiveX architecture. Here's an example of this kind of usage for IE:</p> - -<pre><!-- IE ONLY CODE --> -<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" -codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" -width="366" height="142" id="myFlash"> - <param name="movie" value="javascript-to-flash.swf" /> - <param name="quality" value="high" /> - <param name="swliveconnect" value="true" /> -</object> -</pre> - -<p>In the above example, the <code>classid</code> attribute that goes along with the object element points to a "clsid:" URN followed by the Unique Identifier of an ActiveX control (in the above example, the string beginning with "D27..."). This is, in fact, the Unique Identifier of Macromedia's Flash plugin, and developers are expected to know such Unique Identifiers in order to invoke the component of their choice. The <code>codebase</code> attribute used above points to a location that houses the CAB file containing the ActiveX control. In this context, the codebase attribute is used as an <strong>obtainment mechanism</strong> -- that is to say, a way to obtain a control if it isn't present. If the Flash ActiveX control is not installed, IE will then go to the URL referenced by the codebase attribute and retrieve the ActiveX control. Additional <code>param</code> elements (which are "children" of the above object element) specify configuration parameters for the Flash plugin. For instance, the <code>param name="movie"</code> tells the Flash plugin the location of the SWF file to start playing.</p> - -<p>With the release of Netscape 7.1, this kind of ActiveX use of the object element is supported for use with the Microsoft® Windows Media Player. Only the Windows Media Player is supported as an ActiveX control in Netscape 7.1. The details are covered in <a href="/cn/Windows_Media_in_Netscape" title="cn/Windows_Media_in_Netscape">another article</a>.</p> - -<p>Browsers such as Netscape 7 will not render the Flash plugin if the above kind of markup is used, because Netscape 7 does not support ActiveX or ActiveX-based component invocations, with the exception of Windows Media Player in Netscape 7.1. Mozilla-based browsers support the Netscape Plugin architecture, which is not COM based like ActiveX (and thus, not invoked via a Unique Identifier) but rather, MIME type based. Mozilla-based browsers support the use of the object element along with a MIME type. Here is an example of this usage, once again for the Macromedia Flash plugin:</p> - -<pre><object type="application/x-shockwave-flash" data="javascript-to-flash.swf" -width="366" height="142" id="myFlash"> - <param name="movie" value="javascript-to-flash.swf" /> - <param name="quality" value="high" /> - <param name="swliveconnect" value="true" /> - <p>You need Flash -- get the latest version from - <a href= "http://www.macromedia.com/downloads/">here.</a></p> -</object> -</pre> - -<p>In the above example, <code>application/x-shockwave-flash</code> is the Flash MIME type, and will invoke the Netscape-specific Flash architecture in Mozilla-based browsers. The data attribute points to the SWF file to play, and the configuration parameters (the <code>param</code> elements) are used in a consistent manner both for IE and for Mozilla-based browsers such as Netscape 7. In fact, the above usage will also work for IE, which understands MIME type invocations for certain MIME types such as Flash <em>in addition</em> to ActiveX-style <code>classid</code> invocations.</p> - -<p>Since the use of MIME type for Flash will work for both IE and Netscape 7, you can use the above markup to invoke the Flash plugin for both IE and Netscape 7. However, there are a few caveats that developers ought to bear in mind when using the <code>object</code> element with Mozilla-based browsers such as Netscape 7 and in IE:</p> - -<h4 id="Caveats" name="Caveats">Caveats（警告）</h4> - -<ul> - <li>If you use one single object element for both browsers (as in the above example), <strong>it is not possible to provide a cross-browser <em>obtainment mechanism</em> for streamlined download</strong>. You cannot use a <code>codebase</code> attribute to link to a signed CAB file for the ActiveX component, since this won't work in Mozilla-based browsers such as Netscape 7. Furthermore, IE's use of the <code>codebase</code> attribute as an obtainment mechanism itself is not strictly correct according to the HTML 4.01 specification, which says that the <code>codebase</code> attribute should be used to qualify URNs referenced by the <code>data</code>, <code>archive</code>, and <code>classid</code> attributes. Future Netscape browsers based on Mozilla source code will allow the use of a special <code>param</code> element to specify where to get plugins that are not present, but this feature is not available in Netscape 7. This feature is discussed in Mozilla <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=167601" title='FIXED: [object] Support &amp;lt;param name="PLUGINURL" ...>'>bug 167601</a>.</li> -</ul> - -<ul> - <li><strong>IE doesn't display nested</strong> <code>object</code> <strong>elements correctly according to the HTML 4.01 specification</strong>. According to the specification, you can nest elements and browsers should stop if they can display the outermost element, or else keep going inwards till they can find something to display. IE displays everything as if they are in series, and not nested. Thus, in the following example, instead of stopping at the ActiveX control, IE will display the same animation twice since it also understands the MIME type for Flash:</li> -</ul> - -<pre><!-- Usage Will Not Work As Intended --> -<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" -codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" -width="366" height="142" id="myFlash"> - <param name="movie" value="javascript-to-flash.swf" /> - <param name="quality" value="high" /> - <param name="swliveconnect" value="true" /> - - <object type="application/x-shockwave-flash" data="javascript-to-flash.swf" - width="366" height="142" id="myFlashNSCP"> - <param name="movie" value="javascript-to-flash.swf" /> - <param name="quality" value="high" /> - <param name="swliveconnect" value="true" /> - <p>You need Flash -- get the latest version from - <a href="http://www.macromedia.com/downloads/"> - here.</a></p> - </object> - -</object> -</pre> - -<ul> - <li><strong>Web authors have to specify an <em>obtainment mechanism</em> in Mozilla-based browsers -- the browser won't automatically retrieve plugins that are missing if you don't specify where to get the plugin from using the <code>codebase</code> attribute</strong>. If you don't specify a <code>codebase</code> attribute, and the plugin is not installed,the browser will display only the alternate innermost text. It won't attempt to retrieve a missing plugin using the Netscape Plugin Finder service. This behavior is not incorrect according to the HTML 4.01 specification, but it obliges web authors to diligently specify <em>obtainment mechanisms</em>. At a minimum, web authors will have to nest some alternate text inside their object elements telling users where to obtain the missing component. Adding an additional layer of convenience in the form of automatic retrieval is the subject of a <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=180411" title="Plugin Finder Service is not invoked for OBJECT element">bug 180411</a> in the Mozilla open source code.</li> -</ul> - -<ul> - <li><strong>Some plugins don't understand all the <code>param</code> elements that their documentation suggests should configure them in Mozilla-based browsers.</strong> An example is versions of the Macromedia Flash player plugin upto Flash Player 6 r. 47, which don't understand the <code><param name="movie" value="animation.swf"></code> param element, which is supposed to tell the Flash player which animation to start playing. In order to work around this, developers are encouraged to use the data attribute to the object element: <code><object type="application/x-shockwave-flash" data="animation.swf"..../></code>. The fact that the Flash player doesn't understand this <code>param</code> is a Macromedia Flash Player bug that is <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=180378" title='macromedia.com - Flash ought to support &amp;lt;param name="movie..."> in addition to data attribute'>bug 180378</a>.</li> -</ul> - -<h4 id="Recommendation" name="Recommendation">Recommendation</h4> - -<p>In order to overcome the shortcomings that you can't nest object elements in IE and that there isn't a way you can simply use one <code>object</code> element in a cross-browser way (with architecture specific obtainment mechanisms), the best course of action is to dynamically write <code>object</code> elements based on architecture. For example, on browsers that support ActiveX, such as IE, create an <code>object</code> element with a classid attribute, and on browsers that support the Netscape Plugin architecture, use a MIME type. Here is an example of some JavaScript which does this:</p> - -<pre>if (window.ActiveXObject) -{ - -// browser supports ActiveX -// Create object element with -// download URL for IE OCX - -document.write('<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"'); -document.write(' codebase="http://download.macromedia.com'); -document.write('/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0"'); -document.write(' width="366" height="142" id="myFlash">'); -document.write(' <param name="movie" value="javascript-to-flash.swf" />'); -document.write(' <param name="quality" value="high" />'); -document.write(' <param name="swliveconnect" value="true" />'); -document.write('<\/object>'); - -} - -else -{ - -// browser supports Netscape Plugin API - -document.write('<object id="myFlash" data="javascript-to-flash.swf"'); -document.write(' type="application/x-shockwave-flash"'); -document.write(' width="366" height="142">'); -document.write('<param name="movie" value="javascript-to-flash.swf" />'); -document.write('<param name="quality" value="high" />'); -document.write('<param name="swliveconnect" value="true" />'); -document.write('<p>You need Flash for this.'); -document.write(' Get the latest version from'); -document.write(' <a href="http://www.macromedia.com/downloads">here<\/a>.'); -document.write('<\/p>'); -document.write('<\/object>'); - -} -</pre> - -<p>See also: <a class="external" href="http://www.alistapart.com/articles/flashsatay/">Flash Satay</a></p> - -<h4 id="The_Object_Element_and_Java" name="The_Object_Element_and_Java">The Object Element and Java</h4> - -<p>Mozilla-based browsers such as Netscape 6.x, Netscape 7, and CompuServe 7 ship with the <a class="external" href="http://java.sun.com/j2se/downloads.html">Java plugin that Sun provides</a>. Users installing Netscape 6.x and Netscape 7 have a choice of whether or not to install Java. Unlike Netscape Communicator 4.x, Netscape 6.x and 7 do not have a default Java Virtual Machine -- they rely on Sun's plugin. During the Netscape Communicator 4.x days, Netscape Communications used to develop a Java Virtual Machine which supported Java 1.5.0 and below. Now, with Netscape 6 and 7, the Java Virtual Machine is Sun's plugin. Netscape no longer develops or ships a default Netscape Java Virtual Machine with the browser.</p> - -<p>Sun's Java plugin can be invoked by the <code>object</code> element, just like any other plugin. Once again, IE typically invokes the plugin by way of an <code>object</code> element used in conjunction with a <code>classid</code> attribute that points to an ActiveX Unique Identifier. Each major version of the plugin has a Unique Identifier. For instance, this is an example of the type of markup that will invoke the JRE 1.4.1 in IE, using the unique identifier for the JRE 1.4.1:</p> - -<pre><!-- IE ONLY CODE --> -<object classid="clsid:8AD9C840-044E-11D1-B3E9-00805F499D93" - width="460" height="160" -codebase="http://java.sun.com/products/plugin/autodl/jinstall-1_4_1-windows-i586.cab#version=1,4,1"> - <param...> - <param...> -</object> -</pre> - -<p>The above invocation won't work for Mozilla-based browsers such as Netscape 7 because of the same reason mentioned above: <code>classid</code> used in conjunction with a Unique Identifier references an architecture (ActiveX) that Mozilla code (and thus Netscape 7) does not support. You can invoke the Java plugin for Netscape 7 and other Mozilla-based browsers by using the appropriate Java MIME type. Here is an example:</p> - -<pre><object type="application/x-java-applet;jpi-version=1.4.1_01" -width="460" height="160"> - <param name="code" value="Animator.class" /> - <param name="imagesource" value="images/Beans" /> - <param name="backgroundcolor" value="0xc0c0c0" /> - <param name="endimage" value="10" /> - <param name="soundsource" value="audio"> - <param name="soundtrack" value="spacemusic.au" /> - <param name="sounds" value="1.au|2.au|3.au|4.au|5.au|6.au|7.au|8.au|9.au|0.au" /> - <param name="pause" value="200" /> - <p>You need the Java Plugin. - Get it from <a href="http://java.sun.com/products/plugin/index.html">here.</a></p> -</object> -</pre> - -<p>The above code mentions a version specific MIME type, and if the Mozilla-based browser such as Netscape 7 doesn't have JRE 1.4.1_01 installed, the alternate text is displayed. It isn't always necessary to give such a version specific MIME type. If you aren't taking advantage of any version specific features, a more generic MIME type such as <code>application/x-java-vm</code> will do the job just as well. The configuration parameters for the applet, including the class which contains the initial entry point (Animator.class, referenced by the "code" <code>param</code> element), are specified in multiple <code>param</code> elements.</p> - -<p>Mozilla-based browsers such as Netscape 7 also allow for a special classid attribute that can also be used. This is the special "java:" classid. Here is an example using this invocation method:</p> - -<pre><object classid="java:NervousText.class" width="534" height="50"> - <param name="text" value="Java 2 SDK, Standard Edition v1.4" /> - <p>You need the Java Plugin. - Get it from - <a href="http://java.sun.com/products/plugin/index.html">here. - </a> - </p> -</object> -</pre> - -<p>The "java:" <code>classid</code> allows you to reference the class that provides the primary entry point. The rest of the configuration parameters work via the <code>param</code> elements.</p> - -<h4 id="Applet_--_The_Popular_Choice" name="Applet_--_The_Popular_Choice">Applet -- The Popular Choice</h4> - -<p>The <code>applet</code> element is still very much supported, and is the most popular way currently to invoke Java applets. In Netscape 7 and CompuServe 7, the <code>applet</code> element directly invokes the Java plugin. Here is a sample:</p> - -<pre><applet code="NervousText.class" width="534" height="50"> - <param name="text" value="Java(TM) 2 SDK, Standard Edition v1.4" /> -</applet> -</pre> - -<p>The <code>applet</code> element has been deprecated in the HTML 4.01 specification, but an advantage to using it is that in Mozilla-based browsers such as Netscape 7, if you are missing Java, an automatic obtainment mechanism is in place. The browser will use Netscape's Plugin Finder Service to download the missing Java plugin. The <a href="#References">References</a> section gathers resources about the use of the applet element.</p> - -<h4 id="The_Embed_Element" name="The_Embed_Element">The Embed Element</h4> - -<p>The <code>embed</code> element has been used to invoke plugins since the early days of Netscape browsers. Typically, the <code>embed</code> element is nested within an <code>object</code> element, such that the outer <code>object</code> element invokes an ActiveX control for IE, whereas the inner <code>embed</code> element invokes a Netscape Plugin. Here is an example of this usage:</p> - -<pre><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" -codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=5,0,0,0" -width=366 height=142 id="myFlash"> - <param name="movie" value="javascript_to_flash.swf" /> - <param name="quality" value="high" /> - <param name="swliveconnect" value="true" /> - <embed src="javascript_to_flash.swf" quality="high" width="366" height="142" - type="application/x-shockwave-flash" - pluginspage="http://www.macromedia.com/downloads/" - name="myFlash" swliveconnect="true"> - </embed> -</object> -</pre> - -<p>Links to the rules governing the use of the <code>embed</code> element can be found in the <a href="#References">References</a> section. The <code>embed</code> element is currently the most widely used element to invoke plugins in Netscape browsers. It is important to note, however, that the <code>embed</code> element is not part of the HTML 4.01 Specification, and is therefore not a W3C standard. Some caveats governing the use of the <code>embed</code> element are:</p> - -<ul> - <li>Do not include a <code>name</code> attribute with the <code>object</code> element, especially if it is the same name value as that of the <code>embed</code> element. Though doing so actually violates the HTML 4.01 standard, some code generators give <code>name</code> attributes to the <code>object</code> element. Mozilla-based browsers will not allow you to access the named <code>embed</code> element via JavaScript DOM 0 methods if the <code>object</code> element has the same <code>name</code>. Use the <code>id</code> attribute with the <code>object</code> element. The <code>id</code> attribute of the <code>object</code> element can be the same value as the <code>name</code> attribute of the <code>embed</code> element.</li> - <li>You'll notice that the <code>embed</code> element allows configuration parameters passed to the plugin via custom attributes, such as <code>swliveconnect="true"</code>. These are analogous to the <code>param</code> elements used by the <code>object</code> element. Different plugin vendors may require different configuration paramaters to be passed via the <code>embed</code> element, and learning these is advisable.</li> -</ul> - -<p>Note that the <strong>obtainment mechanism</strong> for the <code>embed</code> element -- that is, the way in which a plugin is obtained if it is missing -- comes via the <code>pluginspage</code> attribute. This attribute points to a page to get the plugin if it is not detected by the browser. The <code>pluginurl</code> attribute is another attribute that can be used, and it can be used to point directly to an <a href="/cn/XPInstall" title="cn/XPInstall">XPInstall</a> file for a more streamlined download. For the <code>embed</code> element in particular, these attributes in Netscape 7 and Mozilla are governed by the Plugin Finder Service preference. Under Edit | Preferences | Navigator | Helper Applications is a preference to use Netscape's Plugin Finder Service. If the user has checked <em>Always Use the Netscape Plugin Finder Service to get Plugins</em> then whether these attributes are specified or not makes no difference -- the browser will <em>always</em> consult with the Plugin Finder Service to determine if it has a plugin to handle the missing MIME type. If the preference is unchecked, the Plugin Finder Service will be consulted only if the web page author <em>does NOT</em> specify either of these attributes.</p> - -<h3 id="Original_Document_Information" name="Original_Document_Information">Original Document Information</h3> - -<ul> - <li>作者：Arun K. Ranganathan, Netscape Communications</li> - <li>Last Updated Date: 14. Nov 2002</li> - <li>版权信息：Copyright © 2001-2003 Netscape. All rights reserved.</li> - <li>Link: <a class="external" href="http://devedge-temp.mozilla.org/viewsource/2002/markup-and-plugins/index_en.html" rel="freelink">http://devedge-temp.mozilla.org/view.../index_en.html</a></li> -</ul> - -<h4 id="References" name="References">References</h4> - -<h5 id="General_--_Specifications" name="General_--_Specifications">General -- Specifications</h5> - -<ul> - <li><a class="external" href="http://www.w3.org/TR/REC-html40">HTML 4.01 Specification</a></li> - <li><a class="external" href="http://www.w3.org/TR/xhtml1/">XHTML 1.0 Specification</a></li> -</ul> - -<h5 id="Object_Element" name="Object_Element">Object Element</h5> - -<ul> - <li><a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-OBJECT">HTML 4.01 Specification On Object Element</a></li> -</ul> - -<h5 id="Embed_Element" name="Embed_Element">Embed Element</h5> - -<ul> - <li><a href="/cn/Gecko_Plugin_API_Reference/Plug-in_Basics" title="cn/Gecko_Plugin_API_Reference/Plug-in_Basics">Plugin API Reference on EMBED element</a> <a class="external" href="http://devedge-temp.mozilla.org/library/manuals/2002/plugin/1.0/intro.html#1002612">on devedge-temp</a></li> -</ul> - -<h5 id="Java" name="Java">Java</h5> - -<ul> - <li><a class="external" href="http://www.w3.org/TR/REC-html40/struct/objects.html#edef-APPLET">HTML 4.01 Applet Definition (Deprecated)</a></li> - <li><a class="external" href="http://java.sun.com/products/plugin/index.html">Java Plugin Homepage</a></li> - <li><a class="external" href="http://java.sun.com/products/plugin/versions.html">Sun Documentation on OBJECT, EMBED, and APPLET and Different Plugin Versions</a></li> - <li><a class="external" href="http://java.sun.com/products/plugin/1.4.1/demos/applets.html">Sun Demonstration of Web Pages using Applet Element</a></li> - <li><a class="external" href="http://java.sun.com/products/plugin/1.4.1/demos/plugin/applets.html">Sun Demonstration of Web Pages Using OBJECT/EMBED Elements</a></li> -</ul> - -<h5 id="Bugs_and_Future_Directions_In_Netscape_and_Mozilla" name="Bugs_and_Future_Directions_In_Netscape_and_Mozilla">Bugs and Future Directions In Netscape and Mozilla</h5> - -<ul> - <li><a href="/cn/Windows_Media_in_Netscape" title="cn/Windows_Media_in_Netscape">Windows Media in Netscape</a> Netscape 7.1 and the Windows Media ActiveX control</li> - <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=180378" title='macromedia.com - Flash ought to support &amp;lt;param name="movie..."> in addition to data attribute'>bug 180378</a></li> - <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=167601" title='FIXED: [object] Support &amp;lt;param name="PLUGINURL" ...>'>bug 167601</a></li> - <li><a href="https://bugzilla.mozilla.org/show_bug.cgi?id=180411" title="Plugin Finder Service is not invoked for OBJECT element">bug 180411</a></li> -</ul> diff --git a/files/zh-cn/archive/在您的网页中应用web标准/index.html b/files/zh-cn/archive/在您的网页中应用web标准/index.html deleted file mode 100644 index ac8ec6977a..0000000000 --- a/files/zh-cn/archive/在您的网页中应用web标准/index.html +++ /dev/null @@ -1,31 +0,0 @@ ---- -title: 在您的网页中应用Web标准 -slug: Archive/在您的网页中应用Web标准 -tags: - - Web开发 - - Web标准 -translation_of: Archive/Using_Web_Standards_in_your_Web_Pages ---- -<p> -</p> -<blockquote>"Browser makers are no longer the problem. The problem lies with designers and developers chained to the browser-quirk-oriented markup of the 1990s-often because they don't realize it is possible to support current standards while accommodating old browsers."<div style="text-align: right;"><a class="external" href="http://webstandards.org/about/history/">-Web Standards Project</a></div></blockquote> -<p>本文对如何升级你的web页面以符合<a class="external" href="http://www.w3.org/">World Wide Web Consortium (W3C)</a>web标准，提供了大致说明。前两个部分分别说明验证问题，验证的好处，错误原件，错误属性；然后通过提供推荐资料、教程和参考来告诉大家，如何升级页面以通过验证以及如何应用CSS。 -</p><p>The other sections address <abbr title="Document Object Model">DOM</abbr> and <abbr title="Dynamic HyperText Markup Language">DHTML</abbr> coding practices which are at odds with the <abbr title="World Wide Web Consortium">W3C</abbr> web standards and suggest replacements. <strong>Every proposed W3C web standards replacement in this article is working without a problem in modern browsers like MSIE 7, Firefox 2, Opera 9, Safari 2, Konqueror 3.5+, Icab 3, etc.</strong> -</p><p>The next-to-last section, <a href="cn/Using_Web_Standards_in_your_Web_Pages/Summary_of_Changes">Summary of Changes</a>, outlines all the changes described in this article. The <a href="cn/Using_Web_Standards_in_your_Web_Pages/References">last section</a> offers excellent and best references for those wishing to learn more about upgrading techniques presented in this article and more for those wishing to perfect their web pages. -</p> -<h2 id=".E7.9B.AE.E5.BD.95" name=".E7.9B.AE.E5.BD.95"> 目录 </h2> -<ol><li> <a href="cn/Using_Web_Standards_in_your_Web_Pages/Benefits_of_using_web_standards">使用web标准的好处</a> -</li><li> <a href="cn/Using_Web_Standards_in_your_Web_Pages/Making_your_page_using_web_standards_-_how_to">Making your page using web standards - how to</a> -</li><li> <a href="cn/Using_Web_Standards_in_your_Web_Pages/Using_the_W3C_DOM">使用 W3C DOM</a> -</li><li> <a href="cn/Using_Web_Standards_in_your_Web_Pages/Developing_Cross_Browser%2f%2fCross_Platform_Pages">Developing Cross Browser/Cross Platform Pages</a> -</li><li> <a href="cn/Using_Web_Standards_in_your_Web_Pages/Using_XMLHttpRequest">使用 XMLHttpRequest</a> -</li><li> <a href="cn/Using_Web_Standards_in_your_Web_Pages/Summary_of_Changes">Summary of Changes</a> -</li><li> <a href="cn/Using_Web_Standards_in_your_Web_Pages/References">References</a> -</li></ol> -<div class="originaldocinfo"> -<h2 id=".E5.8E.9F.E4.BD.9C.E4.BF.A1.E6.81.AF" name=".E5.8E.9F.E4.BD.9C.E4.BF.A1.E6.81.AF"> 原作信息 </h2> -<ul><li> 作者: Mike Cowperthwaite, Marcio Galli, Jim Ley, Ian Oeschger, Simon Paquet, Gérard Talbot -</li><li> 最近更新日期: 2007年4月30日 -</li><li> 版权信息: Portions of this content are © 1998–2006 by individual mozilla.org contributors; content available under a Creative Commons license | <a class="external" href="http://www.mozilla.org/foundation/licensing/website-content.html">Details</a>. -</li></ul> -</div> |