微信分享到朋友圈、傳送給朋友開發注意事項

阿新 • • 發佈：2019-01-02

1、invalid url domain

當前頁面所在域名與使用的appid沒有繫結，請確認正確填寫繫結的域名，如果使用了埠號，則配置的繫結域名也要加上埠號（一個appid可以繫結三個有效域名，見目錄1.1.1）。

2、invalid signature簽名錯誤。

建議按如下順序檢查：

確認簽名演算法正確，可用 http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign 頁面工具進行校驗。
確認config中nonceStr（js中駝峰標準大寫S）, timestamp與用以簽名中的對應noncestr, timestamp一致。
確認url是頁面完整的url(請在當前頁面alert(location.href.split(‘#’)[0])確認)，包括’http(s)://’部分，以及’？’後面的GET引數部分,但不包括’#’hash後面的部分。
確認 config 中的 appid 與用來獲取 jsapi_ticket 的 appid 一致。
確保一定快取access_token和jsapi_ticket。
確保你獲取用來簽名的url是動態獲取的，動態頁面可參見例項程式碼中php的實現方式。如果是html的靜態頁面在前端通過ajax將url傳到後臺簽名，前端需要用js獲取當前頁面除去’#’hash部分的連結（可用location.href.split(‘#’)[0]獲取,而且需要encodeURIComponent），因為頁面一旦分享，微信客戶端會在你的連結末尾加入其它引數，如果不是動態獲取當前連結，將導致分享後的頁面簽名失敗。

3、the permission value is offline verifying

這個錯誤是因為config沒有正確執行，或者是呼叫的JSAPI沒有傳入config的jsApiList引數中。建議按如下順序檢查：

確認config正確通過。
如果是在頁面載入好時就呼叫了JSAPI，則必須寫在wx.ready的回撥中。
確認config的jsApiList引數包含了這個JSAPI。

4、permission denied

該公眾號沒有許可權使用這個JSAPI，或者是呼叫的JSAPI沒有傳入config的jsApiList引數中（部分介面需要認證之後才能使用）。

5、function not exist

當前客戶端版本不支援該介面，請升級到新版體驗。

6、為什麼6.0.1版本config:ok，但是6.0.2版本之後不ok

因為6.0.2版本之前沒有做許可權驗證，所以config都是ok，但這並不意味著你config中的簽名是OK的，請在6.0.2檢驗是否生成正確的簽名以保證config在高版本中也ok。

7、在iOS和Android都無法分享

請確認公眾號已經認證，只有認證的公眾號才具有分享相關介面許可權，如果確實已經認證，則要檢查監聽介面是否在wx.ready回撥函式中觸發

8、服務上線之後無法獲取jsapi_ticket，自己測試時沒問題。

因為access_token和jsapi_ticket必須要在自己的伺服器快取，否則上線後會觸發頻率限制。請確保一定對token和ticket做快取以減少2次伺服器請求，不僅可以避免觸發頻率限制，還加快你們自己的服務速度。目前為了方便測試提供了1w的獲取量，超過閥值後，服務將不再可用，請確保在服務上線前一定全域性快取access_token和jsapi_ticket，兩者有效期均為7200秒，否則一旦上線觸發頻率限制，服務將不再可用。

9、uploadImage怎麼傳多圖

目前只支援一次上傳一張，多張圖片需等前一張圖片上傳之後再呼叫該介面

10、沒法對本地選擇的圖片進行預覽

chooseImage介面本身就支援預覽，不需要額外支援

11、通過a連結(例如先通過微信授權登入)跳轉到b連結，invalid signature簽名失敗

後臺生成簽名的連結為使用jssdk的當前連結，也就是跳轉後的b連結，請不要用微信登入的授權連結進行簽名計算，後臺簽名的url一定是使用jssdk的當前頁面的完整url除去’#’部分

12、出現config:fail錯誤

這是由於傳入的config引數不全導致，請確保傳入正確的appId、timestamp、nonceStr、signature和需要使用的jsApiList

13、如何把jsapi上傳到微信的多媒體資源下載到自己的伺服器

請參見文件中uploadVoice和uploadImage介面的備註說明

14、Android通過jssdk上傳到微信伺服器，第三方再從微信下載到自己的伺服器，會出現雜音

微信團隊已經修復此問題，目前後臺已優化上線

15、繫結父級域名，是否其子域名也是可用的

是的，合法的子域名在繫結父域名之後是完全支援的

16、在iOS微信6.1版本中，分享的圖片外鏈不顯示，只能顯示公眾號頁面內鏈的圖片或者微信伺服器的圖片，已在6.2中修復

17、是否需要對低版本自己做相容

jssdk都是相容低版本的，不需要第三方自己額外做更多工作，但有的介面是6.0.2新引入的，只有新版才可呼叫

18、該公眾號支付簽名無效，無法發起該筆交易

請確保你使用的jweixin.js是官方線上版本，不僅可以減少使用者流量，還有可能對某些bug進行修復，拷貝到第三方伺服器中使用，官方將不對其出現的任何問題提供保障，具體支付簽名演算法可參考 JSSDK微信支付一欄

19、目前Android微信客戶端不支援pushState的H5新特性，所以使用pushState來實現web app的頁面會導致簽名失敗，此問題已在Android6.2中修復

20、uploadImage在chooseImage的回撥中有時候Android會不執行

Android6.2會解決此問題，若需支援低版本可以把呼叫uploadImage放在setTimeout中延遲100ms解決

21、require subscribe錯誤說明你沒有訂閱該測試號，該錯誤僅測試號會出現

22、getLocation返回的座標在openLocation有偏差

因為getLocation返回的是gps座標，openLocation開啟的騰訊地圖為火星座標，需要第三方自己做轉換，6.2版本開始已經支援直接獲取火星座標

23、檢視公眾號（未新增）: “menuItem:addContact”不顯示

目前僅有從公眾號傳播出去的連結才能顯示，來源必須是公眾號

24、ICP備案資料同步有一天延遲，所以請在第二日繫結

6、示例：

1、後臺獲取ticket方法：

public String cacheJsSDKTicket(String appid) throws IOException {
    Assert.hasLength(appid);
    String cachedTicket = spyMemcachedClient.get(WechatConst.Cache.CACHE_KEY + "TICKET");
    if (cachedTicket != null && !"".equals(cachedTicket)) {
        LOG.info("Ticket exists, return directly ...");
        return cachedTicket;
    }
    LOG.info("Ticket not exists, get from weixin ...");
    String accessToken = weChatApi.getAccessToken(appid);
    String ticket = weChatApi.getJsApiTicket(accessToken);
    // 7200秒過期
    int timeOut = 7200;
    spyMemcachedClient.safeSet(WechatConst.Cache.CACHE_KEY + "TICKET", timeOut, ticket);
    return ticket;
}

這裡我將ticket全域性快取到memorycache中。

2、後臺簽名方法：

@Override
    public String signJsSDK(String ticket, String url, String timestamp, String nonceStr) throws NoSuchAlgorithmException {
    Map map = new HashMap();
    map.put("noncestr", nonceStr);
    map.put("jsapi_ticket", ticket);
    map.put("timestamp", timestamp);
    map.put("url", url);
    String[] ss = {"noncestr", "jsapi_ticket", "timestamp", "url"};
    Arrays.sort(ss);
    String signStr = "";
    for (String s : ss) {
        signStr += s + "=" + map.get(s) + "&";
    }
    signStr = signStr.substring(0, signStr.length() - 1);
    return new SHA1().getDigestOfString(signStr.getBytes());
}

3、獲取簽名方法：

public void getJsSdkInfo(CspServiceContext serviceContext) throws IOException, NoSuchAlgorithmException {
    MessageObject mo = serviceContext.getRequestData();
    String url = (String) mo.getValue("url");
    String appid = (String) mo.getValue("appid");
    String timestamp = Long.toString(System.currentTimeMillis() / 1000);
    String nonceStr = UUID.randomUUID().toString(); 
    // 快取ticket
    String ticket = memoryCacheManager.cacheJsSDKTicket(appid);
    // 簽名
    String sign = weChatApi.signJsSDK(ticket, url, timestamp, nonceStr); 
    Map resMap = new HashMap();
    resMap.put("appid", appid);
    resMap.put("ticket", ticket);
    resMap.put("sign", sign);
    resMap.put("nonceStr", nonceStr);
    resMap.put("timestamp", timestamp);

    Response resp = new Response(resMap);
    serviceContext.setResponseData(resp);
    serviceContext.setResult(Result.FAULT_RESULT);
}

4、前臺獲取jssdk：

function _wechatConfig(o) {
        wx.config({
            debug: debug, // 開啟除錯模式,呼叫的所有api的返回值會在客戶端alert出來，若要檢視傳入的引數，可以在pc端開啟，引數資訊會通過log打出，僅在pc端時才會列印。
            appId: o.appid, // 必填，公眾號的唯一標識
            timestamp: o.timestamp, // 必填，生成簽名的時間戳
            nonceStr: o.nonceStr, // 必填，生成簽名的隨機串
            signature: o.sign,// 必填，簽名，見附錄1
            jsApiList: [
                'onMenuShareTimeline',
                'onMenuShareAppMessage'
            ] // 必填，需要使用的JS介面列表，所有JS介面列表見附錄2
        });
    }

    function _getWechatJsSdkInfo(callback) {
        var s = W.Storage.get(W.location.href + "_" + area);
            var appid ='wx7e80e8f93543a5c8';
            ajaxJsonCall('/wechat/service/WeChat.getJsSdkInfo.json', {
                url: W.location.href.split('#')[0],
                appid: appid
            }, function (data) {
                if (data.rtnCode === "000000") {
                    var o = data.responseData;
                    W.Storage.set(W.location.href + "_" + area, o, jsSdkTimeout);
                    callback(o);
                } else {
                    W.Storage.remove(W.location.href + "_" + area);
                }
            }, false);
    }

_getWechatJsSdkInfo(_wechatConfig);

wx.checkJsApi({
    jsApiList: [
        'getLocation',
        'onMenuShareTimeline',
        'onMenuShareAppMessage'
    ],
    success: function (res) {
        //alert(JSON.stringify(res));
    }
});

//var url = "www.zaichengdu.com" + app_path;
var url = curDomain;
function _shareAppMessage() {
    // 頁面載入後設置微信分享給朋友的內容
    wx.onMenuShareAppMessage({
        title: '聖誕老人送禮啦，現金紅包人人領！', // 分享標題
        desc: '“聖誕奪包”35000份禮包等你拆！', // 分享描述
        link: encodeURI(curDomain + '/christmas/service/ChristmasSockOnline.home.do?area=cd'),//encodeURI(window.location.href.replace('&from=ad', '')), // 分享連結
        imgUrl: url + '/public/christmas/img/shorejoin.jpg', // 分享圖示
        type: '', // 分享型別,music、video或link，不填預設為link
        dataUrl: '', // 如果type是music或video，則要提供資料鏈接，預設為空
        success: function () {
            // 使用者確認分享後執行的回撥函式
            //Message.toast.success("分享成功！").appear();
        },
        cancel: function () {
            // 使用者取消分享後執行的回撥函式
            //alert('cancel');
        }
    });
}

function _shareTimeline() {
    // 設定分享到朋友圈的內容
    wx.onMenuShareTimeline({
        title: '聖誕老人送禮啦，現金紅包人人領！', // 分享標題
        link: encodeURI(curDomain + '/christmas/service/ChristmasSockOnline.home.do?area=cd'),//encodeURI(window.location.href.replace('&from=ad', '')), // 分享連結
        imgUrl: url + '/public/christmas/img/shorejoin.jpg', // 分享圖示
        success: function () {
            // 使用者確認分享後執行的回撥函式
            Message.toast.success("分享成功！").appear();
        },
        cancel: function () {
            // 使用者取消分享後執行的回撥函式
            //alert('cancel');
        }
    });
}

wx.ready(function () {
    // config資訊驗證後會執行ready方法，所有介面呼叫都必須在config介面獲得結果之後，config是一個客戶端的非同步操作，所以如果需要在頁面載入時就呼叫相關介面，則須把相關介面放在ready函式中呼叫來確保正確執行。對於使用者觸發時才呼叫的介面，則可以直接呼叫，不需要放在ready函式中。
    //alert('success');
    _shareAppMessage();
    _shareTimeline();
});

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