微信開發的一些總結

最近有機會，嘗試了一次微信開發，中間遇到不少比較容易踩得坑，記錄一下。

主要功能是

1. 微信網頁認證
2. 轉盤抽獎
3. 微信公共號發紅包給當前登陸用戶
4. 分享給好友和分享到朋友圈

涉及到的資源

微信公衆平臺： https://mp.weixin.qq.com

微信商戶平臺： https://pay.weixin.qq.com/

微信API：http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html

微信開發者論壇: http://qydev.weixin.qq.com/qa/index.php?qa=questions

過程記錄

微信網頁認證

條件：

1. 服務號
2. 經過微信認證

接口文檔：http://mp.weixin.qq.com/wiki/17/c0f37d5704f0b64713d5d2c37b468d75.html

過程是獲取用戶受權的code，經過code獲取access_code，而後經過access_code獲取用戶信息。

其中第一個坑

第一步獲取用戶受權的code，redirect_uri常常會報錯redirect_uri參數錯誤，可能的緣由是：

1. 公衆平臺後臺設置受權回調域名
2. 回調頁面有端口，受權也需端口
3. redirect_uri urlencode
4. 綁定已備案域名，主要域名必須是二級或二級以上域名

若是以上問題都注意到後，仍是有問題，即可以等幾個小時，極可能是微信接口抽風了，我就是用着用着這個接口掛了，等了好幾個小時本身好了。

第二個坑

有時候報錯」不能訪問連接「，緣由是微信後臺設置的回調域名不對，有時候本身切換host後，域名不對，因此修改回調域名就行了。

第三個坑

access_token會過時，用的時候建議每次都經過refresh_token去從新獲取access_token

第四個坑

用戶受權後回跳的頁面的時候，控制檯報錯

`Resource interpreted as Document but transferred with MIME type application/octet-stream: "https://open.weixin.qq.com/connect/oauth2/..`

解決辦法是，回調頁面的url設置爲http://xxx.com，而不是xxx.com

第五個坑

受權回調頁面，url會帶有?code=xxx，不能直接分享這個url，會致使後面的用戶受權不了。由於這個問題糾結了好久。

解決方式是，在node端解析code，而後寫入cookie，經過url redirect到沒有code的頁面。另外一種方式是，經過微信api，定製分享內容和分享的連接。

公衆號微信發紅包給用戶

條件：

1. 經過微信認證
2. 經過微信支付認證

接口地址：https://pay.weixin.qq.com/wiki/doc/api/tools/cash_coupon.php?chapter=13_1

第一個坑

就是有時候會報錯簽名錯誤，可能緣由及解決辦法是：

1. 生成簽名的密匙過時，從新去後臺設置一下便可。
2. 加密的字符串須要按照ASCII排序
3. 若是仍是沒解決，能夠去掉中文試試
4. 仍是不正確，能夠經過簽名工具，把參數都輸入後看輸出的和本身的哪一步不對。
5. 最後，post請求傳過去的body應該是xml格式，且xml格式須要嚴格按照xml語法，順序最好和文檔的同樣。

第二個坑

證書的使用。
官方下載會下載到三個證書，node用.p12後綴的，使用方式是在請求頭設置 agent，而後設置密碼。具體見文末的代碼連接。

第三個坑

紅包的描述和祝福語之類的設置中文會出現紅包發送不出去的狀況，解決方式是對中文進行unicode編碼。

分享給好友和分享到朋友圈

第一步，在微信後臺設置js接口安全域名

第二步，引入js文件

第三步，經過config接口注入驗證配置

坑: signature簽名獲取方式是先獲取 jsapi_ticket，經過access_token獲取jsapi_ticket時老是報錯，同一個未過時的access_token獲取用戶信息是能夠的，獲取jsapi_ticket就不行。

第四部，配置onMenuShareTimeline方法。能夠自定義分享內容和連接。

---

最後，推薦html5的一些組件庫

frozenUI： http://frozenui.github.io

很出色的h5製做網站：http://h5.baidu.com/

源代碼倉庫連接：https://github.com/freestyle21/orange-plus

原創文章，歡迎轉載。轉載請註明：轉載自 Fs21 ' s Home，謝謝！
原文連接地址： 微信開發的一些總結