做微信公眾號開發(fā)审姓，用到了微信js-sdk的幾個方法，比如手機相機拍攝照片,上傳照片uploadImage等接口蔬捷。這里微信js-sdk的配置就不多說了，按照微信的開發(fā)文檔和微信的demo就能擼明白了（注意一些變量的緩存价捧，有調(diào)用次數(shù)限制）。公眾號中js的安全調(diào)用域名設(shè)置不需要http,比如example.com涡戳。按照微信公眾號說明修改结蟋，僅支持80和443端口，可以加入多個域名渔彰，如果你們的測試環(huán)境也是域名的話嵌屎，那么開發(fā)調(diào)試就直接可以在測試環(huán)境的域名調(diào)試了。
下面的mac本地調(diào)試方法恍涂，針對沒有測試環(huán)境域名的宝惰，只想在mac本地環(huán)境localhost調(diào)試tomcat服務(wù)下，頁面調(diào)用微信js-sdk的方法是否正確再沧。默認你們的后臺wx.config中需要的參數(shù)都獲得了尼夺。
在實現(xiàn)調(diào)用簽名算法的時候url傳入值需要傳入當前頁面，
varcurrentUrl =window.location.href.split('#')[0];//去掉#后面的炒瘸，包含#
如果url傳入不正確淤堵，會報invalid signature。下載微信web調(diào)試工具顷扩，直接在web調(diào)試工具打開你本地的調(diào)試的url,比如 http://localhost:8080/h5instSystem/#/index拐邪，在js-sdk會報相應(yīng)的錯誤，如果后臺wx.config配置的信息都正確了隘截，會報invalid url domain扎阶。這個錯就說明你調(diào)用js的域名不正確，沒有和你公眾號綁定婶芭，本來我們就沒有在js安全調(diào)用下面的域名設(shè)置localhost本地環(huán)境乘陪，所以報這個錯，你離正確調(diào)通已經(jīng)很近了雕擂。
下面就需要將本地的localhost:8080變成你在公眾號下設(shè)置的域名：比如example.com。修改mac host文件
sudo vi /etc/hosts
文件中127.0.0.1 后面的localhost修改為example.com贱勃。（example.com就是你綁定的域名）井赌，因為這個默認調(diào)用的是80端口，而我們的tomcat默認是8080端口贵扰，mac下tomcat是root啟動的仇穗，改成80端口會有一些問題。所以將本地80端口的訪問轉(zhuǎn)發(fā)到這個8080端口上來戚绕，這樣tomcat服務(wù)器以8080端口啟動纹坐，但我們可以通過80端口來進行訪問，參考[1]舞丛。下面的命令就是本地80端口轉(zhuǎn)發(fā)到8080端口
sudo cp /etc/pf.conf /ect/pf.conf.bak
sudo vi pf.conf
在pf.conf中rdr-anchor "com.apple/*"下面加上
rdr on lo0 inet proto tcp from any to 127.0.0.1 port 80 -> 127.0.0.1 port 8080
保存退出耘子，再執(zhí)行下面命令果漾，確保80端口沒有服務(wù)用。
sudo pfctl -d
sudo pfctl -f /etc/pf.conf
sudo pfctl -e
現(xiàn)在就完成了80端口到8080端口的轉(zhuǎn)發(fā)谷誓，現(xiàn)在我們本地mac上調(diào)用http://example.com/**,就是調(diào)用http://localhost:8080/**
啟動本地tomcat服務(wù)绒障，在微信web開發(fā)工具中，訪問域名服務(wù)捍歪，就能見到config OK的消息了户辱，現(xiàn)在你本地調(diào)試就正確了。但是有的接口糙臼，必須要手機調(diào)試才能有效果庐镐，比如拍照。
我們就需要設(shè)置一個代理变逃，讓手機的網(wǎng)絡(luò)經(jīng)過我們的mac必逆，微信開發(fā)工具我沒有設(shè)置好，我直接用了mac上的抓包工具charles韧献。確保手機和你的mac在同一個網(wǎng)絡(luò)下末患，proxy setting中設(shè)置，然后iphone中,點擊網(wǎng)絡(luò)锤窑，設(shè)置http代理璧针，手動，填寫mac ip渊啰，沒有http,比如192.168.1.245,端口8888探橱。然后charles允許就行了。
手機微信中打開域名調(diào)試绘证，就能正確使用各個接口了隧膏，本地調(diào)試，手機調(diào)試工作就成功了嚷那。其實就是本地模擬設(shè)置好的域名胞枕。
參考：
[1]http://www.cnblogs.com/fullstack-yang/p/6223896.html
