A. 如何實用便捷的在本地真機調試WEB端HTML5網頁
1、如果你能FQ
chrome在32版本後就自帶了移動端調度工具，可以在Android直接聯調，但唯一遺憾的是，在我大天朝要FQ後才能行的通，我自己試了後公司好幾個機器聯不上…
2、如果你有蘋果電腦和iphone
蘋果電腦上的safari 6.0版本後就可以直接連接iphone手機調試手機版上safari正在瀏覽的web頁面，前提是你得有個蘋果電腦和iphone手機，但如果你是Android的話，就沒辦法了
符合前端B格的「小蘋果」
自己在公司里也是開發Mobile端的HTML5頁面的，也深受調試頁面之苦，移動端的WEB頁面坑又多，所以用node-webkit技術做了一個客戶端，專門用來調試，現在每天工作之前都先打開「小蘋果」
小蘋果用的是node-webkit技術打包成客戶端，其實內部實現都是web 頁面與nodejs技術，所以特別符合前端B格。而且由於用了node-webkit技術，客戶端可以跑在windows和mac電腦上，齊活兒了
小蘋果官方網站
里邊有下載及安裝和使用的方法
B. 微信公眾號web開發調試不方便嗎送你2款調試工具完美解決
前言
我們公司有做微信公眾號銜接的項目開發。前端小夥伴一般都是在chrome用手機模擬調試網頁，但是不方便調試與微信銜接部分的功能。有些bug在chrome上沒有調試出來，但是一到真機調試的時候，就出現了。
我也是大量的查閱資料並實踐，發現如下2個調試工具技巧，即可完美解決以上遇到的微信項目開發令人頭疼的調試問題。
1. vConsole 推薦指數：★★★★★
騰訊出品的 Web 調試面板，相信不少前端小夥伴都用過。vConsole 會在你網頁中加一個懸浮的小按鈕，可以點擊它來打開關閉調試面板，並查看 DOM、Console、Network和 本地存儲 等信息。基本可以滿足普通前端開發的需求。使用方法也很簡單，通過npm安裝或者直接在需要的頁面引入 js文件 ，然後 new VConsole() 就可以了。不熟悉的小夥伴可以直接去官方的 GitHub 看 README。但是它並沒有解決我的問題，因為我的 bug嚴重到一進頁面就報錯，脆弱的 javascript 直接原地爆炸，頁面一片空白。
2. 微信web開發者工具 推薦指數：★★★★★
這是一款早期的微信web開發者工具，最新版本： (2016.05.19)0.7.0
前端小夥伴可能更熟悉的是小程序web開發者工具。但是我今天主要介紹的是該工具的 移動調試功能,這一個也許可以用fiddler抓包工具，fiddler配置起來很麻煩，沒有該工具簡單，應付移動端調試抓包還是搓搓有餘。操作說明 請見官方文檔講得很清楚官方調試文檔說明
這兩款工具的實踐是前輩們踩過的坑，並填了坑。你看到了就賺到了，並自己花1個小時的時間學習一下，就為自己節省了很大部分的時間。
工欲善其事必先利其器，沒有好的調試工具或方法，移動端真機下的 debug 簡直是前端的噩夢。但是有了這些好用的方法，我想各位優秀的前端大佬，幫妹子修復個小 bug 還是 so easy 的。
--完--
C. 微信web開發者工具移動調試怎麼弄
使用工具：
電腦；
web開發工具；
例子：以安卓的移動調試為範本；
調試步驟：
選擇無線網卡地址，默認即可，工具會自動查詢無線網卡ipv4地址。
設置-無線區域網-選中網路-HTTP代理手動，設置好上面步驟以後，重啟微信，這可能是讓微信重新檢測目前的網路情況，然後打開想調試的頁面（注意，要先打開要調試的頁面才可以開始調試）。
調試模式開啟以後，就可以直接在手機上查看調試的結果或者修改東西。
注意：想調試本地開發的頁面，需要開啟web服務，只是一個本地頁面，是無法打開調試的。
D. 如何在移動設備上調試html5開發的網頁
1、打開手機web檢查器。
通過【設置】>【Safari】>【高級】>【Web檢查器】打開。見下圖（點擊查看大圖），並且你會看到該選項下面對電腦操作的相應描述，照做就好。
E. 如何 iphone 真機調試web
參考下：1、授權設備：
進入Apple Developer會員中心，點擊圖中的iOS Provisioning
Portal，進入開發者授權設置系統：
在設置界面中，可以選擇點擊頁面下方的助手來運行向導：
點擊左側導航的Device，進入授權設備的頁面，點擊右上方的Add Device按鈕可以添加一個設備：
添加設備的時候可以指定設備的名字（隨便寫），以及設備的UDID。每一個Apple的設備都有一個唯一的標識符，獲得這個標識符的方法很簡單，有兩種方式：
（1）將你的設備連接到電腦，然後在iTunes里找到你的設備信息（如下圖），點擊圖中紅色方框的位置，設備UDID就會顯示出來。右擊UDID會提示拷貝，將拷貝的結果復制到框內即可；
（2）打開xcode，window→organizer→devices，在裡面可以看到identifier信息2、添加App ID：
點擊左側導航的App IDs按鈕可以進入應用程序ID的配置頁面，可以點擊頁面右方的New App
ID按鈕添加一個新的應用。這個ID對應的是即將開發和測試的應用程序。如下圖，在description里添加一個單一應用的名稱（不支持特殊字元），然後在最下面的Bundle
Seed ID裡面填入一個含有domain格式的字元串（如com.bo.test）。Bundle Seed
ID是一個集合了開發商與應用程序的信息，格式為(com.[開發商].[應用]），這里可以指定為單一應用，也可以指定為全部應用。如果是單一應用，建議剛才填寫的description與Bundle
Seed ID的最後一項相同（如test和com.bo.test），如果是全部應用，可以使用這樣的Bundle Seed ID：
com.bo.3、添加證書：
（1）首先在mac電腦上生成開發者證書：
在Applications->Utilities裏手動打開Keychain
Access。按照下圖操作最終點擊「從證書頒發機構請求證書」
正確填寫自己的郵箱和姓名即可，選擇「存儲到磁碟」，點擊繼續。最終會生成一個名為「CertificateSigningRequest.certSigningRequest」的文件。
這時候返回剛才的iOS Provisioning Portal網頁界面，點擊左側的「Certificate」，點擊頁面右方的Request
Certificate申請一個證書，然後點擊頁面下方的按鈕上傳生成的certSigningRequest文件，這樣就完成了證書的申請流程。申請成功後，Certificate頁面里就有了一條證書，刷新幾次頁面後證書的狀態就變成Issued，點擊download按鈕可以下載一個cer文件。4、使用開發者授權：
（1）回到iOS Provisioning Portal網頁界面，點擊左側的「provisioning」，點擊右側的New
Profile按鈕創建一個新的授權文件：
填寫profile
Name；在Certificates中選擇剛剛創建好的證書（一勞永逸的一步，之後只需勾選該證書即可，不必再手動添加）；APP
ID選擇剛剛建的那個；Devices
選擇剛剛添加的設備；Submit（綁定設備到應用程序）；刷新頁面，會看到剛剛建的那個後邊有個Download，點擊Download，下載了一個.mobileprovision文件。
（2）打開xcode→window→organizer，將下載的.mobileprovision文件拖到Provisioning中（此步驟綁定設備到應用程序，並生成證書）
（3）項目中的plist 文件，將Bundle Identifier 這一項的內容改成Bundle Seed
ID(格式:com.[開發商].[應用])即可
將run按鈕右邊的設備選為對應的真機設備，接下來就編譯運行看看吧！希望幫助你
F. 如何調試移動端網頁
1
打開 模擬面板。
2
可以在 Device 選擇設備。
可以在Screen 設置模擬的屏幕方面的東西，設置解析度，屏幕尺寸。
可以在 User Agent 設置 客戶端Agent
可以在 sensors 設置感應等，模擬觸屏操作。
3
配置好之後，點擊 Emulate 。開始進行模擬。
（選擇Device需要點擊emulate)其餘選項是在修改後自動改變。
4
如何假設 平板旋轉屏幕？
可以在 screen中，點擊解析度中間的互換按鈕就可以了。
使用Chrome瀏覽器調試，配置好調試設置之後，可以自由輸入 網址查看 在移動設備上的現實情況。