diff options
Diffstat (limited to 'files/zh-tw/tools/firefox_os_1.1_simulator/index.html')
| -rw-r--r-- | files/zh-tw/tools/firefox_os_1.1_simulator/index.html | 240 |
1 files changed, 240 insertions, 0 deletions
diff --git a/files/zh-tw/tools/firefox_os_1.1_simulator/index.html b/files/zh-tw/tools/firefox_os_1.1_simulator/index.html new file mode 100644 index 0000000000..08483cbb3f --- /dev/null +++ b/files/zh-tw/tools/firefox_os_1.1_simulator/index.html @@ -0,0 +1,240 @@ +--- +title: Firefox OS 1.1 Simulator +slug: Tools/Firefox_OS_1.1_Simulator +translation_of: Tools/Firefox_OS_1.1_Simulator +--- +<div id="doc-content"> + <div class="page-content boxed"> + <div class="note"> + <p>本頁將說明「舊版」的 Firefox OS 模擬器 (Firefox OS Simulator)。只有在開發 Firefox 1.1 所適用的 App 時，才使用 1.1 版模擬器。且本版模擬器僅能安裝於 Firefox 24 或 Firefox 25 之上。</p> + <p>如果要針對 Firefox OS 1.2 或更高版本開發 App，則必須<a href="https://developer.mozilla.org/zh-TW/docs/Mozilla/Firefox_OS/Using_the_App_Manager">使用「應用程式管理員 (App Manager)」</a>。</p> + <p>若需要任何協助，請透過 <a href="https://lists.mozilla.org/listinfo/dev-developer-tools">dev-developer-tools 郵件群組</a>或 <a href="irc://irc.mozilla.org/#devtools">#devtools on irc.mozilla.org</a> 發問。</p> + </div> + <p>Firefox OS 模擬器 (Firefox OS Simulator) 附加元件，可讓你在桌機上測試自己的 <a href="https://developer.mozilla.org/en-US/docs/Apps" title="/en-US/docs/Apps">Firefox OS App</a>。若與實際裝置相較，模擬器可協助開發者順利完成「撰寫─測試─除錯」的程序，而且你還不用真的弄到實際設備就能夠測試 App。</p> + <p>此附加元件基本上包含：</p> + <ul> + <li><strong>模擬器：</strong>其內有 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client" title="/en-US/docs/Mozilla/Firefox_OS/Using_the_B2G_desktop_client">Firefox OS Desktop Client</a>，屬於 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS" title="/en-US/docs/Mozilla/Firefox_OS">Firefox OS</a> 較高層級的版本，可於桌機中執行。模擬器所具備的某些<a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Simulator-toolbar" title="#Simulator-toolbar">附加模擬功能</a>，甚至是標準 Firefox OS 桌面版所沒有的。</li> + <li><strong>Dashboard：</strong>此為 Firefox 瀏覽器所管理的工具，可用以啟動/停止模擬器，並可安裝、除錯、解除安裝模擬器所執行的 App。Dashboard 亦可協助將 App 送入實際裝置，針對常見問題而檢查 App 的 manifest 檔案。.</li> + </ul> + <p>下方截圖則是以模擬器所進行的除錯作業。</p> + <p>「Dashboard」即於右上的 Firefox 分頁中執行。我們在這裡新增了「Where am I?」的封裝式 (Packaged) App。左上方就是模擬器正執行的 App。這裡同時也連上了除錯工具，就位在視窗底端。你也可以看到我們設定了 App 的中斷點。</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5513/Simulator-overview-4.0.png"></p> + <p>本篇指南涵蓋下列主旨：</p> + <ul> + <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Installing" title="#Installing">模擬器附加元件的安裝方式</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Adding-updating-removing" title="#Adding-updating-removing">新增、移除、更新 App 的方式</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Manifest-validation" title="#Manifest-validation">檢驗 manifest 檔案</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Running-the-Simulator" title="#Running-the-Simulator">模擬器執行方式</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Attaching-developer-tools" title="#Attaching-developer-tools">應如何連接開發者工具 (如 JS debugger) 與模擬器所執行的 App</a></li> + <li><a href="https://developer.mozilla.org/zh-TW/docs/Tools/Firefox_OS_Simulator$edit#Simulator-receipts" title="#Simulator-receipts">應如何取得付費 App 的測試用收據</a></li> + <li><a href="https://developer.mozilla.org/zh-TW/docs/Tools/Firefox_OS_Simulator$edit#Push-to-device" title="#Push-to-device">應如何將 App 送入已連線的裝置</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Limitations" title="#Limitations">與實際 Firefox OS 裝置相較，模擬器的限制為何</a></li> + </ul> + <div class="note"> + 若要用模擬器對實際的 Apps 進行除錯，請參閱《<a href="https://developer.mozilla.org/zh-TW/docs/Tools/Firefox_OS_Simulator/Simulator_Walkthrough" title="/en-US/docs/Tools/Firefox_OS_Simulator/Simulator_Walkthrough">Firefox OS 模擬器簡易攻略</a>》頁面。</div> + <h2 id="安裝「Firefox_OS_Simulator」附加元件"><a name="Installing">安裝「Firefox OS Simulator」附加元件</a></h2> + <p>此模擬器軟體已封裝並發佈為 Firefox 的附加元件。安裝步驟為：</p> + <ol> + <li>開啟 Firefox 並前往 <a href="https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/" title="https://addons.mozilla.org/en-US/firefox/addon/firefox-os-simulator/">addons.mozilla.org 上的 Simulator 頁面</a>。</li> + <li>點選「Add to Firefox」。</li> + <li>下載附加元件完畢，系統隨即提醒你安裝。點選「立刻安裝 (Install Now)」。</li> + </ol> + <p>由於附加元件的檔案大小有所不同，Firefox 可能於安裝期間暫停數秒，並可能顯示「注意：發現容易停止回應的程式碼 (Warning: Unresponsive script)」對話框。如果出現此對話框，就點選「繼續 (Continue)」等到安裝作業結束即可。自 Firefox 27 起應該就不會再出現此問題。<br> + <br> + 一旦安裝模擬器附加元件完畢，Firefox 將定期檢查是否有更新版本，隨時保持最新版本。</p> + <p>模擬器安裝期間隨即自動開啟 Dashboard。另外只要點選「Firefox」選單 (若是 OS X 與 Linux，則為「工具」選單)，再點選「網頁開發者 (Web Developer)」→「Firefox OS Simulator」，都可再開啟 Dashboard：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5141/simulator-open-on-windows-7.png" style="margin-right: auto; margin-left: auto; display: block;"><br> + Dashboard 可讓你將 App 新增至模擬器內並執行之。看起來就像下圖：<img alt="" src="https://mdn.mozillademos.org/files/5491/dashboard-4.0.png"></p> + <h2 id="新增、移除、重新整理_App"><a name="Adding-updating-removing">新增、移除、重新整理 App</a></h2> + <h3 id="新增_App">新增 App</h3> + <p>如果要將<a href="https://developer.mozilla.org/zh-TW/docs/%E6%87%89%E7%94%A8%E7%A8%8B%E5%BC%8F-840092-dup/Packaged_apps?redirectlocale=en-US&redirectslug=Apps%2FPackaged_apps" title="/en-US/docs/Apps/Packaged_apps">封裝式 (Packaged) App</a> 新增至模擬器中，則請開啟 Dashboard，點選「Add Directory」並找到 App 的 <a href="https://developer.mozilla.org/zh-TW/docs/%E6%87%89%E7%94%A8%E7%A8%8B%E5%BC%8F/Manifest-840092-dup" title="/en-US/docs/Apps/Manifest">manifest 檔案</a>。<br> + <br> + 若要新增托管式 (Hosted) App，則於「URL for page or manifest.webapp」的文字框中輸入網址，再點選「Add URL」。如果網址指向 manifest 檔案，就會使用該 manifest 檔案；反之，則 Dashboard 將針對該網址產生 manifest 檔案。所以只要輸入網站網址，都可新增該網站作為 App。<br> + <br> + 在新增 App 時，Dashboard 將為 manifest 檔案執行一系列的測試，檢查是否有常見問題。可參閱下方 <a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Manifest-validation" title="#Manifest-validation">Manifest 檔案檢驗</a>以了解測試細節。</p> + <p>除非 manifest 檔案檢驗程序真的發現了 App 的錯誤，否則 Dashboard 均將自動於模擬器中執行你的 App。</p> + <h3 id="管理_App">管理 App</h3> + <p>一旦新增了 App，就會出現在管理程式的 App 清單中：<br> + <img alt="" src="https://mdn.mozillademos.org/files/5493/dashboard-list-apps-4.0.png"><br> + 各個項目均提供了 App 的相關資訊：</p> + <ul> + <li>App 的名稱 ─ 取自於 manifest 檔案</li> + <li>App 的類型 ─ 可能為「Packaged」、「Hosted」、「Generated」之一</li> + <li>其 manifest 檔案的連結</li> + <li>manifest 檔案檢驗的結果</li> + </ul> + <p>另外會提供 4 項指令：</p> + <ul> + <li><strong>「Refresh<strong>」：</strong></strong>在變更過 App 之後，可透過此指令更新並重新載入模擬器中的 App。此指令亦可讓 Dashboard 再次檢驗 manifest 檔案。如果變更過 App 之後卻沒有自動反應在「installed app:」中，則必須重新整理才能套用變更。</li> + <li><strong>「Connect<strong>」：</strong></strong>此指令可銜接開發工具與指定的 App。如果尚未執行 App 與模擬器，則 Dashboard 將啟動之。</li> + <li><strong>「Remove<strong>」(也就是「X」)：</strong></strong>此指令可為 Dashboard 與模擬器移除 App。只要開啟了 Dashboard 分頁，亦可取消此動作。</li> + <li><strong>「Receipt<strong>」：</strong></strong>此指令可針對付費 App 測試收據的驗證作業。在選擇了所要測試的收據類型之後，將重新安裝該 App 並包含所選類型的測試收據。</li> + </ul> + <div class="note"> + <p><strong>從模擬器視窗重新整理 App：</strong>在 App 執行時，只要透過<a href="https://developer.mozilla.org/zh-TW/docs/Tools/Firefox_OS_Simulator$edit#Simulator-menubar" title="#Simulator-menubar">選單列與相關快捷鍵</a>，即可從模擬器視窗直接更新並重新載入 App。</p> + </div> + <h3 id="檢驗_Manifest_檔案"><a name="Manifest-validation">檢驗 Manifest 檔案</a></h3> + <p>當提供 manifest 檔案時，管理程式將執行某些檢驗測試，所回報的問題可分為 3 大類：</p> + <ul> + <li>manifest 錯誤：這種問題將導致 App 無法執行。</li> + <li>manifest 警示：這種問題將導致 App 無法正確運作。</li> + <li>模擬器特定警示：目前模擬器尚未支援此 App 所使用的功能。</li> + </ul> + <p>管理程式將總結 App 所遇到的問題。可點選摘要以獲得更多詳情。</p> + <h4 id="Manifest_檔案錯誤">Manifest 檔案錯誤</h4> + <p>下列狀態均將由 Dashboard 回報為錯誤。也就是說，你必須修復之後才能在模擬器中繼續執行 App：</p> + <ul> + <li>manifest 檔案沒有必要的「name」欄位。</li> + <li>manifest 檔案為無效 JSON。</li> + <li>此 App 屬於托管式 App，但其 manifest 檔案中的<a href="https://developer.mozilla.org/zh-TW/docs/%E6%87%89%E7%94%A8%E7%A8%8B%E5%BC%8F/Manifest-840092-dup" title="/en-US/docs/Apps/Manifest#type">類型 (type)</a> 欄位為<a href="https://developer.mozilla.org/en-US/docs/Apps/Packaged_apps#Types_of_packaged_apps" title="/en-US/docs/Apps/Packaged_apps#Types_of_packaged_apps">「Privileged」或「Certified」</a>；而此 2 種類型僅限用於封裝式 App。</li> + <li>常見的 appCache 錯誤 (封裝式 App 無法使用 appCache，對 manifest 網址的請求，回傳了 HTTP 重新導向狀態或 HTTP 錯誤狀態)</li> + </ul> + <p>如果新增的 manifest 檔案缺少了「name」欄位，就會出現如下圖的結果：<br> + <img alt="" src="https://mdn.mozillademos.org/files/5495/dashboard-missing-name-4.0.png"></p> + <h4 id="Manifest_檔案警示">Manifest <strong>檔案警示</strong></h4> + <p>下列 manifest 檔案的問題，Dashboard 均將回報為警示：</p> + <ul> + <li>缺少圖示。</li> + <li>圖示低於 128 像素：提交至 Marketplace 的所有 App，其代表圖示均必須為至少 128 像素的方塊圖。</li> + <li>無法辨別「<a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a>」欄位。</li> + <li>manifest 檔案所請求的「<a href="https://developer.mozilla.org/zh-TW/docs/%E6%87%89%E7%94%A8%E7%A8%8B%E5%BC%8F/Manifest-840092-dup" title="/en-US/docs/Apps/Manifest#permissions">權限</a>」無法辨別。</li> + <li>manifest 檔案所請求的「<a href="https://developer.mozilla.org/zh-TW/docs/%E6%87%89%E7%94%A8%E7%A8%8B%E5%BC%8F/Manifest-840092-dup" title="/en-US/docs/Apps/Manifest#permissions">權限</a>」遭拒。</li> + <li>manifest 檔案所請求的「<a href="https://developer.mozilla.org/zh-TW/docs/%E6%87%89%E7%94%A8%E7%A8%8B%E5%BC%8F/Manifest-840092-dup" title="/en-US/docs/Apps/Manifest#permissions">權限</a>」無法決定其存取作業。</li> + </ul> + <h4 id="模擬器特定警示"><strong>模擬器特定警示</strong></h4> + <p>最後，針對 App 所要使用的 Firefox OS 功能，但模擬器卻尚未支援的情況，管理程式將送出警示：</p> + <ul> + <li>「<a href="https://developer.mozilla.org/en-US/docs/Apps/Manifest#type" title="/en-US/docs/Apps/Manifest#type">type</a>」欄位屬於「Certified」，但模擬器尚未完整支援 Certified App。</li> + <li>manifest 檔案請求「<a href="https://developer.mozilla.org/zh-TW/docs/%E6%87%89%E7%94%A8%E7%A8%8B%E5%BC%8F/Manifest-840092-dup" title="/en-US/docs/Apps/Manifest#permissions">權限</a>」以使用 API，但模擬器<a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Unsupported-APIs" title="#Unsupported-APIs">尚未支援</a>此 API。</li> + </ul> + <h2 id="執行模擬器"><a name="Running-the-Simulator">執行模擬器</a></h2> + <p>有 2 種方式可啟動模擬器：</p> + <ul> + <li>如果要新增、更新、移除 App，或是按下 App 輸入項旁邊的「Run」按鈕，則 Dashboard 就會在模擬器中自動執行 App。</li> + <li>如果按下 Dashboard 左側的「Stopped」按鈕，則模擬器將回到首頁畫面，讓你再瀏覽自己的 App。</li> + </ul> + <p>不論哪種方法，只要模擬器處於執行狀態，則「Stopped」按鈕會轉成綠色，且按鈕文字也會轉成「Running」。如果要停下模擬器，再按下相同按鈕即可。<br> + <br> + 模擬器將以獨立視窗顯示，而該模擬畫面將為 320x480 像素，且<a href="https://developer.mozilla.org/en-US/docs/Tools/Firefox_OS_Simulator#Simulator-toolbar" title="#Simulator-toolbar">底部工具列 (Toolbar) 將提供某些額外功能</a>。</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5505/simulator-bars.png" style="margin-right: auto; margin-left: auto; display: block;"></p> + <p>若要模擬觸控事件，只要點擊滑鼠不放再拖曳即可。所以如果在主畫面按下滑鼠並由右至左拖曳，就可以看到內建的 App 還有你自己新增的 App：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5517/simulator-homescreen.png"></p> + <h3 id="模擬器工具列"><a name="Simulator-toolbar">模擬器工具列</a></h3> + <p>在模擬器視窗底部的工具列，由左至右分別為<strong>主畫面 (Home)、畫面旋轉 (Screen Rotation)、地理位置定位 (Geolocation)</strong> 共 3 個按鈕：</p> + <ul> + <li>「<strong>主畫面</strong>」可回到主畫面 (或長按不放則可進入工作清單)。</li> + <li>「<strong>畫面旋轉</strong>」可切換裝置的橫向、直向畫面；即產生 <a href="https://developer.mozilla.org/en-US/docs/WebAPI/Managing_screen_orientation#Listening_orientation_change" title="/en-US/docs/WebAPI/Detecting_device_orientation">orientationchange</a> 事件。</li> + <li>「<strong>地理位置定位</strong>」將觸發對話框，詢問使用者是否要分享自己的地理位置。這個功能可能會套用你目前的座標，或提供自訂座標。App 可搭配 <a href="https://developer.mozilla.org/zh-TW/docs/Using_geolocation" title="/en-US/docs/WebAPI/Using_geolocation">Geolocation API</a> 而提供此功能。</li> + </ul> + <p><a href="https://mdn.mozillademos.org/files/5511/simulator-geolocation.png"><img alt="" src="https://mdn.mozillademos.org/files/5511/simulator-geolocation.png" style="width: 520px; height: 309px;"></a><a href="https://mdn.mozillademos.org/files/5519/simulator-screen-orientation.png"><img alt="" src="https://mdn.mozillademos.org/files/5519/simulator-screen-orientation.png" style="width: 500px; height: 297px;"></a></p> + <h3 id="模擬器選單列_(Menubar)"><a name="Simulator-menubar"></a>模擬器選單列 (Menubar)</h3> + <p>在頂端的選單列上即提供多項有用的指令，讓你達到更高的開發效率：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5525/simulator-menubar.png"></p> + <ul> + <li><strong>File -> Quit</strong> (<em>Ctrl/Cmd - Q</em>)：關閉模擬器</li> + <li><strong>App -> Refresh</strong> (<em>Ctrl/Cmd - R</em>)：重新整理執行中的 App</li> + </ul> + <p>若於鍵盤上使用<strong>「App Refresh」</strong> 指令快捷鍵，則開發 App 就更像是撰寫網頁一樣：</p> + <ul> + <li>更改程式碼 (並依需要而重新執行自己的程式設計工具，如 volo / yeoman / grunt)</li> + <li>按下快捷鍵，即可重新整理正於模擬器中執行的 App</li> + </ul> + <div class="note"> + <p><strong>「Refresh App and Clear Data」隱藏快捷鍵：</strong>針對模擬器為 Apps 所儲存的資料，有時若能清除相關資料更有利於開發作業。因此模擬器亦提供隱藏版的快捷鍵「Shift - Ctrl/Cmd - R」。在清除下列資料時，此快捷鍵亦可重新整理正執行中的 App：</p> + <ul> + <li> + <p>localStorage / sessionStorage</p> + </li> + <li> + <p>cookies</p> + </li> + <li> + <p>indexedDB</p> + </li> + <li> + <p>appCache</p> + </li> + </ul> + </div> + <h2 id="附掛開發者工具"><a name="Attaching-developer-tools">附掛開發者工具</a></h2> + <p>使用者可為模擬器附掛開發工具，讓 App 的除錯作業更順利。目前僅能附掛<a href="https://developer.mozilla.org/zh-TW/docs/Tools/Debugger" title="/en-US/docs/Tools/Debugger">JavaScript 除錯器 (JavaScript Debugger)</a>、<a href="https://developer.mozilla.org/en-US/docs/Tools/Web_Console" title="/en-US/docs/Tools/Web_Console">網頁主控台 (Web Console)</a>、<a href="https://developer.mozilla.org/en-US/docs/Tools/Style_Editor" title="/en-US/docs/Tools/Style_Editor">樣式編輯器 (Style Editor)</a>、<a href="https://developer.mozilla.org/en-US/docs/Tools/Profiler" title="/en-US/docs/Tools/Profiler">效能分析器 (Profiler)</a>、<a href="https://developer.mozilla.org/en-US/docs/Tools/Network_Monitor" title="/en-US/docs/Tools/Network_Monitor">網路監測器 (Network Monitor)</a>。當然，我們仍將持續支援更多<a href="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window" title="https://developer.mozilla.org/en-US/docs/Tools/DevTools_Window">開發工具</a>。</p> + <div class="geckoVersionNote"> + <p>某些工具僅能用於 Firefox 的 Beta、Aurora，或 Nightly 版本。</p> + </div> + <p>若要為模擬器附掛開發工具，則可按下任一 App 的「<strong>Connect</strong>」按鈕：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5497/connect-to-app-button.png" style="margin-right: auto; margin-left: auto; display: block;"></p> + <p>Dashboard 分頁下方隨即開啟開發者工具面板，並銜接 App：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5501/simulator-devtools-connected.png" style="margin-right: auto; margin-left: auto; display: block;"></p> + <h3 id="網頁主控台_(Web_Console)">網頁主控台 (Web Console)</h3> + <p>如果勾選了「Stopped/Running」開關下方的「Console」方塊，則執行模擬器時會開啟<a href="https://developer.mozilla.org/en-US/docs/Error_Console" title="/en-US/docs/Error_Console">錯誤主控台 (Error Console)</a>。透過這個通用的<a href="https://developer.mozilla.org/en-US/docs/DOM/console" title="/en-US/docs/DOM/console">主控台</a>物件，你的 App 均將由主控台所記錄。</p> + <h3 id="除錯器_(Debugger)">除錯器 (Debugger)</h3> + <p>透過除錯器，可針對執行中的 App 逐行檢查其 JavaScript 程式碼、管理中斷點、監看表示式，以更迅速追蹤錯誤與問題。<a href="https://developer.mozilla.org/zh-TW/docs/Tools/Debugger" title="/en-US/docs/Tools/Web_Console">進一步了解除錯器</a>。</p> + <h3 id="樣式編輯器_(Style_Editor)">樣式編輯器 (Style Editor)</h3> + <p>可檢查並編輯 App 中設定的 CSS 檔案。你所進行的變更亦將即時套用至 App；而不需再重新整理。<a href="https://developer.mozilla.org/en-US/docs/Tools/Style_Editor" title="/en-US/docs/Tools/Web_Console">進一步了解樣式編輯器</a>。</p> + <h3 id="效能分析器_(Profiler)"><strong>效能分析器 (</strong>Profiler)</h3> + <p>若銜接 App 與效能分析器，即可找出 JavaScript 程式碼耗時過長的部分。效能分析器將對目前 JavaScript 的 Call stack 定期取樣，並編寫樣本的統計資料。<a href="https://developer.mozilla.org/en-US/docs/Tools/Profiler" title="/en-US/docs/Tools/Web_Console">進一步了解效能分析器</a>。</p> + <h3 id="網路監測器_(Network_Monitor)"><strong>網路監測器 (</strong>Network Monitor)</h3> + <p>新的網路監測器提供友善介面，可針對 App 所啟動的網路請求，分析其狀態、標頭、內容、時間點等資訊。<a href="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/" title="https://hacks.mozilla.org/2013/06/network-monitor-now-in-firefox-beta/">進一步了解網路監測器</a>。</p> + <h2 id="收據_(Receipt)"><a name="Simulator-receipts"></a>收據 (Receipt)</h2> + <p>若你正開發付費 App，就應該在有效 (以加密方式簽署) 收據上，測試自己的收據驗證代碼 (此代碼將驗證使用者是否已購買了 App 或收到退款，接著通知使用者並鎖定/解鎖 App 的功能)。</p> + <p>模擬器的 Dashboard 對各個 App 均提供了「<strong>Receipts</strong>」選單，讓你可選擇「<strong>Valid</strong>」、「<strong>Invalid</strong>」、「<strong>Refunded</strong>」測試收據而安裝 App。只要選擇你想要測試的收據類型，則 Dashboard 就會從 Marketplace 收據服務中取得該類型的測試收據，並在模擬器中安裝 App：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5523/simulator-receipts-selector-4.0.png"></p> + <h2 id="直接傳輸_(Push_to_device)"><a name="Push-to-device">直接傳輸 (Push to device</a>)</h2> + <p>如果你手上已經有 Firefox OS 裝置並連上了模擬器，就可以從 Dashboard 直接將 App 送進裝置。</p> + <h3 id="連上裝置">連上裝置</h3> + <p>根據指南中的說明，就可順利將 <a href="https://developer.mozilla.org/en-US/docs/Mozilla/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop" title="/en-US/docs/Mozilla/Firefox_OS/Debugging/Connecting_a_Firefox_OS_device_to_the_desktop">Firefox OS 裝置連上桌機</a>。另請注意，模擬器附加元件已經包含了 ADB，所以你不需再次安裝。</p> + <h3 id="將_App_送入裝置">將 App 送入裝置</h3> + <p>設定完畢之後，就可透過 USB 銜接裝置與桌上型電腦。你可以看到 Dashboard 左邊出現「<strong>Device connected</strong>」的註記，而且各個 App 項目上都會出現新的「<strong>Push</strong>」指令：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5521/simulator-push2device.png"></p> + <p>按下「<strong>Push</strong>」就會把 App 安裝進 Firefox OS 裝置中。</p> + <div class="note"> + <p><strong>手動步驟：</strong></p> + <ul> + <li> + <p>一旦將 App 送入裝置之後，就必須手動關閉並重新啟動，才能取得更新內容。</p> + </li> + <li> + <p>如果你更新了 manifest 檔案 (如 App 的名稱、方向、類型、權限)，就必須重新啟動作業系統，才能讓變更生效。</p> + </li> + </ul> + </div> + <h3 id="Firefox_OS_裝置連線確認">Firefox OS <strong>裝置連線確認</strong></h3> + <p>每次只要重新啟動裝置，就必須確認裝置上的第一次「<strong>Push</strong>」請求：</p> + <p><img alt="" src="https://mdn.mozillademos.org/files/5527/device-push-confirmation.png" style="width: 320px; height: 480px;"></p> + <h3 id="Linux_上的疑難排除">Linux 上的疑難排除</h3> + <p>如果建立 udev 規則之後還是無法銜接裝置，則請參閱這個<a href="https://github.com/mozilla/r2d2b2g/issues/515" title="https://github.com/mozilla/r2d2b2g/issues/515">問題</a>。</p> + <h2 id="模擬器的限制"><a name="Limitations">模擬器的限制</a></h2> + <p>請注意，Firefox OS 模擬器仍無法提供完美的模擬作業。</p> + <h3 id="硬體限制">硬體限制</h3> + <p>模擬器除了螢幕尺寸的限制之外，也無法模擬 Firefox OS 裝置的硬體 (例如 CPU 速度或可用的記憶體容量)。</p> + <h3 id="音訊視訊編碼">音訊/視訊編碼</h3> + <p>下列編碼 (Codecs) 因硬體加速解碼而有所不同，因此尚未支援：</p> + <ul> + <li>MP3</li> + <li>AAC</li> + <li>H.264 (MP4)</li> + <li>WebM</li> + </ul> + <p>也就是說，若 App 或網站 (如 Youtube) 使用這些編碼，則模擬器將無法測試其中的視訊回播功能。</p> + <h3 id="尚未支援的_API"><a name="Unsupported-APIs">尚未支援的 API</a></h3> + <p>一般來說，因為桌上型電腦無法使用支援硬體，所以可於裝置上運作的特定 API，可能無法用於模擬器之上。我們另外針對某些 API (例如 Geolocation 地理位置定位) 建構了模擬功能，未來版本亦將新增更多模擬 API。但目前仍尚未支援下列 API。如果使用了這些 API，也只會得到錯誤的報告或結果：</p> + <ul> + <li><a href="https://developer.mozilla.org/en-US/WebAPI/WebTelephony" title="/en-US/WebAPI/WebTelephony">Telephony</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/WebSMS" title="/en-US/docs/WebAPI/WebSMS">WebSMS</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/WebBluetooth" title="/en-US/docs/WebAPI/WebBluetooth">WebBluetooth</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Using_Light_Events" title="/en-US/docs/WebAPI/Using_Light_Events">Ambient Light</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Proximity" title="/en-US/docs/WebAPI/Proximity">Proximity</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Network_Information" title="/en-US/docs/WebAPI/Network_Information">Network Information</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/Online_and_offline_events" title="/en-US/docs/Online_and_offline_events">navigator.onLine and offline events</a></li> + <li><a href="https://developer.mozilla.org/en-US/docs/WebAPI/Vibration" title="/en-US/docs/WebAPI/Vibration">Vibration</a></li> + </ul> + <h2 id="獲得協助"><a name="Simulator-help"></a>獲得協助</h2> + <p>如果你發現了任何錯誤，請<a href="https://github.com/mozilla/r2d2b2g/issues?state=open">到 GitHub 提交這些錯誤</a>。如果有任何問題，也請透過 <a href="https://lists.mozilla.org/listinfo/dev-developer-tools">dev-developer-tools 郵件群組</a>或到 <a href="irc://irc.mozilla.org/#devtools">#devtools on irc.mozilla.org</a> 上發問。</p> + <h3 id="啟動詳細資訊_(verbose)_記錄的方法"><a name="Simulator-verbose-logging"></a>啟動詳細資訊 (verbose) 記錄的方法</h3> + <p>透過 about:config 即可建立 <a href="mailto:extensions.r2d2b2g@mozilla.org.sdk.console.logLevel">extensions.r2d2b2g@mozilla.org.sdk.console.logLevel</a>，接著將之設定為整數值 0，並停用/重新啟用附加元件即可。有關模擬器作業的其他訊息，均將顯示於錯誤主控台 (Error Console) 中；或是較新版本 Firefox 的瀏覽器主控台 (Browser Console)。</p> + </div> +</div> +<div class="note"> + <p> </p> +</div> +<p> </p> |