每回遇到微信分享都是一個坑，目前的商城項目使用Vue開發，采用history的路由模式，配置微信分享又遇到了很多問題，最后終于解決了，現將解決的過程分享一下。

技術要點

Vue，history

常見問題及說明

debug模式下報false

這個沒得說，就是調用wx.config方法的參數錯誤造成的，請確認以下事項：

是否成功綁定了域名（域名校驗文件要能被訪問到） 使用最新的js-sdk文件，因為微信會改部分api config方法的參數是否傳正確了（拼寫錯誤、大小寫...） 需要使用的方法是否寫在了jsApiList中 獲取簽名的url需要decodeURIComponent 后臺的生成簽名的加密方法需要對照官方文檔

debug返回ok，分享不成功

確保代碼拼寫正確 分享鏈接域名或路徑必須與當前頁面對應的公眾號JS安全域名一致 接口調用需要放在wx.ready方法中

單頁項目（SPA）中的一些要點

所有需要使用JS-SDK的頁面必須先注入配置信息，否則將無法調用（同一個url僅需調用一次，對于變化url的SPA的web app可在每次url變化時進行調用,目前Android微信客戶端不支持pushState的H5新特性，所以使用pushState來實現web app的頁面會導致簽名失敗，此問題會在Android6.2中修復）。

上面那段話摘自官方文檔

開發者需要注意的事項：

android和ios需要分開處理 需要在頁面url變化的時候重新調用wx.config方法，android獲取簽名的url就傳window.location.href Vue項目在切換頁面時，IOS中瀏覽器的url并不會改變，依舊是第一次進入頁面的地址，所以IOS獲取簽名的url需要傳第一次進入的頁面url

Code

router/index.js

......import { wechatAuth } from "@/common/wechatConfig.js";......const router = new Router({  mode: "history",  base: process.env.BASE_URL,  routes: [    {      path: "/",      name: "home",      meta: {        title: "首頁",        showTabbar: true,        allowShare: true      },    },    {      path: "/cart",      name: "cart",      meta: {        title: "購物車",        showTabbar: true      },      component: () => import("./views/cart/index.vue")    }    ......  ]});router.afterEach((to, from) => {  let authUrl = `${window.location.origin}${to.fullPath}`;  let allowShare = !!to.meta.allowShare;  if (!!window.__wxjs_is_wkwebview) {// IOS    if (window.entryUrl == "" || window.entryUrl == undefined) {      window.entryUrl = authUrl; // 將后面的參數去除    }    wechatAuth(authUrl, "ios", allowShare);  } else {    // 安卓    setTimeout(function () {      wechatAuth(authUrl, "android", allowShare);    }, 500);  }});

代碼要點：

meta中的allowShare用于判斷頁面是否可分享 window.__wxjs_is_wkwebview可用來判斷是否是微信IOS瀏覽器 entryUrl是項目第一次進入的頁面的地址，將其緩存在window對象上 為什么安卓的時候要增加一個延時器，因為安卓會存在一些情況，就是即便簽名成功，但是還是會喚不起功能，這個貌似是一個比較穩妥的解決辦法