From 218934fa2ed1c702a6d3923d2aa2cc6b43c48684 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:43:23 -0500 Subject: initial commit --- .../mozilla/creating_a_microsummary/index.html | 214 ++ .../zh-tw/archive/mozilla/drag_and_drop/index.html | 142 + files/zh-tw/archive/mozilla/firefox/index.html | 8 + .../mozilla/firefox/using_microformats/index.html | 78 + files/zh-tw/archive/mozilla/index.html | 10 + .../archive/mozilla/marketplace/apis/index.html | 36 + .../archive/mozilla/marketplace/faq/index.html | 154 + files/zh-tw/archive/mozilla/marketplace/index.html | 159 + .../marketplace/marketplace_apis/index.html | 69 + .../monetization/app_payments_guide/index.html | 48 + .../monetization/app_pricing/index.html | 3698 ++++++++++++++++++++ .../monetization/in-app_payments/index.html | 332 ++ .../mozilla/marketplace/monetization/index.html | 80 + .../introduction_monetization/index.html | 77 + .../monetization/payments_status/index.html | 30 + .../profiting_from_your_app/index.html | 95 + .../monetization/validating_a_receipt/index.html | 132 + .../marketplace/options/hosted_apps/index.html | 69 + .../publishing/adding_a_subdomain/index.html | 40 + .../publishing/creating_a_store/index.html | 22 + .../mozilla/marketplace/publishing/index.html | 9 + .../marketplace/publishing/introduction/index.html | 87 + .../managing_your_apps/app_statistics/index.html | 66 + .../marketplace_screenshot_criteria/index.html | 80 + .../publishing/packaged_apps/index.html | 75 + .../publishing/policies_and_guidelines/index.html | 10 + .../introduction/index.html | 39 + .../publishing/pricing/introduction/index.html | 57 + .../publishing/pricing/payment_accounts/index.html | 61 + .../promote_as_upgrade_to_free_version/index.html | 26 + .../publishing/privacy_policies/index.html | 28 + .../publishing/publish_options/index.html | 145 + .../publishing/submission_checklist/index.html | 72 + .../submit/enter_your_apps_details/index.html | 129 + .../marketplace/publishing/submit/index.html | 10 + .../publishing/submit/load_your_app/index.html | 134 + .../publishing/submit/next_steps/index.html | 16 + .../publishing/submit/overview/index.html | 128 + .../sign-in_to_your_developer_account/index.html | 52 + .../publishing/updating_apps/index.html | 27 + .../mozilla/marketplace/submission/index.html | 9 + .../marketplace_review_criteria/index.html | 80 + .../submission/pre-submission_checklist/index.html | 36 + .../submission/rating_your_content/index.html | 117 + .../index.html | 1070 ++++++ .../archive/mozilla/persona/branding/index.html | 42 + files/zh-tw/archive/mozilla/persona/index.html | 125 + .../persona/internationalization/index.html | 51 + .../archive/mozilla/persona/quick_setup/index.html | 137 + .../persona/remote_verification_api/index.html | 171 + .../archive/mozilla/persona/why_persona/index.html | 30 + files/zh-tw/archive/mozilla/xpinstall/index.html | 65 + .../xpinstall/scripting_by_example/index.html | 244 ++ files/zh-tw/archive/mozilla/xul/index.html | 99 + .../archive/mozilla/xul/template_guide/index.html | 5 + .../archive/mozilla/xul/the_joy_of_xul/index.html | 49 + .../archive/mozilla/xul/xul_reference/index.html | 344 ++ files/zh-tw/archive/mozilla/xulrunner/index.html | 88 + .../mozilla/xulrunner/xulrunner_tips/index.html | 213 ++ 59 files changed, 9719 insertions(+) create mode 100644 files/zh-tw/archive/mozilla/creating_a_microsummary/index.html create mode 100644 files/zh-tw/archive/mozilla/drag_and_drop/index.html create mode 100644 files/zh-tw/archive/mozilla/firefox/index.html create mode 100644 files/zh-tw/archive/mozilla/firefox/using_microformats/index.html create mode 100644 files/zh-tw/archive/mozilla/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/apis/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/faq/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/marketplace_apis/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/app_payments_guide/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/app_pricing/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/in-app_payments/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/introduction_monetization/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/payments_status/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/profiting_from_your_app/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/monetization/validating_a_receipt/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/options/hosted_apps/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/adding_a_subdomain/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/creating_a_store/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/introduction/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/managing_your_apps/app_statistics/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/marketplace_screenshot_criteria/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/packaged_apps/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/introduction/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/pricing/introduction/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/pricing/payment_accounts/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/pricing/promote_as_upgrade_to_free_version/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/privacy_policies/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/publish_options/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/submission_checklist/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/submit/enter_your_apps_details/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/submit/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/submit/load_your_app/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/submit/next_steps/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/submit/overview/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/submit/sign-in_to_your_developer_account/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/publishing/updating_apps/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/submission/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/submission/pre-submission_checklist/index.html create mode 100644 files/zh-tw/archive/mozilla/marketplace/submission/rating_your_content/index.html create mode 100644 files/zh-tw/archive/mozilla/migrate_apps_from_internet_explorer_to_mozilla/index.html create mode 100644 files/zh-tw/archive/mozilla/persona/branding/index.html create mode 100644 files/zh-tw/archive/mozilla/persona/index.html create mode 100644 files/zh-tw/archive/mozilla/persona/internationalization/index.html create mode 100644 files/zh-tw/archive/mozilla/persona/quick_setup/index.html create mode 100644 files/zh-tw/archive/mozilla/persona/remote_verification_api/index.html create mode 100644 files/zh-tw/archive/mozilla/persona/why_persona/index.html create mode 100644 files/zh-tw/archive/mozilla/xpinstall/index.html create mode 100644 files/zh-tw/archive/mozilla/xpinstall/scripting_by_example/index.html create mode 100644 files/zh-tw/archive/mozilla/xul/index.html create mode 100644 files/zh-tw/archive/mozilla/xul/template_guide/index.html create mode 100644 files/zh-tw/archive/mozilla/xul/the_joy_of_xul/index.html create mode 100644 files/zh-tw/archive/mozilla/xul/xul_reference/index.html create mode 100644 files/zh-tw/archive/mozilla/xulrunner/index.html create mode 100644 files/zh-tw/archive/mozilla/xulrunner/xulrunner_tips/index.html (limited to 'files/zh-tw/archive/mozilla') diff --git a/files/zh-tw/archive/mozilla/creating_a_microsummary/index.html b/files/zh-tw/archive/mozilla/creating_a_microsummary/index.html new file mode 100644 index 0000000000..40afef30b6 --- /dev/null +++ b/files/zh-tw/archive/mozilla/creating_a_microsummary/index.html @@ -0,0 +1,214 @@ +--- +title: 製作即時摘要 +slug: Archive/Mozilla/Creating_a_microsummary +tags: + - 即時摘要 +translation_of: Archive/Mozilla/Creating_a_microsummary +--- +

+ 即時摘要來源（microsummary generator）內含一組從網頁中製出即時摘要的指令，而網頁能在 <head> 元素中放入 <link rel="microsummary"> 以指定適用的摘要來源。即時摘要來源檔案中如含有適用頁面列表，則也可以獨立安裝。

+

+ 在這份教學文件中，我們將建立 Spread Firefox 首頁的即時摘要來源，藉以顯示目前 Firefox 的總下載數。 (例： Fx 下載數: 174475447)。

+

+ 接下來我們會用一份 XSLT 樣式表將該網頁轉換為即時摘要、指定此摘要來源的適用頁面並了解摘要來源傳佈方式，讓使用者能下載及安裝。在這份文件中每階段新增的程式碼會以粗體顯示，方便您辨識。

+

+ 開始

+

+ 摘要來源是 XML 文件的一種，而其根元素為 <generator>、名稱空間 (namespace) 需指定為 http://www.mozilla.org/microsummaries/0.1，所以要建立一份摘要來源就先得在空的純文字檔中放入 XML 宣告及空的 <generator> 標籤：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1">
+</generator>
+
+

+ 命名

+

+ 每個即時摘要來源都必須有個名字，該名稱以 name 屬性記載、明確說明此摘要來源所建立的摘要主題。由於我們要建立的摘要來源將顯示 Firefox 總下載數，所以便命名為「Firefox 下載計數」：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+</generator>
+
+

+ 加上 XSLT 樣式表

+

+ 即時摘要來源檔案中必須含有一份 XSLT 樣式表，以便將網頁依樣式表設定轉換為即時摘要。同一份資料碰上不同的 XSLT 樣式便能轉換為「相貌」不同的文件，這便是 XSLT 威力所在。

+

+ 以下示範以 <template> 元素在摘要來源中添加 XSLT 樣式表：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+  <template>
+    <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0">
+    </transform>
+  </template>
+</generator>
+
+

+ 即時摘要來源中可以放任何形式的 XSLT，設定為產生超文件也行，但 Firefox 目前只會顯示純文字內容。

+

+ 設定輸出格式

+

+ 由於 XSLT 樣式表會產岀文字摘要，所以 XSLT 的 <output> 元素需設定如下：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+  <template>
+    <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0">
+      <output method="text"/>
+    </transform>
+  </template>
+</generator>
+
+

+ 使用 XSLT <template>

+

+ XSLT 處理器會分別比對 XSLT 樣式表中每組 <template> 元素及文件中的節點。當 <template> 的 match 屬性設定與節點相符，處理器便依設定轉換文件。

+

+ 這種處理方式可以循序檢查網頁中每個節點，依據設定條件顯示內容，非常有用。不過本例只是要顯示 Spread Firefox 網站上的即時摘要，僅用一個 <template> 元素來找一回根元素下的內容即可：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+  <template>
+    <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0">
+      <output method="text"/>
+      <template match="/">
+      </template>
+    </transform>
+  </template>
+</generator>
+
+

+ 加上下載次數

+

+ 若想將下載次數放到 XSLT 輸出的文件中，我們得在 XSLT 中的 template 元素加上 <value-of> 元素，而此 template 元素的 select 屬性中指定的 XPath 必須指向涵括計數器的節點。

+

+ XPath 是用來指定 HTML/XML 文件節點的語言，也有基本的節點內容處理函式。要得知能指向此節點的 XPath 陳述式，最輕鬆的方法就是使用 XPath Checker 擴充套件。

+

+ 安裝 XPath Checker 並重新啟動 Firefox 之後，先到 Spread Firefox 首頁去，找到 Firefox 下載次數（網頁右邊欄最下方的數字)，在上頭按下右鍵，於快捷選單中選擇 View XPath。此時 XPath Checker 會開啟一個新視窗，其中 XPath 欄位包含方才所選節點的 XPath 陳述式： id('download-count') 。

+

+ 在 XSLT 的 <template> 元素中加上一個 <value-of> 元素，其中 select 屬性便設為此 XPath 陳述式，如下：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+  <template>
+    <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0">
+      <output method="text"/>
+      <template match="/">
+        <value-of select="id('download-count')"/>
+      </template>
+    </transform>
+  </template>
+</generator>
+
+

+ 加上文字

+

+ 為了在即時摘要中加上 Fx 下載數: 這段文字，我們必須將 <text> 元素放到 <template> 元素中文字該出現的地方。以下範例便放進一個內容為 Fx 下載數: 的 <text> 元素：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+  <template>
+    <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0">
+      <output method="text"/>
+      <template match="/">
+        <text>Fx 下載數: </text>
+        <value-of select="id('download-count')"/>
+      </template>
+    </transform>
+  </template>
+</generator>
+
+

+ 此處須留心 XSLT 標籤之間的空白字元並不會出現在輸出結果中，不像 HTML 會合併顯示為一個空格，所以要在字串後多加上一個空白以便區隔下載次數及字串。

+

+ 這麼一來，這個轉換 Spread Firefox 首頁為即時摘要的 XSLT 樣式便完成了。

+

+ 指定摘要來源的適用範圍

+

+ 摘要來源的轉換樣式已大工告成，接下來要指定此樣式適用的網頁。如果我們是 Spread Firefox 的網站管理員，可以在網頁上的 <head> 元素中直接加入 <link rel="microsummary"> 標籤，以便指定此網頁對應的摘要來源：

+
<head>
+  ...
+  <link rel="microsummary" href="path/to/our/generator.xml">
+</head>
+
+

+ 不過，由於我們並非該站網管，所以就得在檔案中規定此摘要來源的適用網頁，然後把摘要來源檔放到網路上供人下載。為了要指定適用網頁範圍，我們在 <generator> 元素中放上 <pages> 元素：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+  <template>
+    <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0">
+      <output method="text"/>
+      <template match="/">
+        <text>Fx 下載數: </text>
+        <value-of select="id('download-count')"/>
+      </template>
+    </transform>
+  </template>
+  <pages>
+  </pages>
+</generator>
+
+

+ <pages> 元素中可以放進多個 <include> 及 <exclude> 元素。元素正如其名，<include> 元素能以規則運算式(regular expression)指定適用網頁，而 <exclude> 元素則以規則運算式指定不適用網頁。

+

+ 若無另加規定，則摘要來源預設不適用所有網頁。也就是說，你必須明確指定摘要來源之適用範圍，但如無必要可不必以 <exclude> 排除其他網頁。

+

+ 此處加上個 <include> 元素指定 Spread Firefox 首頁為適用範圍：

+
<?xml version="1.0" encoding="UTF-8"?>
+<generator xmlns="http://www.mozilla.org/microsummaries/0.1"
+           name="Firefox 下載計數">
+  <template>
+    <transform xmlns="http://www.w3.org/1999/XSL/Transform" version="1.0">
+      <output method="text"/>
+      <template match="/">
+        <text>Fx 下載數: </text>
+        <value-of select="id('download-count')"/>
+      </template>
+    </transform>
+  </template>
+  <pages>
+    <include>http://(www\.)?spreadfirefox\.com/(index\.php)?</include>
+  </pages>
+</generator>
+
+

+ 不熟悉規則運算式的話，可以參考建立即時摘要的規則運算式一文。

+

+ 安裝即時摘要來源

+

+ 現在萬事俱備，只差讓人能下載此摘要來源的機制。我們得先將摘要來源檔上傳到網路，接著再以一段 JavaScript 連結呼叫 Firefox 的 window.sidebar.addMicrosummaryGenerator() 方法以便下載安裝。

+

+ 舉例而言，如果摘要來源檔的位置在 http://people.mozilla.com/~myk/micro...-generator.xml，而我們希望使用者能從 http://people.mozilla.com/~myk/micro...ial/index.html 上下載安裝，就應該在 index.html 網頁上加上此段程式碼：

+
 <button onclick="window.sidebar.addMicrosummaryGenerator('http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">安裝 SpreadFirefox 首頁即時摘要來源！</button>
+
+

+ 不過，如果是不支援即時摘要的瀏覽器，按下此按鈕之後會產生 JavaScript 錯誤，所以我們應該幫使用者點忙、檢查他們的瀏覽器是否支援即時摘要，若不支援則顯示說明訊息：

+
<script>
+  const warning = "不好意思ㄋㄟ，你得用支援即時摘要的瀏覽器 (如 Firefox 2.0) 才能安裝這玩意喔！";
+  function addGenerator(url) {
+    if (typeof window.sidebar == "object" &&
+        typeof window.sidebar.addMicrosummaryGenerator == "function")
+      window.sidebar.addMicrosummaryGenerator(url);
+    else
+     alert(warning);
+  }
+</script>
+<button onclick="addGenerator('http://people.mozilla.com/~myk/microsummaries/tutorial/sfx-generator.xml')">安裝 SpreadFirefox 首頁即時摘要來源！</button>
+
+

+ 附帶一提：

+ +

+ 結語

+

+ 現在你應該瞭解怎麼製作能顯示 Firefox 下載次數的即時摘要了。試著將 Spread Firefox 首頁存為書籤，然後在新增書籤對話方塊中按下名稱下拉式選單、選擇即時標題之後的項目即可。

+

+ 其他關於即時摘要的相關資訊，可以參考 Microsummaries 主題頁。

diff --git a/files/zh-tw/archive/mozilla/drag_and_drop/index.html b/files/zh-tw/archive/mozilla/drag_and_drop/index.html new file mode 100644 index 0000000000..b963b08118 --- /dev/null +++ b/files/zh-tw/archive/mozilla/drag_and_drop/index.html @@ -0,0 +1,142 @@ +--- +title: Drag and Drop +slug: Archive/Mozilla/Drag_and_drop +tags: + - NeedsTranslation + - TopicStub + - XUL +translation_of: Archive/Mozilla/Drag_and_drop +--- +

{{ Next("Drag and Drop JavaScript Wrapper") }}

+

{{ deprecated_header("gecko1.9.1") }}

+
+ As of Gecko 1.9.1 (Firefox 3.5), these APIs are officially deprecated the newer, simpler, portable API should be used in their place.
+

This section describes how to implement objects that can be dragged around and dropped onto other objects.

+

The Drag and Drop Interface

+

Many user interfaces allow one to drag particular objects around within the interface. For example, dragging files to other directories, or dragging an icon to another window to open the document it refers to. Mozilla and XUL provide a number of events that can handle when the user attempts to drag objects around.

+

A user can start dragging by holding down the mouse button and moving the mouse. The drag stops when the user releases the mouse. Event handlers are called when the user starts and ends dragging, and at various points in-between.

+

Mozilla implements dragging by using a drag session. When a user requests to drag something that can be dragged, a drag session should be started. The drag session handles updating the mouse cursor and where the object should be dropped. If something cannot be dragged, it should not start a drag session. Because the user generally has only one mouse, only one drag session is in use at a time.

+

Note that drag sessions can be created from within Mozilla itself or from other applications. Mozilla will translate the data being dragged as needed.

+

The list below describes the event handlers that can be called, which may be placed on any element. You only need to put values for the handlers where you need to do something when the event occurs.

+
+
+ ondrag {{ Fx_minversion_inline(3) }}
+
+ Called periodically throughout the drag and drop operation.
+
+ ondraggesture 
+
+ Called when the user starts dragging the element, which normally happens when the user holds down the mouse button and moves the mouse. The script in this handler should set up a drag session.
+
+ ondragstart {{ Fx_minversion_inline(3) }} 
+
+ An alias for ondraggesture; this is the HTML 5 spec name for the event and may be used in HTML or XUL; however, for backward compatibility with older versions of Firefox, you may wish to continue using ondraggesture in XUL.
+
+ ondragover 
+
+ This event handler is called for an element when something is being dragged over top of it. If the object can be dropped on the element, the drag session should be notified.
+
+ ondragenter 
+
+ Called for an element when the mouse pointer first moves over the element while something is being dragged. This might be used to change the appearance of the element to indicate to the user that the object can be dropped on it.
+
+ ondragexit 
+
+ Called for an element when the mouse pointer moves out of an element while something is being dragged. The is also called after a drop is complete so that an element has a chance to remove any highlighting or other indication.
+
+ ondragdrop 
+
+ This event handler is called for an element when something is dropped on the element. At this point, the user has already released the mouse button. The element can simply ignore the event or can handle it some way, such as pasting the dragged object into itself.
+
+ ondragend {{ Fx_minversion_inline(3) }} 
+
+ Called when the drag operation is finished.
+
+

There are two ways that drag and drop events can be handled. This first involves using the drag and drop XPCOM interfaces directly. The second is to use a JavaScript wrapper object that handles some of this for you. The code for this wrapper can be found in a file named {{ Source("toolkit/content/nsDragAndDrop.js nsDragAndDrop.js") }} which is contained in the widget-toolkit (or global) package.

+

XPCOM Drag and Drop interfaces

+

Two interfaces are used to support drag and drop. The first is a drag service, nsIDragService and the second is the drag session, nsIDragSession.

+

The nsIDragService is responsible for creating drag sessions when a drag starts, and removing the drag session when the drag is complete. The function invokeDragSession should be called to start a drag inside an ondraggesture event handler. Once this function is called, a drag has started.

+

The function invokeDragSession takes four parameters, as described below:

+
invokeDragSession(element,transferableArray,region,actions)
+
+
+
+ element 
+
+ A reference to the element that is being dragged. This can be retrieved by getting the property event.target during the event handler.
+
+ transferableArray 
+
+ An array of nsITransferable objects, one for each item being dragged. An array is used because you might want to drag several objects at once, such as a set of files.
+
+ region 
+
+ A region used for feedback indication. This should usually be set to null.
+
+ actions 
+
+ The actions that the drag uses. This should be set to one of the following constants, or several added together. The action can be changed during the drag depending on what is being dragged over.
+
+
+
+ nsIDragService.DRAGDROP_ACTION_NONE 
+
+
+
+ Used to indicate that no drag is valid.
+
+ nsIDragService.DRAGDROP_ACTION_COPY 
+
+ The item being dragged should be copied to its dropped location.
+
+ nsIDragService.DRAGDROP_ACTION_MOVE 
+
+ The item being dragged should be moved to its dropped location.
+
+ nsIDragService.DRAGDROP_ACTION_LINK 
+
+ A link (or shortcut or alias) to the item being dragged should be created in the dropped location.
+
+
+
+

The interface {{ interface("nsIDragService") }} also provides the function getCurrentSession which can be called from within the drag event handlers to get and modify the state of the drag. The function returns an object that implements {{ interface("nsIDragSession") }}.

+

The interface nsIDragSession is used to get and set properties of the drag that is currently occuring. The following properties and methods are available:

+
+
+ canDrop 
+
+ Set this property to true if the element the mouse is currently over can accept the object currently being dragged to be dropped on it. Set the value to false if it doesn't make sense to drop the object on it. This should be changed in the ondragover and ondragenter event handlers.
+
+ dragAction 
+
+ Set to the current action to be performed, which should be one or more of the constants described earlier. This can be used to provide extra feedback to the user.
+
+ numDropItems 
+
+ The number of items being dragged. For example, this will be set to 5 if five bookmarks are being dragged.
+
+ getData(transfer,index) 
+
+ Get the data being dragged. The first argument should be an nsITransferable object to hold the data. The second argument, index, should be the index of the item to return.
+
+ sourceDocument 
+
+ The document where the drag started.
+
+ sourceNode 
+
+ The DOM node where the drag started.
+
+ isDataFlavorSupported(flavor) 
+
+ Returns true if the data being dragged contains data of the specified flavor.
+
+

{{ Next("Drag and Drop JavaScript Wrapper") }}

+
+

Original Document Information

+ +
diff --git a/files/zh-tw/archive/mozilla/firefox/index.html b/files/zh-tw/archive/mozilla/firefox/index.html new file mode 100644 index 0000000000..c87802d82f --- /dev/null +++ b/files/zh-tw/archive/mozilla/firefox/index.html @@ -0,0 +1,8 @@ +--- +title: Firefox +slug: Archive/Mozilla/Firefox +translation_of: Archive/Mozilla/Firefox +--- +

In progress. Out-of-date information about the Firefox project.

+ +

{{SubpagesWithSummaries}}

diff --git a/files/zh-tw/archive/mozilla/firefox/using_microformats/index.html b/files/zh-tw/archive/mozilla/firefox/using_microformats/index.html new file mode 100644 index 0000000000..6e7260a691 --- /dev/null +++ b/files/zh-tw/archive/mozilla/firefox/using_microformats/index.html @@ -0,0 +1,78 @@ +--- +title: Firefox 3 Using Microformat +slug: Archive/Mozilla/Firefox/Using_microformats +translation_of: Archive/Mozilla/Firefox/Using_microformats +--- +

Microfotmats 讓網站可以提供語意化的資料給瀏覽器，這是為了讓瀏覽器不需知道如何剖析(parse)文件就可以呈現網頁資訊的摘要。Firefox 3 實做了一個全域的 microformats 物件(global microformats object) 以提供 microformats 的存取。這個物件與其 API 簡化了尋找、讀取 microfotmats 的工作。

+

載入 microformats API

+

Microformats 物件是用 Firefox 3 新加入的 JavaScript script loader 建立的。要使用這個 API，你首先需要載入這個物件：

+
Components.utils.import("resource://gre/modules/Microformats.js");
+

一旦載入了這個 microformats API，你就可以使用列在這裡的方式來管理 microformats，詳見 Parsing microformats in JavaScript。

+

預先定義好的 microformats

+

Firefox 3 實做了好幾種常見的 microformats，以下是其定義：

+
+
+ adr
+
+ 代表住址 (例如一條街或郵寄住址)。
+
+ geo
+
+ 代表使用緯度、經度表示的地理位置。
+
+ hCard
+
+ 代表個人的聯絡方式。
+
+ hCalendar
+
+ 代表行事曆上的一個約會。
+
+ tag
+
+ 用於新增標籤給其他 microformats。 +

方式

+

add()

+

新增一個 microformat 到一個 microformat module。

+

如果指定的名稱和現存的 microformat 相同，這個原來存在的 microformat 會被新增的所取代。

+ 
add(name, definition);
+
Parameters
+

 

+
+
+ name
+
+ 新增到 microformat module 的 microformat 名稱。
+
+ definition
+
+ 描述 microformat 的 JavaScript 結構，詳見 Describing microformats in JavaScript
+
+

count()

+

計算文件中符合我們指定的類型的 microformats 的數量

+ 
numMicroformats = Microformats.count(name, rootElement, recurseFrames)
+
Parameters
+

 

+
+
+ name
+
+ 要計算的 microformat 名稱。
+
+ rootElement
+
+ 可加可不加。代表由此開始搜尋的 DOM 元素，預設是 content.document (換句話說，也就是整份文件)。
+
+ recurseFrames
+
+ 可加可不加。如果是 true，搜尋時會連 child frames 一起搜尋，預設是 true
+
+
回傳值 (Return value)
+

是一個整數值，代表符合指定類型的 microformats 數量。

+

debug()

+

get()

+

getNamesFromNode()

+

getParent()

+

isMicroformat()

+
+
diff --git a/files/zh-tw/archive/mozilla/index.html b/files/zh-tw/archive/mozilla/index.html new file mode 100644 index 0000000000..0acec76e6d --- /dev/null +++ b/files/zh-tw/archive/mozilla/index.html @@ -0,0 +1,10 @@ +--- +title: Archived Mozilla and build documentation +slug: Archive/Mozilla +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla +--- +

These articles are archived, obsolete documents about Mozilla, Gecko, and the process of building Mozilla projects.

+

{{SubpagesWithSummaries}}

diff --git a/files/zh-tw/archive/mozilla/marketplace/apis/index.html b/files/zh-tw/archive/mozilla/marketplace/apis/index.html new file mode 100644 index 0000000000..ead011ed63 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/apis/index.html @@ -0,0 +1,36 @@ +--- +title: 公用程式函式庫與 API +slug: Archive/Mozilla/Marketplace/APIs +translation_of: Archive/Mozilla/Marketplace/APIs +--- +
+

如果要將 Firefox Marketplace 的功能寫進 App 與 Web 頁面之中，就必須透過 Marketplace Utility Libraries、Web API、Marketplace API。本文將說明上述方式、使用時機，並提供進一步的說明文件連結。

+
+ +

Marketplace Utility Library

+ +

Marketplace Utility Library 可讓開發者避開複雜的 Web API 與 Marketplace API，進而簡化每天的程式撰寫作業。目前雖然只有 1 組函式庫，但隨著 Marketplace 功能不斷擴充，將會陸續提供其他函式庫：

+ + + +

Web API

+ +

Marketplace App 必須透過 Web API 才能提供特定功能：

+ + + +

Marketplace API

+ +

針對大多數的一般 App 撰寫需要，其實並用不到 Marketplace API。但某些 Activities (如設立自己的 App 商店) 就需要此 API。但根據開發者自己的需求，也許 Marketplace Utility Library 還是比較好用。

+ +

Marketplace API 的相關說明文件，均已置於 readthedocs.org 的這個網址上。如果你需要進一步了解這些 API，亦可加入 dev-marketplace 郵件群組。

+ +
+

Marketplace API 說明文件，均記錄了正在開發中的 Marketplace API。所以內含的 API 細節尚未公開於 Marketplace 之上。

+
+ +

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/faq/index.html b/files/zh-tw/archive/mozilla/marketplace/faq/index.html new file mode 100644 index 0000000000..ba8aa7493a --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/faq/index.html @@ -0,0 +1,154 @@ +--- +title: Firefox Marketplace 常見問題 +slug: Archive/Mozilla/Marketplace/FAQ +translation_of: Archive/Mozilla/Marketplace/FAQ +--- +
+

本篇文章將解答 Firefox Marketplace 多個常見的發佈問題。

+
+ +

帳戶管理

+ +

我該如何變更開發者帳戶的資訊？

+ +

進入 Firefox Marketplace 並登入自己的帳戶，將滑鼠游標置於齒輪圖示 (即設定選單) 之上，點選「Edit Account Settings」即可。

+ +

我該如何變更開發者付款的資訊？

+ +

進入 Firefox Marketplace 並登入自己的帳戶，將滑鼠游標置於齒輪圖示 (即設定選單) 之上。點選「My Apps」之後，找到你想變更付款資訊的 App，再點擊「Set Up Payments」即可。

+ +

我該到哪找到自己的銷售報表與對帳資訊？

+ +

進入 Firefox Marketplace 並登入自己的帳戶，將滑鼠游標置於齒輪圖示 (即設定選單) 之上。點選「My Apps」之後，找到你需要相關資料的 App 即可。

+ +

如果我們是多人組成的開發團隊或公司，該如何管理帳戶資訊？

+ +

進入 Firefox Marketplace 並登入自己的帳戶，將滑鼠游標置於齒輪圖示 (即設定選單) 之上。點選「My Apps」之後，找到你想變更團隊細節的 App 即可。

+ +

我該如何重新命名 App？

+ +

如果你想在 Marketplace 審查之後變更 App 的名稱，就必須再次提交 App 通過審查才行。請參閱更新 App 以進一步了解。

+ +

我該如何進入 Firefox Marketplace 除錯設定？

+ +

登入之後進入 Firefox Marketplace，在搜尋列中輸入「:debug」。

+ +

接著你就會看到自己 Marketplace 帳戶的除錯畫面。你可在此畫面中清除 Marketplace 網站、提交記錄、檢視設定、活動記錄等等相關的 cookies 與 localStorage。

+ +

如果我把 App 提交到自己目前所在地以外的地方，我該如何檢視這些 App？

+ +

如果你自己目前所在之處或擁有手機 SIM 卡的地區，和你 App 發佈地區並不相同，則可透過下列步驟檢視該 App：

+ +
    +
  1. 進入 Firefox Marketplace 除錯設定 (可參閱上一題)。
    2. +
  2. 透過「Region Override」與「Carrier Override」選項，選出自己的所在地區或營運商 (只要選完就會立刻更新這些設定)。
    3. +
  3. 重新整理/載入 Marketplace。
    4. +
+ +

你可以先試著為 App 隨便選個分類，確認系統更新過了相關設定。

+ +

App 提交與審查程序

+ +

我該如何提交新的 App？

+ +

可參閱《將 App 提交至 Firefox Marketplace》中的詳細步驟。

+ +

App 核准程序為何？

+ +

請參閱《Marketplace 審查準則》以了解審查程序的相關準則。

+ +

是否有快速審查程序？所採用的準則是否不同？

+ +

如果開發者正好有絕佳的商機需求，或必須儘快釋出重要修復檔案，即可申請快速審查 App。若需 Marketplace 進行快速審查，可寄發電子郵件到 mozilla.appreview，或加入 irc.mozilla.org 中的「#app-reviewers」IRC 頻道。我們會儘快完成快速審查，但不保證審查人員能配合任何特定時間。

+ +
+

注意：對 App 審查團隊來說，「App 快速審查」也算是額外的工作之一。若你有興趣協助我們的審查作業，歡迎透過 Firefox App 審查者申請表申請。

+
+ +

我的 App 需要遵守內容政策嗎？

+ +

當然！請參閱《Marketplace 審查準則》中的〈內容〉一章，了解 Mozilla 的內容政策。

+ +

如果 App 遭退回或移除，我該如何上訴？

+ +

如果想為遭退回的 App 上訴，則可直接回覆 App 退回通知的電子郵件 (所有 Marketplace 通知郵件的末端，均告知開發者可直接回覆該電子郵件以提出問題)；或可透過 irc.mozilla.org 上的「#app-reviewers」IRC 頻道向我們溝通。

+ +

付款

+ +

Firefox Marketplace 如何運作付款作業？

+ +

Mozilla 提供多種付款方式，包含付費 App、免費增值 (Freemium) App、App 內部付費機制 (In-app payments)。若需進一步資訊，可參閱《Marketplace Payments guide》。

+ +

開發者收益的拆帳方式為何？

+ +

開發者將收到預扣增值稅 (Value Added Tax，VAT) 與費用之後金額的 70%。我們先假設美金訂價 $.99 (Tier 10)，歐元訂價則為 €.89；而增值稅率為 20% (根據英國標準增值稅率) 為例，則預扣增值稅之後的價格為 €.74，亦約為 $.99 (有時匯兌之後的價格點數可能變高，有時也會變低)。開發者最後將收到 €.74 的七成金額。

+ +

若需價格點數與訂價的相關資訊，可參閱《制定 App 的價格》。

+ +

Mozilla 也會拆得一部分的帳嗎？

+ +

會。為了維持 Firefox Marketplace 的運作、持續強化 App 平台、支付每次購買行為所產生的交易費用。Mozilla 將收取預扣增值稅後金額的三成，再拆分給 Mozilla、行動網路營運商、付款服務供應商 (如 Bango) 共三方收取。

+ +

我一定要使用 Firefox Marketplace 的付款系統嗎？

+ +

若要讓消費者從 Firefox Marketplace 下載付費 App，就必須使用 Firefox Marketplace 付款系統。我們不會要求 In-app payments 也同樣使用 Marketplace 付款系統，但目前 Firefox OS 中僅建構了 navigator.mozPay() 函式 (用於 In-app payments)，而該函式就採用 Firefox Marketplace 付款系統。我們以後會讓開發者針對 In-app payments 選用任何付款系統。

+ +

將自己的 App 放上 Firefox Marketplace 後的交易費用？

+ +

需支付預扣稅額訂價的 30%。換句話說，因為 Marketplace 提供的含稅價格點數已經納入了增值稅 (針對需課增值稅的地區)，所以在完成交易之後隨即扣除增值稅，讓開發者取得訂價金額的 70%。

+ +

我需要自行設定銷售稅或增值稅率嗎？

+ +

不用。針對需課稅的地區，Marketplace 的價格點數均已包含了增值稅。而銷售稅的部分，均另由付款服務供應商列入帳單之中。

+ +

我該如何分開付款？

+ +

Firefox Marketplace 目前尚未提供分開付款的功能。

+ +

我能提交免費 App 嗎？會向我收費嗎？

+ +

當然。歡迎開發者在 Firefox Marketplace 中提交免費 App，且 Mozilla 不會對免費 App 收取任何費用。

+ +

付費 App 還能搭配 In-app payments 嗎？

+ +

可以。

+ +

退款程序為何？

+ +

根據付款方式的不同，退款程序可能由電信營運商、信用卡公司，或付款服務供應商 (如 Bango) 進行。若消費者選用電信帳單代繳的方式，則依照電信營運商的退款政策處理。目前尚無營運商提供退款服務。Bango 則是針對信用卡提供前端支援服務。任何退款均將從開發者的收益之中扣除。

+ +

服務條款與開發者協議均提供了退款政策。一般來說，Marketplace 不會支付退款，但會要求 Bango 進行退款程序。若消費者選用電信帳單代繳的方式，就必須要求電信營運商退款並修正電信帳單。

+ +

如何處理詐騙的購買行為？

+ +

尚待完善討論。

+ +

Marketplace 如何處理多樣的幣別？

+ +

根據消費者所選的所在地區，即顯示該地區的預設幣別。另針對付款作業，若消費者目前身處於原本設定的地區之外，就會根據他們收取帳單的地區 (即 SIM 卡所在地)，或根據其所在位置收款。如此可避免詐欺行為。

+ +

付款時程為何？開發者多久能收到銷售 App 的應得款項？

+ +

根據付款服務供應商而有所不同；而目前仍由 Bango 負責所有地區的付款作業。開發者可直接與 Bango 洽詢，且每個月均會收到自行對帳用的發票。因為行動服務營運商必須向消費者收取並匯出相關款項，所以支付日期也各有差異。各個國家又會有所不同。而消費者如果採用信用卡付款，都能讓開發者迅速收取款項。若選用電信帳單代繳方式，可能需時 30 ~ 90 天不等。

+ +

開發者應如何處理退款？

+ +

請參閱《Marketplace payments》中的〈Refunds〉一章。

+ +

Firefox Marketplace 可進行臨時銷售或變更訂價嗎？

+ +

我們正規劃價格點數的變更功能，讓開發者能針對「試用期」或「正式銷售」而設定不同的價格。

+ +

開發者能銷售 Firefox 的附加元件 (add-ons) 嗎？

+ +

目前 Firefox Marketplace 僅供銷售 App。我們希望很快就能提供其他內容的銷售服務。

+ +

技術問題

+ +

誰將可托管 App？

+ +

開發者可在自己的伺服器上托管 App 的所有檔案。但將 App 提交到 Firefox Marketplace 之後，就必須提供 App 的 manifest 檔案網址，以利 Marketplace 進行讀取並檢驗。開發者另可上傳圖示、截圖等元素，以能順利在 Firefox Marketplace 推銷自己的 App。可參閱《將 App 提交至 Firefox Marketplace》進一步了解。

+ +

如何從 App 直接啟動 Marketplace？

+ +

開發者可透過 Web Activities，從自己的 App 或網站啟動 Marketplace。而 Marketplace 所支援的 activities 均記錄於 Github 之上。

diff --git a/files/zh-tw/archive/mozilla/marketplace/index.html b/files/zh-tw/archive/mozilla/marketplace/index.html new file mode 100644 index 0000000000..5ce3b790b0 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/index.html @@ -0,0 +1,159 @@ +--- +title: Firefox Marketplace +slug: Archive/Mozilla/Marketplace +tags: + - Apps + - B2G + - Firefox OS + - Marketplace + - Mobile + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla/Marketplace +--- +
Firefox Marketplace 為開放且非專利的線上商城，針對以 HTML5 所撰寫的 Web App 所建構。若開發者準備在 Firefox Marketplace 上發佈 App，均可於此專區中找到相關資訊。另有其他指南可帶領你成功打造 App、提供其他選項、將自己的心血轉為實質收益、發佈＼更新 App，更有函式庫與 API 可確實發揮 Marketplace 的特色。
+ +
+
+

透過標準的 Web 技術、語言、工具，Firefox Marketplace 可供你發佈免費＼付費的 Open Web App。這些可為封裝式 (Packaged) App，於 Firefox 中執行；或可為托管＼架設式 (Hosted) App，置於你自己的伺服器之上。已上架的 App 則可用於 Firefox 桌機版、Android 裝置、Firefox OS 手機。而使用者可透過 App 的精選、分類、搜尋等區塊，輕鬆找到自己喜愛的 App。接著就能立刻安裝免費 App，或透過目前持續成長中的信用卡付款＼電信帳單代收的功能，購買付費 App。

+ +
+
+

準備發佈 App

+ +
+
不論你撰寫 App 是純粹好玩或想創造收益，你都會希望有許多人發現、使用、享受你的作品。本章節將解釋該如何拓展能見度，並建立消費者社群。
+
+ +

App 發佈選項

+ +
+
到底要用封裝式或托管＼架設式 App？了解應如何發表自己 App 的內容。且除了 Firefox OS 之外，亦可讓 App 躍上 Android 裝置與桌上型電腦。
+
建立自己的 App 商城
+
你不一定要透過 Firefox Marketplace 發佈自己的 App。了解應如何建立自己的 App 商城，或為其他開發者的 App 建立商城。
+
+ +

轉為實質收益

+ +
+
如果你負責撰寫 App，則可透過本章節了解 Open Web App 與 Firefox Marketplace 所提供的收益選項。另亦提供 App 內付款 (In-app payments) 的詳細資訊。
+
+
+ +
+

發佈 App

+ +
+
快向世界發佈你的 App。了解應如何讓 Firefox Marketplace 發佈 App，包含 App 提交程序、審查程序、更新程序、了解上架後的效益，並觀看消費者的反應意見。
+
+ +

App 開發工具

+ +
+
Firefox Marketplace 函式庫與 API
+
概略了解目前可用的函式庫與 API，為自己在 Marketplace 上的 App 添增功能。
+
Firefox OS 的「應用程式管理員 (App Manager)」
+
從桌上型電腦為 Open Web App 測試、佈署、除錯的主要工具。
+
App 開發工具
+
完整工具清單，可供你有效率的開發 Open Web App 並樂在其中。
+
+
+
+
+
+ + + +
    +
  1. 準備發佈 App + +
      +
    1. 介紹
      2. +
    2. 決定所要撰寫的東西
      3. +
    3. 了解目標消費者
      4. +
    4. 選擇自己的營運模式
      5. +
    5. 撰寫高品質 App
      6. +
    6. 當地語系的 App
      7. +
    7. 推銷自己的 App
      8. +
    8. 建立自己的群組
      9. +
    +
    2. +
  2. 發佈選項 +
      +
    1. 介紹
      2. +
    2. 封裝式 (Packaged) App
      3. +
    3. 托管＼架設式 (Hosted) App
      4. +
    4. 要封裝抑或托管？
      5. +
    5. 適合 Android 的 Open Web App
      6. +
    6. 適合桌上型電腦的 Open Web App
      7. +
    7. 自行發佈 App
      8. +
    8. 建立自己的商城
      9. +
    +
    3. +
  3. 產生實質收益 +
      +
    1. 介紹
      2. +
    2. 用自己的 App 創造收益
      3. +
    3. App 付款指南
      4. +
    4. 應用程式內付款 (In-app payments) +
        +
      1. 介紹
        2. +
      2. 透過 mozPay
        3. +
      3. 透過 fxPay
        4. +
      +
      5. +
    5. 驗證收據
      6. +
    6. App 定價表
      7. +
    7. 付款服務狀態
      8. +
    +
    4. +
  4. App 發佈概述 +
      +
    1. 介紹
      2. +
    2. 提交作業檢查清單
      3. +
    3. Marketplace 審查準則
      4. +
    4. 為 App 添增子網域
      5. +
    5. 策略與指南 +
        +
      1. 介紹
        2. +
      2. Marketplace 截圖準則
        3. +
      3. 隱私權政策
        4. +
      4. App 測試與疑難排解
        5. +
      +
      6. +
    +
    5. +
  5. 提交 App +
      +
    1. 概述
      2. +
    2. Step 1：登入
      3. +
    3. Step 2：上傳
      4. +
    4. Step 3：列出細節
      5. +
    5. Step 4：後續步驟
      6. +
    6. Step 5：App 評分
      7. +
    7. Step 6：制定 App 的價格 +
        +
      1. 介紹
        2. +
      2. 付款帳戶
        3. +
      3. Bango
        4. +
      4. Boku
        5. +
      5. 用「升級」的方式推廣
        6. +
      6. fxPay 的 App 產品
        7. +
      +
      8. +
    8. Step 7：定義團隊成員
      9. +
    9. Step 8：檢視列表
      10. +
    10. Step 9：編輯其他本地化的內容
      11. +
    +
    6. +
  6. 管理並更新已發佈的 App +
      +
    1. 介紹
      2. +
    2. App 的狀態
      3. +
    3. 更新 App
      4. +
    4. App 狀態
      5. +
    +
    7. +
  7. 函式庫與 API
    8. +
  8. Firefox Marketplace 常見問題
    9. +
diff --git a/files/zh-tw/archive/mozilla/marketplace/marketplace_apis/index.html b/files/zh-tw/archive/mozilla/marketplace/marketplace_apis/index.html new file mode 100644 index 0000000000..372284a029 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/marketplace_apis/index.html @@ -0,0 +1,69 @@ +--- +title: Firefox Marketplace API +slug: Archive/Mozilla/Marketplace/Marketplace_APIs +translation_of: Archive/Mozilla/Marketplace/Marketplace_APIs +--- +
+

提供 Firefox Marketplace API 的主要參考文章，可協助你進行 App 提交作業、設定 App 的付款帳戶，及其他更多相關重要步驟。

+
+
+
+
+
+ Marketplace 公用程式函式庫
+
+ 可協助你順利進行 Firefox Marketplace 的相關作業。你可將內含的 JavaScript 函式庫用於自己的 App 之內，以輕鬆處理應用程式內付款 (In-app payments) 並驗證付款收據。
+
+ Submission API
+
+ Submission API 可讓你檢驗並更新 App，並在安裝之前提取 App 的可用資訊。
+
+ Payment API
+
+ Payment API 可讓你取得 In-app payments 的資訊，以及不同國家的訂價情形。
+
+ 其他 Marketplace API
+
+ Firefox Marketplace API 的完整說明文件。
+
+
+
+
Tools for app developers
+ +
Technology reference documentation
+
+ +
+
Getting help from the community
+

If you still aren't sure how to do what you're trying to get done, feel free to join the conversation!

+ +

Don't forget about the netiquette...

+
+
+

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/app_payments_guide/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/app_payments_guide/index.html new file mode 100644 index 0000000000..a1f464f224 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/app_payments_guide/index.html @@ -0,0 +1,48 @@ +--- +title: 建構付費 App +slug: Archive/Mozilla/Marketplace/Monetization/App_payments_guide +translation_of: Archive/Marketplace/Monetization/App_payments_guide +--- +
+

Firefox Marketplace 的消費者有兩種需要付款的情形：
+ 1). 購買 App 需付款 (付費 App)
+ 2). 在安裝 App 之後另外購買某樣東西需付款；即 App 內付款機制 (In-app payment)
+ 本文即提供付費 App 所需的程式碼與作業流程，另外將有另一篇文章說明 In-app payments。

+
+

選擇封裝方式 (Packaged 或 Hosted)

+

在了解付款方式之前，先決定自己的 App 應該是封裝式 (Packaged)，或架設/托管式 (Hosted)。如果想處理為封裝式 App，就必須遵守內容安全政策 (Content Security Policy，CSP)。可參閱下列說明以進一步了解。

+ +

建構付費 App

+
+

任何 App 都能設定為付費 App，也都能是封裝式或架設/托管式 App；完全不需特別的權限。在將 App 提交到 Firefox Marketplace 時，只要勾選使其成為付費 App 即可。但開發者需讓 App 驗證自己的銷售收據，才能確認收到帳款。接下來就是應進行的步驟。

+

將 installs_allowed_from 添增到 manifest.webapp

+

首先必須將 installs_allowed_from 欄位添增到 App 的 manifest 檔案中。另給予如下的 Firefox Marketplace 網址：

+ 
"installs_allowed_from": [ "https://marketplace.firefox.com" ]
+

這個步驟屬於收據驗證作業的一部分，才能讓系統確認 App 來自於收款的商店。

+
+

驗證收據

+

只要從 Marketplace 售出 App 之後，隨即會產生該筆銷售的數位收據。開發者應該為自己的 App 植入程式碼，讓 App 執行時能一併驗證銷售收據。我們強烈建議，但不強制驗證收據。此查核作業可避免消費者安裝了 App 卻未付費。

+

Mozilla 另負責維護 JavaScript 輔助函式庫 (Helper)，即所謂的 receiptverifier，只要少量程式碼即可驗證收據。只要將下列 receiptverifier 函式庫加入 App 即可：

+ +

再將下列程式碼加入 App (更改內文以符合自己的 App)，即可驗證收據：

+
mozmarket.receipts.Prompter({
+  storeURL: "https://marketplace.firefox.com/app/your-app",
+  supportHTML: '<a href="mailto:you@yourapp.com">email you@yourapp.com</a>',
+  verify: true
+});
+

正常只要啟動 App 就會開始驗證收據。如果確認收據有效，即可釋放 App 的資源；反之可停止 App 執行。

+
+

注意：若要進一步建立自己的收據驗證器，可參閱驗證收據。

+
+

另可參閱

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/app_pricing/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/app_pricing/index.html new file mode 100644 index 0000000000..4d7c3fbc32 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/app_pricing/index.html @@ -0,0 +1,3698 @@ +--- +title: 制定 App 的價格 +slug: Archive/Mozilla/Marketplace/Monetization/App_pricing +translation_of: Archive/Marketplace/Monetization/App_pricing +--- +
+

本文將為開發者說明在 Firefox Marketplace 中制定 App 價格與收款的方法。因為開發者可能在 Firefox Marketplace 中跨國制定不同的價格，所以定價方式有點複雜。本文即提供相關資訊，如訂價、拆帳、課稅、付款方式、應收帳款、防止詐騙等等。

+
+ +

以「價格點數」定價

+ +

在 Firefox Marketplace 中，開發者必須透過固定的「價格點數 (Price point)」完成定價。開發者可選擇任一價格點數，而該價格點數隨即套用為各地區通用貨幣的等值定價。針對開發者所選定 App 或應用程式內部付費 (In-app Payments) 的販售地區，當地消費者就能透過系統得知 App 的定價。價格點數範圍從 US$0.10 (點數 1) 到 US$49.99 (點數 140)。Firefox Marketplace 中的 App 與 In-app Payments，均適用價格點數的定價方式。

+ +

範例：若 App 設定為「10」價格點數，則在流通美金的地區就是售價 US$0.99 (未含當地銷售稅)；流通歐元的地區就是售價 €0.89 (已含歐洲增值稅)。在哥倫比亞的電信帳單代繳售價為 COP$2060.00 (包含哥倫比亞區的增值稅)，信用卡繳款的售價則為 US$0.99。

+ +

價格點數表

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Price pointAustriaBelgiumBrazilChileColombiaCyprusEstoniaFinlandFranceGermanyGreeceHungaryIrelandItalyLatviaLithuaniaLuxembourgMaltaMexicoNetherlandsPeruPolandPortugalSlovakiaSloveniaSpainUnited KingdomUnited StatesUruguayVenezuelaRest of World
VAT/Tax included in priceunknownunknownnoyes&nbsp;(19%)yes&nbsp;(16%)unknownunknownunknownunknownyes&nbsp;(19%)yes&nbsp;(23%)yes&nbsp;(27%)unknownyes&nbsp;(22%)unknownunknownunknownunknownyes&nbsp;(16%)unknownyes&nbsp;(18%)yes&nbsp;(23%)unknownunknownunknownyes&nbsp;(21%)yes&nbsp;(20%)noyes&nbsp;(22%)yes&nbsp;(12%)no
Tier 0 + + €0 + + + + €0 + + + + $0 + + + + $0 + + + + $0 + + + + €0 + + + + €0 + + + + €0 + + + + €0 + + + + €0 + + + + €0 + + + + Ft&nbsp;0 + + + + €0 + + + + €0 + + + + €0 + + + + €0 + + + + €0 + + + + €0 + + + + $0 + + + + €0 + + + + $0 + + + + 0&nbsp;zł + + + + €0 + + + + €0 + + + + €0 + + + + €0 + + + + £0 + + + + $0 + + + + $0 + + + + $0 + + + + $0 + [1] + +
Tier 1 + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + €0.1 + [2] + + + + €0.1 + [2] + + + + Ft&nbsp;25 + [2] + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + 0.49&nbsp;zł + [2] + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + +
Tier 5 + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + €0.25 + [2] + + + + €0.25 + [2] + + + + Ft&nbsp;70 + [2] + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + $3.75 + [2] + + + + n/a + + + + n/a + + + + 0.98&nbsp;zł + [2] + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + +
Tier 7 + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + €0.4 + [2] + + + + €0.4 + [2] + + + + Ft&nbsp;135 + [2] + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + $7.51 + [2] + + + + n/a + + + + n/a + + + + 1.99&nbsp;zł + [2] + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + + + + n/a + +
Tier 10 + + €0.89 + [1] + + + + €0.89 + [1] + + + + $0.99 + [1] + + + + $0.99 + [1] + + + + $2060 + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + + + + €0.89 + + + + Ft&nbsp;270 + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + $15 + + + + €0.89 + [1] + + + + $0.99 + [1] + + + + 3.99&nbsp;zł + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + €0.89 + [1] + + + + £0.75 + [1] + + + + $0.99 + [1] + + + + $0.99 + [1] + + + + $0.99 + [1] + + + + $0.99 + [1] + +
Tier 20 + + €1.89 + [1] + + + + €1.89 + [1] + + + + $1.99 + [1] + + + + $1.99 + [1] + + + + $4150 + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + + + + €1.89 + + + + Ft&nbsp;545 + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + $30 + + + + €1.89 + [1] + + + + $1.99 + [1] + + + + 7.69&nbsp;zł + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + €1.89 + [1] + + + + £1.5 + [1] + + + + $1.99 + [1] + + + + $1.99 + [1] + + + + $1.99 + [1] + + + + $1.99 + [1] + +
Tier 30 + + €2.79 + [1] + + + + €2.79 + [1] + + + + $2.99 + [1] + + + + $2.99 + [1] + + + + $6240 + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + + + + €2.79 + + + + Ft&nbsp;820 + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + $45 + + + + €2.79 + [1] + + + + $2.99 + [1] + + + + 11.59&nbsp;zł + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + €2.79 + [1] + + + + £2.25 + [1] + + + + $2.99 + [1] + + + + $2.99 + [1] + + + + $2.99 + [1] + + + + $2.99 + [1] + +
Tier 40 + + €3.79 + [1] + + + + €3.79 + [1] + + + + $3.99 + [1] + + + + $3.99 + [1] + + + + $8320 + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + + + + €3.79 + + + + Ft&nbsp;1095 + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + $60 + + + + €3.79 + [1] + + + + $3.99 + [1] + + + + 15.49&nbsp;zł + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + €3.79 + [1] + + + + £3 + [1] + + + + $3.99 + [1] + + + + $3.99 + [1] + + + + $3.99 + [1] + + + + $3.99 + [1] + +
Tier 50 + + €4.69 + [1] + + + + €4.69 + [1] + + + + $4.99 + [1] + + + + $4.99 + [1] + + + + $10420 + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + + + + €4.69 + + + + Ft&nbsp;1360 + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + $75 + [1] + + + + €4.69 + [1] + + + + $4.99 + [1] + + + + 19.5&nbsp;zł + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + €4.69 + [1] + + + + £3.75 + [1] + + + + $4.99 + [1] + + + + $4.99 + [1] + + + + $4.99 + [1] + + + + $4.99 + [1] + +
Tier 60 + + €6.59 + [1] + + + + €6.59 + [1] + + + + $6.99 + [1] + + + + $6.99 + [1] + + + + $14600 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + + + + €6.59 + + + + Ft&nbsp;1900 + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + $105 + [1] + + + + €6.59 + [1] + + + + $6.99 + [1] + + + + 26.99&nbsp;zł + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + €6.59 + [1] + + + + £5.25 + [1] + + + + $6.99 + [1] + + + + $6.99 + [1] + + + + $6.99 + [1] + + + + $6.99 + [1] + +
Tier 70 + + €9.49 + [1] + + + + €9.49 + [1] + + + + $9.99 + [1] + + + + $9.99 + [1] + + + + $20840 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + + + + €9.49 + + + + Ft&nbsp;2720 + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + $150 + [1] + + + + €9.49 + [1] + + + + $9.99 + [1] + + + + 38.79&nbsp;zł + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + €9.49 + [1] + + + + £7.5 + [1] + + + + $9.99 + [1] + + + + $9.99 + [1] + + + + $9.99 + [1] + + + + $9.99 + [1] + +
Tier 80 + + €11.59 + [1] + + + + €11.59 + [1] + + + + $12.49 + [1] + + + + $12.49 + [1] + + + + $26070 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + + + + €11.59 + + + + Ft&nbsp;3400 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + $185 + [1] + + + + €11.59 + [1] + + + + $12.49 + [1] + + + + 48.49&nbsp;zł + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + €11.59 + [1] + + + + £9.5 + [1] + + + + $12.49 + [1] + + + + $12.49 + [1] + + + + $12.49 + [1] + + + + $12.49 + [1] + +
Tier 90 + + €14.19 + [1] + + + + €14.19 + [1] + + + + $14.99 + [1] + + + + $14.99 + [1] + + + + $31280 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + + + + €14.19 + + + + Ft&nbsp;4080 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + $225 + [1] + + + + €14.19 + [1] + + + + $14.99 + [1] + + + + 57.99&nbsp;zł + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + €14.19 + [1] + + + + £11.25 + [1] + + + + $14.99 + [1] + + + + $14.99 + [1] + + + + $14.99 + [1] + + + + $14.99 + [1] + +
Tier 100 + + €18.99 + [1] + + + + €18.99 + [1] + + + + $19.99 + [1] + + + + $19.99 + [1] + + + + $41720 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + + + + €18.99 + + + + Ft&nbsp;5450 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + $300 + [1] + + + + €18.99 + [1] + + + + $19.99 + [1] + + + + 77.49&nbsp;zł + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + €18.99 + [1] + + + + £15 + [1] + + + + $19.99 + [1] + + + + $19.99 + [1] + + + + $19.99 + [1] + + + + $19.99 + [1] + +
Tier 110 + + €23.59 + [1] + + + + €23.59 + [1] + + + + $24.99 + [1] + + + + $24.99 + [1] + + + + $52160 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + + + + €23.59 + + + + Ft&nbsp;6800 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + $375 + [1] + + + + €23.59 + [1] + + + + $24.99 + [1] + + + + 96.99&nbsp;zł + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + €23.59 + [1] + + + + £18.75 + [1] + + + + $24.99 + [1] + + + + $24.99 + [1] + + + + $24.99 + [1] + + + + $24.99 + [1] + +
Tier 120 + + €28.39 + [1] + + + + €28.39 + [1] + + + + $29.99 + [1] + + + + $29.99 + [1] + + + + $62580 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + + + + €28.39 + + + + Ft&nbsp;8170 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + $450 + [1] + + + + €28.39 + [1] + + + + $29.99 + [1] + + + + 116.49&nbsp;zł + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + €28.39 + [1] + + + + £22.5 + [1] + + + + $29.99 + [1] + + + + $29.99 + [1] + + + + $29.99 + [1] + + + + $29.99 + [1] + +
Last updated: 1519101168023.
+ + +

制定自己產品的價格

+ +

如果要為自己的 App 或 In-app 產品定價，就必須選擇價格點數與想要銷售的地區。對 App 來說，選擇銷售國家並不會限制其他國家的消費者購買 App，只會決定 App 所將上架的國家 (可能不只一個國家)。即使消費者身處其他國家，只要付款方式亦適用 App 的上架國家，就同樣可購買該 App。

+ +

價格點數表如何運作？

+ +

Marketplace 將針對各種幣別預先設定匯率，再轉換為美金以外的計價並四捨五入，以更為貼近市場友善的數字。四捨五入的價格與外幣匯率的波動，都代表美金以外的定價不會隨時等值於美金現價。除非需穩定多國換匯之後的相對價格，否則美金以外的定價均將保持不動。Mozilla 也不會刻意常常調整定價，且最快每六個月才會調價一次。價格點數一般均保持在美金定價的 1% ~ 2% 之內。而由於某些國家定價另納入了增值稅，因此可能超出此範圍。

+ +

含稅價與未稅價的價格點數

+ +

顯示於不同地區的價格可能含稅或未稅。含稅價代表該價格已含稅 (一般為增值稅，VAT) 並顯示給消費者知道。未稅價則代表稅額 (若有對應稅額) 將另外再加至顯示的價格中。

+ +

各國家與地區的增值稅略有不同，但一般均依照 App 販售國家 (由電信營運商收取) 的增值稅率而定；或是在英國適用增值稅的地區以信用卡付款，則為 20% 增值稅率。一旦消費者確定付款之後，就會根據其付款資訊中登記地區的幣別，或目前所在地區的幣別計算。

+ +

如果消費者所在地區顯示的是未稅價，則當地稅額與費用將再加入 App 售價之中。消費者可能要收到發票，或由銀行/電信營運商寄發對帳單之後，才會看到實際的稅額。

+ +

如何拆帳？

+ +

在將自己設定為「開發者」的付款帳戶之後，即可選擇往後收款的幣別。目前支援的付款幣別包含美金 ($)、歐元 (€)、英鎊 (£)。若是含稅價格，則開發者在正常情況下會收到「消費者購買 App 金額扣除稅額與特定費用」的 70%。若是未稅價格，則會收到「消費者針對 App 定價表付款」的 70%；應付稅額另再加到消費者實際付款額之中。由於匯率浮動與增殖稅率的差異，各地區的實收金額也有所變動。

+ +

而上述金額的另外 30%，將由 Mozilla、電信營運商、第三方支付供應商拆帳。其內包含商業交易程序的相關交易與服務費用。根據目前既定的分配方式，Mozilla 約將收取 5% ~ 7.5%。

+ +
+

若選用電信帳單代繳方式，則開發者所能收到的款項可能又有差異。請到付款狀態了解相關細節，進一步了解該國電信營運商的拆帳規定。

+
+ +

付款方式：電信帳單代繳與信用卡

+ +

透過 Firefox Marketplace 販售自己 App 的絕佳優點之一，就是能直接讓消費者透過行動電話帳單付款。對信用卡尚未普及的新興市場而言，此特色絕對是目前行動付款的重要媒介。

+ +

目前為止，電信營運商必須與 Mozilla 簽訂合約之後，才能在所屬地區提供電信帳單代繳的服務。消費者必須申請該電信營運商的 SIM 卡並預繳特定金額，以順利支付 App 或 In-app Payment 的款項。當然，消費者亦可透過信用卡購買 App。

+ +

針對客戶透過自己行動電話號碼付費的機制，某些電信營運商另設有最低與最高額度，而且各家營運商均有不同。若 App 定價超出該額度，則款項預設轉為信用卡支付；但又並非所有消費者均擁有信用卡。又有些地區並無法和營運商值接建立帳單服務，而必須透過信用卡付款，如此就限定需以美金、歐元、英鎊購買 App。

+ +
+

注意：針對信用卡部分，目前最低收費款項為 10 價格點數 (即美金 $0.99 元整)；而最高款項為美金 $30.00 元整。接受 Visa® 與 MasterCard® 信用卡。

+
+ +

慎防詐騙

+ +

第三方支付供應商應已有多種防止詐騙的方式。為了減少詐騙行為，目前僅限消費者實際所在地銀行發行的信用卡，才能用以支付 App 購買款項。因此，消費者若持巴西境內銀行所發行的信用卡，就只能在巴西國內使用該信用卡，而不能跑到哥倫比亞境內購買 App。

+ +

取得自己的收益：設定收款帳戶

+ +

開發者若要能確實收到自己 App 或 In-app Payments 所創造的營收，必須先針對自己所選擇的 App 販售地區，開好當地支付供應商所提供的帳戶。各家支付供應商都具備服務條款，與 Mozilla 的服務條款不盡相同。開發者必須同意供應商的條款之後，才能透過 Firefox Marketplace 銷售自己的 App 或取得 In-app Payments 款項。

+ +

你也可在 Firefox Marketplace 中設定開發者的收款帳戶。先找到 App 的「Compatibility & Payments」之後，針對你所選擇的販售地區新增收款帳戶即可。

+ +
+

注意：Bango 則是 Firefox Marketplace 的支付供應商。

+
+ +

收取屬於自己的款項

+ +

開發者可直接與支付供應商往來，以順利取得屬於自己的款項。你會收到「自行對帳發票 (Self Billing Invoice，SBI)」，其中將列舉開發者銷售總額、消費者退費總額、開發者實際收取總額。若你的 App 販售地區可退增值稅，則總額也將包含增值稅額。

+ +

你可透過自己在 Firefox Marketplace 中的開發者帳戶，找到支付供應商的付款入口網頁。由於各國電信營運商入帳時程各有不同，且消費法規也可能影響退款速度，所以帳戶的收款條件與時程也有所差異。請自行了解第三方支付供應商的相關條件與說明。

+ +

稅額

+ +

本章節將說明銷售稅的處理方式。

+ +

增值稅 (Value Added Tax，VAT)

+ +

Bango 可針對當地的稅捐機關，處理增值稅 (VAT) 的退稅問題。根據各個國家與地區的法律規定，相關徵稅與退稅的條件均有不同。開發者可向會計師或稅捐機關諮詢。而自行對帳發票 (SBI) 將根據增值稅稅前金額，開立發票給 Bango。開發者到時候觀看支付清單即可了解運作情形。如果開發者身處不屬於「販售者需支付增值稅」的地區，則應該會收到當地稅捐機關的退稅。相關細節請向會計師諮詢。

+ +

預扣稅額與換匯費用

+ +

Bango 可支付美金 ($)、歐元 (€)、英鎊 (£)，讓開發者自行選擇適合的幣別。Bango 可能會因法條規範，為開發者預扣或繳付當地稅額，因此會從支付帳款中扣除應付稅額。各國的預扣稅率均不相同，也可能必須支付換匯費用。在將當地貨幣換成等值的美金、歐元、英鎊時，就可能產生 1.9% ~ 2.5% 的換匯費用。這項費用對開發者並不友善，而 Mozilla 也正研究是否有替代方案。

+ +

開發者的收益

+ +

因所在國家、當地貨幣、付款方式的不同，開發者販售 App 所獲得的收益也有所差異。可參閱付款狀態以進一步了解各國的付款細節。

diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/in-app_payments/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/in-app_payments/index.html new file mode 100644 index 0000000000..35e3fe4117 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/in-app_payments/index.html @@ -0,0 +1,332 @@ +--- +title: 應用程式內部付費 (In-app payments) +slug: Archive/Mozilla/Marketplace/Monetization/In-app_payments +translation_of: Archive/Marketplace/Monetization/In-app_payments_section/mozPay_iap +--- +
+

navigator.mozPay API 可讓網頁內容執行數位貨品的付款作業，並能接收由付款服務商所傳來的購買確認訊息。我們也針對此 API 建構了 Web 付款服務商，讓你能取得數位貨品的款項。本文將說明該如何使用 navigator.mozPay API 與 Web 付款服務商的服務，以達到應用程式內付款 (In-app payments)。

+
+

另外現正開發「fxPay」付款處理機制。FxPay 不會要求開發者必須架設伺服器以進行購買行為驗證，可算是更完整的付款方式。

+
+
+

In-app payments 概述

+

讓你為自己的 App 添加 In-app payments 機制，與其運作的方法：

+ +

navigator.mozPay API 目前限用於 Firefox OS。你同樣可透過 Firefox OS 應用程式管理員 (App Manager) 測試此 API。

+
+

注意：如果是在 Firefox OS 1.2 裝置上測試，只要該裝置內並無 SIM 卡，則 mozPay 呼叫將失敗。但消費者只要裝入 SIM 卡就可解決此問題。目前市面上販售的 Firefox OS 裝置均未安裝 Firefox 1.2。若要進一步了解，可參閱 bug 989022。

+
+

逐步設定 In-app payment

+

接著說明該如何設定 In-app payment。

+

取得測試用的付款金鑰 (Payment Key)

+

在登入至 Firefox Marketplace 開發者交流中心時，可前往 In-App Payment Keys 頁面取得應用程式金鑰與安全金鑰以利測試。雖然金鑰只能讓你模擬 In-app payments，但已足以因應相關測試。在將自己的 App 提交至 Marketplace 審核之前，應該先多嘗試相關模擬。請參閱付款模擬的相關說明。

+

取得真正的付款金鑰

+

在將自己的 App 提交至 Firefox Marketplace 開發者交流中心時， 系統將要求你設定付款條件。此時請選擇 App 的價格 (你也可能想免費提供)，接著勾選你接受 In-app payments 的選項。在設定自己的銀行帳戶之後，前往「Manage In-App Payments」頁面取得應用程式金鑰與安全金鑰，才能執行真正的付款作業。

+

透過隱私設定或類似檔案，可在自己的 App 伺服器中儲存應用程式安全金鑰。

+
+ 重要：請確認沒有任何人可讀取你的應用程式安全金鑰。絕對不要在用戶端披露該項資訊。
+

設定 App

+

先假設你在設計某個 Open Web App 的冒險遊戲，而你想販售「魔力獨角獸」物品，讓玩家能擁有遊戲優勢。你可設定美金 $1.99、歐元 €1.89，或任何幣值均可。接著將說明該如何設定後端伺服器，並撰寫前端程式碼而透過 navigator.mozPay 銷售產品。

+

設定自己的伺服器以簽署 JWT

+

因為用來簽署的應用程式安全金鑰絕對不能公開，所以你必須在伺服端簽署 JSON Web Tokens (JWTs)；而非用戶端。回到剛剛冒險遊戲要賣魔力獨角獸的例子，你要在自己的伺服器上建立如 /sign-jwt 的網址。如此可建立 JSON 物件以定義產品名稱、定價等。可參閱 Web Payment API 規格以了解完整的 JWT 格式。範例如下：

+
{
+  "iss": APPLICATION_KEY,
+  "aud": "marketplace.firefox.com",
+  "typ": "mozilla/payments/pay/v1",
+  "iat": 1337357297,
+  "exp": 1337360897,
+  "request": {
+    "id": "915c07fc-87df-46e5-9513-45cb6e504e39",
+    "pricePoint": 10,
+    "name": "Magical Unicorn",
+    "description": "Adventure Game item",
+    "icons": {
+      "64": "https://yourapp.com/img/icon-64.png",
+      "128": "https://yourapp.com/img/icon-128.png"
+    },
+    "productData": "user_id=1234&my_session_id=XYZ",
+    "postbackURL": "https://yourapp.com/payments/postback",
+    "chargebackURL": "https://yourapp.com/payments/chargeback",
+    "defaultLocale": "en",
+    "locales": {
+      "de": {
+        "name": "Magisches Einhorn",
+        "description": "Adventure Game Artikel"
+      }
+    }
+  }
+}
+

Web Payment API 規格將詳細解釋格式。此處列出幾個重點：

+ +

在 Python (使用 PyJWT) 程式碼中，你可簽署並編碼上述的請求路徑如下：

+
import jwt
+signed_request = jwt.encode(request_dict, application_secret, algorithm='HS256')
+

此程式碼將為 JWT (使用應用程式安全金鑰) 進行簽章，並使用 HMAC SHA 256 演算法。在編碼過後就如下列：

+
eyJhbGciOiAiSFMyNTYiLCAidHlwIjogIkpXVCJ9.IntcImF1ZFwiOiBcIm1hcmtldHBsYWNlLm1vemlsbGEub3JnXCIsIFwiaXNzXCI6IFwiQVBQLTEyM1wiLCBcInJlcXVlc3RcIjoge1wiY3VycmVuY3lcIjogXCJVU0RcIiwgXCJwcmljZVwiOiBcIjAuOTlcIiwgXCJuYW1lXCI6IFwiVmlydHVhbCAzRCBHbGFzc2VzXCIsIFwicHJvZHVjdGRhdGFcIjogXCJBQkMxMjNfREVGNDU2X0dISV83ODkuWFlaXCIsIFwiZGVzY3JpcHRpb25cIjogXCJWaXJ0dWFsIDNEIEdsYXNzZXNcIn0sIFwiZXhwXCI6IFwiMjAxMi0wMy0yMVQxMTowOTo1Ni43NTMxNDFcIiwgXCJpYXRcIjogXCIyMDEyLTAzLTIxVDEwOjA5OjU2LjgxMDQyMFwiLCBcInR5cFwiOiBcIm1vemlsbGEvcGF5bWVudHMvcGF5L3YxXCJ9Ig.vl4E31_5H3t5H_mM8XA69DqypCqdACVKFy3kXz9EmTI
+

如上面章節所述，在 JWT 經過編碼/簽章之後，即可透過其用戶端碼而供你的 App 所使用。

+

設定購買按鈕

+

現在你已經有後端可為自己的產品產生 JWT 了。接著透過 navigator.mozPay 提供前端程式碼的撰寫範例。請確實在自己的 App 中提供按鈕，以利消費者購買產品。例如：

+
<button id="purchase">Purchase Magical Unicorn</button>
+

點選購買按鈕之後，你的 App 應會簽署 JSON Web Token (JWT) 並呼叫 navigator.mozPay。下列為 jQuery 使用範例：

+
$('#purchase button').click(function() {
+  // The purchase is now pending...
+  $.post('/sign-jwt', {})
+    .done(function(signedJWT) {
+      var request = navigator.mozPay([signedJWT]);
+      request.onsuccess = function() {
+        waitForPostback();
+      };
+      request.onerror = function() {
+        console.log('navigator.mozPay() error: ' + this.error.name);
+      }
+    })
+    .fail(function() {
+      console.error('Ajax post to /sign-jwt failed');
+    });
+});
+
+function waitForPostback() {
+  // Poll your server until you receive a postback with a JWT.
+  // If the JWT signature is valid then you can dispurse the Magical Unicorn
+  // product to your customer.
+  // For bonus points, use Web Sockets :)
+}
+

上列程式碼將送出 Ajax 請求至你伺服器上的 /sign-jwt 網址。該網址所簽署的 JSON blob 將包含產品/價格資訊，並以純文字檔回傳 JWT。而 Ajax 處理器 (Handler) 將傳送該 JWT 進入 navigator.mozPay 並等待，直到付款服務商將購買確認訊息送至你的伺服器上。若送過來的 JWT 簽章通過驗證為有效，你就可將虛擬商品交付給消費者。

+

於伺服器上處理 Postback

+

在正式販售出出自己的 App 產品之前，必須先等待 Marketplace 回傳購買確認訊息；此及所謂的「Postback」。此由 marketplace.firefox.com 傳送出「POST」確認通知 (即 1 組 JWT)，至原始付款請求所指定的 request.postbackURL。

+

而此「POST」具備 application/x-www-form-urlencoded 的 Content-Type，且亦可於 notice 參數中找到此 JWT。在你的伺服器框架中，你可透過如 request.POST['notice'] 來存取此 JWT。

+

此 JWT 通知具備所有的付款請求欄位與 1 組交易 ID，並以 Firefox Marketplace 開發者交流中心取得的應用程式安全金鑰而完成簽章。當你收到 Postback 並驗證簽章之後，隨即完成購買程序。若你無法辨別 JWT 的簽章，就可能不是 Marketplace 所傳送的 JWT，你可逕行忽略。

+

Web Payment API 規格即解釋了 Postback 的細節。Postback 內含原始請求，且添增的新反應參數亦包含 Mozilla 的特定交易 ID。範例如下：

+
{
+  "iss": "marketplace.firefox.com",
+  "aud": APPLICATION_KEY,
+  "typ": "mozilla/payments/pay/postback/v1",
+  "exp": 1337370900,
+  "iat": 1337360900,
+  "request": {
+    "id": "915c07fc-87df-46e5-9513-45cb6e504e39",
+    "pricePoint": 10,
+    "name": "Magical Unicorn",
+    "description": "Adventure Game item",
+    "icons": {
+      "64": "https://yourapp.com/img/icon-64.png",
+      "128": "https://yourapp.com/img/icon-128.png"
+    },
+    "productData": "user_id=1234&my_session_id=XYZ",
+    "postbackURL": "https://yourapp.com/payments/postback",
+    "chargebackURL": "https://yourapp.com/payments/chargeback",
+    "defaultLocale": "en",
+    "locales": {
+      "de": {
+        "name": "Magisches Einhorn",
+        "description": "Adventure Game Artikel"
+      }
+    }
+  },
+  "response": {
+    "transactionID": "webpay:84294ec6-7352-4dc7-90fd-3d3dd36377e9",
+    "price": {"amount": "0.99", "currency": "CAD"}
+  }
+}
+

列出 Postback 的幾項重點：

+ +

回應 Postback

+

App 必須透過純文字的 HTTP 回應 (其內僅含交易 ID)，對 Postback 做出回應。例如：

+
HTTP/1.1 200 OK
+Content-Type: text/plain
+
+webpay:84294ec6-7352-4dc7-90fd-3d3dd36377e9
+

於伺服器上處理 Chargeback

+

如果交易過程發生問題 (如消費者帳戶的餘額不足)，則 Marketplace 將傳送退款通知 (即 POST 過的 JWT)。Chargeback 與 Postback 同樣都會傳送到 App，但 Chargeback 送達的時間較晚。該 POST 具備 application/x-www-form-urlencoded 的 Content-Type，且可於 notice 參數中找到該 JWT。下列為解碼後的 Chargeback 通知範例：

+
{
+  "iss": "marketplace.firefox.com",
+  "aud": APPLICATION_KEY,
+  "typ": "mozilla/payments/pay/chargeback/v1",
+  "exp": 1337370900,
+  "iat": 1337360900,
+  "request": {
+    "id": "915c07fc-87df-46e5-9513-45cb6e504e39",
+    "pricePoint": 10,
+    "name": "Magical Unicorn",
+    "description": "Adventure Game item",
+    "icons": {
+      "64": "https://yourapp.com/img/icon-64.png",
+      "128": "https://yourapp.com/img/icon-128.png"
+    },
+    "productData": "user_id=1234&my_session_id=XYZ",
+    "postbackURL": "https://yourapp.com/payments/postback",
+    "chargebackURL": "https://yourapp.com/payments/chargeback",
+    "defaultLocale": "en",
+    "locales": {
+      "de": {
+        "name": "Magisches Einhorn",
+        "description": "Adventure Game Artikel"
+      }
+    }
+  },
+  "response": {
+    "transactionID": "webpay:84294ec6-7352-4dc7-90fd-3d3dd36377e9",
+    "reason": "refund"
+  }
+}
+

此 JWT 和 Postback 類似，可於 Web Payment API 規格中參閱其定義細節。此處列出幾項重點：

+ +
+

注意：目前 in-app payments 尚未支援退款作業。

+
+

App 必須透過純文字的 HTTP 回應 (其內僅含交易 ID)，對 Chargeback 做出回應。舉例來說：

+
HTTP/1.1 200 OK
+Content-Type: text/plain
+
+webpay:84294ec6-7352-4dc7-90fd-3d3dd36377e9
+

Postback/chargeback 錯誤

+

若 App 伺服器是以不成功的狀態碼回應 HTTP 請求，則 Mozilla 的 Web Payment Provider 將重新嘗試 URL 數次。若仍未能接收成功回應，則 App 開發者就會收到通知，且該 App 將暫時停用。若 App 伺服器未能以交易 ID 回應 Postback 或 Chargeback，就會將該伺服器處理為錯誤並會重新嘗試。

+

使用 HTTPS Postback/chargeback 網址

+

於正式環境中執行 App 時，可依需要而嘗試使用安全的 HTTPS 網址。如此一來，在將 Postbacks 從 Mozilla 伺服器傳輸至自己的 App 伺服器時，可避免 Postback 資料遭他人讀取。目前並未強制使用 HTTPS 來保護付款請求，其實 JWT 簽章即可達到相同效果。

+
+

注意：若你並未使用安全的 HTTPS Postback 網址，則請確認自己的付款請求並未包含個人識別資訊，以免遭第三方所攔截。舉例來說，需確認自己的 productData 值並未揭露任何高敏感性的使用者資料。Mozilla 預設的付款請求亦未包含任何個人識別資訊。

+
+

Postback/chargeback IP

+

如果你依照上述方式而確實檢查了 JWT 簽章，就不需為 Firefox Marketplace 伺服器 (傳送 postback/chargeback 通知給你) 的 IP 設定許可清單。但如果你想再另加額外保險 (例如防止鍵盤側錄)，則 Marketplace 也能從下列 IP 位址寄發 postback/chargeback 通知給你。只要這些 IP 位址變更，都會發佈到 dev-marketplace 郵件群組之中。

+
63.245.216.100
+

模擬付款

+

上面的「概述」部分提到，你可從 Firefox Marketplace 開發者交流中心取得特殊的應用程式金鑰 (Application Key) 與應用程式安全金鑰 (Application Secret)，進而模擬 In-app payments。而這個安全金鑰亦可簽署如下的客製 JWT：

+
{
+  "iss": APPLICATION_KEY,
+  "aud": "marketplace.firefox.com",
+  "typ": "mozilla/payments/pay/v1",
+  "iat": 1337357297,
+  "exp": 1337360897,
+  "request": {
+    "id": "915c07fc-87df-46e5-9513-45cb6e504e39",
+    "pricePoint": 10,
+    "name": "Magical Unicorn",
+    "description": "Adventure Game item",
+    "icons": {
+      "64": "https://yourapp.com/img/icon-64.png",
+      "128": "https://yourapp.com/img/icon-128.png"
+    },
+    "productData": "user_id=1234&my_session_id=XYZ",
+    "postbackURL": "https://yourapp.com/payments/postback",
+    "chargebackURL": "https://yourapp.com/payments/chargeback",
+    "simulate": {
+      "result": "postback"
+    }
+  }
+}
+

額外的 request.simulate 屬性可要求 Payment Provider 模擬相關結果，而不會真正收費。使用者介面亦不會要求登入或 PIN 碼。在開發 App 時，可透過此屬性而確認「購買」鈕已正確掛上 navigator.mozPay，且自己的伺服器可正確運作 Postbacks 與 Chargebacks 的網址。

+

下列範例將模擬 1 筆成功的購買作業，並傳送簽署過的通知至你的 Postback 網址：

+
{
+  ...
+  "request": {
+    ...
+    "simulate": {
+      "result": "postback"
+    }
+  }
+}
+

下列則模擬 1 筆 Chargeback 退款：

+
{
+  ...
+  "request": {
+    ...
+    "simulate": {
+      "result": "chargeback",
+      "reason": "refund"
+    }
+  }
+}
+

將如同真正的購買作業一般，將有 1 筆 JWT 通知傳送到你的處理器，但不會有隨機產生的 transactionID。模擬作業亦可使用 non-HTTPS 網址。

+
+

注意：模擬的付款 JWT 不該用於正式的服務環境中，否則你的消費者將免費取得產品。

+
+

除錯

+

如果你並未正確使用 in-app payment API，則付款畫面將顯示錯誤訊息，以協助使用者進行後續步驟。付款畫面亦將提供錯誤程式碼，協助開發者找出相關錯誤。你可透過 Mozilla 的 Error Legend API，在自己慣用的程式語言中觀看錯誤代碼。舉例來說，錯誤代碼 INVALID_JWT 即表示 JWT 簽章無效，或 JWT 格式混亂。

+

保護應用程式安全金鑰

+
+

警告：請確認沒有任何人可讀取你的應用程式安全金鑰。絕對不要在用戶端披露該項資訊。

+
+

撤銷遭盜用的應用程式安全金鑰

+

雖然遭盜用的機率極低，但你的安全金鑰仍可能外洩或遭盜用，這時應儘快進行下列撤銷步驟：

+
    +
  1. 登入 Firefox Marketplace。
    2. +
  2. 前往「My Submissions」並找到自己的 App。
    3. +
  3. 前往「Manage In-App Payments」頁面；就是產生自己所屬憑證 (Credentials) 的相同頁面。
    4. +
  4. 點擊「Reset Credentials」按鈕。
    5. +
+

在重設自己的憑證之後，其他人就無法以舊憑證處理付款作業。你會看到新的應用程式金鑰與安全金鑰，並可立刻用來處理自己 App 中的付款流程。

+

若要回報任何安全性問題，請填寫 Payments/Refunds 分類下的錯誤。

+

程式碼函式庫

+

下列為 Mozilla 的 navigator.mozPay 專屬函式庫：

+ +

Here are some generic JSON Web Token (JWT) libraries for encoding/decoding and signature verification:

+ +

範例程式碼

+ +

尋求協助

+ +

類似的付款系統

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/index.html new file mode 100644 index 0000000000..ed0b227445 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/index.html @@ -0,0 +1,80 @@ +--- +title: 讓 App 產生實質收益 +slug: Archive/Mozilla/Marketplace/Monetization +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Marketplace/Monetization +--- +
+

你努力打造出自己的 App，又該如何在發佈之後取得實質收益呢？不論你選用 Marketplace 付款或應用程式內部付費機制 (In-app payments)，本頁將提供所有相關的 App 付款資訊。

+
+
+
+
+
+ 用自己的 App 獲益
+
+ 透過自己 App 獲益的相關要素介紹，包含所需的工具。
+
+ Marketplace 付款
+
+ 了解 App 將如何搭配 Firefox Marketplace，以強化自己的銷售模式 (如果你的是付費 App，更能提升自己的收入)。
+
+ In-app payments
+
+ 說明應如何在自己的 Web App 中建構 In-app payments
+
+ 檢驗收據
+
+ 檢驗自己 App 購買收據的時機與方式。
+
+ App 定價列表
+
+ 內有價格點數 (Price point)，可讓開發者為自己的付費 App 設定售價，並根據不同的幣別各對應不同的價格點數；另有處理 App 付款的相關資訊。
+
+ 付款狀態
+
+ 提供目前有哪些國家已經設定 Marketplace 的 App 付款服務完畢，基本上也代表這些國家已可銷售付費 App。
+
+
+
+
Tools for app developers
+ +
Technology reference documentation
+
+ +
+
Getting help from the community
+

If you still aren't sure how to do what you're trying to get done, feel free to join the conversation!

+ +

Don't forget about the netiquette...

+
+
+

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/introduction_monetization/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/introduction_monetization/index.html new file mode 100644 index 0000000000..1c5993a876 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/introduction_monetization/index.html @@ -0,0 +1,77 @@ +--- +title: 介紹 ─ 應如何讓 App 創造收益 +slug: Archive/Mozilla/Marketplace/Monetization/Introduction_Monetization +translation_of: Archive/Marketplace/Monetization/Introduction_Monetization +--- +
+

你努力打造出自己的 App，又該如何在發佈之後取得實質收益呢？不論你選用 Marketplace 付款，或是應用程式內部付費機制 (In-app payments)，本頁將提供所有相關的 App 付款資訊。

+
+
+
+
+
+ 用自己的 App 創造收益
+
+ 將說明該如何用自己的 App 創造收益，包含付費式 App、定價、付款作業處理。
+
+ App 付款指南
+
+ 說明付費式 App 的相關技術。
+
+ 應用程式內付款 (In-app payments)
+
+ 說明該如何在自己的 Web App 中建構 In-app payments 功能。
+
+ 檢驗收據
+
+ 檢驗自己 App 購買收據的時機與方式。你可自行建構檢驗機制，亦可使用現有的函式庫。
+
+ 制定 App 的價格
+
+ 可為自己的 App 選擇固定的「價格點數 (Price points)」，且價格點數跨不同幣別也有所差異。本文將提供 App 付費資訊。
+
+ 付款服務狀態
+
+ 總結目前有哪些國家已經支援我們的 App 付款服務。另提供可發佈 App 上架的國家列表。
+
+
+
+
Tools for app developers
+ +
Technology reference documentation
+
+ +
+
Getting help from the community
+

If you still aren't sure how to do what you're trying to get done, feel free to join the conversation!

+ +

Don't forget about the netiquette...

+
+
+

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/payments_status/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/payments_status/index.html new file mode 100644 index 0000000000..25726a4fb5 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/payments_status/index.html @@ -0,0 +1,30 @@ +--- +title: 付款服務狀態 +slug: Archive/Mozilla/Marketplace/Monetization/Payments_Status +translation_of: Archive/Marketplace/Monetization/App_pricing +--- +
+

Firefox Marketplace 付款服務均以「國家」為單位進行，且各國有不同的定價與付款方式。本文列出已開始 Marketplace 付款服務的國家，並附上進一步資訊的連結。

+
+
+

注意：另請參閱《制定 App 的價格》以了解價格點數，並可透過 API 取得。

+
+

各國的付款服務

+

下列為 Marketplace 目前提供付款服務的國家。我們亦隨時努力於更多國家提供付款服務。若需要現已支援付款服務的國家清單，可參閱《制定 App 的價格》。

+

App 支付

+

下列頁面將提供各國的付款服務資訊。另請注意，目前出帳作業僅支援當地貨幣；信用卡付款僅接受英鎊、美金、歐元計價。

+ +

進一步了解收費費率

+

若要進一步了解收費費率，請至 Firefox Marketplace 找到你自己的 App 頁面。點擊「相容性與付款 (Compatibility & Payments)」→「新增、管理或檢視您的付款帳號中的交易 (Add manage or view transactions for your payment account)」→「檢視交易 (View Transactions)」連結，即如下所示。

+

Transactions link

diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/profiting_from_your_app/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/profiting_from_your_app/index.html new file mode 100644 index 0000000000..b66295dcee --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/profiting_from_your_app/index.html @@ -0,0 +1,95 @@ +--- +title: 用自己的 App 創造收益 +slug: Archive/Mozilla/Marketplace/Monetization/Profiting_from_your_app +translation_of: Archive/Marketplace/Monetization/Profiting_from_your_app +--- +
+

開發 Web App 不只有趣，也是將自己熱情轉為實質收益的絕佳方式！本篇文章將介紹 App 付款的相關主題、說明目前已經建構的付款類型 ─ 包含付款購買 App 與應用程式內部付費 (In-app payments)，以及該如何處理不同國家內所發生的交易。

+
+ +

Firefox Marketplace 是專為 Web App 開發者所設計的絕佳市集，可支援付費/免費 App 與 In-app payments、多款裝置平台的 App，還有更多特色。Firefox Marketplace 具備高競爭力的定價系統，讓消費者能選用自己喜歡的付款方式。並由付款服務供應商處理付款程序，可透過消費者的信用卡或行動電話帳單收取款項。

+ +
+

注意：可參閱《Marketplace 常見問題》的〈付款〉一章，了解 Marketplace 付款方面的常見問題。

+
+ +

設定付費 App

+ +

完全可由開發者自行決定 App 收費與否，而且將 App 提交至 Firefox Marketplace 的程序極為相似。Firefox Marketplace 目前支援二種 App 付款模式：

+ + + +

若將 App 定位為付費 App，則開發者會有不同的選擇並需制定價格；消費者也會在開始下載時完成付費。另請注意，因為必須經過 Marketplace 驗證並正確安裝 App，所以目前僅有 Firefox OS 才支援付費 App。在建構付費 App 時，可參閱《App 付款指南》進一步了解其內部的必要程式碼。

+ +

如果開發者是透過 Marketplace 收款，則消費者付款之後即可收到電子收據。開發者必須負責查驗電子收據，確認自己的 App 已正確收款。一般只要啟動 App 時就完成了查驗作業。可參閱《查驗收據》以進一步了解。

+ +

Mozilla 強烈建議開發者應在收費之前，讓消費者能預覽/試用 App 的功能。只要同時提供單一 App 的免費與付費版本，或透過 In-app payments 都能達到上述目的。

+ +

In-app payments

+ +

In-app payments 讓消費者可在 App 中付款，亦即透過 App 而靈活收取多樣數位版商品與服務的款項。且 In-app payments 讓開發者強化現有 App 即可獲得更高收益；而消費者也不需再另外購買新的 App。

+ +

舉例來說，In-app payments 可用於：

+ + + +

Mozilla 與 Google 的 In-Apps Payments 系統運作模式極為相似。Firefox Marketplace 系統如下：

+ + + +

Firefox Marketplace 另提供 JavaScript 公用程式函式庫，可協助完成購買程序。

+ +

免費增值 (Freemium) App

+ +

若開發者想將付費版本的 App 拿掉數項功能而成為免費版本，以供消費者可預覽/試用該 App，則 Mozilla 也同樣支援此一需求。開發者可在「免費版 App」的「詳細資訊」區塊中，找到「upsell」加入付費升級的功能，即可銜接免費與付費版本的 App 並簡化此「免費增值」模式。

+ +

退款

+ +

一旦消費者要求退款，則可能由 Mozilla、付款服務供應商，或電信營運商授權退款作業。根據各地的消費規範、信用卡退款政策、電信營運商退款政策等的差異，退款授權方式亦有所不同。此外，Mozilla 並無法處理 In-app payments 的退款作業。

+ +

一旦 App 購買行為退款完畢，所對應的收據也隨即失效。因此，開發者應隨時查驗收據以確保 App 是否正確授權批准。若任何 App 發生不尋常的大量退款要求，將由 Mozilla 進一步查驗。

+ +
+

注意：《應用程式內部付費 (In-app payments)》提供 In-app payments 作業的豐富訊息與範例程式碼。目前 In-app payment 程序尚在實測階段，請隨時參閱更新訊息。

+
+ +
+

注意：若 App 使用 In-app payments 機制，則 Mozilla 建議該 App 可設定為免費下載 App。當然付費 App 同樣可使用此機制。

+
+ +

定價與款項給付

+ +

App 內部應使用正確的程式碼，且最好透過 Marketplace 檢驗 App 較為穩當。但你心裡可能還是會想著系統是如何跨國處理這些款項。

+ +

Firefox Marketplace 所列出的 App，都是由付款服務供應商負責販售。這些付款服務供應商將負責處理交易、收取營業稅與增值稅 (VAT)、確認符合當地消費法規、相關出納/退款作業，以及其他應盡的零售作業。Mozilla 則是提供買家 (即 App 使用者) 與賣家 (App 開發者) 的交流場所，但完全不參與交易活動。而 Bango 則是 Firefox Marketplace 的付款服務開發商。

+ +

付款處理商另負責買家 (即 App 使用者) 與賣家 (App 開發者) 之間的交易過程，包含信用卡處理在內的大小事。付款處理商一般會逐筆交易收取服務費用。開發者必須透過 Firefox Marketplace 開發者交流中心 (Firefox Marketplace Developer Hub)，於各家付款處理商建立自己的帳戶。

+ +

為了維持 Firefox Marketplace 的運作、不斷提升 App 平台、實踐我們的使命，Mozilla 與合作夥伴將針對各筆交易拆帳，並另外支付交易費用。目前，若開發者是透過 Marketplace 進行交易，則每筆 App 或 In-app 銷售活動均可獲得 70% 的銷售金額 (此為必要費用與稅後總額，均已包含於消費者所看到價格之中)。而 Mozilla 與合作夥伴則收取 30%。

+ +

Firefox Marketplace 未來將支援更多國家、語言、幣別。我們亦將設法提供多個語系的 Marketplace，並搭配各國所適用的付款方式。

+ +

進一步了解：

+ + diff --git a/files/zh-tw/archive/mozilla/marketplace/monetization/validating_a_receipt/index.html b/files/zh-tw/archive/mozilla/marketplace/monetization/validating_a_receipt/index.html new file mode 100644 index 0000000000..8ad877280b --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/monetization/validating_a_receipt/index.html @@ -0,0 +1,132 @@ +--- +title: 驗證收據 +slug: Archive/Mozilla/Marketplace/Monetization/Validating_a_receipt +translation_of: Archive/Marketplace/Monetization/Validating_a_receipt +--- +
+

如果你的是付費 App，就應該檢查消費者的收據是否有效。如果開發者完全不檢查，則可能會有消費者購買 App 之後立刻退款，就變成免費取得 App 了；或可能直接從你的網站參照 manifest 檔案，就能安裝 App。如果開發者要建構收據驗證機制，可參閱本文提供的程式碼與作業流程。

+
+

收據 (Receipt) 即為消費者的 App 購買證明。收據將經由付款處理機制 (由消費者完成的交易) 產生確認資料 (Affirmation)，以取得特定的數位產品。在消費者付費購買 Firefox Marketplace 上的 App 之後，收據就隨即傳送到消費者的裝置之中。位於消費者裝置上的收據，將用在 mozApps.install() 函式的第二組參數之上。Firefox Marketplace 將使用該筆收據資料，進而呼叫 install() 以完成 App 的安裝。

+

驗證收據的時機

+

開發者必須決定 App 該何時驗證收據。一般都是在消費者啟動 App 時開始驗證。如果是屬於長時間執行 App，則可以定時/定期進行驗證。例如影片串流 App 就可以每隔 20 分鐘檢查收據 1 次。

+

另請注意，如果消費者為離線狀態，App 也就無法驗證收據。開發者可決定 App 在離線時所進行的作業。為了避免打擾某些消費者，開發者可停止強制的收據驗證作業 (消費者可能進入隧道而暫時離線)，只要等消費者上線時再次檢查即可。

+

如何驗證收據

+

最簡單就是使用 Firefox Marketplace 的驗證服務即可。如果你的 App 屬於「HTML-only」，也就是伺服器只會提供靜態檔案，則可使用 Mozilla 的「receiptverifier」JavaScript 函式庫。此函式庫基本上只會將 receiptverifier.js 指令碼加入 App 之中，並使用 verifyReceipts() 函式。可參閱上述連結以進一步了解。

+

收據內容

+

Open Web App 所使用的收據，均為可攜式、可驗證的「Token」購買證明，即所謂 JSON Web Token (JWT) 的數位簽署 JSON 資料架構，且此格式可讓所有用戶端與伺服器讀取。許多程式語言均提供 JWT 函式庫。

+

應接受的收據

+

收據就是付款的證明，但 App 開發者可決定自己想要的收據類型。以下是你該檢查的要項：

+ +

receipt verifier 函式庫可進行其中數項檢查。

+

測試用收據

+

在開發期間，Firefox Marketplace 即可協助發出測試用收據，以供完整測試 App 的相關付款程序。可透過 Firefox 開發者交流中心 (Firefox Developer Hub) 的公用程式頁面產生測試用收據。此種收據將具備「test-receipt」的 typ。且 App 只會在開發期間接收這類收據，一旦上架之後就停止接收；否則消費者可略過 App 銷售程序，直接使用測試用收據。

+

receipt verifier 函式庫預設不會接收 test-receipts。

+

收據驗證

+

在沒有 JWT 函式庫的情況下，開發者也能在收據的 verify 欄位中，找到驗證服務的對應網址，並將收據傳送給驗證服務。各個 App 均具備不同的 Firefox Marketplace 驗證服務網址。

+

下列範例程式碼可於收據中顯示 verify 網址。該程式碼將用於 Firefox 的「網頁主控台 (Web console)」開發者工具。

+
var request = navigator.mozApps.getSelf();
+request.onsuccess = function() {
+  // Get the app's receipt and decode it
+  console.log(atob(request.result.receipts[0].split('~')[1].split('.')[1]));
+};
+

為了取得 verify 網址，此範例將近行下列作業：

+ +

接著是上述程式碼結果的完整範例。此即為扣除 JWT 部分的完整收據。

+
{
+  "product": {
+    "url": "http://example.com",
+    "storedata": "id=111111"
+  },
+  "iss": "https://marketplace.mozilla.org",
+  "verify": "https://receiptcheck.marketplace.mozilla.org/verify/111111", // The verify URL
+  "detail": "https://marketplace.mozilla.org/en-US/purchases/111111",
+  "reissue": "https://marketplace.mozilla.org/en-US/app/example/purchase/reissue",
+  "user": {
+    "type": "directed-identifier",
+    "value": "1234-abcd99ef-a123-456b-bbbb-cccc11112222"
+  },
+  "exp": 1353028900,
+  "iat": 1337304100,
+  "typ": "purchase-receipt",
+  "nbf": 1337304100
+}
+

在開發者取得 verify 網址之後，就可透過 POST 函式，在訊息主體之內傳送完整的 JWT。驗證服務的回應即如上方所述。下列程式碼片段 (snippet)，將從上列範例中取得 App 第一筆收據的完整 JWT。

+
request.result.receipts[0]
+

請注意，上述程式碼並不會處理 JWT 的加密部分。如果你要透過 Marketplace 驗證收據，則收據將檢查本身的加密簽章。

+
+

注意：可在 Kumar McMillan 提供的 Private Yacht 範例中，找到其他更高擴充性的收據驗證範例。

+
+

App 盜版問題

+

即使你驗證了自己付費 App 的收據，還是可能有人繞過收據機制而盜用 App。上列的收據驗證函式並無法避免此問題。

+

如果想要更好的防盜版機制，就必須設定代理伺服器，將之作為 App 與 Firefox Marketplace 之間的媒介。代理伺服器可檢查收據、IP 位址，還有更多物件。如果單一收據來自於不同的 IP 位址，且能一樣執行正確動作，則伺服器就可進行類似通知的作業。如果是大型、複雜、使用伺服器處理功能的 App，就能達到更適當、更正確的設定。

+

此 Python 程式碼仍是開發中的專案，可提供某些代理伺服器的靈感。Django Receipts 則是測試用的代理伺服器，可驗證收據。開發者最好不要直接將之作為正式運行的代理伺服器，但可進行測試以了解相關機制。另可參閱更多資訊，讓自己了解收據驗證作業。

+

收據欄位

+

收據應包含下列欄位：

+
+
+ typ
+
+ 可供識別收據類型的字串，必為以下之一： +
    +
  • purchase-receipt ─ 交易完成之後隨即發出的收據。這類收據應隨時能由 App 接收。
    • +
  • developer-receipt ─ 由 App 開發者所發出的收據。一般是開發者交由自己使用的 App 商店所發出。這類收據有效期較短。
    • +
  • reveiwer-receipt ─ 由 App 審查者所發出的收據。一般是 App 審查者透過其所位於的商店發出。這類收據只需要在審查期間接收即可，有效期較短。
    • +
  • test-receipt ─ 在開發期間用以測試 App 所發出的收據。只要是開發期間以外，均不應該接收這類收據，有效期較短。
    • +
+
+
+ product
+
+ JSON 物件在識別產品時，包含收據所囊括的範圍，以及任何特定商店的資料。包含下列欄位： +
    +
  • url ─ 代表該網址的根網域 (root of a domain)，且沒有最後的斜線 (例如「https://someapp.com」)。一般這樣就代表了 Web App。如果是以根網域開頭的其他網址，則代表「App 內購買」。只要開發者或收據開立者覺得方便，則可使用各種路徑規則 (Path scheme)。
    • +
  • storedata ─ 此字串為 App 所獨有，將提供給收據驗證器 (Verifier) 所用。
    • +
+
+
+ user
+
+ 針對完成購買作業的消費者，此 JSON 物件包含了使用者 ID，並包含下列欄位： +
    +
  • type ─ 此字串內有「directed-identifier」值。
    • +
  • value ─ 此字串即為消費者的專屬 ID。消費者每次購買 App，都會擁有不同的 ID。
    • +
+
+
+ iss
+
+ 發出收據的商店，其所屬之網域。
+
+ nbf
+
+ 完成購買程序之後，顯示「Not-before」的時間戳記。時間戳記是從 1970-01-01T00:00:00Z (UTC, RFC 3339) 開始的秒數。
+
+ iat
+
+ 發出收據之後，顯示「Issued-at」的時間戳記。此時間戳記的格式如同 nbf。可透過此數值決定收據的存在時間。
+
+ exp
+
+ (選填) 代表收據過期的時間戳記。此時間戳記的格式如同 nbf。
+
+ detail
+
+ (選填) 網址包含額外人、機均可讀取的購買細節。如果另提供購買行為的交易記錄或退款功能，則本頁亦應包含相關函式。
+
+ verify
+
+ (選填) 由經過授權的 App 使用此網址，以驗證收據。另請注意，Firefox Marketplace 一定會為 App 提供此欄位。如果開發者想自己建立 App 的商城，就可能不需使用此欄位。
+
+ reissue
+
+ (選填) 網址可重新發出新收據。
+
diff --git a/files/zh-tw/archive/mozilla/marketplace/options/hosted_apps/index.html b/files/zh-tw/archive/mozilla/marketplace/options/hosted_apps/index.html new file mode 100644 index 0000000000..69614f7cf4 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/options/hosted_apps/index.html @@ -0,0 +1,69 @@ +--- +title: 托管＼架設式 (Hosted) App +slug: Archive/Mozilla/Marketplace/Options/Hosted_apps +translation_of: Archive/Mozilla/Marketplace/Options/Hosted_apps +--- +
+

托管＼架設式 (Hosted) App 即為 Open Web App，將其所有資源 (HTML、CSS、JavaScript、manifest 檔案等) 儲存於 Web 伺服器上。本文將簡介托管＼架設式 App，另有相關連結讓你從開發者的角度進一步了解相關資訊。

+
+ +

與一般網站相同，托管的 Open Web App 亦透過 Web 伺服器提供其所有內容，另於 App 的根目錄中提供 App 的 manifest 檔案。manifest 檔案則具備 App 的詳細資料，如相關說明、代表 App 的圖示等等。且不論是 Firefox OS 裝置、Android 裝置，或桌上型電腦，這些詳細資料都會用於 App 的安裝作業。一旦安裝完畢，App 就會從原本的托管伺服器動態載入其內容，並可存取 Web 上的其他資源，如 Web 伺服器上的資料庫。

+ +

在 Firefox OS 安全模型中，托管式 App 均定義為 Web App，意即這類 App 無法利用 Privileged 與內部 (即 Certified) API。若要利用這些 API，則必須以封裝式 (Packaged) App 的方式來提供 App。

+ +
+

注意：Firefox Marketplace 僅支援 Firefox OS 的付費托管式，以及 Firefox OS、Firefox for Android、Firefox 的免費托管式 App。目前正開發所有平台的付費 App 支援功能。

+
+ +

App 托管選擇

+ +

開發者可自行選擇 App 的托管之處。如果你還沒選擇托管方式，則可考慮本段說明的常見托管選擇。

+ +

GitHub

+ +

如果你的 Open Web App 為靜態內容 (HTML/CSS/JavaScript，但無伺服器端的處理作業)，那GitHub Pages 應該是你的不二選擇。如果你的 manifest 檔案是 .webapp 為附檔名，則 GitHub 就能用 correct MIME type 提供 manifest 檔案。

+ +

一般托管解決方案

+ +

動態的 Open Web App 需要伺服器端的處理作業，所以你可用任何常見的托管選擇 (像是你自己架設或可存取的 Web 伺服器)。你必須先確認 Web 伺服器具備相關功能。另有許多托管服務供應商已針對托管式 App 的需求 (如 Heroku、Google App Engine、Amazon App Hosting)，量身打造出 Web 伺服器。

+ +
+

注意：之前在安裝 Open Web App 時，必須滿足「一組來源僅能提供一個 App」的安全規範。但這項條件到 Firefox 34/Firefox OS 2.1 (可參閱此 FAQ 以獲得更多資訊) 已經移除。如果你仍要支援較舊版本，則可試試看在不同來源托管不同的 App (如測試＼正式版本)。其中一個方法就是為 App 建立不同的子網域，或可透過 WebIDE 測試 App。可參閱〈manifest 檔案常見問題〉以進一步了解。

+
+ +

測試托管式 App

+ +

若要將托管式 App 安裝至 Firefox OS 模擬器或實體裝置上，以利進行測試，請參閱《應用程式管理員 (App Manager)》。你也可觀看《自行發佈 App》中所說明的步驟，透過 Web 伺服器將 App 安裝到裝置之上。

+ +

發佈托管式 App

+ +

現有 2 種方式可發佈托管式 App：1). 透過 Firefox Marketplace 或 2). 自行發佈。

+ +

發佈於 Firefox Marketplace

+ +

你可參閱《App 發佈流程》，了解應如何將托管式 App 提交到 Firefox Marketplace 之上。

+ +

在你提交自己的托管式 App 之後，Marketplace 隨即根據你放在 Web 伺服器上的 manifest 檔案，產生新的「mini-manifes」檔案。只要消費者決定要安裝 App，則 mini-manifest 就會傳送到 Apps.install() 函式以安裝該 App。mini-manifest 僅會用於 App 的安裝與更新作業，並不會用於 App 執行期間。

+ +

自行發佈

+ +

你當然也能在 Firefox Marketplace 以外發佈托管式 App，也就是透過自己架設的 Web 伺服器。可參閱《自行發佈 App》。

+ +

更新托管式 App

+ +

共有 2 種方式可更新托管式 App：

+ + + +

若要進一步了解在 Firefox Marketplace 上更新 App 的方法，可參閱《更新 App》；若是自行發佈的 App，則可參閱《自行發佈 App》。

+ +

另請參閱

+ + diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/adding_a_subdomain/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/adding_a_subdomain/index.html new file mode 100644 index 0000000000..27d7c108df --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/adding_a_subdomain/index.html @@ -0,0 +1,40 @@ +--- +title: 為 App 添增子網域 +slug: Archive/Mozilla/Marketplace/Publishing/Adding_a_subdomain +translation_of: Archive/Mozilla/Marketplace/Publishing/Adding_a_subdomain +--- +
+

一組來源網域僅限容納一個 App。但若要打破此限制，則可為 App 新增子網域。每個子網域就代表不同的來源，例如 app1.example.com 或 app2.example.com。建立子網域很簡單，而且大多數的網域托管服務供應商也都不額外收費。服務供應商一般會免費提供特定數量的子網域。以下即為子網域的新增範例。

+
+

新增子網域的常見步驟

+
    +
  1. 登入托管服務供應商的管理介面，找到自己所使用的網域。
    2. +
  2. 找到設定網域的頁面。
    3. +
  3. 找到可新增子網域的功能。
    4. +
  4. 新增子網域、指定子網域檔案的儲存路徑、儲存你所完成的變更。
    5. +
  5. 將自己的 App 檔案放進你在上個步驟所指定的伺服器路徑中。
    6. +
  6. 實際以瀏覽器開啟該路徑，檢驗新的子網域已確實產生。
    7. +
+

接著將說明該如何透過特定托管工具新增子網域。

+

以 cPanel 新增子網域

+

這裡提供 cPanel 建立子網域的範例。cPanel 是 Web 托管控制台，已有多家托管服務供應商採用。每個開發者的 cPanel 頁面可能因設定方式而略有不同。這裡僅提供整個介面的基本概念。

+
    +
  1. 登入 cPanel。
    2. +
  2. 往下捲動找到「Domains」區塊。 +

    +
    3. +
  3. 點擊「Subdomains」即開啟「Subdomains」頁面。 +

    +
    4. +
  4. 在「Subdomain」文字框中輸入子網域名稱。我們這裡先以「newsubdomain」為例。
    5. +
  5. 再點入「Document Root」文字框。隨著顯示的路徑，就是儲存新子網域檔案的路徑。我們這裡先以「/public_html/newsubdomain」為例。如果開發者想把 App 檔案儲存到其他位址，亦可依自己需要更改。假設你的 App 檔案位於「public_html/gamedev_com/games/coolgame/」，則可於「Document Root」文字框中鍵入該路徑。Document root
    6. +
  6. 點擊「Create」按鈕，即可收到確認訊息。
    7. +
  7. 將 App 檔案放進你指定的子網域路徑中。我們這裡先使用名為「index.html」的簡單 HTML，將顯示「This is on a new subdomain!」。
    8. +
  8. 確認新的子網域現已存在。開啟瀏覽器並輸入新的網域名稱。根據我們所使用的範例，即如下圖所示： +

    New subdomain in browser

    +
    9. +
+

以 Go Daddy 新增子網域

+

可觀看此影片，為 Go Daddy 所托管的網域添增子網域。

+
+  
diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/creating_a_store/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/creating_a_store/index.html new file mode 100644 index 0000000000..968dce2720 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/creating_a_store/index.html @@ -0,0 +1,22 @@ +--- +title: 設立自己的 App 商店 +slug: Archive/Mozilla/Marketplace/Publishing/Creating_a_store +translation_of: Archive/Marketplace/Options/Creating_a_store +--- +
+

任何 Web 網站若具備豐富的圖片與互動經驗，則 Web 瀏覽器可透過Mozilla 的 App 專案平台，將這類網站識別為「Web App」，進而能跨裝置安裝並同步這些網站。開發者現可透過此項特性，將已發佈的 App 整理到目錄與商店中。接著說明相關步驟。

+
+

與瀏覽器整合

+

App 平台即提供「navigator.mozApps」這個 JavaScript 物件，可作為商店與瀏覽器之間的溝通橋樑。

+

Web App 是根據其網域所辨識而得。而一個來源網域就只會有一個 App。針對目錄或商店，開發者可透過 App Installation API 與 App Management API，讓瀏覽器觸發 apps.install 函式並提示 App 的安裝作業，另提供 App 的 manifest 檔案網址，以及任何想要補充的後設資料 (metadata)。開發者可存取此筆後設資料，以查閱消費者的購買資訊、確認單一登入狀態 (SSO)，或其他服務。

+

使用 getInstalled()

+

只要 App 是根據你的網域而安裝於目前的瀏覽器上，均可透過 navigator.mozApps.getInstalled() 函式取得此類 App 的清單。另請注意，開發者不會看到其他網域所安裝的 App，只會看到放在自己網域中的 App。

+

開發者可透過此函式而了解消費者安裝的 App 是否符合你的預期。即使消費者是以新帳戶登入你的網站，亦可透過「resync」功能而再次安裝既有的 App。

+

到底該不該托管？

+

針對托管式 App，商店只需該網站的 manifest 網址，即可觸發 App 的安裝作業 (apps.install)。該 App 檔案不一定要儲存於商店或目錄之下。

+

如果 App 沒有伺服器的邏輯元件 (也就是完全以用戶端 JavaScript、HTML、CSS 所建構的 App)，開發者就可能會想建構出托管功能。此時必須為各 App 指派不同的網域名稱，並針對各 App 的 manifest 檔案建構伺服邏輯，才能使用托管功能。

+

如果你現在正自行托管 App 邏輯，則可輕鬆維護和消費者之間的會話 (Session)，進而追蹤消費者的喜好、購買證明，或其他服務。如果你要針對遠端網站提供服務，就必須完成額外作業，才能支援分散式的認證系統。

+
+

注意：Firefox Marketplace API 內含的功能，讓開發者只耗費最小程度的心血，即可迅速設立自己的 App 商店。

+
+

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/index.html new file mode 100644 index 0000000000..280345b59e --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/index.html @@ -0,0 +1,9 @@ +--- +title: Publishing +slug: Archive/Mozilla/Marketplace/Publishing +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla/Marketplace/Publishing/Introduction +--- +

Marketplace publishing

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/introduction/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/introduction/index.html new file mode 100644 index 0000000000..0cdc397b2e --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/introduction/index.html @@ -0,0 +1,87 @@ +--- +title: 介紹 — App 發佈流程 +slug: Archive/Mozilla/Marketplace/Publishing/Introduction +translation_of: Archive/Mozilla/Marketplace/Publishing/Introduction +--- +
+ 你到這裡應該已經知道該如何打造成功的 App、選擇 App 發佈平台 (甚或發佈到 Firefox OS 以外的平台)、撰寫並側試過自己的程式碼。現在應該著手將 App 發表給全球的使用者知道，並於 Firefox Marketplace 上發佈。本文將引導你完成相關程序，讓你順利於 Firefox Marketplace 上發佈自己的 Open Web App，並能隨時更新檔案及有用的附加資訊。
+
+  
+
+
+

發佈指南

+
+
+ 提交作業檢查清單
+
+ 提交 App 前的準備工作。
+
+ Marketplace 審查
+
+ 審查 App 時的程序與準則。
+
+ 設定付費 App 與應用程式內付款 (In-app payment)
+
+ Marketplace 的相關功能，可設定付費式 App 與應用程式內的付款項目。另將說明 Firefox Marketplace 是如何使用第三方的付費服務，並建立廠商的帳戶。
+
+

策略與指南

+
+
+ 圖示 (應用程式中心)
+
+ 根據 Firefox OS 的不同版本，取得詳細的圖示尺寸。
+
+
+
+ 圖示設計 (Mozilla 風格指南)
+
+ 你的 App 或 In-app 產品圖示，必須符合圓形或方形設計。進一步參閱 Mozilla 風格指南。
+
+
+
+ 隱私權政策
+
+ 如果你的 App 會取得使用者的個人資料，就必須另外具備隱私權政策。指南內所提供的資訊，均必須納入你的 App 隱私權政策之中。
+
+
+
+ 擷圖指南
+
+ 若要讓自己的 App 在 Marketplace 順利上架，所提供的擷圖必須符合相關規範。
+
+ App 測試與疑難排解
+
+ 帶領你設定測試環境、實際測試  App，並解決你所發現的問題或錯誤。
+
+
+
+

提交 App

+
+
+ App 提交程序指南
+
+ 你已經準備好發佈第一個 App；也可能要以自己沒用過的方式封裝/發佈 App。到這裡了解該如何將 App 提交到 Firefox Marketplace 之上。
+
+

更新 App

+
+
+ 更新 App
+
+ 不論是要添增新功能或是修正錯誤 (當然最好不要是錯誤)，定期提供 App 更新檔，才能保持 App 的能見度。本文將說明應如何透過 Firefox Marketplace 遞交 App 的更新檔案。
+
+

管理已發佈的 App

+
+
+ App 管理指南
+
+ 在發佈 App 之後，你可能想更改某個地方，或了解消費者對該 App 的接受度為何。本文將帶領你變更 App 的狀態、檢視統計資料、檢查於 Firefox Marketplace 上所獲得的評價。
+
+

更多工具

+
+
+ 為自己的 App 添增子網域
+
+ 如果要從自己的網站上提供超過 1 個的架設/托管式 (Hosted) App，就必須逐一建立子網域。本文將說明添增子網域的方式。
+
+
+
diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/managing_your_apps/app_statistics/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/managing_your_apps/app_statistics/index.html new file mode 100644 index 0000000000..6454ca8f31 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/managing_your_apps/app_statistics/index.html @@ -0,0 +1,66 @@ +--- +title: App 統計資料 +slug: Archive/Mozilla/Marketplace/Publishing/Managing_your_apps/App_Statistics +translation_of: Archive/Mozilla/Marketplace/Publishing/Managing_your_apps/App_Statistics +--- +
+

Firefox Marketplace 可提供 App 的多樣統計資料。本文將說明應如何取得自己 App 在 Firefox Marketplace 上的統計資料、報表資料的呈現方式，另可審閱報表內的特定資訊、可用的報表，並使用已匯出的報表資料。

+
+ +

取得 App 的狀態

+ +

若要取得任何已發佈 App 的狀態，須先到 Firefox Marketplace 點擊「開發者交流中心 (Developer Hub)」，再進入「我的提交 (My Submissions)」。所有已發佈的 App 都能看到 (1)「統計資訊 (Statistics)」連結。

+ +

In My Submissions, for each published app you will find a link to the app's stats page

+ +

報表介紹

+ +

在開啟了 App 的統計資訊之後，就會進入下方的統計資料表。此頁將摘要呈現目前可用的統計報表資料。

+ +

The stats dashboard provides a visual summary of your app's stats and links to the 5 reports

+ +

開發者可在此頁看到下列報表：

+ + + +

每組報表均為相同的基礎架構，如下所示：

+ +

All reports follow the same basic structure with date selector, region selector (Installs report only) graph, JSON export option and daily summary.

+ +
    +
  1. 日期選擇 — 可設定報表應顯示的開始＼結束日期。
    2. +
  2. 地區選擇 (僅 Installs 報表) — 可設定報表應顯示全世界活動資料，或個別國家＼地區的資料。 +
    在本文撰寫期間，此功能因資料加總功能的問題，先予以關閉。可參閱 Bug 1028448。
    +
    3. +
  3. 「更新」按鈕 — 依照目前日期與地區設定，重新整理報表內容。
    4. +
  4. 按每日顯示的活動圖表。
    5. +
  5. JSON 匯出選項。
    6. +
  6. 其他按每日顯示的活動圖表。
    7. +
+ +

使用匯出的資料

+ +

你可能想在其他試算表應用中使用匯出的資料。目前尚無主流的試算表應用程式 (Microsoft 的 Excel、Apple 的 iWorks Numbers、OpenOffice 的 Calc) 能支援 JSON 格式的資料匯入功能。解決方案就是將 JSON 轉檔為 CSV 格式。此檔案格式可用於大多數的試算表應用程式。目前有許多 JSON to CSV 的線上轉檔功能：

+ + + +

此外還有下列資源提供程式碼，讓你能針對不同的試算表應用程式，建立自動匯入功能：

+ + diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/marketplace_screenshot_criteria/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/marketplace_screenshot_criteria/index.html new file mode 100644 index 0000000000..76f2576eff --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/marketplace_screenshot_criteria/index.html @@ -0,0 +1,80 @@ +--- +title: Marketplace 截圖準則 +slug: Archive/Mozilla/Marketplace/Publishing/Marketplace_screenshot_criteria +translation_of: >- + Archive/Mozilla/Marketplace/Publishing/Policies_and_Guidelines/Marketplace_screenshot_criteria +--- +
+

在將 App 提交至 Firefox Marketplace 時，開發者必須提供 1 幅或更多截圖以供使用。Marketplace 另提供此類截圖的非硬性規範，可作為開發者截圖時的準則。如果 App 截圖均未能符合本篇文章所載明的規範，則可能會要求開發者提交新的截圖。

+
+

截圖概述

+ +

截圖重點

+ +

總而言之，截圖應該以 App 為重點，而不是 App 周圍的情境。

+

尺寸與格式

+

截圖可為 JPG 與 PNG 格式。若是較能保有原來解析度的 PNG-24 最好。如果是 JPG 格式，則應儘量使用最小幅度的壓縮並設定為最高圖像品質。

+

建議尺寸

+ + + + + + + + + + + + + + + + + + + + + +
裝置規格建議的解析度
手機 +

320x480 的倍數、720x1280 的倍數；或 480x320 的倍數、1280x720 的倍數

+
平板電腦1024x768 的倍數、1280x800 的倍數
桌上型電腦1280x800 的倍數、1440x900 的倍數
+

範例

+

不要出現與 App 無關的圖素，如廣告或商標。

+

+

不要提供「手拿著裝置」的照片，或將截圖編輯到實體裝置之上。

+

+

截圖不需使用/添加裝置的邊框、不必要的文字、其他不必要的特色。

+

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/packaged_apps/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/packaged_apps/index.html new file mode 100644 index 0000000000..cf9937c110 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/packaged_apps/index.html @@ -0,0 +1,75 @@ +--- +title: 封裝式 (Packaged) App +slug: Archive/Mozilla/Marketplace/Publishing/Packaged_apps +translation_of: Archive/Mozilla/Marketplace/Options/Packaged_apps +--- +

封裝式 (Packaged) App 屬於 Open Web App，即以 ZIP 壓縮檔納入其 HTML、CSS、JavaScript、manifest 檔案等所有資源，不像之前必須將資源置於網路伺服器之中。本篇文章將為開發者提供封裝式 App 的相關說明 。

+

封裝式 App 為 ZIP 壓縮檔，內含 Open Web App 能夠運作的所有資源，並將 manifest 檔案置於其根目錄之下，且此 manifest 檔案將提供 App 本身的說明、圖示等資訊，以利辨識出已安裝的 App。此封包接著可將 App 安裝到 Firefox OS 裝置、Android 裝置、桌機之中。一旦在裝置上安裝 App 之後，仍可存取 Web 上的資源，如伺服器上的資料庫。

+

封裝式 App 另可分為三類：Web App、Privileged App、Certified App。封裝式 App 可作為任何形式的 Open Web App；Privileged 與 Certified App 則是透過數位簽章的方式，啟動 Privileged 與 Certified API。Privileged App 簽章之後即成為 Marketplace 審查流程的一部分；Certified App 則是由裝置製造商或電信營運商進行簽章。

+

封裝式 App 除了能使用 Privileged 與 Certified API 之外，也能在安裝之後更快取得裝置的資源，達到更快的首次啟動速度。基於這些特色，我們也針對 Firefox OS 裝置、Android 裝置、桌機，均建議以封裝式 App 的形式提供 Open Web App。

+
+

注意：目前 Firefox Marketplace 上所支援的付費封裝式 App，僅限為 Firefox OS App。而免費封裝式 App 已可支援 Firefox OS、行動版 Firefox (Firefox for Android)、桌面版 Firefox。現正開發可支援所有平台的付費 App。

+
+
+

注意：你會在 Firefox 開發者工具的「應用程式管理員 (App Manager)」看到「manifest」中文翻譯為「安裝資訊檔」。

+
+

封裝式 App 的類型

+

封裝式 App 可分為 Web App、Privileged App、Certified App，且均可對應 Firefox OS 不同程度的 App 安全性模式。接著將提供進一步資訊。

+

Web app

+

Web App 不會使用 Privileged 或 Certified API。在提交到 Marketplace 之後，App 的封包隨即簽章完成，但仍尚未執行 Privileged 或 Certified App 所使用的特殊授權程序。也因此 Web App 不能使用 Privileged 或 Certified API。這些 App 也不需要 Privileged 與 Certified App 所必備的內容安全政策 (CSP)。

+

這種封裝式 App 的 manifest.webapp 檔案中，不需要 type 欄位。其 type (web) 的預設值就是正確的值。

+

Web App 可自行發佈，或可透過 Firefox Marketplace 發佈。Web App 亦可透過架設/托管式 App 的機制對外提供。

+

Privileged app

+
+
+  
+
+ Privileged app 是由 Firefox OS Marketplace 以特殊程序核准之後發出。如果任一 App 要存取裝置上的特定 Sensitive API，則可為使用者提供更高的安全性。此種 App 即等同 iOS 或 Android 平台上的原生 App。若要指定為 Privileged App，必須在其 manifest.webapp 檔案中添增 type 欄位並設定為 privileged。App 所要存取的 privileged API，均必須加入 manifest 檔案的 permissions 欄位中。
+
+ Firefox OS、Web runtimes for Android、桌機，將針對 Privileged App 強制使用下列 CSP：
+
+
+
+ 
"default-src *; script-src 'self'; object-src 'none'; style-src 'self' 'unsafe-inline'"
+

Privileged App 僅能透過 Firefox Marketplace 發佈。

+
+
+  
+
+

Certified app

+
+
+  
+
+
+

一般第三方開發者並不會接觸到 Certified App；且 Certified App 也不會透過 Firefox Marketplace 發佈。這類 API 的長遠目標，就是要讓本身的憑證更完善、更具公信力，進而也能作為 Privileged API。如果你不是很想架構特定的 API，也可直接在 dev-webapps 郵件群組中反應。

+
+
+
+ Certified App 將透過 Certified API 而存取重要的系統功能，如智慧型手機上預設的撥號鍵盤，或系統設定 App。與 Privileged App 相較，並不會用於第三方 App，所以大多數的 App 開發者可忽略此類 App。除了所有的裝置許可均為隱式許可 (Implicit permission，意即不需要外部的使用者許可) 之外，Certified 與 Privileged App 大部分均屬於相似的封裝式 App。而 Certified App 必須取得 OEM 裝置或電信營運商裝置的許可，才能讓此隱式 App 使用重要 API。若要將 App 指定為 Certified App，則需於其 manifest.webapp 檔案中添增 type 欄位並設定為 certified。
+
+ Firefox OS 則針對 Certified App 建構了下列 CSP： + 
"default-src *; script-src 'self'; object-src 'none'; style-src 'self'"
+ 與 Certified App 相較，Privileged App 則是針對 inline CSP 的影響而稍微放寬了限制。進一步了解其原因，可參閱預設 CSP 與 Bug 768029。
+
+ OEM 廠商與電信營運商均已將 Certified App 安裝到裝置之上。
+
+  
+
+

測試封裝式 App

+

如果要透過 Firefox OS 模擬器 (Firefox OS Simulator)，測試 Firefox OS 裝置在安裝封裝式 App 的情形，可參閱《應用程式管理員 (App Manager)》。開發者也能透過《App 發佈方式》中的步驟，從一般網頁伺服器上安裝該 App 到裝置上。另請注意，如果你要自己發佈 App，就只能安裝封裝式 Web App。

+

發佈封裝式 App

+

有兩種方式可發佈封裝式 App：透過 Firefox Marketplace 或自行發佈。

+

透過 Firefox Marketplace 發佈

+

可參閱 App Publishing，將封裝式 App 提交到 Firefox Marketplace 之上。

+

在提交封裝式 App 時，其 zip 檔案即儲存於 Marketplace 伺服器之上，且 Marketplace 將根據封裝式 App 的 zip 檔案中的 manifest，產生新的「mini-manifest」檔案。在消費者安裝 App 時，隨即將 mini-manifest 傳送至 Apps.installPackage() 函式以安裝該 App。僅安裝與更新程序才會使用 mini-manifest。App 執行期間並不會使用此檔案。

+

自行發佈

+

當然也能在 Firefox Marketplace 之外，也就是自己的網路伺服器上發佈封裝式 App。可參閱《自行發佈 App》。

+

更新封裝式 App

+

若要進一步了解更新作業，請參閱《更新 App》。

+

更多資訊

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/index.html new file mode 100644 index 0000000000..d914835648 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/index.html @@ -0,0 +1,10 @@ +--- +title: Policies and Guidelines +slug: Archive/Mozilla/Marketplace/Publishing/Policies_and_Guidelines +tags: + - NeedsTranslation + - Structure + - TopicStub +translation_of: Archive/Mozilla/Marketplace/Publishing/Policies_and_Guidelines +--- +

This section contains Firefox Marketplace policies and guidelines

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/introduction/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/introduction/index.html new file mode 100644 index 0000000000..230c5d714a --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/policies_and_guidelines/introduction/index.html @@ -0,0 +1,39 @@ +--- +title: 簡介 ─ 政策與指南 +slug: Archive/Mozilla/Marketplace/Publishing/Policies_and_Guidelines/Introduction +translation_of: Archive/Mozilla/Marketplace/Publishing/Policies_and_Guidelines/Introduction +--- +
本文將提供 Firefox Marketplace 所用的多項政策與指南。
+ +
下列政策與指南均為 Firefox Marketplace 所用：
+ +
 
+ +
+
+

政策

+ +
+
隱私權政策
+
如果 App 需用到消費者的個人資料，就必須提供隱私權政策。
+
+
+ +
+

指南

+ +
+
隱私權政策
+
如果 App 需用到消費者的個人資料，則相關指南可提供 App 隱私權政策中所需的資訊。
+
+ +
+
截圖指南
+
為 App 截圖的相關指南，且截圖亦可用於 Marketplace 上架展示。
+
App 測試與疑難排解
+
相關資訊將說明測試環境的設定方式，以利測試 App 並解決可能發現的問題。
+
+
+
+ +

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/introduction/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/introduction/index.html new file mode 100644 index 0000000000..6c505166dd --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/introduction/index.html @@ -0,0 +1,57 @@ +--- +title: 簡介 — 制定 App 的價格 +slug: Archive/Mozilla/Marketplace/Publishing/Pricing/Introduction +translation_of: Archive/Marketplace/Publishing/Pricing/Introduction +--- +
+

本文將陸續新增相關內容，請隨時注意更新資訊。

+
+ +
要讓自己的 App 透過 Firefox Marketplace 獲得收益很簡單：為自己的帳戶設定 1 或更多的付款服務供應商，再設定 App 價格與發售國家 (免費 App 也能讓消費者升級為付費版本)。如果你要使用「應用程式內付款 (In-app payment)」功能，就必須取得 API 金鑰並定義 App 內販售的產品。本文將帶領你在 Firefox Marketplace 中設定付費的Open Web App 及其內部販售產品，另提供有用的相關資訊。
+ +
 
+ +
+
+

設定付費 App

+ +
+
付費帳戶
+
設定帳戶的付款服務供應商，才能收取 App 售出及其內部付款的收益。
+
訂價 (敬請期待)
+
設定 App 價格與銷售國家等選項。
+
以「升級」方式推廣
+
免費 App 亦可升級為付費 App。
+
+ +

更多資訊

+ +
+
 
+
檢驗收據
+
該如何檢查消費者是否付款購買 App。
+
價格點數
+
依國家訂價的相關資訊。
+
+
+ +
+

設定應用程式內付款

+ +
+
取得自己的 API 金鑰 (敬請期待)
+
為自己的 App 取得 API 金鑰。
+
定義應用程式內販售的產品
+
於 Marketplace 上設定 fxPay 的應用程式內產品。
+
+ +

更多資訊

+ +
+
檢驗收據
+
該如何檢查消費者是否付款購買 App 內販售的產品。
+
+
+
+ +

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/payment_accounts/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/payment_accounts/index.html new file mode 100644 index 0000000000..e6938f4336 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/payment_accounts/index.html @@ -0,0 +1,61 @@ +--- +title: 付款帳號 +slug: Archive/Mozilla/Marketplace/Publishing/Pricing/Payment_Accounts +translation_of: Archive/Marketplace/Publishing/Pricing/Payment_Accounts +--- +
+

如果要在 Firefox Marketplace 設定付款 App 或應用程式內付款 (In-app payment) 產品，首先就是設定 1 家或更多的付款服務供應商。本文將說明 Firefox Marketplace 搭配多家供應商的理由、提交程序中所應完成的設定，另提供各家供應商的帳號資訊。

+
+ +

付款服務供應商

+ +

目前配合 Firefox Marketplace 活躍中的付款服務供應商就是「Bango」，當然 Firefox Marketplace 未來將支援其他供應商。付款服務供應商可新增其他付款選項，如付款類型、電信營運商、收款國家等。另間「Boku」供應商很快就會加入 Marletplace。供應商另可透過 Marketplace 讓消費者選用其服務；但目前尚未有供應商支援此一選項。

+ +
+

在交易付費 App 時，均必須透過  Firefox Marketplace 中的付款服務供應商之一。如果 App 亦提供應用程式內付款的產品，也可配合其他供應商，但開發者必須自行滿足必要的推銷與技術需求。

+
+ +

供應商的功能

+ +

所有的付款服務供應商必須達到下列：

+ + + +

設定自己的付款帳號

+ +

在 Marketplace 提交程序的「相容性與付款 (Compatibility & Payments)」頁面上，找到「付款帳號 (Payment Accounts)」區塊並設定付款服務供應商。

+ +

The Payment Accounts section of the Compatibility and Pricing page

+ +

在設定付款帳號與供應商兩者時，所需的資訊有所不同。但同樣必備的資訊如下：

+ + + +
+

在大多數的情況下，付款服務供應商也有在其他國家運作，因此會透過某些形式的國際銀行轉帳作業支付款項給開發者。這類交易都會需要收款銀行的識別代碼。常用的代碼有：

+ + + +

其實只要透過 Google 查詢自己開戶的銀行名稱與匯款代碼 (可能是 SWIFT 或 BIC 或 IBAN)，往往都能找到銀行的相關資訊。可在你開戶銀行的網站上尋找「跨國轉帳」、「收取海外匯款」或類似字眼。此外還有某些工具可協助你找到相關代碼：

+ + +
+ +

以下連結可找到付款服務供應商的設定資訊：

+ + diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/promote_as_upgrade_to_free_version/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/promote_as_upgrade_to_free_version/index.html new file mode 100644 index 0000000000..d0eb6c32a4 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/pricing/promote_as_upgrade_to_free_version/index.html @@ -0,0 +1,26 @@ +--- +title: 建議升級 App 的免費版本 +slug: >- + Archive/Mozilla/Marketplace/Publishing/Pricing/Promote_as_upgrade_to_free_version +translation_of: Archive/Marketplace/Publishing/Pricing/Promote_as_upgrade_to_free_version +--- +
+

談到 App 的相容性與付款選項時，可讓 App 的免費版本升級為付費版本，並透過 Firefox Marketplace 提出此一推銷建議。此一選項可供消費者先體驗功能有所限制的 App，在決定是否購買完整功能的版本。或是免費版本會顯示廣告，付費版本則無廣告；或可為其他類似的組合。本文章說明設定方式，並讓 Firefox Marketplace 顯示升級資訊。

+
+ +

在「相容性與訂價 (Compatibility & Pricing)」頁面底部，可看到「以升級至免費版本促銷 (Promote as upgrade to free version)」區塊。而在「這個付費版本升級此附加元件 (This is a paid upgrade of)」方塊中，你可選擇要哪些免費 App 可升級為付費 App。一旦選擇對應的免費版本 App 之後，就點擊「儲存變更 (Save Changes)」。

+ +

Promote as upgrade to free version section of the Compatibility & Pricing page

+ +

一旦 App 通過審查並發佈於 Firefox Marketplace 之上，則免費 App 列表中就會出現下列附加資訊：

+ + + +

若要進一步了解 App 的銷售方式，可參閱〈選擇自己的商業模式〉。

+ +

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/privacy_policies/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/privacy_policies/index.html new file mode 100644 index 0000000000..80c1bc6b62 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/privacy_policies/index.html @@ -0,0 +1,28 @@ +--- +title: 隱私權政策制定指南 +slug: Archive/Mozilla/Marketplace/Publishing/Privacy_policies +translation_of: >- + Archive/Mozilla/Marketplace/Publishing/Policies_and_Guidelines/Privacy_policies +--- +

隱私權極難以界定，且牽涉到法律、社會規範、使用者期望等複雜的概念。不論是 App、網站、網頁、附加元件的開發者，都必須謹慎對待使用者的隱私權以獲得信賴。Mozilla 集結相關指南並制定極佳的隱私權政策，以協助開發者建構出注重隱私權的 App。但請注意，本文並無法取代真正律師所提供的實質法律服務。

+

隱私權政策

+

隱私權政策用以闡述你對資料的處理方式。關鍵在於開發者蒐集、使用、儲存、共用、揭露個人資訊的方法。Mozilla 則集結成隱私權政策範本，讓開發者能簡單說明自己的隱私權政策。

+
https://github.com/flamsmark/privacy-policy-template
+
+

首先請參閱 README。此範本僅可協助你制定部分的隱私權政策。Mozilla 前提是協助開發者能更輕鬆制定隱私權政策，但無法保證此範本已經面面俱到。至少此範本能讓你注意到主要的隱私權問題並進一步思考。敬請使用該範本並自行強化不足的部份。

+

此範本也是很好的實作機會 (某些情況下必須兼顧適法性的問題)。開發者可透過隱私權政策讓消費者知道自己的資訊將何去何從。全世界有這麼多不同的國家，對使用者資料的蒐集、使用、儲存、揭露方式的要求也有所差異。開發者應透過律師了解不同的隱私權政策，並確實讓消費者得知自己應熟悉的要點。

+

Mozilla Marketplace 的隱私權要求

+

如果任一 App 或附加元件 (Add-on) 將蒐集消費者的資料，則開發者就必須提供隱私權政策並將之列於 Mozilla Marketplace 之中。

+

設計 App 的隱私權要點

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/publish_options/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/publish_options/index.html new file mode 100644 index 0000000000..c7b213c18c --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/publish_options/index.html @@ -0,0 +1,145 @@ +--- +title: 自行發佈 App +slug: Archive/Mozilla/Marketplace/Publishing/Publish_options +translation_of: Archive/Mozilla/Marketplace/Options/Self_publishing +--- +
+

開發者可能不想透過 Firefox Marketplace 發佈 App，例如你只想提供給組織內的成員、執行測試版 App，或只是自己試好玩的。本篇文章將說明開發者如何在 Firefox Marketplace 之外自行發佈 App。

+
+

 

+

Open Web App 可透過 {{ domxref("Apps.install") }} 或 {{ domxref("Apps.installPackage") }}，安裝到 Firefox OS、執行 Firefox for Android 的裝置，或是執行桌面版 Firefox 的桌機之上。而這些 API 均會送出 manifest 檔案的網址，其內將敘述所將安裝的 App。因此要自行發佈 App 就必須滿足下列基本要求：

+
    +
  1. 伺服器必須裝載 App 的 manifest 檔案
    2. +
  2. 伺服器必須裝載 (架設/托管式) App，或 (封裝式) App 的 ZIP 檔案
    3. +
  3. 置於網站上的程式碼必須觸發合適的 {{ domxref("Apps.install") }} 或 {{ domxref("Apps.installPackage") }}
    4. +
+

限制

+

在自己發佈 Open Web App 之前，必須注意下列限制：

+ +

自行發佈封裝式 App

+

只要在伺服器上架設/托管 ZIP 檔案與其 mini-manifest，就能自行發佈封裝式 App。而 mini-manifest 必須置於 ZIP 相同的目錄之下，以利安裝程序能識別 App。接著可建立指令碼以觸發 {{ domxref("Apps.installPackage") }}，送出 mini-manifest 的細節。可參閱下方以了解：

+
    +
  1. +

    將 App 的內容壓縮為 ZIP 並命名為 package.zip。 此檔案應容納 App 的所有資源檔案，並包含 (主要) manifest 檔案。

    +
    +

    重要：請注意封裝式 App 所要壓縮的內容，不要包含檔案本身的目錄。如果你連母目錄都壓縮進去，則 manifest 檔案就位於錯誤地方，整個封裝式 App 隨即無效。

    +
    +
    2. +
  2. 建立名為 manifest.webapp 的檔案，並加入以下內容。此檔案即所謂的 mini-manifest，也是封裝式 App 壓縮檔內的精簡版 manifest 檔案。而 {{ domxref("Apps.installPackage") }} 將使用 mini-manifest，以進行 App 的安裝程序。若要進一步了解細節，可參閱下方的 Mini-manifest 欄位。
    + 
    {
+    "name": "My sample app",
+    "package_path" : "http://my-server.com/my-app-directory/package.zip",
+    "version": "1",
+    "developer": {
+        "name": "A. Developer",
+        "url": "http://my-server.com"
+    }
+}
    +
    3. +
  3. 建立可安裝 App 的指令碼。這裡我們使用了名為「index.html」的簡易 HTML 檔案。但你也可將指令碼新增至按鈕，或使用任何適當的函式，以於自己的網站上觸發作業。此頁面上的 JavaScript 將呼叫 Packaged App installer API ({{ domxref("Apps.installPackage") }})，並針對安裝作業的成功與否進行回呼 (Callback)。 + 
    <html>
+  <body>
+    <p>Packaged app installation page</p>
+    <script>
+      // This URL must be a full url.
+      var manifestUrl = 'http://my-server.com/my-app-directory/manifest.webapp';
+      var req = navigator.mozApps.installPackage(manifestUrl);
+      req.onsuccess = function() {
+        alert(this.result.origin);
+      };
+      req.onerror = function() {
+        alert(this.error.name);
+      };
+    </script>
+  </body>
+</html>
    +
    4. +
  4. 將「package.zip」、「package.manifest」、「index.html」複製到你指定的目錄中 (此範例則為 my-app-directory)，即可在自己的伺服器或網站上設定檔案。
    5. +
  5. 以相容設備 (如 Firefox OS 手機) 安裝 App。只要開啟 index.html 檔案 (此範例的路徑為 http://my-server.com/my-app-directory/index.html)  就會看到系統詢問是否要安裝該 App。繼續執行安裝步驟直到完畢，接著網頁指令就會顯示安裝作業是否成功。
    6. +
+
+

秘訣：你可於本端架設/托管 1 個封裝式 App，並於裝置中進行測試。伺服器與裝置必須位於同一個網路之上，而伺服器必須能接收本端網路的請求。你只要在 mini-manifest 檔案的 package_path 中加入絕對路徑即可。只要用相同的方式，正常情況就已經納入絕對路徑 (可參閱下方)。如果要使用非標準通訊埠，例如 http://10.10.12.1:8080/package.zip，則記得應納入通訊埠的資訊。

+
+

Mini-manifest 檔案的欄位

+

如果要在 Firefox Marketplace 發佈 App，就不需擔心該如何建立 mini-manifest 檔案；Firefox Marketplace 可為開發者代勞。Marketplace 將使用 manifest 檔案中的相關資訊。可參閱《App 的 manifest 檔案》一文。

+

如果要自行發佈 App，也就必須自行建立 mini-manifest 檔案。最好就是複製「主要」的 manifest 檔案，並依需求將之更新。先複製完整內容就能輕鬆建立 mini-manifest 檔案，因其內的 name、version、developer、locales 欄位必須完全相同。開發者亦可添增其他內容。mini-manifest 檔案專屬的欄位則包含 package_path、release_notes、size。

+
+
+ package_path (必填)
+
+ 儲存 App 壓縮檔的絕對路徑 (需為完整的網址，如  http://my-server.com/my-app-directory/manifest.webapp)
+
+ release_notes (選填)
+
+ App 版本資訊。在 Firefox Marketplace 的提交過程中，就必須提供此項資訊。
+
+
+
+ size (選填)
+
+ 以 byte 計算的 App 壓縮檔容量。而 {{ domxref("Apps.installPackage") }} 將使用此項資訊，才能在安裝過程中顯示安裝進度。
+
+

以下提供範例：

+
{
+  "name": "My app",
+  "package_path": "http://thisdomaindoesnotexist.org/myapp.zip",
+  "version": "1.0",
+  "size": 172496,
+  "release_notes": "First release",
+  "developer": {
+    "name": "Developer Name",
+    "url": "http://thisdomaindoesnotexist.org/"
+  },
+  "locales": {
+    "fr-FR": {
+      "name": "Mon application"
+    },
+    "se-SE": {
+      "name": "Min balla app"
+    }
+  },
+  "icons": {
+    "16": "/icons/16.png",
+    "32": "/icons/32.png",
+    "256": "/icons/256.png"
+  }
+}
+

此範例中的其他欄位包含：

+
+
+ name (必填)
+
+ App 的名稱，最長 128 個字元。
+
+ version (選填)
+
+ App 的目前版本。
+
+ developer  (選填)
+
+ 開發者的資訊，內含 name 與 url 欄位。而 mini-manifest 與 manifest 檔案中的開發者資訊必須相同。
+
+ locales (選填)
+
+ 語系資訊，必須為 xx-YY 格式。
+
+ icons (選填)
+
+ App 所使用的圖示。
+
+

若要進一步了解 manifest 檔案，可參閱《App 的 manifest 檔案》。

+

自行發佈架設/托管式 App

+

與封裝式 App 相較，如果你建立內容的方式，就與 Firefox Marketplace 發佈的方式相同，則自行發佈架設/托管式 (Hosted) App 就更簡單了。基本上就是為自己的 App 建立 manifest 檔案。接著加入程式碼以觸發 {{ domxref("Apps.install") }}。此程式碼必須與上述封裝式 App 所用的相同。唯一不同點在於，你可對 manifest 檔案設立相對的參考位置。

+

另請參閱

+ +

 

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/submission_checklist/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/submission_checklist/index.html new file mode 100644 index 0000000000..5f029ca0c3 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/submission_checklist/index.html @@ -0,0 +1,72 @@ +--- +title: 提交作業檢查清單 +slug: Archive/Mozilla/Marketplace/Publishing/Submission_checklist +translation_of: Archive/Mozilla/Marketplace/Publishing/Submission_checklist +--- +
+

在將自己的 App 提交到 Firefox Marketplace 之前，當然該確認是否已經掌握了所有必要資源。本文則提供檢查項目與相關資訊的連結。

+
+

提交作業檢查清單

+

要完成 Firefox Marketplace 的提交程序，你需要：

+

針對封裝式 (Packaged) App

+ +

針對架設/托管式 (Hosted) App

+ +
+

在將 App 提交到 Firefox Marketplace 之前，可使用「測試應用程式驗證」工具來測試 manifest 檔案的正確性。

+
+
+

注意：你會在「應用程式管理員 (App Manager)」看到「manifest」中文翻譯為「安裝資訊檔」。

+
+

針對所有 App (必備)

+

架設/托管式、封裝式 App 的共通必要條件：

+ +

針對付費 App 或應用程式內付款 (In-app payments)

+ +

針對所有 App (非必備)

+

架設/托管式、封裝式 App 的建議條件：

+ +

另外還有......

+

......你應該：

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/submit/enter_your_apps_details/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/enter_your_apps_details/index.html new file mode 100644 index 0000000000..88211b4b18 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/enter_your_apps_details/index.html @@ -0,0 +1,129 @@ +--- +title: 輸入 App 上架時所顯示的詳細資訊 +slug: Archive/Mozilla/Marketplace/Publishing/Submit/Enter_your_apps_details +translation_of: Archive/Mozilla/Marketplace/Publishing/Submit/Enter_your_apps_details +--- +
+

在將 App 上傳到 Firefox Marketplace 之後，應更新 App 的詳細資訊以利於 Marketplace 頁面上顯示。

+
+ +
+

此步驟將針對 App 的預設語系版本 (英文)，編輯相關細節 (如網址與說明等)。如果你有其他語系版本，或是要針對其他國家＼語系而修改詳細資訊，仍必須透過標準的「編輯資訊 (Edit Listing)」選項 (可參閱 step 9)。

+
+ +
+

注意：你可能會看到「manifest 檔案」的正體中文翻譯為「安裝資訊檔」。

+
+ +

現在進入「提交 App、編輯 App 詳細資訊」的頁面。

+ +

Edit app details page header

+ +

如頁面中所示，你在 manifest 檔案中提供的 App 詳細資訊，會由系統預先填入大部分的頁面空格之中。

+ +

App 圖示與網址

+ +

在 manifest 檔案中提供的 App 圖示與說明，再加上檔案儲存網頁的網址，都已經列於此頁面的第一區塊內。Marketplace 將根據 App 名稱而自動產生網址，並逕行修改以成為專屬網址。你可以點擊 (1)「開啟詳細資訊頁面 (Open details page)」以檢視 Marketplace 的細節頁面，也能點擊 (2)「編輯 (Edit)」以編輯圖示與Marketplace 的網址。

+ +

When the page first loads your app name and icon are displayed (based on the manifest content) along with the URL generated by Marketplace

+ +

若要更改 App 的圖示，就點擊 (1) 的圖示就能瀏覽電腦上的其他圖檔。若要更改 App 詳細資訊的頁面名稱，可於 (2) 的 App 網址方塊中輸入新的值。如果你輸入目前已存在的頁面名稱，就會出現警告訊息，直到你修改完畢並點擊「繼續 (Continue)」為止。而且必須修改成有效的 App 詳細資訊頁面網址，否則就無法離開此頁面。

+ +

You can (1) change the app's icon and (2) enter your own page name for the app

+ +

App 說明

+ +

接著下個區塊則顯示 App 的相關說明，也是直接取自於 manifest 檔案而來。你也可以依照自己需要而在「說明 (Description)」方塊中編輯說明。只要拖曳方塊右下角，就能拉大整個編輯方塊的面積。此為必填欄位。

+ +

You can create a description over 1024 characters and include some HTML tags to improve formatting.

+ +

與 manifest 檔案所提供的說明不同，這裡讓你編輯的說明內容可以：

+ + + +

App 分類

+ +

Marketplace 是以「分類 (Category)」提供 App 完整列表。開發者必須為自己的 App 勾選至少一項分類，當然也可以視需要而勾選他項適合的分類。舉例來說，如果 App 可擷取、編輯、分享照片，你當然可以勾選「Photo & Video」與「Social」兩種分類。

+ +

You must pick one, but can pick 2, categories that match your app'scontent

+ +

隱私權政策

+ +

開發者必須提供 App 的隱私權政策，即使 App 聲稱不會蒐集個人資料，也同樣必須提供。如果 App 會蒐集消費者的個人詳細資訊，就必須提供詳盡的政策 (網頁連結或純文字均可)。你可到《隱私權政策指南》 找到的撰寫資訊。而上述「說明」欄位所支援的 HTML 標籤，也同樣可用在政策撰寫時的格式。這裡一樣拖曳 (1) 方塊的右下角，能拉大編輯方塊的面積空間。

+ +

A privacy policy must be provided, even if its only to say that no personal data is collected by the app

+ +

App 資訊與支援服務連結

+ +

如果有 App 首頁與支援服務頁面的網址，亦可一併提供。但你至少須提供電子郵件位址，以利消費者聯絡後續支援服務。

+ +

Link can be provided to any information or support pages for the app, however a support email address must be provided

+ +
+

支援服務的電子郵件位址，即納入 App 於 Marketplace 上架時的公開清單中。建議你應提供專屬的電子郵件位址，而不要使用一般的免費郵件位址。

+
+ +

是否支援 Flash

+ +

如果你針對 Adobe Flash 而開發 Web App 的內容，則請在這裡點選「Yes」代表使用了 Adobe Flash。反之則點選「No」。

+ +

Indicate whether your app has need for Flash support

+ +

截圖與影片

+ +

現在可為自己的 App 加上截圖與影片了。點擊 (1)「新增螢幕截圖或影片 (Add a screenshot or video)」，就能瀏覽電腦的檔案，找到對應的檔案並點選即可。若添增超過 1 支以上的檔案，就能拖曳 (2) 檔案以變更 Marketplace 中呈現的順序。亦可點擊 (3) 的刪除圖示，移除你不想要的檔案。

+ +

截圖可為 PNG 或 JPG 格式，影片則為 WebM 格式。建議手機截圖為 320 x 480 px 尺寸。另可參閱《Marketplace 截圖準則》，以及《Promoting your app》的〈Videos〉進一步了解。

+ +

Click Add a screenshot or video to add a new item. reorder added items and delete any unwanted items

+ +

設定發佈方式

+ +

你可決定在 App 通過 Firefox Marketplace 的審查之後，是要立刻上架 (發佈 App 並讓任何人都能在 Marketplace 中看到，另將納入搜尋結果)，或是暫時不要發佈 (不發佈App。提醒開發者可稍後調整 App 上架情形)。

+ +

Selected whether your app will be added to Marketplace as soon as it's been approved or whether you will set its visibility after approval

+ +

點選「不要自動發佈我的程式 (Do not publish my app)」將可：

+ + + +

「不要自動發佈我的程式」將有更多詳細資訊供你選擇，敬請期待。

+ +
+

在你完成這一步驟之後，就無法編輯此選項。往後若要修改此選項，就必須提供 App 的更新檔才行。

+
+ +

給審查人員看的註記

+ +

最後，你可提供額外資訊給 App 審查人員觀看。特別一提，如果 App 所搭配的 Web 服務需要消費者登入才可使用，則你應提供暫時性的帳戶給審查人員試用此服務。只要拖曳方塊右下角，就能拉大整個編輯方塊的面積。

+ +

Add comments to assist the reviewer review your app

+ +
+

在你完成這一步驟之後，就無法編輯此選項。往後若要修改此選項，就必須提供 App 的更新檔才行。

+
+ +

下一步

+ +

點擊「繼續 (Contiune)」即可進到下個程序：下一步

+ +

Click Continue to proceed to the next step

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/submit/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/index.html new file mode 100644 index 0000000000..a6e3468169 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/index.html @@ -0,0 +1,10 @@ +--- +title: Submit +slug: Archive/Mozilla/Marketplace/Publishing/Submit +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla/Marketplace/Publishing/Submit +--- +

This section describes the process for submitting an app to Firefox Marketplace

+

Residual details: https://developer.mozilla.org/en-US/Marketplace/Publishing/Submit/Submitting_an_app

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/submit/load_your_app/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/load_your_app/index.html new file mode 100644 index 0000000000..7c657ed720 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/load_your_app/index.html @@ -0,0 +1,134 @@ +--- +title: 將 App 上傳到 Firefox Marketplace +slug: Archive/Mozilla/Marketplace/Publishing/Submit/Load_your_app +translation_of: Archive/Mozilla/Marketplace/Publishing/Submit/Load_your_app +--- +
+

在登入自己的開發者帳戶並同意開發者協定之後，就能輸入 App 的細節，再讓  Firefox Marketplace 識別其 manifest 檔案。

+
+ +
+

注意：你可能會看到「manifest 檔案」之正體中文翻譯為「安裝資訊檔」。

+
+ +

概述

+ +

現在你進入「提交 App (Submit an App )」頁面，可進行：

+ + + +

收益方式

+ +

你首先應對 App 所提供的資訊，就是其收益方式。

+ +
    +
  1. 針對自己的 App，點選 (1)「免費 (Free)」或「付費/應用程式內付款 (Paid / in-app)」分頁。
    2. +
  2. Select either Free if the app is free to download and use, or Paid / In-app of the app has to be purchased or contains any in-app payment options
    3. +
+ +
+

如果你想先讓消費者免費下載 App，再透過 App 內部付費產品獲得收益，請點選「付費 / 應用程式內付款」。

+
+ +
+

只要你點選「付費/應用程式內付款」並完成提交程序之後，就無法再將該 App 改回免費提供。但原本就點選「免費」的 App 可隨時更改為付費形式。

+
+ +

平台相容性

+ +

在選擇了免費＼付費 App 之後，就該定義 App 所將賴以執行的作業系統與瀏覽器。

+ +
    +
  1. 選擇 App 相容的平台
    + Select the OS and browser implementations the app is designed to work on.
    2. +
+ +

各個平台所支援的收益方式如下。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 FreePaid /In-app
Firefox OS
Firefox for Desktop 
Firefox Mobile
+ (Firefox for Android on screen 7" or less)		 
Firefox Tablet
+ (Firefox for Android on screen over 7")		 
+ +

上傳 App

+ +

現在為 Firefox Marketplace 說明 App 類型：

+ +
    +
  1. 如果為托管＼架設式 App，(1) 須先輸入 App 的 manifest 檔案所在之伺服器位址 (須為完整的 URL)，再點擊 (2)「驗證 (Validate)」。
    + Enter the URL for the manifest of a Hosted App
    +
    + Marketplace 就會驗證你的 manifest 檔案。 +
      +
    • 驗證完畢，點擊「繼續 (Continue)」。
      • +
    • 若 manifest 檔案的驗證結果出現錯誤或警告，也會提供完整報告的連結。請看過報告之後修正錯誤，再重新提交 manifest 檔案進行驗證。
      + If there are errors or warning as a result of validating the app's manifest a link is provided to a full report
      • +
    +
    2. +
  2. 如果為封裝式 App，則點擊「封裝 (Packaged)」分頁並點選「選擇檔案... (Select a file...)」。接著就會開啟電腦的檔案瀏覽功能，找到 App 的 zip 檔案並上傳。
    + Click Select a file to upload a packaged app's ZIP file
    + Marketplace 現已可驗證 App 的封包。 +
      +
    • 驗證完畢，點擊「繼續 (Continue)」。
      • +
    • 若封包 (ZIP) 的驗證結果出現錯誤或警告，也會提供完整報告的連結。請看過報告之後修正錯誤，再重新封包檔案之後提交以利驗證。
      + If there are errors or warning as a result of validating the app's manifest a link is provided to a full report
      • +
    +
    3. +
+ +

了解 App 最低限度的 API 需求

+ +

在 App 驗證完成之後，就會出現「應用程式最低需求 (App Minimum Requirements)」頁面。一開始將顯示最常用的 API 需求清單。如果有找不到的 App 需求，則點擊 (1)「檢視全部 (View all)」，再 (2) 勾選所要的需求方塊。

+ +
+

消費者的裝置若不支援本頁中所選的需求，則 Marketplace 將隱藏你的 App。

+
+ +

An automatically populated list of app requirements displays, click View all and add any that have been missed

+ +

下一步

+ +

接著可點擊「繼續 (Continue)」完成下個程序。

+ +

When the details have been added to the page, clicking Continue moves onto the next step.

+ +

若要了解接下來的步驟，可繼續閱讀：輸入 App 的細節。

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/submit/next_steps/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/next_steps/index.html new file mode 100644 index 0000000000..47ef08f0d5 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/next_steps/index.html @@ -0,0 +1,16 @@ +--- +title: App 提交程序的下一步 +slug: Archive/Mozilla/Marketplace/Publishing/Submit/Next_steps +translation_of: Archive/Mozilla/Marketplace/Publishing/Submit/Next_steps +--- +
+

現在你已經上傳了自己的 App，也更新了詳細資訊。接著讓你先了解接下來將完成的步驟。

+
+ +

an interface screen on the Firefox Marketplace at the start of stage 4, where you are told you can enter some more information, starting with submitting a content rating for your app.

+ +

如果你的 App 有其他語言版本，你可能想在繼續下一步之前，再補充 Marketplace 上的其他詳細資訊。這時可點擊「編輯資訊 (Edit Listing)」，或參閱《Edit other localizations》進一步了解。不論如何，當然還是跟著流程一步步完成比較簡單。

+ +

下一步

+ +

這時可點擊「繼續 (Continue)」以進到下一步驟：《取得 App 內容分級》。

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/submit/overview/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/overview/index.html new file mode 100644 index 0000000000..8c00d35b23 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/overview/index.html @@ -0,0 +1,128 @@ +--- +title: Firefox Marketplace 概述 +slug: Archive/Mozilla/Marketplace/Publishing/Submit/Overview +translation_of: Archive/Mozilla/Marketplace/Publishing/Submit/Overview +--- +
+

若要讓自己的 App 在 Firefox Marketplace 上架，就必須將 App 提交到 Marketplace 並通過審查。本頁將簡述 App 提交程序。另可參閱其他頁面以了解其他步驟。

+
+ +
+

若要進一步了解各個步驟，請逐一參閱各個步驟之連結，並從 Step 1 開始整個程序。而此頁下方亦提供步驟關係圖。

+
+ +

另可觀看提交程序影片：http://vid.ly/8k2n4w

+ +

提交程序

+ +

接著就開始將 App 提交到 Firefox Marketplace 之上：

+ +
+
Step 1 - 登入自己的開發者帳戶
+
+ +
+
Step 2 - 上傳 App
+
在「提交應用程式」頁面上： +
    +
  • 設定免費＼付費 App。
    • +
  • 選擇 App 對應的平台。
    • +
  • 選擇該 App 為托管＼架設式 (Hosted) 或是封裝式 (Packaged)： +
      +
    • 若為托管＼架設式 App，應在其 manifest 檔案中提供連結。
      • +
    • 若為封裝式 App，請上傳 package.zip 檔案，且在驗證完畢之後，確認是否符合最低 API 需求。
      • +
    +
    • +
  • 點擊「繼續」。
    • +
+ +
+

注意：你可能會看到「manifest 檔案」之正體中文翻譯為「安裝資訊檔」。

+
+
+
Step 3 - 輸入 App 的詳細資訊
+
+

在「編輯 App 詳細資訊」頁面：

+ +
    +
  • 依自己需要而修改 App 網址。
    • +
  • 依自己需要而修改 App 相關說明 (manifest 檔案中所載)。
    • +
  • 選擇 1 到 2 種分類。
    • +
  • 提供隱私權政策。
    • +
  • 若有首頁與支援服務網站，亦請提供。
    • +
  • 提供支援服務的電子郵件位址。
    • +
  • 說明該 App 是否須 Flash 支援功能。
    • +
  • 上傳至少 1 張畫面截圖或影片。
    • +
  • 提供額外說明＼註記給 App 審查人員看 (如果 App 需要登入細節，應另外說明其理由)。另請注意，只有在你提交新版本 App 時，才能修改這些註記。
    • +
  • 設定 App 是否在通過審查之後立刻上架。另請注意，只有在你提交新版本 App 時，才能修改此項設定。
    • +
  • 點擊「繼續」。
    • +
+
+
Step 4 - 參閱「下一步」的細節
+
在「下一步 (Next Steps)」頁面上點擊「繼續」。
+
Step 5 - 取得內容分級
+
在「內容分級」頁面： +
    +
  • 點擊「建立 IARC 分級憑證 (Create an IARC Ratings Certificate)」以取得新的分級，另於 IARC 網站上完成分級問卷。
    • +
  • 若要進入已取得之分級，須提供 Submission ID 與 Security Code。
    • +
+
+
Step 6 - 更新 App 目前對應的販售國別與付款細節
+
Step 6a - 若為免費 App (且無 In-app purchases)：
+
在左側選單中點擊「相容性 (Compatibility)」。依自己需要而更改 App 即將販售的國別。
+
Step 6b - 若為付費 App (或免費 App 但有 In-app payments)：
+
在左側選單點擊「相容性與付款 (Compatibility & Payments)」 +
    +
  • 設定你的付款服務供應商帳戶，如 Bango 與 Boku。
    • +
  • 設定 App 價格。確認 App 是否提供應用程式內付款的產品，並選擇即將販售 App 的國別。
    • +
  • 如果本為免費 App，須付費之後才能升級為較完整功能的「專業版」App，請先設定為免費 App。
    • +
+
+
Step 6c - 若 App 包含應用程式內付款的產品：
+
+
    +
  • 在左側選單點擊「應用程式內付款 (In-App Payments)」，取得 API 金鑰與安全金鑰。(請注意，只要為 App 添增 API 金鑰與安全金鑰之後，就必須為 App 提交更新檔。可參閱 In-app payments 進一步了解)
    • +
  • 如果你使用 fxPay，則在左側選單點擊「In-App Products」，並逐一定義你的應用程式內付款產品。
    • +
+
+
Step 7 - 設定開發團隊成員 (選填)
+
在左側選單點擊「團隊成員 (Team Members)」，並依自己的需要添增團隊成員資訊。
+
Step 8 - 檢視清單 (選填)
+
在左側選單點擊「檢視清單 (View Listing)」，檢視自己在 Marketplace 上的 App 清單。
+
Step 9 - 編輯其他本地化清單 (選填)
+
在左側選單點擊「編輯清單 (Edit Listing)」，針對 App 的本地化內容而修改 App 的網址、說明、分類，或新增 Firefox Marketplace 所支援任何語系的細節。
+
+ +

到此為止，你的 App 已進入審查程序。在左側選單點擊「狀態與版本 (Status and Version)」即可了解目前的審查進度。只要 App 提供應用程式內付款的產品，就必須加入 API 金鑰，且須在發佈 App 之前提交更新檔案。

+ +

流程圖

+ +

 

+ +

+ +

下一步？

+ +

提交 App 完畢之後，你可能會需要：

+ + diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/submit/sign-in_to_your_developer_account/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/sign-in_to_your_developer_account/index.html new file mode 100644 index 0000000000..e46dbad938 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/submit/sign-in_to_your_developer_account/index.html @@ -0,0 +1,52 @@ +--- +title: 登入 Firefox Marketplace 上的開發者帳戶 +slug: >- + Archive/Mozilla/Marketplace/Publishing/Submit/Sign-in_to_your_developer_account +translation_of: >- + Archive/Mozilla/Marketplace/Publishing/Submit/Sign-in_to_your_developer_account +--- +
+

在將 App 提交到 Firefox Marketplace 之前，必須先申請開發者帳戶，登入之後再接受開發者協定。

+
+ +

開啟開發者交流中心 (Developer Hub)

+ +
    +
  1. 以瀏覽器開啟 Firefox Marketplace。
    2. +
  2. 到 Firefox Marketplace 頁面底部點擊 (1) 開發者交流中心。Footer of the Firefox Marketplace home page showing the link to the Developer Hub
    3. +
+ +

開始 App 提交程序

+ +
    +
  1. 在交流中心的首頁上，找到 (1) 提交您的應用程式至 Marketplace (Submit your app to the Marketplace)。
    + Developer Hub home page showing the Submit your app to the Marketplace button
    2. +
  2. 這時會出現「請登入」對話框，點擊 (1) 登入 / 註冊 (Sign in / Sign up)。
    + The Developer Hub please sign in dialog displayed over the Marketplace Developer Agreement
    3. +
  3. 接下來就看你是否註冊過 Mozilla Persona： +
      +
    • 如果你沒用過 Persona，建議你註冊：
      + The first dialog of the Create Persona process你可到這裡進一步了解 Persona +
        +
      1. 輸入電子郵件位址並點擊「Next」。
        2. +
      2. 輸入新的密碼並再次確認，點擊「Done」。
        3. +
      3. 到你剛剛提供的電子郵件信箱收取確認信。此郵件內含「Confirm your account now」的確認連結，點擊此連結。
        4. +
      4. 在接下來的頁面 (跟上述 step 2 顯示的頁面相同) 上點擊「登入 / 註冊」。
        5. +
      +
      • +
    • 如果你已經註冊過 Persona，就請確認你想登入為開發者帳戶的電子郵件位址。
      + Sign in with an existing Persona identity
      + 點擊「Sign in」。
      • +
    +
    4. +
  4. 就會看到開發者協定 (Developer Agreement)。
    + Read the developer agreement, select the option to receive information by email if you wish and agree to the agreement +
      +
    1. 請閱讀過開發者協定。
      2. +
    2. 同意往後接收 App Developer 新聞與問卷 (當然還是看你本身意願)
      3. +
    3. 點擊「同意並繼續 (Agree and Continue)」。
      4. +
    +
    5. +
+ +

接著就能進到下一步：上傳你的 App

diff --git a/files/zh-tw/archive/mozilla/marketplace/publishing/updating_apps/index.html b/files/zh-tw/archive/mozilla/marketplace/publishing/updating_apps/index.html new file mode 100644 index 0000000000..57fb423374 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/publishing/updating_apps/index.html @@ -0,0 +1,27 @@ +--- +title: 更新 App +slug: Archive/Mozilla/Marketplace/Publishing/Updating_apps +translation_of: Archive/Mozilla/Marketplace/Publishing/Updating_apps +--- +
+

本篇文章將針對已發佈的 App (自行發佈或於 Firefox Marketplace 上發佈)，說明相關更新步驟。

+
+
+

注意：如果 App 已通過 Marketplace 審查，而開發者想更改 App 的名稱，就必須再次提交 App 並重新審查。

+
+

更新托管式 (Hosted) App

+

托管式 App 本質就是網頁，因此同樣依 Web 快取的常規而運作。但開發者亦可選用如 HTML5 AppCache 的進階機制以加快啟動速度。先了解這二點之後，更新 App 所使用的一般資源大概就沒有需要特別注意的地方了。

+

但 Open Web App 在處理 manifest 檔案時就不太一樣了。某些 manifest 的變動必須經過使用者許可。但根據 Web runtime 實作的不同，較難以確定是否會啟動更新作業。

+

如果要能確實解決此問題，開發者可於 manifest 檔案中添加「version」欄位。只要檢查 navigator.mozApps.getInstalled() 函式所回傳的值，即可了解目前的版本。如果消費者並未安裝最新版本，則可透過 navigator.mozApps.install() 觸發更新作業。

+

Web runtime 並不會使用 version 的值，所以開發者可使用任何喜歡的版號設定格式。

+

另請注意，如果因更改 manifest 檔案而發生錯誤或毀損，則一旦將 manifest 檔案提交到 Firefox Marketplace 就會發現。嚴重錯誤將導致 App 無法出現在 Marketplace 之中。若是較不嚴重的錯誤，就可能會自動標定該 App 需要重新審查。

+

更新封裝式 (Packaged) App

+

封裝式 App 與托管式 App 的更新程序有所不同。在更新封裝式 App 時，開發者必須將 App 的新版 zip 檔案上傳至 Firefox Marketplace。更新過的 App 同樣要先通過審查，才能再發佈至 Marketplace 之上。如此將於 Firefox OS 手機上觸發更新作業。消費者亦可透過「Settings」App 要求進行更新。

+

若想進一步了解封裝式 App 的更新程序，可參閱下一章節。

+

更新封裝式 App 相關細節

+

接著提供封裝式 App 更新時的相關細節。如果你打算建構 App 商城，就可能必須特別注意。

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/submission/index.html b/files/zh-tw/archive/mozilla/marketplace/submission/index.html new file mode 100644 index 0000000000..2ac47dd745 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/submission/index.html @@ -0,0 +1,9 @@ +--- +title: Submission +slug: Archive/Mozilla/Marketplace/Submission +tags: + - NeedsTranslation + - TopicStub +translation_of: Archive/Mozilla/Marketplace/Submission +--- +

Marketplace submission

diff --git a/files/zh-tw/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html b/files/zh-tw/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html new file mode 100644 index 0000000000..efabe33036 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/submission/marketplace_review_criteria/index.html @@ -0,0 +1,80 @@ +--- +title: Marketplace 審查準則 +slug: Archive/Mozilla/Marketplace/Submission/Marketplace_review_criteria +translation_of: Archive/Mozilla/Marketplace/Publishing/Marketplace_review_criteria +--- +
+

開發者若要透過 Firefox Marketplace 發佈 App，則必須先滿足本篇文章的所有條件。相關條件是為了均衡 Firefox Marketplace 開發者與消費者的需求所設計。開發者需要公平、一致、審查嚴格但不嚴苛的平台，以安心作為 App 的開發基礎；消費者希望 App 安全無虞、可在裝置上順利運作、確實進行 App 本身所載明的功能。下方所列的 App 條件，就是為了兼顧相關需求所設計。

+
+

先列出 Mozilla 的 App 審查原則：

+ +

安全性

+

可到這裡參閱 App 安全架構的相關細節：https://wiki.mozilla.org/Apps/Security

+ +

隱私性

+ +

內容

+ +

內容指南

+

Firefox Marketplace 將不會接受涉及下列內容的 App。且下方均為說明性的列表而非絕對的定義。Mozilla 亦將視情況而隨時更新。若 App 違反本內容指南所提及的任何內容，Mozilla 均有權立刻將該 App 自 Firefox Marketplace 中撤除。

+ +

功能性

+ +

使用性

+ +

黑名單政策

+

Mozilla 希望永遠都不會動用到黑名單機制，但仍保留將 App 撤除下架的權利。但只要發現已發佈的 App 違反安全性、隱私性、內容規範，或是嚴重影響系統/網路效能，我們將立刻撤除該 App。在將 App 列入黑名單之前，Mozilla 均將通知該 App 的開發者 (除非我們握有特定證據，否則會假設所有開發者都是善良好公民)，並由 App 審查團隊提供完整協助，妥善溝通我們所發現的錯誤並儘力解決。以下特定情況絕對會將 App 列入黑名單並撤除下架：

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/submission/pre-submission_checklist/index.html b/files/zh-tw/archive/mozilla/marketplace/submission/pre-submission_checklist/index.html new file mode 100644 index 0000000000..3299054ee5 --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/submission/pre-submission_checklist/index.html @@ -0,0 +1,36 @@ +--- +title: App 測試與疑難排解 +slug: Archive/Mozilla/Marketplace/Submission/Pre-submission_checklist +translation_of: >- + Archive/Mozilla/Marketplace/Publishing/Policies_and_Guidelines/Testing_and_troubleshooting +--- +
+

本文將說明 App 測試與疑難排解時的注意事項。

+
+

設定自己的測試環境

+

開發者可安裝多種工具，針對 Firefox OS/Open Web App 執行真正有效的測試。我們建議至少安裝下列工具：

+ +

最理想的情況，當然是能用實際裝置測試自己的 App。可參閱開發者手機指南。

+

測試

+

雖然 Open Web App 與網頁，均使用相同的技術和發佈方式，但因為 App 環境並不具備如 Chrome 瀏覽器的網址列或返回按鈕；且 Firefox OS 裝置也不像 Android 有實體的退回按鈕，所以使用者經驗是截然不同。以下步驟可讓開發者確保 App 達到絕佳的使用者經驗。

+
    +
  1. 安裝 App。確認 App 的圖示有出現在主畫面上，且 App 的名稱完整未遭截斷。
    2. +
  2. 啟動 App。確認能正確偵測、顯示螢幕尺寸與方向。
    3. +
  3. 確認消費者可馬上看到你的 App，而不是看到你的首頁。請記住，若消費者是從 Firefox Marketplace 上安裝你的 App，也就是購買了 App 的功能。不需再次傳送 App 功能的登錄頁面給消費者才對。理想的 App 應該讓消費者能第一眼就看到「Getting Started」或「Login」頁面。
    4. +
  4. 從頭到尾執行過 App 的主要功能。特別注意瀏覽作業的最末端，還有內容縮放時的問題。
    5. +
  5. 確認內容連結將導向 App 之外 (如連至其他網頁或 Twitter)。若要開啟新的視窗或框架，也要讓消費者能順利返回你的 App。
    6. +
  6. 在桌面版瀏覽器中，可使用適應性設計 (Responsive Design) 檢視模式檢查 App 在不同螢幕尺寸中的情況。建議檢查 320x480 ~ 1260x800 的解析度。
    7. +
+

疑難排解

+ diff --git a/files/zh-tw/archive/mozilla/marketplace/submission/rating_your_content/index.html b/files/zh-tw/archive/mozilla/marketplace/submission/rating_your_content/index.html new file mode 100644 index 0000000000..0446f0240f --- /dev/null +++ b/files/zh-tw/archive/mozilla/marketplace/submission/rating_your_content/index.html @@ -0,0 +1,117 @@ +--- +title: 取得 App 內容分級 +slug: Archive/Mozilla/Marketplace/Submission/Rating_Your_Content +translation_of: Archive/Mozilla/Marketplace/Publishing/Submit/Rating_Your_Content +--- +
+

Mozilla 與國際年齡分級聯盟 (International Age Rating Coalition，IARC) 合作，將所有 App 均納入適用年齡分級規範。Mozilla 關心使用者，並認為使用者應能自行選擇適合自己的內容。凡 Firefox Marketplace 內的所有 App 均必須完成 IARC 分級。Mozilla 絕對在乎、愛護所有的 App，也必須要求所有 App 或遊戲完成內容分級。在 2014 年 5 月 15 日之後，只要是未完成內容分級的 App 均將強制從 Marketplace 下架。 而 IARC 另提供免費工具讓開發者進行內容分級。

+
+ +

有關 IARC 分級工具

+ +

IARC 是由多間國際級的分級委員會合力運作，針對以數位方式發佈於全球的 App 與遊戲，提供了相關工具作為內容分級的基準。只要填寫簡單表格，就會立刻收到所有分級委員會所制定的分級規範。此份規範不僅可協助消費者了解 App 的內容，亦可讓開發者不需個別取得各國的內容分級，進而大幅縮減成本與不便。

+ +

所支援的國際分級系統

+ +

透過單一的分級精靈功能，即可產生不同系統、國家、所在地區的內容分級。

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
分級系統支援國家
Classificação Indicativa Brazil
ESRBCanada, Mexico, United States
PEGIAustria, Denmark, Hungary, Latvia, Norway, Slovenia, Belgium, Estonia, Iceland, Lithuania, Poland, Spain, Bulgaria, Finland, Ireland, Luxembourg, Portugal, Sweden, Cyprus, France, Israel, Malta, Romania, Switzerland, Czech Republic, Greece, Italy, Netherlands, Slovak Republic, United Kingdom
USKGermany
通用其他所有國家適用
+ +

內容分級包含哪些項目？

+ +

分級系統將提供消費者三種資訊：

+ + + +

分級程序僅需幾分鐘且完全免費，並已整合至 Firefox Marketplace 提交程序與開發者主控頁 (Developer Dashboard) 中。任何 App 均必須先完成分級，Mozilla 才能進行後續審查作業。消費者可在 App 說明頁面上看到 App 對應所在地區的分級，並取得自己想進一步了解的相關資訊。

+ +

讓自己的 App 取得內容分級

+ +

IARC 即提供免費的遊戲分級工具，且大多數的 App 都能輕鬆又快速的完成分級。接著來看看分級程序。

+ +
+

注意：Mozilla 並不接受其他系統的分級認證。即使 App 已經完成其他系統的內容分級，開發者仍需要完成 IARC 認證程序。

+
+ +
    +
  1. 登入 Firefox Marketplace 開發者網站。你必須以開發者的身分登入，才會看到分級工具。
    2. +
  2. +

    在 App 提交程序期間，就會進入 IARC 分級工具：

    + +

    Demonstrates where in the app submission flow where ratings can be entered.

    + +

    或可從開發者主控頁中找到分級工具：

    + +

    +
    3. +
  3. +

    開始分級程序：

    + +

    + +

    或可輸入現有分級的資訊：

    + +

    +
    4. +
  4. +

    填寫簡單的問卷：

    + +

    +
    5. +
  5. +

    添加 App 額外資訊：

    + +

    +
    6. +
  6. +

    預覽並確認分級資訊：

    + +

    +
    7. +
  7. +

    回到開發者主控頁就會看到分級資訊。接著就可準備上架！

    +
    8. +
+ +
+

注意：開發者接著會收到電子郵件，內含分級認證與安全碼。請自行保留相關記錄備查。

+
+ +

更多資訊

+ +

如果開發者對分級程序、分級問卷填寫方式，或對分級結果有任何疑問，請寄發電子郵件至 dev-questions@globalratings.com 向 IARC 團隊詢問。另可前往全球分級網站獲得更多資訊。

+ +

其他任何問題，可聯繫 Mozilla 的 App 審查團隊 mozilla.appreview。

diff --git a/files/zh-tw/archive/mozilla/migrate_apps_from_internet_explorer_to_mozilla/index.html b/files/zh-tw/archive/mozilla/migrate_apps_from_internet_explorer_to_mozilla/index.html new file mode 100644 index 0000000000..857b8f22eb --- /dev/null +++ b/files/zh-tw/archive/mozilla/migrate_apps_from_internet_explorer_to_mozilla/index.html @@ -0,0 +1,1070 @@ +--- +title: 轉換網頁程式：從 IE 到 Mozilla +slug: Archive/Mozilla/Migrate_apps_from_Internet_Explorer_to_Mozilla +tags: + - 待翻譯 +translation_of: Archive/Mozilla/Migrate_apps_from_Internet_Explorer_to_Mozilla +--- +

這篇文章描述 IE 與 Mozilla 瀏覽器之間在程式上的差異，協助您將 IE-only 網頁改寫為 Mozilla 通用網頁。

+

簡介

+

Netscape 當初決定要製作 Mozilla 瀏覽器時刻意決定要支援 W3C 標準，因此 Mozilla 並不能完全回溯相容 Netscape Navigator 4.x 及 Microsoft Internet Explorer 的自有程式。舉例來說，Mozilla 不支援稍候會討論的 <layer> 標籤。此外，有些在 W3C 標準觀念尚未普及前製作的瀏覽器（如 Internet Explorer 4）內含各式怪異的花招，我們稱為怪癖（Quirk），而為了相容這些舊瀏覽器的模式便稱為 Quirks 模式。本文稍後也會討論 Mozilla 的 Quirks 模式。

+

我也會闡述其他 Mozilla 支援、但還沒有 W3C 相關規格的非標準技術，如 XMLHttpRequest 及 Rich-text 編輯功能。此處指的 W3C 規格包括：

+ +

跨瀏覽器程式小技巧

+

雖然這世上有所謂的 Web 標準，但不同的瀏覽器作法依然大不相同（即使是同一個瀏覽器，也可能因為作業系統差別而相異）。許多瀏覽器（如 Internet Explorer）在 W3C 規格形成前便提供某些功能，卻在標準制訂後忘了修改既有支援程式以符合標準。

+

在我闡述 Mozilla 與 Internet Explorer 相異之處前，我會先講點小技巧，讓你的 Web 應用程式容易擴充、在未來略事修改便能相容新瀏覽器。

+

不同瀏覽器下的某相同功能，往往也有不同的 API，所以在某些程式中你會發現不少 if() else() 程式區段，以便區分不同的瀏覽器。以下程式是寫給 Internet Explorer 用的：

+
. . .
+
+var elm;
+
+if (ns4)
+  elm = document.layers["myID"];
+else if (ie4)
+  elm = document.all["myID"]
+
+

上面這段程式稱不上容易擴充，如果你要多相容一種瀏覽器就得改寫一次。

+

要排除遇到新的瀏覽器就要重寫網頁碼的情形，最容易的方法，就是把功能「抽」出來。與其使用一堆 if() else()，不如將常用的程式片段獨立為一個函式以提高效率。如此一來不但程式易讀，要支援更多瀏覽器也方便些：

+
var elm = getElmById("myID");
+
+function getElmById(aID){
+  var element = null;
+
+  if (isMozilla || isIE5)
+    element = document.getElementById(aID)
+  else if (isNetscape4)
+   element = document.layers[aID]
+  else if (isIE4)
+    element = document.all[aID];
+
+  return element;
+}
+
+

以上的程式仍得處理瀏覽器偵測的問題，通常這要靠 useragent 字串來解決，例如：

+
Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.5) Gecko/20031016
+
+

雖然 useragent 字串提供瀏覽器的詳細資訊，但處理這段字串的程式碰上新瀏覽器時還是有可能出錯，此時便需修改程式。

+

如果瀏覽器種類無關緊要（好比你已經把不支援的瀏覽器全都擋在門外了），那麼依據瀏覽器的能力來判別會比較好一點。通常可以用 JavaScript 來測試必備的功能，舉例來說，與其使用這樣的程式碼：

+
if (isMozilla || isIE5)
+
+

還不如換條路走：

+
if (document.getElementById)
+
+

這樣也可以讓其他支援此方法的瀏覽器（如 Opera 或 Safari）正常使用，無須更動程式。

+

而依據 useragent 字串辨識瀏覽器也並非一無是處，例如在檢查瀏覽器是否符合最低需求或除錯時都有其用途。

+

JavaScript也允許順序條件語言（inline conditional statements）以助於代碼的可讀性：

+

JavaScript 也支援判斷句簡寫法，協助你將程式寫得更易讀：

+
var foo = (condition) ? conditionIsTrue : conditionIsFalse;
+
+

舉例而言，要取用某元素，可以寫為：

+
+function getElement(aID){
+  return (document.getElementById) ? document.getElementById(aID)
+                                   : document.all[aID];
+}
+
+

Mozilla 與 Internet Explorer 的差別

+

首先，我要討論Mozilla和IE在表現HTML行為上的差別。

+

工具提示（tooltips）

+

老牌的瀏覽器透過在超連結和利用 alt 屬性值的 HTML 中導入工具提示來作為工具提示的內容。 最新的 W3C HTML specification 建立了 title 這個屬性，它包含超連結的詳細說明。 現代的瀏覽器會使用 title 的屬性來顯示工具提示，而且 mozilla 只支援 title 屬性，並不支援 alt 屬性。

+

HTML 特殊字元（entities）

+

HTML 標籤可以是一些在 W3 standards body 中已定義的字元。 您可以利用它們的數值或字符來代替字元。 舉例來說，您可以利用 &#160; 或等同的字符參考資料 &nbsp; 來代替空白鍵。

+

有一些很老很老的瀏覽器，像是 Internet Explorer ，它們允許在特殊字元後面拿走;（分號（：

+
&nbsp Foo
+&nbsp&nbsp Foo
+
+

Mozilla 依然會把 &nbsp 當作空白鍵，既使這樣違反了 W3C 標準（W3C specification）。 但如果 &nbsp 後面直接跟上一些其他的字元，瀏覽器就不會轉換它。 範例：

+
&nbsp12345
+
+

這行程式碼在 Mozilla 中就不會被執行，因為它違反了 W3 標準（W3 standard）。請使用正確的格式（&nbsp;）來避免瀏覽器與瀏覽器之間的差異性。

+

DOM 差異

+

文件物件模型（The Document Object Model，簡稱DOM）是一個裝載著文件元素的樹狀結構。你可以熟練地透過已成為 W3C 標準的 JavaScript API 來操作 DOM。然而在 W3C 標準建立以前， Netscape 4 和 IE 4 實作了一些類似的 API。 Mozilla 僅在使用 W3C 標準無法達成這些 API 的效果時才予以實作。

+

存取元素

+

如果你想以跨瀏覽器的方式來取得某個元素的參考，請使用document.getelementById(aID) 方法，這個方法不僅可以在 IE 5.0+ 和 Mozilla 上正常運作，它還是 DOM Level 1 的規範。

+

Mozilla 不能夠以 document.elementName 或是元素名稱來存取元素，而 IE 可以(名為全域名稱污染)。 Mozilla 也不支援 Netscape 4 的 document.layers 和 IE 的 document.all。 而 document.getElementById 可以讓你取得某個元素，你還可以使用 document.layers 和 document.all 指定一個 tag 名稱來取得一串文件元素，像是全部的 <div> 元素。

+

在 W3C DOM Level 1 的規範中，JavaScript 應透過 getElementsByTagName() 取得相同標籤(tag)下的元素。這個方法會傳回一個陣列，同時這個方法也可以呼叫 document 或其他節點下的元素。如果你想取得，你可以透過 getElementsByTagName("*") 來取得整個 DOM 下的元素陣列。

+

就如下面表格一，DOM Level 1 經常被用來移動或者隱藏元素。當一個 HTML 元素可以隨意移動時，Netscape 4 所使用的 <layer> 標籤就不被 Mozilla 支援，你可以使用如同 Internet Explorer 的 <div>。根據 HTML 規範，這個標籤可以在 Mozilla 正常運行的。

+

 

+

表格一 － 用於存取元素的方法

+ + + + + + + + + + + + + + + +
方法描述
document.getElementById( aId )回傳文件中 ID 值為 aId 元素的。
document.getElementsByTagName( aTagName )回傳文件中標籤名稱為 aTagName 的元素
+

縱橫 DOM

+

Mozilla 支援透過 JavaScript 存取 DOM 樹狀圖的 W3C DOM APIs (詳見表格二)。透過他可以讀取文件中的任何一個節點。Internet Explorer 也支援這個 APIs，同時也支援一些過時的方法，像是 children。

+

 

+

表格二 － 縱橫 DOM 的方法

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
屬性／方法描述
childNodes回傳一個該元素下所有子節點的陣列。
firstChild回傳該元素下的第一個子節點。
getAttribute( aAttributeName )回傳 aAttributeName 的值。
hasAttribute( aAttributeName )回傳一個關於節點 aAttributeName 是否有屬性的布林值。
hasChildNodes()回傳一個關於該節點下是否仍含有子節點的布林值。
lastChild回傳該元素下的最後一個子節點。
nextSibling回傳當下節點後的下一個節點。
nodeName回傳一個當下節點名稱的字串。
nodeType回傳該節點的類型。 + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
數值描述
1元素節點(Element Node)
2屬性節點(Attribute Node)
3文字節點(Text Node)
4CDATA 段落節點(CDATA Section Node)
5實體參引節點(Entity Reference Node)
6實體節點(Entity Node)
7處理指令(Processing Instruction Node)
8註解節點(Comment Node)
9文件節點(Document Node)
10文件型別(Document Type Node)
11文件片段(Document Fragment Node)
12記法節點(Notation Node)
+ 
+     *譯注：目前參照 中央研究院計算中心曾士熊先生提供 SGML 名詞部份的翻譯內容，其中並不包含「文件片段(Document Fragment Node)」
+
+
nodeValue回傳當下節點的值。當節點中存在文字或文段，如文字和註解節點時，此方法會回傳他們的字串值。當節點為屬性節點(attribute node)時，此方法將會回傳屬性值。除此之外，其餘的節點類型都會回傳 null。 
ownerDocument回傳存在於當下節點的 document 物件。
parentNode回傳當前節點的父節點。
previousSibling回傳在該節點之前的節點。
removeAttribute( aName )從當前的節點中移除 aName 屬性。
setAttribute( aName, aValue )將 aName 屬性的值更改為 aValue。
+

在 Internet Explorer 中有個不正常的怪癖(quirk)，上表中有許多方法會略過自動產生的空白文字節點。請注意，在 Mozilla 中這些並不會略過，所以有時候你必須區別開這些節點。每一個節點都有它的 nodeType 屬性。舉例來說，元素節點的類型是 1；而文字節點是 3、註解節點是 8（詳見表格二 － nodeType）。最好區別開這些空白文字節點的辦法就是指處裡節點類型為 1 的子節點：

+
HTML部分:
+  <div id="foo">
+    <span>Test</span>
+  </div>
+
+JavaScript部分:
+  var myDiv = document.getElementById("foo");
+  var myChildren = myXMLDoc.childNodes;
+  for (var i = 0; i < myChildren.length; i++) {
+    if (myChildren[i].nodeType == 1){
+      // 元素節點
+    }
+  }
+
+

內容建立及處理

+

Mozilla 支援一些比較舊的動態增加 DOM 內容的方法，像是

+
document.write， document.open 和 document.close。
+
+

Mozilla 也支援 Internet Explorer 的 innerHTML 方法，這個方法可以用來處理所有的節點。即使這個方法無效，Mozilla 還支援 outerHTML (這個方法包含該元素，它與 innerHTML 有一定的差異) 和 innerText (用於存取或修改節點的文字，功能與 Mozilla 裡的 textContent 差不多)。

+

Internet Explorer 中存在著許多不規範也不被 Mozilla 的內容處理方法，包括回傳參數、插入數值和插入元素到節點中。像是 getAdjacentElement、 insertAdjacentHTML 等。表格三中敘述了 W3C 定義的內容處理方法，它們適用於所有的 DOM 節點。

+

 

+

表格三 － Mozilla 使用的內容處理方法

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
方法描述
appendChild( aNode )建立一個新的子節點，並回傳新子節點的參照值。
cloneNode( aDeep )複製該節點並且傳回複製後的節點。如果 aDeep 的值「成立」，那個這個方法會把該節點下所有的子節點複製到新的節點。
createElement( aTagName )建立並回傳一個沒有母節點(即上層沒有節點)的節點。該節點的名稱為 aTagName 。
createTextNode( aTextValue )建立並回傳一個沒有母節點的文字節點，該節點值為 aTextValue。
insertBefore( aNewNode, aChildNode )把 aNewNode 插入到 aChildNode 之前。(兩者都必須在當前的節點下)
removeChild( aChildNode )移除 aChildNode 並回傳一個參照值。
replaceChild( aNewNode, aChildNode )用 aChildNode 替代 aNewNode，並且回傳一個移除節點的參照值。
+

文件片段

+

因為效能的緣故，你可以在記憶體中創建 document 而非在現存的 DOM 上做動作。 DOM Level 1 Core 引入了 document fragments，這是一個輕量化的 document 且支援了部份既有可用的 document interface。舉例來說，他雖不支援 getElementById 但卻支援 appendChild 。你可以很容易的按照現存的的 document 來創建  document fragments 。

+

在 Mozilla 中，要創造新的 document fragments 只需要使用 document.createDocumentFragment()，之後你便可取得一個空的 document fragment。

+

Internet Explorer 在實做 document fragment 上並未按照標準的 W3C standard 。倘若你在 IE 中調用此功能，只能拿回一個 regular document 而非 document fragment。

+

JavaScript 差異

+

Mozilla 與 Internet Explorer 之間最大的差別就是 JavaScript。 這些問題通常存在於瀏覽器所公佈的 JavaScript APIs，像是 DOM hooks。 這兩種瀏覽器各自佔有一部份 JavaScript 核心的差異性；這些遇到的問題通常也和時間有關。

+

JavaScript 日期差異

+

getYear 這個函數是唯一 Date 中的不同點。根據 ECMAScript specification（JavaScript 也遵循這個 specification），這個函式不是 Y2k-compliant 。假設在 2004 年時執行 new Date().getYear()，它會回傳 "104" 。根據 ECMAScript specification ， getYear 會回傳年份減去 1900，原意是回傳 "98" 來表示 1998。getYear 在 ECMAScript Version 3 時被 getFullYear() 所代替。 當 mozilla 繼續遵循規範時，Internet Explorer 已經把 getYear() 修改成像 getFullYear() 的工作方式，使它成為Y2k-compliant。

+

JavaScript 執行差異

+

不同的瀏覽器使用不同的方法執行 JavaScript。舉例來說，下面的程式碼假設當 script 執行的時候 div 節點已經存在於 DOM：

+
...
+<div id="foo">Loading...</div>
+
+<script>
+  document.getElementById("foo").innerHTML = "Done.";
+</script>
+
+

無論如何，這都不能夠確定元素（elements）是否存在。要確認所有的元素都存在，您應該將 onload 事件擺在 <body> 標籤：

+
<body onload="doFinish()">
+
+<div id="foo">Loading...</div>
+
+<script>
+  function doFinish() {
+    var element = document.getElementById("foo");
+	  element.innerHTML = "Done.";
+  }
+</script>
+...
+
+

像這樣與時間相關的問題也和硬體有關－較慢的系統可以顯示出較快的系統中隱藏的臭蟲（bugs）。 window.open 是一個具體的例子：  

+
<script>
+  function doOpenWindow(){
+    var myWindow = window.open("about:blank");
+    myWindow.location.href = "http://www.ibm.com";
+  }
+</script>
+
+

這段程式碼的問題是： window.open 的時程是非同步的－它不會阻擋 JavaScript 的執行，直到所有的新視窗載入完畢。 因此，您應該在在載入新視窗完畢後才執行 window.open 。 您可以透過 在新視窗中利用 onload 執行 window.opener 來回到原本開啟新視窗的視窗（母體）。

+

JavaScript 產生之 HTML 差異

+

  在 JavaScript 中，我們可以透過 document.write 來從字串產生 HTML 程式碼。但這有個值得注意的地方在於，要是你的內嵌碼中中含有 <script> tag 會發生什麼事？當你的目標頁面處於 <a href="#html_modes">strict rendering mode</a> 下時，它將會解析位於  <script> 和  </script>  中的內容。讓我們看個例子：

+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+...
+<script>
+  document.write("<script>alert("Hello")</script>")
+</script>
+
+

  因為目前處於 strict mode 下，Mozilla 的解析器 (parser) 將會查看介於 <script> 和 </script>中的內容。這是因為在 strict mode 下解析器並不認得任何語言。但假如處在 quirks mode 下，解析器卻識得 JavaScript 語法。而事實上，Internet Explorer 總是處於 quirks mode 下 - 它並不真正之支援 XHTML。一個比較兩全其美的作法是將該內容分割成兩個部份：

+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+ "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+...
+<script>
+  document.write("<script>alert("Hello")</" + "script>")
+</script>
+
+

JavaScript 除錯

+

Mozilla provides several ways to debug JavaScript-related issues found in applications created for Internet Explorer. The first tool is the built-in JavaScript console, shown in Figure 1, where errors and warnings are logged. You can access it in Mozilla by going to Tools -> Web Development -> JavaScript Console, or in Firefox (the standalone browser product from Mozilla) at Tools -> JavaScript Console.

+

 

+

Figure 1. JavaScript console

+
+ Javascript Console
+

The JavaScript console can show the full log list or just errors, warnings, and messages. The error message in Figure 1 says that at aol.com, line 95 tries to access an undefined variable called is_ns70. Clicking on the link will open Mozilla's internal view source window with the offending line highlighted.

+

The console also allows you to evaluate JavaScript. To evaluate the entered JavaScript syntax, type in 1+1 into the input field and press Evaluate, as Figure 2 shows.

+

 

+

Figure 2. JavaScript console evaluating

+
+ JavaScript Console evaluating
+

Mozilla's JavaScript engine has built-in support for debugging, and thus can provide powerful tools for JavaScript developers. Venkman, shown in Figure 3, is a powerful, cross-platform JavaScript debugger that integrates with Mozilla. It is usually bundled with Mozilla releases; you can find it at Tools -> Web Development -> JavaScript Debugger. For Firefox, the debugger isn't bundled; instead, you can download and install it from the Venkman Project Page. You can also find tutorials at the development page, located at the Venkman Development Page.

+

 

+

Figure 3. Mozilla's JavaScript debugger

+
+ Mozilla's JavaScript debugger
+

The JavaScript debugger can debug JavaScript running in the Mozilla browser window. It supports such standard debugging features as breakpoint management, call stack inspection, and variable/object inspection. All features are accessible through the user interface or through the debugger's interactive console. With the console, you al can execute arbitrary JavaScript in the same scope as the JavaScript currently being debugged.

+

CSS 差異

+

與 Internet Explorer 和其他的瀏覽器比較之下， Mozilla 擁有最強大的 Cascading Style Sheets 4（即 CSS） 支援， 包含大部份的 CSS1、CSS2 和部份的 CSS3 。

+

對於下列敘述的問題， Mozilla 會在 JavaScript 控制台中發出警告。 如果您遇到了 CSS 的相關問題，請確認 JavaScript 控制台。

+

CSS 檔無法套用：MIME Type 問題

+

CSS 定義的相關檔沒有被讀取是 CSS 的相關問題中最常見的。 這通常是伺服器將 CSS 檔案送出了錯誤的 MIME Type 。 CSS 說明書 （ CSS specification ） 中提到：「 CSS 檔案應該被作為 text/css mimetype 。」 當網頁處於嚴格的規範模式 （ strict standards mode ）時， Mozilla 將遵循並只載入以 text/css 作為 mimetype 的 CSS 檔案。 在 Internet Explorer 中，無論 mimetype 是甚麼， CSS 檔案都會被載入。 當網頁的 doctype （ document type，檔案類型 ） 在網頁的開頭被指定時，他們會進入嚴格的標準模式。 要解決這個問題，您可以修改正確的 mimetype 或移除 doctype。 我們會在下個章節中討論更多關於 doctype。

+

CSS 單位

+

有很多網路應用程式都不在他們的 CSS 中加上單位，尤其是利用 JavaScript 設定 CSS 的時候。 當網頁不執行在標準模式時，Mozilla 不會回報錯誤。 因為 Internet Explorer 並非真正的支援 XHTML ，它不在乎有沒有具體的單位描述。 如果網頁處於嚴格的標準描述下，並且沒有使用單位，那麼 Mozilla 將忽略以下的 style ：

+
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
+  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
+<html>
+  <body>
+    // works in strict mode
+    <div style="width:40px; border:1px solid black;">
+      Text
+    </div>
+
+    // will fail in strict mode
+    <div style="width:40; border:1px solid black;">
+      Text
+    </div>
+  </body>
+</html>
+
+

因為上述的範例中有一個規範的 doctype （檔案類型），所以網頁將執行在嚴格的標準模式下。 第一個 div 標籤會套用 40 像素的寬度，因為它有單位，但是第二個 div 標籤將不會套用指定的寬度，因此會套用預設的 100% 寬度。 透過 JavaScript 設定寬度將會得到一樣的結果。

+

JavaScript 及 CSS

+

既然 Mozilla 支援 CSS 標準，它同時也支援透過 JavaScript 設定 CSS 的 CSS DOM。 您可以透過 style 標籤讀取、移除和修改 CSS 的屬性規則：

+
<div id="myDiv" border:1px solid black;">
+  Text
+</div>
+
+<script>
+  var myElm = document.getElementById("myDiv");
+  myElm.style.width = "40px";
+</script>
+
+

您可以利用這種方式來延伸 css 的屬性。再次強調，如果網頁處於標準模式，您必須加上單位，否則 Mozilla 將忽略指令。 當您要查詢變數時，透過 .style.width 來達成，在 Mozilla 和 Internet Explorer 中，傳回的值中會包含單位，也就是傳回了一串字串。 您可以利用 parseFloat("40px") 將字串轉換成數值。

+

CSS 溢出部分（overflow）差異

+

CSS 增加了溢出（overflow）的概念，它允許您定義如何處理溢出部份；舉例來說，當 div 內容指定的高度高於 div 的高度時， CSS 規範（CSS standard）中定義了如果程式中沒有定義溢出的相關設定， div 的內容將會溢出。 但是 Internet Explorer 仍然不會遵循相關規範，並且會為了留住內容而擴張 div 的高度。 下面的例子表現了這個差異性：

+
<div style="height:100px; border: 1px solid black;">
+  <div style="height:150px; border: 1px solid red; margin:10px;">
+    a
+  </div>
+</div>
+
+

就像你在圖片四看到的，Mozilla 依照了 CSS 規範做出了判斷。 規範中提到了在這個情況下，因為 div 的內部高過它的母體，所以它溢出到了按鈕的地方。 如果您這麼愛 Internet Explorer 的行為，就不要在母體（即 div ）加上 height 這個屬性。

+

 

+

圖片四：div溢出部份

+
+ DIVdiv溢出部份
+

hover（滑鼠移上某元素）效果差異

+

在一些網站上存在著 Internet Explorer 的非標準 CSS hover。 在 Mozilla 中，通常當滑鼠滑入的時候，利用改變 Text Style 來顯示它自己。 這是因為 a:hover ，在 Internet Explorer 中的 CSS 解析器對應 HTML 中錨點（anchor）的是 <a href="" />，而不是 <a name="" /> 由於作者將錨點設定標記（anchor-setting markup）套用進了區塊，所以造成了文字的顏色變化：

+
CSS:
+  a:hover {color:green;}
+
+HTML:
+  <a href="foo.com">This text should turn green when you hover over it.</a>
+
+  <a name="anchor-name">
+    This text should change color when hovered over, but doesn't in Internet Explorer.
+  </a>
+
+

Mozilla 遵循 CSS 說明書 （ CSS specification ）並且在這個例子中會把顏色變成綠色。 您可以使用這兩種方法來讓 Mozilla 擁有像 Internet Explorer 的效果，並且當滑鼠滑入時不會改變文字的顏色：

+ +

Quirks 模式、標準模式

+

  在舊的瀏覽器上 (如 Internet Explorer 4)，網頁可能會被以一種被不完全正確的方式渲染網頁。當 Mozilla 企圖成為一個和標準相容的瀏覽器的情況下，它採取三種不同方式來處理在這些不太合標準的渲染方式下開發的既有網頁。你可以在  Mozilla 瀏覽器中的  View -> Page Info (或 Ctrl-i) 下查看目前處於哪種模式。而該採取怎樣的模式則取決於該頁面的 doctype。

+

  Doctypes (document type declarations) 看起來是：

+

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

+

  藍色部份稱為 public identifier，而綠色部份是為 system identifier (以 URI 方式描述)。

+

Standards Mode (標準模式)

+

  Standards mode 是最嚴謹的渲染模式。它將完全按照 W3C HTML 以及 CSS specification 來處理，並且不支援任何除此之外的寫法。 Mozilla 會在以下情形中使用此模式：

+ +

Almost Standards mode (近乎標準模式)

+

Mozilla introduced almost standards mode for one reason: a section in the CSS 2 specification breaks designs based on a precise layout of small images in table cells. Instead of forming one image to the user, each small image ends up with a gap next to it. The old IBM homepage shown in Figure 5 offers an example.

+

 

+

Figure 5. Image gap

+
+ Image Gap
+

Almost standards mode behaves almost exactly as standards mode, except when it comes to an image gap issue. The issue occurs often on standards-compliant pages and causes them to display incorrectly.

+

Mozilla uses almost standards mode for the following conditions:

+ +

You can read more about the image gap issue.

+

Quirks Mode (怪癖模式)

+

  以目前情況來說，網路上充斥著許多不完全符合標準規範的網頁。這些不合標準的網頁，卻和有著 bug 的瀏覽器配合的很好。舉例來說，在以前Netscape 居市場領導地位時，便有著 bug。而 IE 誕生石，為了能和那些網頁相容，「繼承」了這些 bug 們。對於在之後才來到市場上的新一代瀏覽器們來說，這些 bug 們便被稱為 quirks (但他們大都能向下相容於這些網頁)。值得注意的是，因為這些既有網頁並非按照規格設計，所以新瀏覽器在渲染時得花上更多時間。不幸的是，絕大多數的網頁都有賴新瀏覽器們以此模式渲染。

+

Mozilla 會在以下情況使用此模式：

+ +

For further reading, check out: List of Quirks and List of Doctypes and What Modes They Cause.

+

 

+

事件差異

+

  Mozilla 和 Internet Explorer 在 events 的這個部分幾乎是完全不同的。 Mozilla event model 遵循 W3C 以及 Netscape model。但在 Internet Explorer 中，倘若一個 function 被 event 所觸發，那麼我們可以用 window.event 來接觸到該 event 物件 - 這必須被特別指定為參數傳入。Mozilla 則會直接傳遞該 event 物件到 event handlers 中。一個跨瀏覽器 (cross-browser) 的 event handling 範例如下：

+
<div onclick="handleEvent(event)">Click me!</div>
+
+<script>
+  function handleEvent(aEvent) {
+    // if aEvent is null, means the Internet Explorer event model,
+    // so get window.event.
+    var myEvent = aEvent ? aEvent : window.event;
+  }
+</script>
+
+

  此外，event 物件產生時所擁有的 properties 和 functions 在 Mozilla and Internet Explorer 也可能有不同的名字。請參見 Table 4。

+

 

+

Table 4. Mozilla/Internet Explorer event property 比較表

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Internet Explorer NameMozilla NameDescription
altKeyaltKeyBoolean property that returns whether the alt key was pressed during the event.
cancelBubblestopPropagation()Used to stop the event from bubbling farther up the tree.
clientXclientXThe X coordinate of the event, in relation to the client.
clientYclientYThe Y coordinate of the event, in relation to the client.
ctrlKeyctrlKeyBoolean property that returns whether the Ctrl key was pressed during the event.
fromElementrelatedTargetFor mouse events, this is the element from which the mouse moved away.
keyCodekeyCodeFor keyboard events, this is a number representing the key that was pressed. It is 0 for mouse events.
returnValuepreventDefault()Used to prevent the event's default action from occurring.
screenXscreenXThe X coordinate of the event, in relation to the screen.
screenXscreenYThe Y coordinate of the event, in relation to the screen.
shiftKeyshiftKeyBoolean property that returns whether the Shift key was pressed during the event.
srcElementtargetThe element to which the event was originally dispatched.
toElementcurrentTargetFor mouse events, this is the element to which the mouse moved.
typetypeReturns the name of the event.
+

加上事件控制式

+

  Mozilla 支援了兩種方式來附加 events 到 JavaScript 中。第一種是所有瀏覽器都支援的，直接將 event properties 連接到物件上。下例為設定一個 click event handler，一個 function reference 被設定到物件的 onclick property：

+
<div id="myDiv">Click me!</div>
+
+<script>
+  function handleEvent(aEvent) {
+    // if aEvent is null, means the Internet Explorer event model,
+    // so get window.event.
+    var myEvent = aEvent ? aEvent : window.event;
+  }
+
+  function onPageLoad(){
+    document.getElementById("myDiv").onclick = handleEvent;
+  }
+</script>
+
+

Mozilla fully supports the W3C standard way of attaching listeners to DOM nodes. You use the addEventListener() and removeEventListener() methods, and have the benefit of being able to set multiple listeners for the same event type. Both methods require three parameters: the event type, a function reference, and a boolean denoting whether the listener should catch events in their capture phase. If the boolean is set to false, it will only catch bubbling events. W3C events have three phases: capturing, at target, and bubbling. Every event object has an eventPhase attribute indicating the phase numerically (0 indexed). Every time you trigger an event, the event starts at the DOM's outermost element, the element at the top of the DOM tree. It then walks the DOM using the most direct route toward the target, which is the capturing phase. When the event reaches the target, the event is in the target phase.  After arriving at the target, it walks up the DOM tree back to the outermost node; this is bubbling. Internet Explorer's event model only has the bubbling phase; therefore, setting the third parameter to false results in Internet Explorer-like behavior:

+
<div id="myDiv">Click me!</div>
+
+<script>
+
+  function handleEvent(aEvent) {
+    // if aEvent is null, it is the Internet Explorer event model,
+    // so get window.event.
+    var myEvent = aEvent ? aEvent : window.event;
+  }
+
+  function onPageLoad() {
+    var element = document.getElementById("myDiv");
+    element.addEventListener("click", handleEvent, false);
+  }
+</script>
+
+

One advantage of addEventListener() and removeEventListener() over setting properties is that you can have multiple event listeners for the same event, each calling another function. Thus, to remove an event listener requires all three parameters be the same as the ones you use when adding the listener.

+

Mozilla does not support Internet Explorer's method of converting <script> tags into event handlers, which extends <script> with for and event attributes (see Table 5). It also does not support the attachEvent and detachEvent methods. Instead, you should use the addEventListener and removeEventListener methods. Internet Explorer does not support the W3C events specification.

+

 

+

Table 5. Event method differences between Mozilla and Internet Explorer

+ + + + + + + + + + + + + + + + + + +
Internet Explorer MethodMozilla MethodDescription
attachEvent(aEventType, aFunctionReference)addEventListener(aEventType, aFunctionReference, aUseCapture)Adds an event listener to a DOM element.
detachEvent(aEventType, aFunctionReference)removeEventListener(aEventType, aFunctionReference, aUseCapture)Removes an event listener to a DOM element.
+

Rich-text 編輯

+

While Mozilla prides itself with being the most W3C standards-compliant browser, it does support nonstandard functionality, such as innerHTML and rich text editing, if no W3C equivalent exists.

+

Mozilla 1.3 introduced an implementation of Internet Explorer's designMode feature, which turns an HTML document into a rich text editor field. Once turned into the editor, commands can run on the document through the execCommand command. Mozilla does not support Internet Explorer's contentEditable attribute for making any widget editable. You can use an iframe to add a rich text editor.

+

Rich-text 差異

+

Mozilla supports the W3C standard of accessing iframe's document object through IFrameElm.contentDocument, while Internet Explorer requires you to access it through document.frames{{ mediawiki.external('\"name\"') }} and then access the resulting document:

+
function getIFrameDocument(aID) {
+  var rv = null;
+
+  // if contentDocument exists, W3C compliant (Mozilla)
+  if (document.getElementById(aID).contentDocument){
+    rv = document.getElementById(aID).contentDocument;
+  } else {
+    // IE
+    rv = document.frames[aID].document;
+  }
+  return rv;
+}
+
+

Another difference between Mozilla and Internet Explorer is the HTML that the rich text editor creates. Mozilla defaults to using CSS for the generated markup. However, Mozilla allows you to toggle between HTML and CSS mode using the useCSS execCommand and toggling it between true and false. Internet Explorer always uses HTML markup.

+
Mozilla (CSS):
+  <span style="color: blue;">Big Blue</span>
+
+Mozilla (HTML):
+  <font color="blue">Big Blue</font>
+
+Internet Explorer:
+  <FONT color="blue">Big Blue</FONT>
+
+

Below is a list of commands that execCommand in Mozilla supports:

+

 

+

Table 6. Rich text editing commands

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
Command NameDescriptionArgument
boldToggles the selection's bold attribute.---
createlinkGenerates an HTML link from the selected text.The URL to use for the link
deleteDeletes the selection.---
fontnameChanges the font used in the selected text.The font name to use (Arial, for example)
fontsizeChanges the font size used in the selected text.The font size to use
fontcolorChanges the font color used in the selected text.The color to use
indentIndents the block where the caret is.---
inserthorizontalruleInserts an <hr> element at the cursor's position.---
insertimageInserts an image at the cursor's position.URL of the image to use
insertorderedlistInserts an ordered list (<ol>) element at the cursor's position.---
insertunorderedlistInserts an unordered list (<ul>) element at the cursor's position.---
italicToggles the selection's italicize attribute.---
justifycenterCenters the content at the current line.---
justifyleftJustifies the content at the current line to the left.---
justifyrightJustifies the content at the current line to the right.---
outdentOutdents the block where the caret is.---
redoRedoes the previous undo command.---
removeformatRemoves all formatting from the selection.---
selectallSelects everything in the rich text editor.---
strikethroughToggles the strikethrough of the selected text.---
subscriptConverts the current selection into subscript.---
superscriptConverts the current selection into superscript.---
underlineToggles the underline of the selected text.---
undoUndoes the last executed command.---
unlinkRemoves all link information from the selection.---
useCSSToggles the usage of CSS in the generated markup.Boolean value
+

For more information, visit Rich-Text Editing in Mozilla.

+

 

+

XML 差異

+

Mozilla 對 XML 與相關的技術有很完整的支援，如對 XSLT 與 Web services 等。它也支援一些 Internet Explorer 非標準的延伸，例如 XMLHttpRequest。

+

Mozilla has strong support for XML and XML-related technologies, such as XSLT and Web services. It also supports some nonstandard Internet Explorer extensions, such as XMLHttpRequest.

+

掌控 XML

+

如同對於標準 HTML，對於可各方面控制 XML 檔的 DOM 的支援，Mozilla 也是依 W3C 所定的 XML DOM 規格。Mozilla 與 Internet Explorer 在 XML DOM 上的不同處大多在於 Internet Explorer 非標準的處理方式。一個常見的差異是對空白字元節點的處理。 通常在建立 XML 時，XML 節點間會有空白。 Internet Explorer 用 XMLNode.childNodes[] 時不會包括這些空白節點，但在 Mozilla 上這些節點會在 array 裡。

+

  在 HTML 標準上，Mozilla 支援了 W3C XML DOM 規範，但  Internet Explorer 則否。Mozilla 和 Internet Explorer 的一些差異很大部分是肇始於後者的非規範行為。在這其中，最廣為人知的應該就是如何去處理 white space text nodes 了。通常在 XML 文檔產生後，會在 XML node 間包含著一些 white space。當你使用 XMLNode.childNodes[] 時，Internet Explorer 將不會包含這些 white space nodes。但在 Mozilla 中，這些 nodes 仍會出現在 array 中。

+
XML:
+  <?xml version="1.0"?>
+  <myXMLdoc xmlns:myns="http://myfoo.com">
+    <myns:foo>bar</myns:foo>
+  </myXMLdoc>
+
+JavaScript:
+  var myXMLDoc = getXMLDocument().documentElement;
+  alert(myXMLDoc.childNodes.length);
+
+

The first line of JavaScript 的第一行載入 XML 檔並用 documentElement 來存取它的 root 元素 (myXMLDoc)。第二行顯示子節點的數目。根據 W3C 規格，接在一起的空白與換行字符組成一個文字節點。在 Mozilla 上 myXMLdoc 節點有三個子：一個有換行字符與兩個空白的文字節點、myns:foo 節點、與另一個有換行字符的文字節點。Internet Explorer 並不遵循這個，因此上面的程式碼會顯示 "1"，表示只有 myns:foo 節點。所以，如要迴走子節點並掠過文字節點，要分辨這些節點。

+

The first line of JavaScript loads the XML document and accesses the root element (myXMLDoc) by retrieving the documentElement. The second line simply alerts the number of child nodes. Per the W3C specification, the white spaces and new lines merge into one text node if they follow each other. For Mozilla, the myXMLdoc node has three children: a text node containing a new line and two spaces; the myns:foo node; and another text node with a new line. Internet Explorer, however, does not abide by this and will return "1" for the above code, namely only the myns:foo node. Therefore, to walk the child nodes and disregard text nodes, you must distinguish such nodes.

+

As mentioned earlier, every node has a nodeType attribute representing the node type. For example, an element node has type 1, while a document node has type 9. To disregard text nodes, you must check for types 3 (text node) and 8 (comment node).

+
XML:
+  <?xml version="1.0"?>
+  <myXMLdoc xmlns:myns="http://myfoo.com">
+    <myns:foo>bar</myns:foo>
+  </myXMLdoc>
+
+JavaScript:
+  var myXMLDoc = getXMLDocument().documentElement;
+  var myChildren = myXMLDoc.childNodes;
+
+  for (var run = 0; run < myChildren.length; run++){
+    if ( (myChildren[run].nodeType != 3) &&
+          myChildren[run].nodeType != 8) ){
+      // not a text or comment node
+    }
+  }
+
+

XML data islands

+

Internet Explorer has a nonstandard feature called XML data islands, which allow you to embed XML inside an HTML document using the nonstandard HTML tag <xml>. Mozilla does not support XML data islands and handles them as unknown HTML tags. You can achieve the same functionality using XHTML; however, because Internet Explorer's support for XHTML is weak, this is usually not an option.

+

One cross-browser solution is to use DOM parsers, which parse a string that contains a serialized XML document and generates the document for the parsed XML. Mozilla uses the DOMParser class, which takes the serialized string and creates an XML document out of it. In Internet Explorer, you can achieve the same functionality using ActiveX. A new Microsoft.XMLDOM generates and has a loadXML method that can take in a string and generate a document from it. The following code shows you how:

+
IE XML data island:
+  ..
+  <xml id="xmldataisland">
+    <foo>bar</foo>
+  </xml>
+
+Cross-browser solution:
+  var xmlString = "<xml id=\"xmldataisland\"><foo>bar</foo></xml>";
+
+  var myDocument;
+
+  if (document.implementation.createDocument){
+    // Mozilla, create a new DOMParser
+    var parser = new DOMParser();
+    myDocument = parser.parseFromString(xmlString, "text/xml");
+  } else if (window.ActiveXObject){
+    // Internet Explorer, create a new XML document using ActiveX
+    // and use loadXML as a DOM parser.
+    myDocument = new ActiveXObject("Microsoft.XMLDOM")
+    myDocument.async="false";
+
+    myDocument.loadXML(xmlString);
+  }
+
+

XML HTTP request

+

Internet Explorer allows you to send and retrieve XML files using MSXML's XMLHTTP class, which is instantiated through ActiveX using new ActiveXObject("Msxml2.XMLHTTP") or new ActiveXObject("Microsoft.XMLHTTP"). Since there is no standard method of doing this, Mozilla provides the same functionality in the global JavaScript XMLHttpRequest object. The object generates asynchronous requests by default.

+

After instantiating the object using new XMLHttpRequest(), you can use the open method to specify what type of request (GET or POST) you use, which file you load, and if it is asynchronous or not. If the call is asynchronous, then give the onload member a function reference, which is called once the request has completed.

+

Synchronous request:

+
  var myXMLHTTPRequest = new XMLHttpRequest();
+  myXMLHTTPRequest.open("GET", "data.xml", false);
+
+  myXMLHTTPRequest.send(null);
+
+  var myXMLDocument = myXMLHTTPRequest.responseXML;
+
+

Asynchronous request:

+
  var myXMLHTTPRequest;
+
+  function xmlLoaded() {
+    var myXMLDocument = myXMLHTTPRequest.responseXML;
+  }
+
+  function loadXML(){
+    myXMLHTTPRequest = new XMLHttpRequest();
+
+    myXMLHTTPRequest.open("GET", "data.xml", true);
+
+    myXMLHTTPRequest.onload = xmlLoaded;
+
+    myXMLHTTPRequest.send(null);
+  }
+
+

Table 7 features a list of available methods and properties for Mozilla's XMLHttpRequest.

+

 

+

Table 7. XMLHttpRequest methods and properties

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
NameDescription
void abort()Stops the request if it is still running.
string getAllResponseHeaders()Returns all response headers as one string.
string getResponseHeader(string headerName)Returns the value of the specified header.
functionRef onerrorIf set, the references function will be called whenever an error occurs during the request.
functionRef onloadIf set, the references function will be called when the request completes successfully and the response has been received. Use when an asynchronous request is used.
void open (string HTTP_Method, string URL)
+
+ void open (string HTTP_Method, string URL, boolean async, string userName, string password)		Initializes the request for the specified URL, using either GET or POST as the HTTP method. To send the request, call the send() method after initialization. If async is false, the request is synchronous, else it defaults to asynchronous. Optionally, you can specify a username and password for the given URL needed.
int readyStateState of the request. Possible values: + + + + + + + + + + + + + + + + + + + + + + + + + + + +
ValueDescription
0UNINITIALIZED - open() has not been called yet.
1LOADING - send() has not been called yet.
2LOADED - send() has been called, headers and status are available.
3INTERACTIVE - Downloading, responseText holds the partial data.
4COMPLETED - Finished with all operations.
+
string responseTextString containing the response.
DOMDocument responseXMLDOM Document containing the response.
void send(variant body)Initiates the request. If body is defined, it issent as the body of the POST request. body can be an XML document or a string serialized XML document.
void setRequestHeader (string headerName, string headerValue)Sets an HTTP request header for use in the HTTP request. Has to be called after open() is called.
string statusThe status code of the HTTP response.
+

XSLT 差異

+

Mozilla supports XSL Transformations (XSLT) 1.0. It also allows JavaScript to perform XSLT transformations and allows running XPATH on a document.

+

Mozilla requires that you send the XML and XSLT file holding the stylesheet with an XML mimetype (text/xml or application/xml). This is the most common reason why XSLT won't run in Mozilla but will in Internet Explorer. Mozilla is strict in that way.

+

Internet Explorer 5.0 and 5.5 supported XSLT's working draft, which is substantially different than the final 1.0 recommendation. The easiest way to distinguish what version an XSLT file was written against is to look at the namespace. The namespace for the 1.0 recommendation is http://www.w3.org/1999/XSL/Transform, while the working draft's namespace is http://www.w3.org/TR/WD-xsl. Internet Explorer 6 supports the working draft for backwards compatibility, but Mozilla does not support the working draft, only the final recommendation.

+

If XSLT requires you to distinguish the browser, you can query the "xsl:vendor" system property. Mozilla's XSLT engine will report itself as "Transformiix" and Internet Explorer will return "Microsoft."

+
<xsl:if test="system-property('xsl:vendor') = 'Transformiix'">
+  <!-- Mozilla specific markup -->
+</xsl:if>
+<xsl:if test="system-property('xsl:vendor') = 'Microsoft'">
+  <!-- Internet Explorer specific markup -->
+</xsl:if>
+
+

Mozilla also provides JavaScript interfaces for XSLT, allowing a Web site to complete XSLT transformations in memory. You can do this using the global XSLTProcessor JavaScript object. XSLTProcessor requires you to load the XML and XSLT files, because it needs their DOM documents. The XSLT document, imported by the XSLTProcessor, allows you to manipulate XSLT parameters. XSLTProcessor can generate a standalone document using transformToDocument(), or it can create a document fragment using transformToFragment(), which you can easily append into another DOM document. Below is an example:

+

 

+
var xslStylesheet;
+var xsltProcessor = new XSLTProcessor();
+
+// load the xslt file, example1.xsl
+var myXMLHTTPRequest = new XMLHttpRequest();
+myXMLHTTPRequest.open("GET", "example1.xsl", false);
+myXMLHTTPRequest.send(null);
+
+// get the XML document and import it
+xslStylesheet = myXMLHTTPRequest.responseXML;
+
+xsltProcessor.importStylesheet(xslStylesheet);
+
+// load the xml file, example1.xml
+myXMLHTTPRequest = new XMLHttpRequest();
+myXMLHTTPRequest.open("GET", "example1.xml", false);
+myXMLHTTPRequest.send(null);
+
+var xmlSource = myXMLHTTPRequest.responseXML;
+
+var resultDocument = xsltProcessor.transformToDocument(xmlSource);
+
+

After creating an XSLTProcessor, you load the XSLT file using XMLHttpRequest. The XMLHttpRequest's responseXML member contains the XML document of the XSLT file, which is passed to importStylesheet. You then use the XMLHttpRequest again to load the source XML document that must be transformed; that document is then passed to the transformToDocument method of XSLTProcessor. Table 8 features a list of XSLTProcessor methods.

+

 

+

Table 8. XSLTProcessor methods

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
MethodDescription
void importStylesheet(Node styleSheet)Imports the XSLT stylesheet. The styleSheet argument is the root node of an XSLT stylesheet's DOM document.
DocumentFragment transformToFragment(Node source, Document owner)Transforms the Node source by applying the stylesheet imported using the importStylesheet method and generates a DocumentFragment. owner specifies what DOM document the DocumentFragment should belong to, making it appendable to that DOM document.
Document transformToDocument(Node source)Transforms the Node source by applying the stylesheet imported using the importStylesheet method and returns a standalone DOM document.
void setParameter(String namespaceURI, String localName, Variant value)Sets a parameter in the imported XSLT stylesheet.
Variant getParameter(String namespaceURI, String localName)Gets the value of a parameter in the imported XSLT stylesheet.
void removeParameter(String namespaceURI, String localName)Removes all set parameters from the imported XSLT stylesheet and makes them default to the XSLT-defined defaults.
void clearParameters()Removes all set parameters and sets them to defaults specified in the XSLT stylesheet.
void reset()Removes all parameters and stylesheets.
+
+

原文資訊

+ +
diff --git a/files/zh-tw/archive/mozilla/persona/branding/index.html b/files/zh-tw/archive/mozilla/persona/branding/index.html new file mode 100644 index 0000000000..2793b91f88 --- /dev/null +++ b/files/zh-tw/archive/mozilla/persona/branding/index.html @@ -0,0 +1,42 @@ +--- +title: 品牌資源 +slug: Archive/Mozilla/Persona/branding +translation_of: Archive/Mozilla/Persona/User_interface_guidelines +--- +

「使用 Persona 登入」按鈕

+

圖片

+

登入按鈕有三種版本、三種配色：

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
 Sign in with your EmailSign in with PersonaSign in
黑
藍
紅
+

CSS-Based

+

Sawyer Hollenshead 製作了一套精美的 CSS-based 按鈕。下載 (.zip)

+

更多資訊

+

您可在 Sean Martell's style primer 找到更多有關 Persona 視覺設計的資訊。

diff --git a/files/zh-tw/archive/mozilla/persona/index.html b/files/zh-tw/archive/mozilla/persona/index.html new file mode 100644 index 0000000000..5345e5f569 --- /dev/null +++ b/files/zh-tw/archive/mozilla/persona/index.html @@ -0,0 +1,125 @@ +--- +title: Persona +slug: Archive/Mozilla/Persona +translation_of: Archive/Mozilla/Persona +--- +
+

       保持聯繫或取得協助！

+ +

追蹤 我們的 blog，加入 我們的郵件列表，或在 IRC 裡頭 #identity 頻道找到我們。

+
+ +

Mozilla Persona 是一個跨瀏覽器的 Web 登入驗證系統，其基本設計精神為易於使用以及易於實作。它可以使用於當今主要的各種瀏覽器環境中，你可以現在就開始使用它。

+ +

為什麼你應該套用 Persona 在你的網站上呢？

+ +
    +
  1. Persona 完全消除了特定網站的密碼，讓使用者們與網站們從創立、管理以及安全地保存密碼的責任中解放出來。
    2. +
  2. Persona 易於使用。只需要兩次點擊，一位 Persona 使用者即可登入某個新網站，諸如：Voost 或 The Times Crossword ，避開了造訪新網站又要再申請一組帳號密碼的麻煩事。
    3. +
  3. Persona 易於實作。開發人員只需要花一個下午的時間，即可將 Persona 套用到一個網站中。
    4. +
  4. 更棒的是，不會被鎖定。開發人員可以取得造訪網站的所有使用者已驗證過的電子郵件信箱，而使用者可以使用任何一個或多個電子郵件信箱在 Persona 中。
    5. +
+ +

而且，Persona 未來將會變得越來越棒：它是基於開放、去中心化的通訊協定，被設計規劃成可直接整合到各個瀏覽器中，以及可由電子郵件服務提供者直接提供支援。今天採用並導入 Persona 的網站將直接體驗到這些未來的改進項目，不需要再更動其程式碼。

+ +
備註：Persona 正在很活躍地開發中。歡迎造訪我們的 blog 來認識更多心功能，或是加入我們的郵件群組（英文）給予我們更多建議與回饋！
+ +

動手導入 Persona 到你的網站中

+ + + + + + + + + + + + +
+

開始動手！

+ +
+
為什麼是 Persona？
+
認識更多關於在你的網站上採用 Persona 的原因，以及它與其他身分驗證系統的差異比較。
+
快速指南
+
這是一份快捷的攻略，馬上學習如何在你的網站中加入 Persona 功能。
+
+ 		+

Persona API 參考資料

+ +
+
navigator.id API
+
這是一份關於 navigator.id 物件的參考資料，Web 開發人員可以用來將 Persona 整合到網站中。
+
Verification (驗證) API
+
這份參考資料是關於建構在https://verifier.login.persona.org/verify 的遠端驗證 API。
+
+
+

導引指南

+ +
+
安全考量
+
實作與技巧用以確保你的 Persona 佈署是安全的。
+
瀏覽器相容性
+
確切得知有哪些瀏覽器有支援 Persona。
+
國際化
+
了解 Persona 如何處理不同的各國語言。
+
+ 		+

資源

+ +
+
函式庫與套件
+
尋找你愛好的程式語言、web framework、blog 或是內容管理系統 (CMS) 的函式庫或套件 (plugin)。
+
The Persona cookbook
+
給 Persona 網站參考的範例程式碼。包含有 C# (MVC3)、PHP、Node.JS 等等各種語言。
+
品牌資源
+
Persona 登入按鈕，以及方便你的使用者識別的 Persona 圖形資源。
+
+
+ +

 

+ + + + + + + + +
+

給身分識別提供者 (Identity Provider) 的資訊

+ +

如果你是電子郵件服務提供者，或是身分識別服務提供者，請參考以下資訊獲知如何整合並成為一個 Persona 身分識別提供者 (IdP)。

+ +
+
IdP 概述
+
Persona 身份識別提供者概述。
+
實作 IdP
+
這是一份詳細的技術指南，關於如何成為身分識別提供者 (IdP)。
+
.well-known/browserid
+
.well-known/browserid 文件的結構與用途概述。這份文件檔案被 IdPs 用於廣播通知其支援此通訊協定。
+
+ 		+

Persona 專案

+ +
+
專有名詞對照表
+
BrowserID 和 Persona 定義的專有名詞。
+
FAQ
+
常見問題集。
+
通訊協定概述
+
BrowserID 通訊協定的底層技術性概述。
+
加密
+
一瞥 Persona 和 BrowserID 背後的密碼學概念。
+
規格
+
在這裡可以挖到更多更深的技術性細節。
+
Persona 網站
+
為了讓 Persona 運作，我們在 https://login.persona.org 設立了三種服務：一個身分識別提供者，一個可移動可轉移的 {{ domxref("navigator.id") }} API 實作，以及一個身分判定 (identity assertion) 驗證服務。
+
Persona 原始程式碼
+
我們將 Persona 網站背後的程式碼放在 GitHub 上。非常歡迎送 Pull requests 給我們！
+
+
+ +

 

diff --git a/files/zh-tw/archive/mozilla/persona/internationalization/index.html b/files/zh-tw/archive/mozilla/persona/internationalization/index.html new file mode 100644 index 0000000000..b4ec357352 --- /dev/null +++ b/files/zh-tw/archive/mozilla/persona/internationalization/index.html @@ -0,0 +1,51 @@ +--- +title: Internationalization +slug: Archive/Mozilla/Persona/Internationalization +tags: + - Persona +translation_of: Archive/Mozilla/Persona/Internationalization +--- +

Persona 的本土化如何呢？

+

將來，使用 Persona 登入網站的使用者界面（UI）將被直接集成至瀏覽器中，並且隨著瀏覽器自己的本土化來本土化。。而不支援集成的瀏覽器，Persona 的使用者界面即由一系列來自 login.persona.org 的對話框所組成。這些對話框的翻譯由來自社群的自願者進行，並且有超過 45 種語言可用於這些產品中。

+

Persona 如何選擇語言？

+

Persona 服務通過來自瀏覽器請求頭部訊息中的 Accept-Language 來選擇語言。Accept-Language 頭部訊息所使用的語言與 mozilla.org 所使用的為一致：

+
    +
  1. 對於每個 Accept-Language 中的語言標籤： +
      +
    • 確保我們有完整的該語言標籤的語言，則為精準配對該語言標籤
      • +
    • 確保我們有該語言標籤中的第一個部分，則精準配對第一部分
      • +
    +
    2. +
  2. 若沒辦法通過規則 1 來配對，則退而使用 en-US 。但是，通常 en 或 en-US 幾乎會被大多數瀏覽器作為最後一個傳送的 accept-lang 頭部資訊。
    3. +
+

舉例來說，下列下列表格列出了不同的 Accept-Language 會選擇的語言，假設支援下列語言： en-US, es, es-MX:

+ + + + + + + + + + + + + + + + + + + + + + + + + +
Accept-Language HeaderPersona 選擇的語言
es-AR,es;q=0.8,en-us;q=0.5es
es-MX,es;q=0.8,en-us;q=0.5es-MX
es-es,en-us;q=0.5en-US
es-esen-US
+

目前還沒辦法讓網站強制將對話框設為某一種語言。這是因為 Persona UI 的邏輯是（以及未來在本機上實現的，也會是）設計為作為瀏覽器的使用者界面的一部分，所以其語言應該要同瀏覽器的語言一致。

+

我可以如何協助？

+

Persona 使用了 Mozilla Verbatim 來協助志願者建立新的翻譯。若您想幫助，請參閱開始使用 Verbatim 並看看 Verbatim 上的「BrowserID」計劃 。

+

 

diff --git a/files/zh-tw/archive/mozilla/persona/quick_setup/index.html b/files/zh-tw/archive/mozilla/persona/quick_setup/index.html new file mode 100644 index 0000000000..d21858329f --- /dev/null +++ b/files/zh-tw/archive/mozilla/persona/quick_setup/index.html @@ -0,0 +1,137 @@ +--- +title: 快速指南 +slug: Archive/Mozilla/Persona/Quick_Setup +translation_of: Archive/Mozilla/Persona/Quick_Setup +--- +

要把 Persona 登入系統加到你的網站，只需要五個步驟：

+
    +
  1. 在你的網頁中引入 Persona 的 JavaScript 函式庫。
    2. +
  2. 加上「登入」和「登出」按鈕。
    3. +
  3. 監聽登入和登出行為。
    4. +
  4. 驗證使用者的身分 (credential)。
    5. +
  5. 檢視最佳導入實例。
    6. +
+

你應該能在一個下午就建置完成並開始執行，另外重要的事情是：如果你要在你的網站上開始使用 Persona，請花點時間訂閱 Persona 通知 郵件清單。它的流量非常低，只會用於通知你關於變更公告或是安全問題等可能對你的網站造成影響的議題。

+

步驟1：引入 Persona 函式庫

+

Persona 被設計為跨瀏覽器且可在全部主要桌面和移動瀏覽器中工作。

+

在未來我們期望瀏覽器提供 Persona 的原生支援，但我們同時提供了一個 JavaScript 函式庫完整實作了使用者介面和客戶端部分的協議。透過包含這個函式庫，你的使用者將可以用 Persona 登入，無論他們的瀏覽器是否有原生支援。

+

一旦頁面中的這個函式庫載入完成，你需要的 Persona 函式（{{ domxref("navigator.id.watch()", "watch()") }}、{{ domxref("navigator.id.request()", "request()") }} 和 {{ domxref("navigator.id.logout()", "logout()") }}）會在全域物件 navigator.id 中可用。

+

要包含 Persona JavaScript 函式庫，你可以把這個 script 標籤放進你頁面的首部：

+
<script src="https://login.persona.org/include.js"></script>
+
+

你必須在每個使用 {{ domxref("navigator.id") }} 中函式的頁面裡包含這個標籤。因為 Persona 始終在開發中，你不應該自行管理 include.js 檔。

+

步驟2：加入登入/登出按鈕

+

因為 Persona 被設計為一個 DOM API，你必須在使用者按下你網站上的登入或登出按鈕時呼叫函式。要開啟 Persona 對話視窗並提示使用者登入，你應該呼叫 {{ domxref("navigator.id.request()") }} 。而登出要呼叫 {{ domxref("navigator.id.logout()") }} 。

+

例如：

+
var signinLink = document.getElementById('signin');
+if (signinLink) {
+signinLink.onclick = function() { navigator.id.request(); };
+};
+
+var signoutLink = document.getElementById('signout');
+if (signoutLink) {
+signoutLink.onclick = function() { navigator.id.logout(); };
+};
+
+

那些按鈕的是什麼樣子的？查看我們的品牌資源頁面中的預製圖片和基於 CSS 的按鈕！

+

步驟3：監視登入/登出行為

+

要把 Persona 封裝成函式，你需要告訴它當使用者登入/登出時做甚麼。呼叫 {{ domxref("navigator.id.watch()") }} 函式就可以實作，它支援三處：

+
    +
  1. +

    你網站目前使用者的 loggedInEmail ，如果沒有則為 null 。你應該在渲染頁面的時候動態產生它。

    +
    2. +
  2. +

    當觸發 onlogin 行為的時候呼叫的函式。這個函式會被傳遞一個必須認證的「身分斷言」參數。

    +
    3. +
  3. +

    當觸發 onlogout 行為的時候呼叫的函式。這個函式不會被傳遞任何參數。

    +
    4. +
+
+

注意：你必須總是在呼叫 {{ domxref("navigator.id.watch()") }} 時同時包含 onlogin 和 onlogout 。

+
+

例如，如果你現在認為 Bob 已經登入到你的網站，你會這樣做：

+
var currentUser = 'bob@example.com';
+
+navigator.id.watch({
+loggedInUser: currentUser,
+onlogin: function(assertion) {
+// 一個使用者已經登入！這是你需要做的：
+// 1. 把斷言發送到後端驗證並建立一個工作階段。
+// 2. 更新你的 UI。
+$.ajax({ /* <-- 本例使用了 jQuery，但你也可以用你想用的 */
+type: 'POST',
+url: '/auth/login', // 這是你網站上的一個 URL
+data: {assertion: assertion},
+success: function(res, status, xhr) { window.location.reload(); },
+error: function(res, status, xhr) { alert("登入失敗" + res); }
+});
+},
+onlogout: function() {
+// 一個使用者已經登出！這是你需要做的：
+// 銷毀使用者的工作階段並重新導向使用者或做後端的呼叫。
+// 同樣，讓 loggedInUser 在下個頁面載入時變為 null。
+// （這是一個字面的 JavaScript null。不是 false、 0 或 undefined。null。)
+$.ajax({
+type: 'POST',
+url: '/auth/logout', // 這是你網站上的一個 URL
+success: function(res, status, xhr) { window.location.reload(); },
+error: function(res, status, xhr) { alert("登出失敗" + res); }
+});
+}
+});
+
+

在本例中，onlogin 和 onlogout 都通過向你網站的後端發送非同步 POST 請求來實作。後端隨後通常用設定或刪除工作階段 cookie 中的資訊來登入或登出使用者。之後，如果一切都核對無誤，頁面重新載入來考慮帳號的新登入狀態。

+

你當然可以用 AJAX 來不用重新載入或重新導向來實作，但這超出了本教學的範疇。

+

你必須在每個有登入/登出按鈕的頁面上呼叫這個函式。要為使用者支持 Persona 加強功能，諸如自動登入和全域登出，你應該在網站上的每個頁面都呼叫這個函式。

+

步驟4：驗證使用者證書

+

Persona 用「身分斷言」來代替密碼，那是一種類似一次性、單一網站的、使用者郵件地址捆綁的密碼。當使用者想要登入時，你的 onlogin 回調會傳入一個該使用者的斷言來呼叫。在你登入他們前，你必須驗證斷言的有效性。

+

在你的伺服器上而不是使用者瀏覽器上執行的 JavaScript 中驗證斷言是極度重要的，因為那很容易偽造。上面的例子用 jQuery 的 $.ajax() 輔助函式來把斷言通過 POST 到 /auth/login 來呈遞給後端。

+

一旦你的伺服器取得了斷言，你如何驗證它？最簡單的方法是用 Mozilla 提供的輔助服務。簡單地把斷言以兩個參數 POST 給 https://verifier.login.persona.org/verify：

+
    +
  1. assertion: 使用者提供的身分斷言。
    2. +
  2. audience: 你網站的主機名稱和連接埠。你必須在後端硬編碼這個值；不要從使用者提供的任何資料中派生這個值。
    3. +
+

例如，如果你是 example.com，你可以用下面的命令行來測試斷言：

+
$ curl -d "assertion=<ASSERTION>&audience=https://example.com:443" "https://verifier.login.persona.org/verify"
+
+

如果它是有效的，你會得到像這樣的一個 JSON 回應：

+
{
+"status": "okay",
+"email": "bob@eyedee.me",
+"audience": "https://example.com:443",
+"expires": 1308859352261,
+"issuer": "eyedee.me"
+}
+
+

你可以閱讀驗證服務 API來獲知更多關於驗證服務的內容。一個 /api/login 實作的使用了 Python、Flask web 框架和 Requests HTTP 函式庫的例子看起來是這樣：

+
@app.route('/auth/login', methods=['POST'])
+def login():
+# 請求必須包含我們要驗證的斷言
+if 'assertion' not in request.form:
+abort(400)
+
+# 把斷言發送給 Mozilla 的驗證服務
+data = {'assertion': request.form['assertion'], 'audience': 'https://example.com:443'}
+resp = requests.post('https://verifier.login.persona.org/verify', data=data, verify=True)
+
+# 驗證器回應了嗎？
+if resp.ok:
+# 處理回應
+verification_data = json.loads(resp.content)
+
+# 檢查斷言是否有效
+if verification_data['status'] == 'okay':
+# 設置一個安全工作階段 cookie 來登入使用者
+session.update({'email': verification_data['email']})
+return resp.content
+
+# 哎喲，有什麼東西不對，放棄
+abort(500)
+
+

工作階段管理可能很像你現有的登入系統。首先的大區別是在驗證使用者身分採用了檢查斷言而不是檢查密碼。另一個不同是確保使用者的郵件地址有效來用於 {{ domxref("navigator.id.watch()") }} 的 loggedInEmail 參數

+

登出很簡單：你只需要移除使用者的工作階段 cookie。

+

步驟5：回顧最佳實踐

+

一旦所有的東西都工作正常並且你已經成功登入和登出你的網站，你應該花一會時間來回顧安全可靠地使用 Persona 的最佳實踐。

+

如果你在做一個要作為生產環境的網站，你會想要編寫整合測試來模擬用 Persona 登入或登出使用者。要改善 Selenium 中的這個行為，請考慮使用 bidpom 函式庫。mockmyid.com 和 personatestuser.org 這兩個網站也可能會有用。

+

最後，不要忘記登記加入 Persona 通知 郵件清單，這樣會通知你任何安全問題或 Persona API 的向後相容變更。這個清單的流量非常低：它只用於通知會對你的網站造成負面影響的變更。

diff --git a/files/zh-tw/archive/mozilla/persona/remote_verification_api/index.html b/files/zh-tw/archive/mozilla/persona/remote_verification_api/index.html new file mode 100644 index 0000000000..7d84cc21b6 --- /dev/null +++ b/files/zh-tw/archive/mozilla/persona/remote_verification_api/index.html @@ -0,0 +1,171 @@ +--- +title: 遠端驗證 API +slug: Archive/Mozilla/Persona/Remote_Verification_API +translation_of: Archive/Mozilla/Persona/Remote_Verification_API +--- +

概覽

+

當使用者嘗試登入至網站時，瀏覽器會產生一名為「斷言」的資料結構，其實質上就是一個加密過的電子郵件位置。瀏覽器傳送這個斷言至網站上，使用者登入前，網站必須驗證斷言的有效性。

+

斷言可以在本地端或是通過在下列位置的 API 來進行驗證：https://verifier.login.persona.org/verify。這個頁面介紹了如何使用 API 。

+

方法

+

HTTP POST 請求至 https://verifier.login.persona.org/verify。

+

參數

+
+
+ assertion
+
+ 使用者所提供之斷言。作為傳入 {{ domxref("navigator.id.watch()") }} 中 onlogin 函數的第一個參數。
+
+ audience
+
+ 您網站的通訊協定、網域名稱、與通訊埠。例如：「https://example.com:443」
+
+

回傳值

+

呼叫後會傳統一個包含 status 元素的 JSON 結構，其值可能為「okay」或是「failure」。 依據 status 的值的不同，可能會包含下列表中的額外元素。

+

"okay"

+

該斷言有效。

+

在這種情況下，JSON 結構會包含下列附加元素：

+ + + + + + + + + + + + + + + + + + + +
"email"斷言中包含的登入者的郵件位置。
"audience"Audience 的值包含了斷言。Expected to be your own website URL.
"expires"斷言有效期的資料，expressed as the primitive value of a Date object: that is, the number of milliseconds since midnight 01 January, 1970 UTC.
"issuer"The hostname of the identity provider that issued the assertion.
+

"failure"

+

該斷言無效。這種情況下 JSON 結構將會包含一個附加的元素：

+ + + + + + + +
"reason"一字串解釋驗證為何失敗。
+

範例

+

node.js

+

該範例為使用 express.js 的 Node.js 伺服器。

+
var express = require("express"),
+    app = express.createServer(),
+    https = require("https"),
+    querystring = require("querystring");
+/* ... */
+
+// Audience 必須符合您瀏覽器的位置列上顯示的，
+// 包含通訊協定、主機名稱、以及通訊埠。
+var audience = "http://localhost:8888";
+
+app.post("/authenticate", function(req, res) {
+  var vreq = https.request({
+    host: "verifier.login.persona.org",
+    path: "/verify",
+    method: "POST"
+  }, function(vres) {
+    var body = "";
+    vres.on('data', function(chunk) { body+=chunk; } )
+        .on('end', function() {
+          try {
+            var verifierResp = JSON.parse(body);
+            var valid = verifierResp && verifierResp.status === "okay";
+            var email = valid ? verifierResp.email : null;
+            req.session.email = email;
+            if (valid) {
+              console.log("assertion verified successfully for email:", email);
+              res.json(email);
+            } else {
+              console.log("failed to verify assertion:", verifierResp.reason);
+              res.send(verifierResp.reason, 403);
+            }
+          } catch(e) {
+            console.log("non-JSON response from verifier");
+            // bogus response from verifier!
+            res.send("bogus response from verifier!", 403);
+
+          }
+        });
+  });
+
+  vreq.setHeader('Content-Type', 'application/x-www-form-urlencoded');
+
+  var data = querystring.stringify({
+    assertion: req.body.assertion,
+    audience: audience
+  });
+
+  vreq.setHeader('Content-Length', data.length);
+  vreq.write(data);
+  vreq.end();
+
+  console.log("verifying assertion!");
+});
+
+
+

via Lloyd Hilaiel

+

PHP

+
$url = 'https://verifier.login.persona.org/verify';
+$assert = filter_input(
+    INPUT_POST,
+    'assertion',
+    FILTER_UNSAFE_RAW,
+    FILTER_FLAG_STRIP_LOW|FILTER_FLAG_STRIP_HIGH
+);
+//使用 $_POST 超全域陣列供 PHP < 5.2 並撰寫您自己的篩選其
+$params = 'assertion=' . urlencode($assert) . '&audience=' .
+           urlencode('http://example.com:80');
+$ch = curl_init();
+$options = array(
+    CURLOPT_URL => $url,
+    CURLOPT_RETURNTRANSFER => TRUE,
+    CURLOPT_POST => 2,
+    //CURLOPT_SSL_VERIFYPEER => true,   //This currently blocks connection to 'https://verifier.login.persona.org/verify'
+    CURLOPT_SSL_VERIFYPEER => 0,
+
+    CURLOPT_SSL_VERIFYHOST => 2,
+    CURLOPT_POSTFIELDS => $params
+);
+curl_setopt_array($ch, $options);
+$result = curl_exec($ch);
+curl_close($ch);
+echo $result;
+

Via Christian Heilmann

+

Java

+
@Override
+protected void doPost(final HttpServletRequest req,
+   final HttpServletResponse resp) throws ServletException,
+   IOException {
+
+   final String audience = req.getServerName();
+   final String assertion = req.getParameter("assertion");
+   final Verifier verifier = new Verifier();
+   final BrowserIDResponse personaResponse = verifier.verify(assertion,audience);
+   final Status status = personaResponse.getStatus();
+
+   if (status == Status.OK) {
+     /* Authentication with Persona was successful */
+     String email = personaResponse.getEmail();
+     log.info("{} has sucessfully signed in", email);
+     HttpSession session = req.getSession(true);
+     session.setAttribute("email", email);
+
+   } else {
+     /* Authentication with Persona failed */
+     log.info("Sign in failed...");
+
+   }
+}
+
+

Via Javier

+

 

+

注意：If you send the assertion and audience parameters as a JSON-object, they must not be URL-encoded. If they are sent as regular HTTP POST parameters, as in the example above, they must be URL-encoded.

diff --git a/files/zh-tw/archive/mozilla/persona/why_persona/index.html b/files/zh-tw/archive/mozilla/persona/why_persona/index.html new file mode 100644 index 0000000000..e6b3b97ded --- /dev/null +++ b/files/zh-tw/archive/mozilla/persona/why_persona/index.html @@ -0,0 +1,30 @@ +--- +title: 為什麼是 Persona? +slug: Archive/Mozilla/Persona/Why_Persona +translation_of: Archive/Mozilla/Persona/Why_Persona +--- +

現行的使用者帳號和密碼系統不是個長久之計：使用者每造訪一個新網站新服務就得建立並記住一組新的、複雜的密碼，然後每一個網站系統都必須要夠安全地存放這些密碼。儘管如此，最近的事故中也顯示了即使是有規模、有聲望的大型網路公司也還是會在密碼安全上失誤出錯，讓他們的使用者資訊暴露在風險中。

+

Persona 是一個開放的、分散式的、web 規模的身分識別系統，用以取代一個網站一組密碼的局面。它解決了如 OpenID 這類系統的易用性與隱私相關等缺點，而且不訴諸於如 Facebook Connect 這類型中心化系統架構。

+

Persona 擺脫了每站一密碼

+

Persona 讓使用者在完成一個簡單的、一次性的身分識別處理流程後，只需要兩次點擊即可登入網站，而不再需要每站一密碼了。這是安全、可靠的，並且植基於公開金鑰密碼學的基礎上。使用者的瀏覽器產生一組加密過的「身分判定」來取代密碼，它的有效期只存在幾分鐘而且只能用於單一網站上。因為沒有網站特定的密碼，網站使用 Persona 也就不需要擔心如何安全地儲存密碼或是擔心失去或洩漏密碼資料庫了。

+

如此快速簡便的步驟，將讓使用者更快樂地造訪新網站。

+

Persona 使用電子郵件信箱地址作為身分識別

+

Persona 使用電子郵件信箱地址作為身分的識別方式，而不使用任意形式或自訂形式的用戶名稱作為身分識別。這帶給了使用者與開發人員諸多的好處：

+

使用者使用電子郵件信箱地址的好處

+ +

開發者使用電子郵件信箱地址的好處

+ +

更不用說電子郵件已經是個完整地，橫跨無數服務提供者的，數以億計帳戶的分散式系統。

+

Persona 與其他單一登入 (Single Sign-On) 服務有何不同？

+

Persona 安全、可靠、而且簡單。它保護了使用者的隱私、使用者的控制權、使用者的選擇，而這些是其它登入服務無法或不願意做到的。

+

許多社群網站，例如 Facebook 或 Google+，需要使用者使用真實姓名，並且限制使用者僅能使用單一帳號。藉由建構於電子郵件信箱地址的架構，Persona 允許使用者用以區分它們工作用、家用、學校用等不同的身份識別。

+

Persona 是開放的，也是分散式的：任何一位擁有電子郵件信箱地址的人都可以登入使用 Persona。除此之外，任何人也可以建立他們自己的身份識別服務或委由其他專業機構建立服務，就像使用電子郵件一般。這與需要單一且中心化帳號的社群網站登錄服務的做法剛好相反。

+

Persona 也採用較為新穎的做法來保護使用者的隱私，藉由將瀏覽器置入成為驗證過程當中的一環：瀏覽器從使用者的電子郵件提供者獲取認證身份，然後瀏覽器轉頭將此認證轉呈給網站。電子郵件提供者無法追蹤使用者，但是網站仍可藉由密碼學等驗證技術取得使用者的身份認證，並信任此使用者身份。其它大部份系統，即使是像 OpenID 如此的分散式系統，仍需要網站在背景連接通訊 (phone home) 才允許使用者登入。

diff --git a/files/zh-tw/archive/mozilla/xpinstall/index.html b/files/zh-tw/archive/mozilla/xpinstall/index.html new file mode 100644 index 0000000000..907f839dc4 --- /dev/null +++ b/files/zh-tw/archive/mozilla/xpinstall/index.html @@ -0,0 +1,65 @@ +--- +title: XPInstall +slug: Archive/Mozilla/XPInstall +tags: + - NeedsTranslation + - TopicStub + - XPInstall + - XPInstall_API_reference +translation_of: Archive/Mozilla/XPInstall +--- +

Parts of this page show the use of the XPInstall API. The majority of this API is now deprecated and as of Gecko 1.9 no longer available. Extension, Theme, and plug-in developers must switch away from install.js based packages to the new packaging scheme with an install.rdf manifest. In particular plugin developers should see how to package a plugin as an extension.

+
<?xml version="1.0" encoding="UTF-8"?>
+
+<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">
+    <!-- properties -->
+  </Description>
+</RDF>
+
+ +
Cross-Platform Install (XPInstall) is a technology used by Mozilla Application Suite, Mozilla Firefox, Mozilla Thunderbird and other XUL-based applications for installing extensions. An XPI (pronounced "zippy" and derived from XPInstall) installer module is a ZIP file that contains an install script or manifest (entitled install.js or install.rdf) at the root of the file.
+ + + + + + + + +
+

Documentation

+ +
+
XPInstall API Reference
+
XPInstall API Reference.
+
Learn XPI Installer Scripting by Example
+
This article uses the installer script from browser.xpi install package as the basis for discussing XPI installations in general.
+
Creating XPI Installer Modules
+
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.
+
Install Wizards (aka: Stub Installers)
+
+ +

View All...

+ 		+

Community

+ +
    +
  • View Mozilla forums... {{ DiscussionList("dev-platform", "mozilla.dev.platform") }}
    • +
+ +

Tools

+ + + + + + +
+ +

 

diff --git a/files/zh-tw/archive/mozilla/xpinstall/scripting_by_example/index.html b/files/zh-tw/archive/mozilla/xpinstall/scripting_by_example/index.html new file mode 100644 index 0000000000..7d95c88d75 --- /dev/null +++ b/files/zh-tw/archive/mozilla/xpinstall/scripting_by_example/index.html @@ -0,0 +1,244 @@ +--- +title: XPI 安裝腳本範例教學 +slug: Archive/Mozilla/XPInstall/Scripting_by_example +tags: + - XPInstall + - 待翻譯 +translation_of: Archive/Mozilla/XPInstall/Scripting_by_example +--- +

本文以 browser.xpi 安裝套件為基礎，討論一般的 XPI 安裝程序。安裝腳本 installer script 雖短，但含括了 XPInstall API 大部分的重要功能，且可做為其他一般用途套件的安裝腳本樣本。本文在 unix 下安裝，不過各平台的安裝方式大同小異，你可以此變化安裝在各種 Mozilla 支援的平台。

+ +

關於 browser.xpi

+ +

browser.xpi 是 Mozilla 瀏覽器安裝主要元件的 XPI 封存檔。Mozilla 跨平台安裝以 XPI 格式作為組織、壓縮、以及軟體自動化安裝及更新的用途。XPI 的格式同 ZIP 及 JAR，為 PKZIP 壓縮後的檔案，只是內含可供管理安裝方式的腳本。本文目標即為此安裝腳本installer script（通常稱為 install.js）的教學。

+ +

任何能解 ZIP 壓縮檔的工具都能開啟 XPI 檔，先來看看裡面有什麼東西：

+ +
install.js
+bin\
+  chrome\
+  components
+  defaults\
+  icons\
+  plugins\
+  res\
+
+ +

Note that this high-level structure parallels the directory structure of the installed browser very closely:

+ +

mozilla directory on linux

+ +

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.

+ +

綜覽安裝腳本

+ +

XPI install scripts are written in JavaScript using XPInstall Engine syntax defined in the XPInstall API Reference.

+ +

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):

+ +

節譯：大部分的安裝腳本都採以下的概念依流程安裝：

+ +
initInstall();
+if (verify_space()) {
+   err = add_dirs_and_files;
+   register_files;
+
+   if (err==SUCCESS) { performInstall() };
+   else { cancelInstall() };
+}
+
+ +

As you can see in the code listing, 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 mustinitialize, add the files to be installed, and execute.

+ +

Note also that when you call methods on the Install--as you do so often in installation scripts (getFolder, initInstall, addFile, and performInstall are all examples of common Install object methods)--the Install object is implicit; like the window object in regular web page scripts, the Install object does not need to be prefixed to the method.

+ +

初始化

+ +

All installations must begin with initInstall(). The initInstall() 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: var err = initInstall("Netscape Seamonkey", "Browser", "6.0.0.2000110807");

+ +

如果你在 initInstall() 之前呼叫 Install 物件中的方法，會導致錯誤。

+ +

The initInstall 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 initInstall in the XPInstall API Reference for more information on the initialization process.

+ +

檢驗安裝目標

+ +

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 verifyDiskSpace function is called as a condition of the main installation block that starts at line 24).

+ +
 // 先檢查磁碟剩餘空間
+ function verifyDiskSpace(dirPath, spaceRequired)
+ {
+   var spaceAvailable;
+   // 取得安裝磁碟之剩餘空間
+   spaceAvailable = fileGetDiskSpaceAvailable(dirPath);
+
+   // 將剩餘空間單位化為 KB
+   spaceAvailable = parseInt(spaceAvailable / 1024);
+   // 開始檢查
+   if(spaceAvailable < spaceRequired)
+   {
+      logComment("Insufficient disk space: " + dirPath);
+      logComment("  required : " + spaceRequired + " K");
+      logComment("  available: " + spaceAvailable + " K");
+      return(false);
+   }
+   return(true);
+ }
+
+ +

In the verifyDiskSpace block, fileGetDiskSpaceAvailable is called with dirPath as its expected input. This input is defined in line 22, where getFolder() is used to assign a value to the communicatorFolder variable representing the "Program" folder on the local system:

+ +
var communicatorFolder = getFolder("Program");
+spaceAvailable = fileGetDiskSpaceAvailable(dirPath);
+
+ +

spaceRequired, the other expected input to the verifyDiskSpace 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.

+ +

為 Install 物件加入檔案及內含檔案的目錄

+ +

一旦確保程式可以開始安裝，就該把想放的檔案加入安裝程序。在 browser.xpi 中，此程式段位於 26 到 41 行：

+ +
  err = addDirectory("Program",
+                     "6.0.0.2000110807",
+                     "bin",              // jar source folder
+                     communicatorFolder, // target folder
+                     "",                 // target subdir
+                     true );             // force flag
+
+  logComment("addDirectory() returned: " + err);
+
+  // 建立 plugins 目錄
+  var pluginsFolder = getFolder("Plugins");
+  if (!fileExists(pluginsFolder))
+  {
+      var ignoreErr = dirCreate(pluginsFolder);
+      logComment("dirCreate() returned: " + ignoreErr);
+  }
+  else
+      logComment("Plugins folder already exists");
+
+ +

本例檔案都放在單一目錄中, 所以採用 Install 物件的 addDirectory 方法將壓縮檔目錄中的檔案一併加入。addDirectory 跟 addFile 兩種方法都要指定來源與目的路徑，在此例中是把「bin」目錄中的檔案列為來源，並要求於程式正式呼叫 performInstall 時將檔案安裝到 communicatorFolder 目錄（此變數於第 22 行指定為「Program」）。

+ +

"Program" is one of a short list of keywords that can be used in place of full path names in methods such as addFile. "Program" represents the directory where software itself is installed (e.g., C:\Program Files\ on win32 systems), as opposed to supporting directories like "Components", "Chrome", or "Temporary" (see getFolder in the XPInstall API Reference for a list of keywords).

+ +

登記軟體

+ +

對於一個軟體來說，有時候需要同時在作業系統和 Netscape 6 平台上進行登記「登錄碼」。當你安裝了一個新的 chrome 像是 browser.xpi 時，你需要讓 chrome 登錄碼把這些更新登記在起來；如此一來，面板（skin）、使用者介面（user preference）、檔案清單（packaging list）、本地化文件（localization bundle）就會自動與新的軟體對應。

+ +

對於在 win32 作業系統上登記軟體，XPInstall API 提供兩個特別的物件－WinProfile 和 WinReg。它們能夠對 Windows 使用者資料和 Windows 登錄碼進行對應的操作。browser.xpi 安裝腳本並不強制你使用這些物件。關於在 win32 平台上和其他作業系統登記軟體，詳情可以參考 XPInstall API Reference。

+ +

而要利用 chrome 登錄碼登記基於 Netscape 6 的新軟體，像是一些外掛（plug-in）、元件（component）、佈景主題（theme）和套件（package），你需要使用 Install 物件中的 registerChrome 函數。如果執行成功，這個函數會回傳一個「0」並且將這筆紀錄寫進 chrome 的子目錄「installed-chrome.txt」這個檔案當中以便以後其他的 chrome 能夠同步更新千變萬化的 RDF 檔案。

+ +
 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/");
+ ...
+
+ +

在第 42 行至 58 行，只要有不同的資料夾中存在需要紀錄在 chrome 紀錄碼中的內容， registerChrome 就會被呼叫。 In lines 42-58, registerChrome 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 registerChrome function (it can also be used to support the now-deprecatedmanifest.rdf style of installation archive), the three parameters represent, in order, the chrome SWITCH 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.

+ +

See registerChrome in the XPInstall API Reference for more information about registering new packages with the chrome registry.

+ +

開始安裝

+ +

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:

+ +
initInstall();
+if (verify_space()) {
+   err = add_dirs_and_files;
+   register_files;
+
+   if (err==SUCCESS) { performInstall() };
+   else { cancelInstall() };
+}
+
+ +

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.

+ +

The actual install code used to execute the installation appears in theinstall.js file as follows:

+ +
if (err==SUCCESS)
+  {
+     err = performInstall();
+        logComment("performInstall() returned: " + err);
+  }
+
+  else
+  {
+     cancelInstall(err);
+	 logComment("cancelInstall() due to error: " + err);
+  }
+}
+else
+   cancelInstall(INSUFFICIENT_DISK_SPACE);
+
+ +

performInstall 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.

+ +

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 logComment, described in the following section.

+ +

安裝紀錄

+ +

Logging is an important feature of the XPInstall API that can help you streamline and debug your installations. In the example in the Executing the Installation section and in many places in the installation script, the logComment API is used to write data to a log file that can then be reviewed when things don't go as planned.

+ +

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.

+ +

更進一步

+ +

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).

+ +

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.

+ +

Minimally, the installation script must:

+ + + +

Here is an example of small but complete installation script.

+ +
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();
+
+ +

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:

+ +
function putIt()
+{
+  xpi={'CD_Ripper':'cdrip.xpi'};
+  InstallTrigger.install(xpi);
+}
+...
+
+<a href="#" onclick="putIt();">install the CD Ripper Now!</a>
+
+ +

See the InstallTrigger object in the XPInstall API Reference for more information on triggering installations.

+ +
+

原文資訊

+ + +
diff --git a/files/zh-tw/archive/mozilla/xul/index.html b/files/zh-tw/archive/mozilla/xul/index.html new file mode 100644 index 0000000000..ac13916ad4 --- /dev/null +++ b/files/zh-tw/archive/mozilla/xul/index.html @@ -0,0 +1,99 @@ +--- +title: XUL +slug: Archive/Mozilla/XUL +tags: + - XUL +translation_of: Archive/Mozilla/XUL +--- +

 

+ +
XUL 指南
+這份指南將協助你開始學習 XUL，原始創作來自於 XULPlanet。
+ +
XUL (XML User Interface Language，XML 使用者介面語言) 是 Mozilla 以 XML 為基礎的語言，可以讓你打造豐富功能且跨平台的應用程式，不論是否有連線到網際網路。這些應用程式可以輕鬆地自訂文字、圖案以及排版，因此可以很方便地為不同市場區塊發表不同品牌形象或本地化。已經熟悉 Dynamic HTML (DHTML) 的 Web 開發人員將可以很快地學會 XUL，並且馬上開始開發應用程式。 用 Firefox 或其他以 Gecko 為基礎的瀏覽器開啟 XUL 週期表 ，你將會看到一些 XUL 範例。
+ + + + + + + + +
+

文件

+ +
+
XUL 參考文獻
+
請參照這份 prefwindow MDC 文件。
+
+ +
+
XUL 控制項
+
快速瀏覽 XUL 控制項。
+
+ +
+
第一次玩 XUL 就上手
+
介紹 XUL 幾項重要功能與元件。
+
+ +
+
選單和彈出選單指南
+
選單和彈出式面板的指南。
+
+ +
+
XUL 模板指南
+
一份詳細討論 XUL 模板的指南，是個從資料源產生內容的方法指引。
+
+ +
+
XUL 的拖曳處理
+
如何使用拖曳操作。
+
+ +
+
為 Firefox 1.5 改寫 XUL 應用程式
+
一份關於 Firefox 1.5 所做變更的清單，會影響到使用 XUL 開發人員。
+
+ +

所有文件...

+ 		+

社群

+ +
    +
  • 查閱 Mozilla 討論區...
    • +
+ + + + + +

工具

+ + + +

所有工具...

+ +

相關主題

+ +
+
JavaScript, XBL, CSS, RDF, Extensions, XULRunner
+
+
+ +

Categories

+ +

Interwiki Language Links

diff --git a/files/zh-tw/archive/mozilla/xul/template_guide/index.html b/files/zh-tw/archive/mozilla/xul/template_guide/index.html new file mode 100644 index 0000000000..643bdaea0e --- /dev/null +++ b/files/zh-tw/archive/mozilla/xul/template_guide/index.html @@ -0,0 +1,5 @@ +--- +title: Template Guide +slug: Archive/Mozilla/XUL/Template_Guide +--- +

這個頁面無內容。您可以通過貢獻來豐富 MDN 的內容

diff --git a/files/zh-tw/archive/mozilla/xul/the_joy_of_xul/index.html b/files/zh-tw/archive/mozilla/xul/the_joy_of_xul/index.html new file mode 100644 index 0000000000..ab1da2e93c --- /dev/null +++ b/files/zh-tw/archive/mozilla/xul/the_joy_of_xul/index.html @@ -0,0 +1,49 @@ +--- +title: The Joy of XUL +slug: Archive/Mozilla/XUL/The_Joy_of_XUL +tags: + - XUL +translation_of: Archive/Mozilla/XUL/The_Joy_of_XUL +--- +

 

+

建議的讀者群：想要更加認識 XUL 且想瞭解為什麼 Mozilla 會採用 XUL 的應用開發人員與管理者。

+

翻譯原則：由於考量到預設讀者群應該有某種程度的原文專有名詞的認識基礎，故盡可能保留原文專有名詞，或採用加註的方式呈現。如果文中有對稱關係，則採用對稱保留或加註。

+

 

+

序論

+

XUL (發音〝/zu:l/〞) 是 Mozilla 以 XML 為基礎的使用者介面語言，讓你盡情地開發各式各樣的跨平台應用程式，不論是否在連線到網際網路的狀態皆可。這些應用程式可以藉由簡單地變更文字，圖案與版面佈局，來達到客製化的目的，因此可以輕易地本土化以推廣到各種市場去。如果您已經是熟習 Dynamic HTML (DHTML) 的網頁設計師，那您將可以很快地學會 XUL 並且可以馬上開始動手建構應用程式了。

+

這份文件將介紹一些比較吸引人的理由給網頁設計師，來應用 XUL 以及 Mozilla 相關技術來撰寫跨平台的應用程式。這也將充分說明 Mozilla 要設計 XUL 的動機，以及為什麼 Mozilla 平台是使用 XUL 建構起來的。XUL 的重要特色與優勢將會接著以支援 Mozilla 技術的方式來呈現。最後，有個關於 "使用 XUL 所撰寫之 Calendar" 的小小個案研討，作為補充。

+

重要特色與優勢

+ +
強大、以元件為基礎的標示語言 XUL 的目標是建造跨平台的應用程式，以別於原本拿來設計網頁的 DHTML。因此，XUL 設計為應用程式的加工組件(application artifacts)，如︰視窗(windows)、標籤(labels)、按鈕(buttons)等，用來取代頁面(pages)、大標題(heading levels)、連結(hypertext links)等。

事實上，許多開發人員已經嘗試在他們的 DHTML 網頁應用程式中達到圖形界面的效果，但這其中的代價就是複雜以及效能，而且沒有任何標準可以支援。
以現有標準為基礎 XUL 是立基於 W3C 標準 XML 1.0 的一個 XML 語言。使用 XUL 的應用程式是建構於這些 W3C 標準技術之上︰HTML 4.0、CSS 1 & 2、DOM Levels 1 & 2、JavaScript 1.5，包括 ECMA-262 Edition 3 (ECMAscript)、XML 1.0。

mozilla.org 正進一步地尋求 W3C 為 eXtensible Binding Language (XBL) 標準化。(參考下面的〝支援技術〞)。
平台可攜性 如同 HTML，XUL 被設計成與平台無關的，可以很容易地讓應用程式在任何存在 Mozilla 的作業系統上面使用。想想看現在有多麼廣泛的平台支援 Mozilla，這是以 XUL 技術來開發應用程式當中，最令人讚嘆的特色。

因為 XUL 提供了使用者介面組成元件的抽象層，因此實現了這個保證︰一經寫就，處處執行 (write-once, run-anywhere)。所有 Mozilla 核心應用程式的使用者介面都是用 XUL 所撰寫的，並且該單一程式碼，在所有 Mozilla 平台上都支援。
分離介面呈現與程式流程 大部分網頁應用程式沒落的主因就是，把使用者介面跟程式流程緊緊的結合在一起了。這在一個團隊的環境中是個頗為難的問題，因為這兩部分所需的技能通常是分散在不同的人身上。

XUL 很清楚地分離出應用程式的各個組成︰程式流程 ("content" 以 XUL、XBL 與 JavaScript 組成)、外觀 ("skin" 以 CSS 和圖像組成)、與特定語言的文字標籤 ("locale" 以 DTD 以及在 .properties 檔案中的對應字串)。XUL 應用程式的佈局與外觀可以自由地改變，獨立程式與流程之外。甚至，應用程式可以本地化為任何語言或地區，完全獨立於程式流程或外觀。

對應用程式作各種分離所得的結果是︰程式設計師可以很容易地維護程式，設計師可以輕鬆地變更設計樣式，而各個語言的翻譯人員也可以自行完成翻譯工作。這樣子獨立的工作流程，相較於以 HTML 為基礎的應用程式更容易協同工作，也減少了整個系統在穩定性與品質上的衝擊。
輕鬆自訂、本地化、打品牌 另一個由分離程式流程，介面呈現和語言文字所直接造成的特點，即是不同的使用者或使用群可以很容易的修改成所需要的樣子。

程式開發人員可以只維護應用程式的主要程式碼，然後藉由使用不同的外觀介面 (skin) 來自訂圖示與品牌觀感給他們不同的顧客群。一個以英文介面撰寫與開發的應用程式，可以被翻譯成法文給相同需求的顧客使用。當這些改變被廣泛地使用在這個應用程式的時候，他們也可以從程式流程與介面呈現之中獨立出來，來分享給所有的自訂版本。
+

支援技術

+

這裡有一些 Mozilla 所用來支援 XUL 撰寫跨平台網頁應用程式的技術。

+ +
XBL eXtensible Bindings Language (XBL) 是一種標記語言 (markup language)，定義了新的物件元素以及給 XUL 構件 (widget) 的 "bindings"。藉由 XBL，開發人員可以為 XUL 構件定義新的內容，為 XUL 構件添加事件處理，加入新的介面屬性與方法。事實上，XBL 將使得開發人員得以利用自訂現有的標籤 (tag) 或是新增他們所需要的標籤來擴充 XUL。

藉由使用 XBL，開發人員可以輕易地建構出所想要的使用者介面物件，如︰進度表、別緻的彈出式選單、甚至是工具列或搜尋表單。這些自訂物件可以在指定標籤與其屬性之後，使用在各個 XUL 應用程式當中。
Overlays Overlay 是用來描述使用介面之額外內容的 XUL 檔案。他們是一種增添使用介面的通用機制，用以增加額外的元件，覆蓋掉 XUL 檔案中不再支援的使用者介面，並且可以重新利用使用者介面當中的一些片段。

Overlay 對於自訂與擴充現有應用程式而言是個很強大的機制，因為他們是以兩種相關但卻又幾乎完全不同的方式在運作著。某種程度上看來，Overlay 其他語言所謂的〝引入(include)〞檔案，因為一個應用程式可能指定在其定義中引入一個 Overlay。但是 Overlay 也可以只用於外觀上，使得設計人員可以在某個應用程式上頭使用 Overlay，而不需要改變其原始程式。

在實作上，這使得開發人員只需對其應用程式維護一組程式碼，然後再為客戶應用各自自訂的外型，或是引入特別的功能，而這些都完全獨立於主程式碼。這導致整個解決方案的簡化，與降低維護成本。

Overlay 對於那些想要為 Mozilla 增添新功能但又希望保有著作權的軟體開發人員而言還有個特點。這兩種執照聲明︰Netscape Public License (NPL) 和 Mozilla Public License (MPL) 都要求那些有對原始程式 (Mozilla 所提供的那些原始程式碼) 做過修改的開發人員，要釋放出他們變更之後的程式碼給他們的顧客。Overlay 可以在變更著作權的情況下用來為 Mozilla 增添新的功能，而不會污染了最原始的開放原始程式碼。
XPCOM/XPConnect XPCOM 與 XPConnect 都是加強技術，將外部函數庫與 XUL 應用程式整合在一起。

XPCOM，代表的是跨平台組成物件模型 (Cross Platform Component Object Model)，是個用來撰寫跨平台與軟體模組化的一個架構。XPCOM 的組成元件可以用 C、C++ 和 JavaScript 來撰寫，並且可以在這些環境下來開發︰C、C++、JavaScript、Python、與 Perl 擴充集。

XPConnect 這個技術是用來製造出簡單的 XPCOM 與 JavaScript 之間的溝通。XPConnect 允許 JavaScript 物件正大光明地存取與運用 XPCOM 物件。他也讓 JavaScript 物件可以表示成 XPCOM 相容介面以供 XPCOM 物件呼叫使用。

將兩者合在一起，XPCOM 和 XPConnect 使得開發人員可以設計那些需要使用編譯式語言的效能或是存取作業系統等級的 XUL 應用程式。
XPInstall XPInstall，Mozilla 的跨平台安裝技術，提供了一個標準的方式將 XUL 應用程式的各個元件包裝成一個安裝檔案，來讓 Mozilla 可以下載並且執行之。

XPInstall 讓使用者可以毫不費力地從網際網路或是公司主機來安裝新的 XUL 應用程式。要安裝一個新的應用程式，使用者只要在網頁上或是電子郵件訊息中的超連結點一下滑鼠，然後在安裝對話方塊中允許安裝新的應用程式即可。
+

個案研討: A Mozilla Calendar Application

+

這個小型的個案研討將敘述 OEone 公司 (http://www.oeone.com) 如何將他的 Calendar 應用程式整合成為 Mozilla 的核心產品. Calendar 包含了 XUL 前端使用介面與以 C 寫成的 XPCOM 元件函式庫 libical , 該函式庫主要是供日期運算以及行事曆資料的儲存. 原本 Calendar 只有在 Linux 上開發, 但是都會成功地在一週之內移植到 Macintosh 和 Windows 平台上.

+

XUL 提供了許多的使用者介面元件. Calendar 的使用者介面完完全全都是用 XUL 所完成的, JavaScript? 還有 CSS, 都可以證明這樣的開發平台所帶來的強大與彈性. 他使用了簡單的 XUL 元件, 例如 boxes, grids, 和 stacks 來構成週, 日, 和月的瀏覽介面. 一開始 Calendar 還沒有利用到 XBL, 因為開發人員還沒完全清楚地掌握這整個開發技術. 但是 Calendar 的未來計畫已經包含了要將這些使用者介面的元件轉換成 XBL widgets 來簡化開發工作.

+

XPCOM/XPConnect 讓整合現有程式碼成為可能. 一個擁有完整行事曆功能的開放原始碼函式庫, libical (http://www.softwarestudio.org/libical/), 被 Calendar 專案所採用. Libical 以開放原始碼的方式實做了 IETF 的 iCalendar 行事曆與排程協定. (RFC 2445, 2446, 及 2447). 他有 iCal 元件並提供了 C API 來操作這些元件的屬性, 參數以及其子元件. 這個函式庫藉由撰寫一個 XPCOM wrapper 來整合操作其使用介面. 為了增進應用程式的效能, 也將程式從 JavaScript 轉移成 XPCOM 元件.

+

外觀呈現與程式寫作的分離, 修改起來超有彈性. 原本的使用者介面使用了大量的圖形檔案來呈現月和週的顯示. 而在開發人員學習了更多關於 XUL 的細節之後, 改用一些較為精巧的元件來呈現這個使用介面. 這不僅加快了顯示的速度, 也節省了許多記憶體與磁碟存取的資源. 他們幾乎重寫整個顯示月和週的使用者介面, 但對於主程式方面則絲毫不受影響, 不需要做任何的改變.

+

轉移 XUL 的應用程式到其他作業平台, 壓根兒不重要. Calendar 原本是個 Linux 上的應用程式, 也沒想過要轉移到其他平台上面去. 但是當原來的開發者 (OEone Corporation) 將原始程式碼貢獻給 Mozilla 專案的時候, Calendar 就必須要想辦法轉移到 Windows 和 Macintosh 的平台上面去. XUL 應用程式的使用者介面不用做任何平台轉移的修改, 因為他可以幾乎不做任何變更就可以在這兩個新的平台上運作. 相類似地, 因為使用者介面是用 JavaScript 寫成的, 互動操作方面的程式也不需要做修改, 不過, 因為 libical 函式庫是由 C 所寫成的, 所以比較需要做修改, 才能轉移到其他平台上面去使用.

+

很幸運地, 現有的 libical 函式庫已經有 Macintosh 平台上的版本可以用了, 藉由 XPCOM 這個跨平台的基石, 在 Macintosh 上的行事曆在幾天之內就完成移植了. 可是那時候還沒有 Win32 上面的版本可以直接拿來用, 所以開發人員需要把 libical 移植到 Windows 平台上面來. 不到一個星期, 這項工作也完成了, 因此 Mozilla 可以在這三個平台上使用行事曆了: Linux, Macintosh, 和 Windows.

+

XPInstall 對於開發者和使用者都很方便. Calendar 沒有被包含在 Mozilla 1.0 裡面一起發行, 因此沒有被當成標準配備而包含在固定的 nightly release builds 裡面. 對於有能力自行編譯 Mozilla 的開發人員而言, 他們可以自己設定相關的環境變數, 並且自己編譯 Calendar 來使用. 但是對於許多想要試看看 Calendar 的 Mozilla 使用者來說, 編譯這件事實在是遙不可及. 但是藉由 XPInstall, 開發者就可以很輕易地包裝各個版本的 Calendar, 然後只要在網路上點擊一個連結就可以直接進行安裝.

+

結論

+

Mozilla, 那出色的 XUL, 使用與 desktop 應用程式相同且豐富的使用者介面與使用體驗, 為開發跨平台的應用程式帶來令人讚嘆的全心體驗. 對於使用 W3C 標準來設計 web 應用程式的設計師們, 可以輕鬆地利用以往的經驗直接轉換到 desktop 應用程式.

+

在 web 成為散佈應用程式供使用者在不同電腦上使用的標準之前, 這個跨平台的問題需要藉由 客戶端-伺服端 (client-server) 的工具來解決. 但這總是會有版權的問題, 開發人員需要支付一筆可觀的金額來購買執行程式時所需要之函式庫的版權, 也同時被廠商給綁住了. Mozilla 為這些跨平台的工具, 提供了相同價值觀但卻是使用開放原始碼版權的選擇.

+

身為快速成長的跨平台技術, XUL 可以填滿一些有趣的技術空缺, 例如那些透過網路存取分散式物件的 Java J2EE 和 Microsoft .Net. 動態的應用程式搭配可以自由變換的使用者介面表達, 這都是依循標準, 具有擴充性, 而且可以很方便的透過網際網路來散播.

+

XUL 模糊了 desktop 和 web 應用程式的分界, 因為他在這兩個世界裡面都有良好的根基. 將 web 應用程式轉換成 XUL 將獲得許多好處, 可以有高度的介面彈性, 在各種支援的平台上擁有一致的操作環境, 而且仍然可以存取你原有的資源, 例如共享的函式庫, 以及本地端的檔案系統.

+

不論你是需要將現有的網頁應用程式轉移到 desktop 而尋求可以讓你輕鬆移轉到多重平台的技術, 或是將你的勁酷功能整合進瀏覽器, XUL 都會是個很值得的選擇.

+

Reference Material

+
  1. XUL Planet - Samples, Tutorials and Language-References to XUL and XBL http://www.xulplanet.com/
  2. Introduction to a XUL Document, Dan Matejka <danm@netscape.com> http://www.mozilla.org/xpfe/xptoolkit/xulintro.html
  3. XBL - Extensible Binding Language 1.0, David Hyatt <hyatt@netscape.com> http://www.mozilla.org/projects/xbl/xbl.html
  4. XBL - XML Binding Language (W3C Note), David Hyatt < hyatt@netscape.com> http://www.w3.org/TR/xbl/
  5. XUL Overlays, Ian Oeschger <oeschger@netscape.com> and David Hyatt <hyatt@netscape.com> http://www.mozilla.org/xpfe/xptoolkit/overlays.html
  6. XPCOM Part 1: An introduction to XPCOM, Rick Parrish <rfmobile@swbell.net> http://www-106.ibm.com/developerwork.../co-xpcom.html
  7. XPConnect (Scriptable Components), John Bandhauer <jband@netscape.com> http://www.mozilla.org/scriptable/
  8. 為 Mozilla 建立新的套件(Package), Ian Oeschger <oeschger@netscape.com> http://www.mozilla.org/docs/xul/xuln..._packages.html
  9. Mozilla Calendar 專案網站, 由 Mike Potter 所維護 <mikep@oeone.com> http://www.mozilla.org/projects/calendar/
    10. +
+
+

原始文件資訊

+ +

翻譯文件資訊

+ +
+

zh_tw:The Joy of XUL

+ +

{{ languages( { "en": "en/The_Joy_of_XUL", "fr": "fr/Les_joies_de_XUL", "ja": "ja/The_Joy_of_XUL", "pl": "pl/Zabawa_j\u0119zykiem_XUL" } ) }}

diff --git a/files/zh-tw/archive/mozilla/xul/xul_reference/index.html b/files/zh-tw/archive/mozilla/xul/xul_reference/index.html new file mode 100644 index 0000000000..337bb2938a --- /dev/null +++ b/files/zh-tw/archive/mozilla/xul/xul_reference/index.html @@ -0,0 +1,344 @@ +--- +title: XUL 參考文件 +slug: Archive/Mozilla/XUL/XUL_Reference +tags: + - XUL +translation_of: Archive/Mozilla/XUL/XUL_Reference +--- +

« XUL Reference «

+ + + + + + + + + + + + +
全部 XUL 元件 (按字母排序)
+

action
+ arrowscrollbox
+ assign
+ bbox
+ binding
+ bindings
+ box
+ broadcaster
+ broadcasterset
+ button
+ browser
+ checkbox
+ caption
+ colorpicker
+ column
+ columns
+ commandset
+ command
+ conditions
+ content
+ datepicker
+ deck
+ description
+ dialog
+ dialogheader
+ dropmarker
+ editor
+ grid
+ grippy
+ groupbox
+ hbox
+ iframe
+ image
+ key
+ keyset
+ label
+ listbox
+ listcell
+ listcol
+ listcols
+ listhead
+ listheader
+ listitem

+ 		+

member
+ menu
+ menubar
+ menuitem
+ menulist
+ menupopup
+ menuseparator
+ notification
+ notificationbox
+ observes
+ overlay
+ page
+ panel
+ param
+ popupset
+ preference
+ preferences
+ prefpane
+ prefwindow
+ progressmeter
+ query
+ queryset
+ radio
+ radiogroup
+ resizer
+ richlistbox
+ richlistitem
+ row
+ rows
+ rule
+ scale
+ script
+ scrollbar
+ scrollbox
+ scrollcorner
+ separator
+ spacer
+ spinbuttons
+ splitter
+ stack
+ statusbar

+ 		+

statusbarpanel
+ stringbundle
+ stringbundleset
+ tab
+ tabbrowser (從 Firefox 3/Gecko 1.9 開始支援)
+ tabbox
+ tabpanel
+ tabpanels
+ tabs
+ template
+ textnode
+ textbox
+ textbox (Firefox autocomplete)
+ textbox (Mozilla autocomplete)
+ timepicker
+ titlebar
+ toolbar
+ toolbarbutton
+ toolbargrippy
+ toolbaritem
+ toolbarpalette
+ toolbarseparator
+ toolbarset
+ toolbarspacer
+ toolbarspring
+ toolbox
+ tooltip
+ tree
+ treecell
+ treechildren
+ treecol
+ treecols
+ treeitem
+ treerow
+ treeseparator
+ triple
+ vbox
+ where
+ window
+ wizard
+ wizardpage

+
+ +

XUL 參考文件

+ +

« XUL Reference «

+ + + + + + + + + + + + +
XUL 元件 (按分類)
+

WINDOWS

+ +

dialog
+ overlay
+ page
+ window
+ wizard
+ wizardpage
+ preference
+ preferences
+ prefpane
+ prefwindow

+ +

WINDOW STRUCTURE

+ +

browser
+ tabbrowser
+ editor
+ iframe
+ titlebar
+ resizer
+ statusbar
+ statusbarpanel
+ dialogheader
+ notification
+ notificationbox

+ +

MENUS AND POPUPS

+ +

menubar
+ menu
+ menuitem
+ menuseparator
+ menupopup
+ panel
+ tooltip
+ popupset

+ +

TOOLBARS

+ +

toolbar
+ toolbarbutton
+ toolbargrippy
+ toolbaritem
+ toolbarpalette
+ toolbarseparator
+ toolbarset
+ toolbarspacer
+ toolbarspring
+ toolbox

+ +

TABS AND GROUPING

+ +

tabbox
+ tabs
+ tab
+ tabpanels
+ tabpanel
+ groupbox
+ caption
+ separator
+ spacer

+ 		+

CONTROLS

+ +

button
+ checkbox
+ colorpicker
+ datepicker
+ menulist
+ progressmeter
+ radio
+ radiogroup
+ scale
+ splitter
+ textbox
+ textbox (Firefox autocomplete)
+ textbox (Mozilla autocomplete)
+ timepicker

+ +

TEXT AND IMAGES

+ +

description
+ label
+ image

+ +

LISTS

+ +

listbox
+ listitem
+ listcell
+ listcol
+ listcols
+ listhead
+ listheader
+ richlistbox
+ richlistitem

+ +

TREES

+ +

tree
+ treecell
+ treechildren
+ treecol
+ treecols
+ treeitem
+ treerow
+ treeseparator

+ +

 

+ 		+

LAYOUT

+ +

box
+ hbox
+ vbox
+ bbox
+ deck
+ stack
+ grid
+ columns
+ column
+ rows
+ row
+ scrollbox

+ +

TEMPLATES

+ +

action
+ assign
+ binding
+ bindings
+ conditions
+ content
+ member
+ param
+ query
+ queryset
+ rule
+ template
+ textnode
+ triple
+ where

+ +

SCRIPTING

+ +

script
+ commandset
+ command
+ broadcaster
+ broadcasterset
+ observes
+ key
+ keyset
+ stringbundle
+ stringbundleset

+ +

HELPER ELEMENTS

+ +

arrowscrollbox
+ dropmarker
+ grippy
+ scrollbar
+ scrollcorner
+ spinbuttons

+
+ +

其他 XUL 列表

+ + diff --git a/files/zh-tw/archive/mozilla/xulrunner/index.html b/files/zh-tw/archive/mozilla/xulrunner/index.html new file mode 100644 index 0000000000..f2e5e0b75c --- /dev/null +++ b/files/zh-tw/archive/mozilla/xulrunner/index.html @@ -0,0 +1,88 @@ +--- +title: XULRunner +slug: Archive/Mozilla/XULRunner +tags: + - NeedsTranslation + - NeedsUpdate + - TopicStub + - XUL + - XULRunner +translation_of: Archive/Mozilla/XULRunner +--- +
Getting Started with XULRunner
+A short introduction to XULRunner.
+ +
XULRunner is a Mozilla runtime package that can be used to bootstrap XUL+XPCOM applications that are as rich as Firefox and Thunderbird. It provides mechanisms for installing, upgrading, and uninstalling these applications. XULRunner also provides libxul, a solution which allows the embedding of Mozilla technologies in other projects and products.
+ + + + + + + + +
+

Releases

+ +
+

Until version 41, XULRunner could be downloaded from ftp.mozilla.org.

+ +

Firefox (from version 3) ships with a private XULRunner package, which can run any compatible XULRunner application using the -app switch: firefox -app application.ini is equivalent to xulrunner -app application.ini

+ +

Older builds are also available.

+
+ +

Overview

+ + + +

Documentation

+ +
+
Getting Started with XULRunner
+
Short tutorial on building desktop applications with XULRunner.
+
XUL Tutorial
+
Once you have a working XULRunner application, use the XUL tutorial to expand it into a fantastic XUL application.
+
XULRunner tips
+
A collection of tips for working with XULRunner.
+
Deploying XULRunner
+
An introduction on how to package your application with XULRunner.
+
XULRunner Hall of Fame
+
Tracks all available applications based on XULRunner.
+
Build Documentation
+
Learn how to get the source and build it.
+
Debug Documentation
+
Steps to configure Venkman to debug your App
+
XULRunner Guide
+
A fairly complete, but outdated, introduction and tutorial for XULRunner which collates much of the documentation found here.
+
+ +

View all...

+ 		+

Community

+ + + + + + + +

See also

+ + +
+ +

 

diff --git a/files/zh-tw/archive/mozilla/xulrunner/xulrunner_tips/index.html b/files/zh-tw/archive/mozilla/xulrunner/xulrunner_tips/index.html new file mode 100644 index 0000000000..c51ae6a0ee --- /dev/null +++ b/files/zh-tw/archive/mozilla/xulrunner/xulrunner_tips/index.html @@ -0,0 +1,213 @@ +--- +title: XULRunner秘技 +slug: Archive/Mozilla/XULRunner/XULRunner_tips +translation_of: Archive/Mozilla/XULRunner/Tips +--- +

XULRunner Frequently Asked Questions. Work in progress.

+

Extension Manager

+

To be able to install any extensions, you first need to enable the Extension Manager in application.ini. XULRunner 1.8.0 does not load extensions from the application directory; only the XULRunner directory and the user profile directory are checked. However, it seems that with XULRunner 1.9 the XULRunner directory is ignored, while the profile and application directories are checked. The following prefs must also be set to make the XPInstall dialog, extension manager, and theme manager work:

+
pref("xpinstall.dialog.confirm", "chrome://mozapps/content/xpinstall/xpinstallConfirm.xul");
+pref("xpinstall.dialog.progress.skin", "chrome://mozapps/content/extensions/extensions.xul?type=themes");
+pref("xpinstall.dialog.progress.chrome", "chrome://mozapps/content/extensions/extensions.xul?type=extensions");
+pref("xpinstall.dialog.progress.type.skin", "Extension:Manager-themes");
+pref("xpinstall.dialog.progress.type.chrome", "Extension:Manager-extensions");
+pref("extensions.update.enabled", true);
+pref("extensions.update.interval", 86400);
+pref("extensions.dss.enabled", false);
+pref("extensions.dss.switchPending", false);
+pref("extensions.ignoreMTimeChanges", false);
+pref("extensions.logging.enabled", false);
+pref("general.skins.selectedSkin", "classic/1.0");
+// NB these point at AMO
+pref("extensions.update.url", "chrome://mozapps/locale/extensions/extensions.properties");
+pref("extensions.getMoreExtensionsURL", "chrome://mozapps/locale/extensions/extensions.properties");
+pref("extensions.getMoreThemesURL", "chrome://mozapps/locale/extensions/extensions.properties");
+
+

If your application is based on Gecko 2.0, you need to register a component through the new component registration because the extension manager uses FUEL, namely Application.restart(), to restart your xulrunner-based application after any change (installation, removal, enabling, disabling) in the extensions' list:

+
    +
  1. copy files fuelApplication.js and fuelApplication.manifest from browser/fuel/src for instance into your components/ directory
    2. +
  2. tweak the line #include ../../../toolkit/components/exthelper/extApplication.js in your copy of fuelApplication.js as needed
    3. +
  3. make sure to declare the FUEL module and the two files in your components/Makefile.in as in browser/fuel/src/Makefile.in
    4. +
  4. rebuild...
    5. +
+

Useful Chrome URLs

+

Most of these require branding.

+ + + + + + + + + + + + + + + + + + + + + + + + + + + + +
WindowURLWindow Type
Extension Managerchrome://mozapps/content/extensions/extensions.xul?type=extensionsExtension:Manager-extensions
Theme Managerchrome://mozapps/content/extensions/extensions.xul?type=themesExtension:Manager-themes
JavaScript Consolechrome://global/content/console.xulglobal:console
about:configchrome://global/content/config.xul  
+

Developer Extensions

+

Venkman

+ +

DOM Inspector

+

To add DOM Inspector 2.0.* to your XULRunner 1.9.0.* application follow these steps:

+ +
content  inspector                       jar:inspector.jar!/content/inspector/ xpcnativewrappers=no
+locale   inspector           en-US       jar:inspector.jar!/locale/en-US/inspector/
+skin     inspector           modern/1.0  jar:inspector.jar!/skin/modern/inspector/
+skin     inspector           classic/1.0 jar:inspector.jar!/skin/classic/inspector/
+
+overlay  chrome://inspector/content/popupOverlay.xul   chrome://inspector/content/viewers/dom/popupOverlay.xul
+overlay  chrome://inspector/content/commandOverlay.xul chrome://inspector/content/viewers/styleRules/commandOverlay.xul
+overlay  chrome://inspector/content/keysetOverlay.xul  chrome://inspector/content/viewers/dom/keysetOverlay.xul
+overlay  chrome://inspector/content/popupOverlay.xul   chrome://inspector/content/viewers/styleRules/popupOverlay.xul
+overlay  chrome://inspector/content/commandOverlay.xul chrome://inspector/content/viewers/dom/commandOverlay.xul
+
+

To launch DOM Inspector in your application, you need to open its main window, with a command like this:

+
window.open("chrome://inspector/content/inspector.xul", "", "chrome");
+
+

Alternatively, the DOM Inspector may also be added as an extension:

+
    +
  1. (if you already have inspector installed for another application you can skip to the next step)
    + Follow the instructions above through "Unzip the package."
    2. +
  2. Create a file in the extensions directory of your application with the same name as the DOM Inspector ID (inspector@mozilla.org) containing one line of text -- the exact path to the root directory of DOM inspector (where the install.rdf is) like this one: + 
    /home/username/.mozilla/firefox/numbersandletters/extensions/inspector@mozilla.org/
    +
    3. +
  3. Now create a javascript file with the following code and include it in the main window of your application: + 
    function startDOMi()
+{
+  // Load the Window DataSource so that browser windows opened subsequent to DOM
+  // Inspector show up in the DOM Inspector's window list.
+  var windowDS = Components.classes["@mozilla.org/rdf/datasource;1?name=window-mediator"]
+                                   .getService(Components.interfaces.nsIWindowDataSource);
+  var tmpNameSpace = {};
+  var sl = Components.classes["@mozilla.org/moz/jssubscript-loader;1"]
+    .createInstance(Components.interfaces.mozIJSSubScriptLoader);
+  sl.loadSubScript("chrome://inspector/content/hooks.js", tmpNameSpace);
+  tmpNameSpace.inspectDOMDocument(document);
+}
+
    +
    4. +
  4. Now create a hook in your application window to start DOM Inspector, like this one: + 
    <button label="Start Inpector" oncommand="startDOMi()"/>
    +
    5. +
  5. Start your application and DOM Inspector will be installed.
    6. +
+

Note: I use this method of installing extensions into all of my Mozilla applications. This way I have one directory where I keep all my Mozilla extensions, and each application (Firefox, Thunderbird) simply contains a few small, one line files pointing to the location of the extensions. (I keep them in source control to be sure I can maintain compatibility)

+

Component Viewer

+

Need custom build, first of all. What else?

+

Extension Developer's Extension

+

Extension Developer's Extension is a useful tool, featuring Live XUL Editor and JavaScript Shell. To install the extension into your application you'll need to hack its install.rdf (see above). You'll probably also want to create menuitems that let you open the JS Shell and other tools provided by the extension.

+

Branding

+

Branding is a chrome package containing product-specific information (e.g. the product name, vendor, and logo). Some XULRunner components (in particular, the Extension Manager) depend on branding, in the sense that they expect to find certain strings in chrome://branding/locale/brand.dtd and chrome://branding/locale/brand.properties. In order to satisfy these dependencies, you can save Firefox's brand.dtd/brand.properties to chrome/locale/branding folder, modify them appropriately, and register a locale provider for branding by adding the following line to your chrome manifest:

+
locale branding en-US chrome/locale/branding/
+
+

The location you put the branding files in doesn't matter, as long as you register it appropriately in the manifest. In addition, a branding content package must be registered to include the application logos:

+
content branding chrome/branding/
+
+

3 files should be provided in this folder: about.png, icon48.png and icon64.png. See Firefox for example.

+

Making Windows display correct application name and icon when buttons are grouped

+

By default, the task bar on Windows might group windows belonging to the same process into one button to save space. This button is usually called "xulrunner.exe" and has XULRunner's icon. There are two approaches to display the branding of your application instead:

+ +

Reading command line arguments

+

See Chrome: Command Line. Command line arguments are handled via nsICommandLineHandler, as usual.

+

Preferences needed for file download dialogs

+

To use the unknown-content-type and file-downloads dialogs from a <browser> element, you need to add the following prefs:

+
pref("browser.download.useDownloadDir", true);
+pref("browser.download.folderList", 0);
+pref("browser.download.manager.showAlertOnComplete", true);
+pref("browser.download.manager.showAlertInterval", 2000);
+pref("browser.download.manager.retention", 2);
+pref("browser.download.manager.showWhenStarting", true);
+pref("browser.download.manager.useWindow", true);
+pref("browser.download.manager.closeWhenDone", true);
+pref("browser.download.manager.openDelay", 0);
+pref("browser.download.manager.focusWhenStarting", false);
+pref("browser.download.manager.flashCount", 2);
+//
+pref("alerts.slideIncrement", 1);
+pref("alerts.slideIncrementTime", 10);
+pref("alerts.totalOpenTime", 4000);
+pref("alerts.height", 50);
+
+

If you are missing preferences that a dialog requires, you will get the following errors:

+
Component returned failure code: 0x8000ffff (NS_ERROR_UNEXPECTED) [nsIPrefBranch.getBoolPref]
+
+Error: dialog has no properties
+Source File: chrome://mozapps/content/downloads/u...ontentType.xul
+Line: 1
+
+

Enabling Password Manager

+

These preferences seem to be the default in Firefox, however, they are missing in XULRunner. Without these settings Password Manager will not store login details.

+
pref("signon.rememberSignons", true);
+pref("signon.expireMasterPassword", false);
+pref("signon.SignonFileName", "signons.txt");
+
+

You also need to get an instance of the login manager service, which internally initializes the system:

+
Components.classes["@mozilla.org/login-manager;1"].getService(Components.interfaces.nsILoginManager);
+
+

Using Firefox 3 to run XULRunner applications

+

Firefox 3 contains the XULRunner runtime. It has an -app command-line switch to run a specified XUL application instead of starting the browser.

+

On Windows:

+
  firefox.exe -app path\to\application.ini
+
+

On Linux:

+
  firefox -app path/to/application.ini
+

On the Mac:

+
  /Applications/Firefox.app/Contents/MacOS/firefox-bin -app /path/to/application.ini
+
+

Note that at least on the Mac, you need to use a full path. Partial paths don't seem to work.

+

Troubleshooting

+

Window title missing

+

If the title of your XUL <window> is blank, even though you specified a title attribute, make sure the extension on your XUL file is .xul rather than .xml

+

Default Theme

+

To create a default theme you need to create a folder in the extensions folder with an install.rdf in it.  As of Oct. 2008, the folder needs to have the same name as the one in Firefox 3.0. 

+

\MyApp\Extensions\{972ce4c6-7e08-4474-a285-3208198ce6fd}\install.rdf

+

It should also have an <em:internalName>classic/1.0</em:internalName> as that is the default theme in Firefox.

+

{{ languages( { "ja": "ja/XULRunner_tips", "fr": "fr/Astuces_XULRunner" } ) }}

-- cgit v1.2.3-54-g00ecf