微信開(kāi)發(fā)者工具是一款編程工具，微信相關(guān)的軟件開(kāi)發(fā)太多了，所以大家一定用得著，而且小程序今日正式上線(xiàn)，大家馬上就會(huì)迎來(lái)新一輪的工作，這款微信開(kāi)發(fā)者工具由西西為大家精心帶來(lái)，包含32位與位的操作系統(tǒng)工具，能滿(mǎn)足廣大用戶(hù)的需求，同時(shí)提供必要的教程。

為幫助開(kāi)發(fā)者更方便、更安全地開(kāi)發(fā)和調(diào)試基于微信的網(wǎng)頁(yè)，我們推出了 web 開(kāi)發(fā)者工具。它是一個(gè)桌面應(yīng)用，通過(guò)模擬微信客戶(hù)端的表現(xiàn)，使得開(kāi)發(fā)者可以使用這個(gè)工具方便地在 PC 或者 Mac 上進(jìn)行開(kāi)發(fā)和調(diào)試工作。立即下載體驗(yàn)

你可以：

使用自己的微信號(hào)來(lái)調(diào)試微信網(wǎng)頁(yè)授權(quán)

調(diào)試、檢驗(yàn)頁(yè)面的 JS-SDK 相關(guān)功能與權(quán)限，模擬大部分 SDK 的輸入和輸出

使用基于 weinre 的移動(dòng)調(diào)試功能

利用集成的 Chrome DevTools 協(xié)助開(kāi)發(fā)

該工具界面主要由幾大部分組成，如下圖所示：

頂部菜單欄是刷新、后退、選中地址欄等動(dòng)作的統(tǒng)一入口，以及微信客戶(hù)端版本的模擬設(shè)置頁(yè)。左側(cè)是微信的 webview 模擬器，可以直接操作網(wǎng)頁(yè)，模擬用戶(hù)真實(shí)行為。右側(cè)上方是地址欄，用于輸入待調(diào)試的頁(yè)面鏈接，以及清除緩存按鈕。右側(cè)下方是相關(guān)的請(qǐng)求和返回結(jié)果，以及調(diào)試界面和登錄按鈕。

調(diào)試微信網(wǎng)頁(yè)授權(quán)

之前在開(kāi)發(fā)基于微信的網(wǎng)頁(yè)授權(quán)的功能時(shí)，開(kāi)發(fā)者通常需要手機(jī)上輸入 URL 進(jìn)而獲取用戶(hù)信息，從而進(jìn)行開(kāi)發(fā)和調(diào)試工作，可是因?yàn)槭謾C(jī)的諸多限制，這個(gè)過(guò)程很不方便。 通過(guò)使用微信 web 開(kāi)發(fā)者工具，從此開(kāi)發(fā)者可以直接在 PC 或者 Mac 上進(jìn)行這種調(diào)試了。具體操作步驟為：

開(kāi)發(fā)者可以在調(diào)試器中點(diǎn)擊“登錄”，使用手機(jī)微信掃碼登錄，從而使用真實(shí)的用戶(hù)身份（支持測(cè)試號(hào)）來(lái)開(kāi)發(fā)和調(diào)試微信網(wǎng)頁(yè)授權(quán)。請(qǐng)確認(rèn)手機(jī)登錄頁(yè)，綁定的公眾號(hào)為“微信 web 開(kāi)發(fā)者工具”，如下圖所示：

為了保證開(kāi)發(fā)者身份信息的安全，對(duì)于希望調(diào)試的公眾號(hào)，我們要求開(kāi)發(fā)者微信號(hào)與之建立綁定關(guān)系。具體操作為：公眾號(hào)登錄管理后臺(tái)，啟用開(kāi)發(fā)者中心，在開(kāi)發(fā)者工具——web 開(kāi)發(fā)者工具頁(yè)面，向開(kāi)發(fā)者微信號(hào)發(fā)送綁定邀請(qǐng)。綁定頁(yè)面如下圖所示：

開(kāi)發(fā)者在手機(jī)微信上接受邀請(qǐng)，即可完成綁定。每個(gè)公眾號(hào)最多可同時(shí)綁定10個(gè)開(kāi)發(fā)者微信號(hào)。邀請(qǐng)確認(rèn)頁(yè)面如下圖所示：

完成登錄和綁定后，開(kāi)發(fā)者就可以開(kāi)始調(diào)試微信網(wǎng)頁(yè)授權(quán)了，注意只能調(diào)試自己綁定過(guò)的公眾號(hào)

通過(guò) web 開(kāi)發(fā)者工具，可以模擬 JSSDK 在微信客戶(hù)端中的請(qǐng)求，并直觀(guān)地看到鑒權(quán)結(jié)果和 log。以微信 JSSDK DEMO 頁(yè)面為例：

http://demo.open.weixin.qq.com/jssdk

在調(diào)試器中打開(kāi)該 URL，可以方便地在右側(cè)的 JS-SDK Tab 中看到當(dāng)前頁(yè)面 wx.config 的校驗(yàn)情況和 JSSDK 的調(diào)用 log。 如下是校驗(yàn)通過(guò)的頁(yè)面：

如下是校驗(yàn)未通過(guò)的頁(yè)面：

在“權(quán)限列表” Tab 中，可以查詢(xún)到當(dāng)前頁(yè)面擁有權(quán)限的 JS-SDK 列表：

移動(dòng)調(diào)試

移動(dòng)調(diào)試功能是基于 weinre 的，并且做了一些改進(jìn)，相比直接使用 weinre 有兩個(gè)優(yōu)點(diǎn)：

無(wú)須手工在頁(yè)面中加入 weinre 調(diào)試腳本

可以在 weinre 的網(wǎng)絡(luò)請(qǐng)求頁(yè)卡中，看到完整的 http 請(qǐng)求 log，非局限于 ajax 請(qǐng)求

如下圖所示：

注意，移動(dòng)調(diào)試功能暫不支持https。

Chrome DevTools

微信 web 開(kāi)發(fā)者工具集成了 Chrome DevTools。同之前在 PC 上的調(diào)試體驗(yàn)一致，可以快速上手。

如下圖所示：

新增 支持設(shè)置插件頁(yè)面為自定義編譯條件的啟動(dòng)頁(yè)面

新增 第三方平臺(tái)小程序支持使用企業(yè)微信模擬器進(jìn)行調(diào)試

新增 保留上次預(yù)覽的二維碼

新增 云開(kāi)發(fā)控制臺(tái)文件存儲(chǔ)配置

新增 修改 appid 時(shí)支持下拉選取最近使用的appid

新增 體驗(yàn)評(píng)分支持導(dǎo)出報(bào)告

新增 支持切后臺(tái)后可以獲取用戶(hù)位置

新增 云開(kāi)發(fā)靜態(tài)網(wǎng)站托管支持自定義域名

新增 靜態(tài)網(wǎng)站和云存儲(chǔ)支持上傳文件夾

新增 云開(kāi)發(fā)支持云托管

新增 預(yù)覽時(shí)報(bào)錯(cuò)通過(guò)彈框提供錯(cuò)誤信息 反饋詳情

優(yōu)化 云開(kāi)發(fā)拓展功能入口優(yōu)化

優(yōu)化 新建項(xiàng)目流程

優(yōu)化 安裝包體積

修復(fù) 調(diào)試器在模擬器右側(cè)時(shí)，選擇機(jī)型會(huì)導(dǎo)致調(diào)試器錯(cuò)位

修復(fù) 公眾號(hào)網(wǎng)頁(yè)調(diào)試模式下調(diào)試器白屏

修復(fù) 項(xiàng)目列表頁(yè)，刪除項(xiàng)目時(shí)的彈框無(wú)法縱向滾動(dòng)

修復(fù) 工具導(dǎo)入代碼片段會(huì)直接新建一個(gè)新的代碼片段

修復(fù) WXML面板節(jié)點(diǎn)元素?zé)o法選中

修復(fù) 新的編譯模塊在win7系統(tǒng)預(yù)覽報(bào)錯(cuò)的問(wèn)題 反饋詳情

修復(fù) udp onClose與客戶(hù)端表現(xiàn)不一致

修復(fù) 打開(kāi)工具全屏的問(wèn)題

修復(fù) 多賬號(hào)調(diào)試，編譯一直使用緩存

修復(fù) 2.13.0以上基礎(chǔ)庫(kù)，無(wú)法觸發(fā) onPageNotFound 反饋詳情

修復(fù) 非系統(tǒng)菜單欄 Mac 下左上角的放大無(wú)法按住option最大化 反饋詳情

修復(fù) 關(guān)閉所有項(xiàng)目窗口后，不能從菜單里打開(kāi)項(xiàng)目選擇界面 反饋詳情

修復(fù) 重復(fù)CSS樣式?jīng)]有warning提示

修復(fù) cli使用 --appid參數(shù)時(shí)錯(cuò)誤

修復(fù) downloadFile接口三端表現(xiàn)不一致

修復(fù) openSetting中有三個(gè)權(quán)限一直關(guān)不掉 反饋詳情

修復(fù) 工具上臨時(shí)文件能被unlink刪除的問(wèn)題 反饋詳情

修復(fù) MacOS Big Sur 頻繁崩潰的問(wèn)題

修復(fù) 調(diào)試器跟隨模擬器一起彈出時(shí)編輯器部分區(qū)域無(wú)法觸發(fā)點(diǎn)擊的問(wèn)題

修復(fù) 刪除項(xiàng)目后，重啟工具，已刪除的項(xiàng)目又重新出現(xiàn)的問(wèn)題

修復(fù) 休眠后重新打開(kāi)會(huì)出現(xiàn)項(xiàng)目列表窗口的問(wèn)題