總結微信vue單頁應用開發的一些坑

最近在作一個微信上的移動應用，踩了很多坑，作了如下的總結：

1. 微信分享功能，安卓和iPhone存在着不少而差別。一開始調用微信分享功能須要引入jssdk，在入口文件index.js中引入了http://res.wx.qq.com/open/js/jweixin-1.0.0.js js文件，而後出現了的問題是安卓能夠進分享，可是iPhone卻老是出現invalid signature，後來發現是由於iOS 9.0須要引入https://res.wx.qq.com/open/js/jweixin-1.0.0.js，不然會分享失敗。

2. iOS overflow：auto滾動不流暢問題。這個問題通常加上一句-webkit-overflow-scrolling : touch;就能夠就解決問題，可是當有已導航欄用了fixed或者absolute定位的，定位就會失效，這是須要給overflow：auto的標籤加上一個絕對定位，如position：fixed或者position：absolute。

3. 有關於css選擇器的坑：若是在html和body選擇器中寫了overflow:auto,對子元素div的滾動條的scrolltop值就總會爲0，這和瀏覽器的兼容不一樣，這個神奇的坑花了我很長的時間才解決。

4. 作微信支付接口jsapi調用的時候,支付目錄的配置頗有講究，Vue項目若是沒有改變路由的mode的默認值hash,這時#的存在就會是支付目錄的配置失敗，這是須要更改mode的模式，變爲history。

5. 引入了百度地圖API後，在微信開發者工具上面的定位和手機上定位差距很大，居然有十多千米，這個讓我一直覺得是百度定位不許確，還試過換微新jssdk的定位，到頭卻發現是由於瀏覽器定位不許確致使的，只要代碼在手機上跑起來，定位就會很精確。

6. 上傳文件的坑，或者說是上傳圖片，用formdata經過ajax發送給後臺，可是圖片太大的話node會報一個錯誤request entity too large，這是node上傳文件限制的緣由，這個須要在node加上一個上傳文件的限制

   //app.use(express.limit(100000000)
    //app.use(bodyParser({limit : "5000kb"}));
    //app.use(json({limit: '5000kb'}));

   可是通常體驗文件太大的話用戶體驗很差，又消耗流量，最好仍是使用canvas壓縮上傳。