微信公眾號二次分享ios分享失敗問題

阿新 • • 發佈：2020-06-29

一、首先，看正常通用的

1、繫結域名

　　再公眾號開發設定裡邊配置域名

2、引入js檔案

index.html

 <script src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js "></script>

3、通過後臺處理呼叫介面得到簽名

這裡通過新增路由守衛 判斷 ios系統時 儲存第一次進入時的連結地址（iso分享失敗原因：因為ios獲取到的url永遠是你進入這個專案的第一個url，不訪你可以點選上角重新整理試試）
 beforeRouteEnter(to, from, next) {
    let userAgent  
= navigator.userAgent;

    if (userAgent.includes("iPhone") || userAgent.includes("iPad")) {
      sessionStorage.setItem("originUrl", location.href); // 用於ios分享
    }

    next();
  },

 sendShare() {
      // this.reload();
      this.common.tip("點選右上角完成分享");
      var timestamp = "";
      var nonceStr = "" 
;
      var signature = "";
      let urls = "";
　　　　// 這個判斷是處理ios分享失效的問題
      let userAgent = navigator.userAgent;
      if (userAgent.includes("iPhone") || userAgent.includes("iPad")) {
        urls = sessionStorage.getItem("originUrl");
      } else {
        urls = window.location.href;
      }
　　　　// 這兒的調介面方法是自己封裝的
       
this.http.getRequest(apis.getSignature_url, {
          urls: urls  // 注意注意注意：這裡的路徑必須是當前頁面路徑，並且必須和公眾號裡邊配置的域名保持一致，否則會簽名失效
        }).then(res => {
          console.log(res, "res");
          timestamp = res.timestamp;
          nonceStr = res.nonceStr;
          signature = res.signature;

　　　　　　通過config介面注入許可權驗證配置


          wx.config({
            debug: false, // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來，若要檢視傳入的引數，可以在pc端開啟，引數資訊會通過log打出，僅在pc端時才會列印。
            appId: "wxfbf80fe01e7999a8", // 必填，公眾號的唯一標識，填自己的！
            timestamp: timestamp, // 必填，生成簽名的時間戳，剛才介面拿到的資料
            nonceStr: nonceStr, // 必填，生成簽名的隨機串
            signature: signature, // 必填，簽名，見附錄1
            jsApiList: ["updateAppMessageShareData", "onMenuShareTimeline"]， // 許可權匯入
          });
          var url_link = apis.sharUrl + "/index?activityPlanId=" +this.activityPlanId + "&accountId=" + this.accountId;

　　　　　　通過ready介面處理成功驗證


          wx.ready(() => {
            //需在使用者可能點選分享按鈕前就先呼叫
            // 分享給朋友

            wx.updateAppMessageShareData({
              title: this.data.title, // 分享標題
              desc: this.data.introduce, // 分享描述
              link: url_link, // 分享連結，該連結域名或路徑必須與當前頁面對應的公眾號JS安全域名一致
              imgUrl: this.logo, // 分享圖示， 此圖示也要以http開頭的路徑
              success: function() {
                // 設定成功
              }
            });

　　　　　　通過error介面處理失敗驗證


            wx.error(function(res) {
              // config資訊驗證失敗會執行error函式，如簽名過期導致驗證失敗，具體錯誤資訊可以開啟config的debug模式檢視，也可以在返回的res引數中檢視，對於SPA可以在這裡更新簽名。
            });
          });
          // =================
        });
    },

參考：https://www.cnblogs.com/zishang91/p/10755488.html

https://blog.csdn.net/sinat_33184880/article/details/90240567