﻿# WP7 修練 DAY 04：使用 Fiddler 收錄 WP7 上的 HTTP 封包

開發 Web 應用程式時經常會使用 [Fiddler Web Debugger](http://www.fiddler2.com/fiddler2/) 來收錄所有電腦發出與接收到的 HTTP 封包，這能夠進一步分析 HTTP 封包內容，包括 HTTP Rquest 與 HTTP Response 的 Header 與 Body 部分。而在 Windows Phone 7 應用程式，由於很有可能會使用 REST 或 SOAP 來進行資料傳輸，若能在開發時期也能收錄到這些訊息，將能更有效率的對訊息內容進行分析與偵錯，本日的修練就是跟各位講解如何讓你的「模擬器」與「實體 WP7 手機」都能透過 [Fiddler](http://www.fiddler2.com/fiddler2/) 取得 HTTP 或 HTTPS 封包。

**§ 使用 Fiddler 收錄 WP7 模擬器發出的 HTTP 封包**

設定的步驟如下：

1\. 安裝 [Fiddler Web Debugger](http://www.fiddler2.com/fiddler2/) 最新版

2\. 啟動 Fiddler 並點擊 \[Tools\] / \[Fiddler Options\] 選單 (如下圖示)

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/4059d98a9c8d47162ae5-image_1217.png)

3\. 切換至 **Connections** 頁籤，並勾選 **Allow remote computers to connect**，並按下 OK 按鈕

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/f363430492b7ea766ec4-SNAGHTML2f00239d.png)

    剛按下時，他會顯示一個提示訊息，告知你透過遠端電腦連接 Fiddler 需要開啟防火牆例外

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/37d01f8d05cf3cce6c46-SNAGHTML2f02795a.png)

    當你重新啟動 Fiddler 時，就會看到出現以下 Windows 安全性警訊視窗，你可以參考以下圖示勾選：

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/04b191c28541a99c5283-SNAGHTML2f048404.png)

4\. 在 Fiddler 的 QuickExec 區塊，輸入以下指令，並按下 Enter 確認。

```
prefs set fiddler.network.proxy.registrationhostname 你的電腦名稱
```

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/b8e199a0a5781ff8ac7c-SNAGHTML2f075566.png)

    備註：電腦名稱可透過命令提示字元輸入 **set computername** 來快速取得名稱，如下圖示：

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/b50e701938f7dbe5ac87-SNAGHTML2f0d3d06.png)

**注意**：若你日後修改電腦名稱，這行 QuickExec 指令必須重新執行一遍，否則可能會收錄不到封包。

5\. 重新啟動 Fiddler 即大功告成！

此時若開啟 WP7 模擬器中的 Internet Explorer 瀏覽器，就會在 Fiddler 上看見所有流經 WP7 模擬器的 HTTP 與 HTTPS 封包，如下圖示：

![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/480582af3977602c5c5e-image_1218.png)

不過，模擬器只要透過 Fiddler 連上 HTTPS 加密網頁就會跳出如下圖的警告提示，那是因為 WP7 模擬器中的 **根憑證授權單位** (Root CA) 並沒有信任 Fiddler 內所使用的憑證，所以一定會出現這個提示畫面，而且每次模擬器重開都會問你一次，但只要不重開就只會問一次而已。**額外補充**：WP7 內見的 SSL 根憑證可參考【[SSL Root Certificates for Windows Phone](http://msdn.microsoft.com/en-us/library/gg521150.aspx)】網頁。

![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/0ffaa56ef2975352608f-SNAGHTML2f1200c2.png)

若你不想再次看到這個警示畫面，也可以選擇將 Fiddler 的根憑證註冊進模擬器，如此一來 WP7 模擬器便可自動信任 Fiddler 的憑證，但**此舉可能會對你的 WP7 模擬器的 SSL 安全通訊帶來一些資安風險，畢竟你共用的是一個全世界都不信任的憑證，請各位斟酌後再行設置**。另一個比較安全的作法是，下載 [FiddlerCertMaker.exe](http://www.fiddler2.com/dl/FiddlerCertMaker.exe) 工具，自己建立一個新的專屬 DO\_NOT\_TRUST\_FiddlerRoot 憑證，建立完成之後再重新啟動一次 Fiddler 即可開始使用新的 Fiddler 根憑證。

設置的方法是在 WP7 模擬器上的 IE 網址列輸入以下網址下載 DO\_NOT\_TRUST\_FiddlerRoot 憑證：

```
http://你的電腦名稱:8888/FiddlerRoot.cer
```

![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/9dad65f355b56031dc7a-SNAGHTML2f1aae01.png)

下載後會提示你要不要安裝進 Windows Phone 作業系統

![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/4487c9ac51482ed60107-image_1219.png)

按下 install 按鈕之後即安裝完成。

![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/a462062216bd40c5d201-SNAGHTML2f237140.png)

接下來，所有網站的 HTTPS 連線都不會再跳出警示訊息了。

**請注意**：每次 WP7 模擬器重開都會自動重置 (Reset) 作業系統，所以就算你安裝了也沒有用，下次還是要重裝一次，所以這段完全是寫心酸的，哈哈。不過，以下的文章就可能會用到，因為我們會拿 Fiddler 來收錄 WP7 實體裝置 (就是你手上的 WP7 手機啦) 。

**§ 使用 Fiddler 收錄 WP7 實體裝置發出的 HTTP 封包**

收錄 WP7 實體裝置發出的 HTTP 封包其步驟跟設定與模擬器收錄的步驟差不多，只是在 WP7 手機上做設定上比較繁瑣一些，由於拍攝實體手機上的畫面非常麻煩，我手邊又沒有數位相機或 iPad，所以這部分我用文字描述即可，各位要參考圖片可以到 [Debugging Windows Phone 7 device traffic with Fiddler](https://www.telerik.com/fiddler/fiddler-classic/documentation/configure-fiddler/advanced-options/monitorwindowsphone7) 文章查閱。

WP7 手機要能連上 Internet 有 3 種方法，一種是透過 USB 連接 PC 上網 (透過 Zune 軟體)，另一種是透過 3G 行動數據上網，最後一種是透過 Wi-Fi 上網。而在這三種方法中，只有透過 Wi-Fi 可以設定 Proxy 伺服器，而我們也可以透過這種方式將手機的上網 Proxy 設定成 Fiddler 即可收錄到所有實體手機上的 HTTP/HTTPS 封包，手機的設定方法如下：

1\. 進入 \[設定\] / \[系統\] / \[Wi-Fi\]，並開啟 \[Wi-Fi 網路\]

2\. 當連接到其中一個**熱點**後，在該**熱點**上按住不放就會跳出一個 Context Menu，並選取「編輯」

3\. 接著會出現一個 **Proxy** 的開關，打開之後可以讓你輸入：

-   **伺服器/URL**：請輸入 你的電腦名稱
-   **連接埠**：請輸入預設的 8888

接著手機上網，就可以在 Fiddler 裡面看見所有 HTTP/HTTPS 的流量了！

**請注意**：你所在的熱點必須跟你的電腦處於同一個網段內，而且 DHCP 所配發的 DNS 設定必須為內網的 DNS 伺服器，否則很有可能會找不到你的電腦而無法收錄到任何封包。

若你希望透過 USB 連接 PC 上網時也能夠透過 Fiddler 側錄封包，在設定上就會繁雜許多，以下是設定步驟：

1\. 先安裝 WPAD-to-Fiddler extension  \[ 直接下載 \]

2\. 開啟 [Fiddler Web Debugger](http://www.fiddler2.com/fiddler2/)

3\. 如下圖示啟動 **WPAD Server**

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/8ee165b1585d3eeac9df-image_1220.png)

4\. 開啟「服務」管理員，並重新啟動 **DHCP Client** 服務

    ![](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/74e5024ffc300df32749-image_1221.png)

5\. 關閉 Zune 並拔除 WP7 手機的 USB 線，重接 USB 線並啟動 Zune 軟體！

此時，你再用 WP7 手機上網，就會看到 Fiddler 視窗中出現所有 HTTP/HTTPS 封包的流量了！

**今日修練總結**

[Fiddler Web Debugger](http://www.fiddler2.com/fiddler2/) 是一套強大的 HTTP 封包收錄軟體，開發 WP7 應用程式若能獲得 Fiddler 的幫助，並進一步分析所有 HTTP 封包，絕對有助於開發網路應用程式的各種情況。例如我就拿這招來分析 Map 控制項是如何取得 BingMap 的圖資，並設法研究出 Nokia Maps 的整合方法 (不過尚未實驗出來)。

**相關連結**

-   [Debugging Windows Phone traffic](http://www.fiddler2.com/fiddler/help/phone.asp)

-   [Fiddler and the Windows Phone 7 Emulator](https://web.archive.org/web/20101121111413/http://blogs.msdn.com:80/b/fiddler/archive/2010/10/15/fiddler-and-the-windows-phone-emulator.aspx)
-   [Debugging Windows Phone 7 device traffic with Fiddler](https://www.telerik.com/fiddler/fiddler-classic/documentation/configure-fiddler/advanced-options/monitorwindowsphone7)

-   [QuickExec Reference](http://www.fiddler2.com/fiddler/help/quickexec.asp)
-   [Decrypting HTTPS-protected traffic](http://www.fiddler2.com/fiddler/help/httpsdecryption.asp)
-   [SSL Root Certificates for Windows Phone](http://msdn.microsoft.com/en-us/library/gg521150.aspx)
-   WPAD-to-Fiddler extension
-   [Web Proxy Autodiscovery Protocol - Wikipedia, the free encyclopedia](http://en.wikipedia.org/wiki/Wpad)
