欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

关于微信JS-SDK 分享接口的两个报错记录

程序员文章站 2022-04-04 15:18:22
一、前提: 微信测试号,用微信开发者工具测试 二、简单复述文档: 1、引入JS文件 在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.4.0.js 如需进一步提升服务稳定性,当上述资源不可访问时,可改访问:ht ......

一、前提:

微信测试号,用微信开发者工具测试

二、简单复述文档:

1、引入js文件

在需要调用js接口的页面引入如下js文件,(支持https):

如需进一步提升服务稳定性,当上述资源不可访问时,可改访问: (支持https)。

备注:支持使用 amd/cmd 标准模块加载方法加载

2、通过config接口注入权限验证配置

所有需要使用js-sdk的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的spa的web app可在每次url变化时进行调用,目前android微信客户端不支持pushstate的h5新特性,所以使用pushstate来实现web app的页面会导致签名失败,此问题会在android6.2中修复)。

wx.config({

    debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。

    appid: '', // 必填,公众号的唯一标识

    timestamp: , // 必填,生成签名的时间戳

    noncestr: '', // 必填,生成签名的随机串

    signature: '',// 必填,签名

    jsapilist: [] // 必填,需要使用的js接口列表

});

 

 

3、签名算法

签名生成规则如下:参与签名的字段包括noncestr(随机字符串), 有效的jsapi_ticket, timestamp(时间戳), url(当前网页的url,不包含#及其后面部分) 。对所有待签名参数按照字段名的ascii 码从小到大排序(字典序)后,使用url键值对的格式(即key1=value1&key2=value2…)拼接成字符串string1。这里需要注意的是所有参数名均为小写字符。对string1作sha1加密,字段名和字段值都采用原始值,不进行url 转义。

即signature=sha1(string1)。 示例:

noncestr=wm3wzytpz0wzccnw

jsapi_ticket=sm4aovdwfpe4dxkxges8vmcpggvi4c3vm0p37wvucfvkvay_90u5h9nbslyy3-sl-hhtdfl2fzfy1aochkp7qg

timestamp=1414587457

url=http://mp.weixin.qq.com?params=value

 

 

步骤1. 对所有待签名参数按照字段名的ascii 码从小到大排序(字典序)后,使用url键值对的格式(即key1=value1&key2=value2…)拼接成字符串string1:

jsapi_ticket=sm4aovdwfpe4dxkxges8vmcpggvi4c3vm0p37wvucfvkvay_90u5h9nbslyy3-sl-hhtdfl2fzfy1aochkp7qg&noncestr=wm3wzytpz0wzccnw&timestamp=1414587457&url=http://mp.weixin.qq.com?params=value

 步骤2. 对string1进行sha1签名,得到signature:

0f9de62fce790f9a083d5c99e95740ceb90c27ed

注意事项

1.签名用的noncestr和timestamp必须与wx.config中的noncestr和timestamp相同。

2.签名用的url必须是调用js接口页面的完整url。

3.出于安全考虑,开发者必须在服务器端实现签名的逻辑。

4、自定义“分享给朋友”及“分享到qq”按钮的分享内容(1.4.0)

wx.ready(function () {   //需在用户可能点击分享按钮前就先调用

    wx.updateappmessagesharedata({

        title: '', // 分享标题

        desc: '', // 分享描述

        link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号js安全域名一致

        imgurl: '', // 分享图标

        success: function () {

          // 设置成功

        }

});

5、自定义“分享到朋友圈”及“分享到qq空间”按钮的分享内容(1.4.0)

wx.ready(function () {      //需在用户可能点击分享按钮前就先调用

    wx.updatetimelinesharedata({

        title: '', // 分享标题

        link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号js安全域名一致

        imgurl: '', // 分享图标

        success: function () {

          // 设置成功

        }

});

 

 三、写代码

public map<string,string> getshareinformation(string link) throws exception{

               string appid = wechatutil.appid;

               string appcret = wechatutil.appsecret;

               string timestamp = string.valueof(system.currenttimemillis()/1000).trim();

               string noncestr = wechatutil.generatenoncestr().substring(0,16);

               string jsapi_ticket = wechatutil.getsharejsapitick(appid, appcret, 8);

               string signature = share.sha1("jsapi_ticket="+jsapi_ticket+"&noncestr="+noncestr+"&timestamp="+timestamp+"&url="+link);

               map<string,string>data = new hashmap<string,string>();

               data.put("appid", appid.tostring());

               data.put("timestamp",timestamp);

               data.put("noncestr", noncestr);

               data.put("signature", signature);

               return data;

        }
function setshare(openid){

        var ref = window.location.href.split('#')[0];

               $.ajax({

                       url: comurl+"share/buttonshare.api?link="+ref,

                       type: 'get',

                       success: function(data){

                          var datas =json.parse(data);

                          if(datas.returncode=='0'){

                                       var obj = datas.obj;

                                       wx.config({

                                           debug: true, // 开启调试模式,

                                          appid: obj.appid, // 必填,公众号的唯一标识

                                          timestamp: obj.timestamp, // 必填,生成签名的时间戳

                                          noncestr: obj.noncestr, // 必填,生成签名的随机串

                                          signature: obj.signature,// 必填,签名,见附录1

                                          jsapilist: ['updateappmessagesharedata',

                                          'updatetimelinesharedata'], // 必填,需要使用的js接口列表,所有js接口列表见附录2

                                       success:function(res){

                                              console.log("wx.config成功"+res);

                                       },

                                          fail:function(res){

                                              console.log("wx.config失败"+res);

                                       }

                                   });

                                   wx.ready(function () {      //需在用户可能点击分享按钮前就先调用

                                       wx.updateappmessagesharedata({  //“分享给朋友”及“分享到qq”

                                              title: '测试', // 分享标题

                                              desc: '快来帮我集能量', // 分享描述

                                              link: comhref+"share.html?openid="+openid, // 分享链接,

                                              imgurl: comhref+"images/xiaoguanjia.png", // 分享图标

                                              success: function () {

                                                         console.log("分享成功");

                                                  },

                                                  cancel: function () {

                                                         console.log("取消分享");

                                                  }

                        });

                        wx.updatetimelinesharedata({   //“分享到朋友圈”及“分享到qq空间”

                                              title: '测试', // 分享标题

                                              link: comhref+"share.html?openid="+openid, // 分享链接,

                                              imgurl: comhref+"images/xiaoguanjia.png", // 分享图标

                                              success: function () {

                                                         console.log("分享成功");

                                                  },

                                                  cancel: function () {

                                                         console.log("取消分享");

                                                  }

                                       });

                                      

                  });

                      }else{

                                  $.dialog.alert(datas.message)

                          }

                        },

                       error:function(data) {

                             var datas =json.parse(data);

                       }

               });

        }

 

四、测试

遇到两个问题

问题一:报错 invaid url domain

 关于微信JS-SDK 分享接口的两个报错记录

 

原因是我配置有问题:不能有http://  直接写域名,就可以了

 关于微信JS-SDK 分享接口的两个报错记录

config通过

 关于微信JS-SDK 分享接口的两个报错记录

接着出现问题二:没有此sdk或暂不支持此sdk模拟

 关于微信JS-SDK 分享接口的两个报错记录

是因为我用的微信开发工具,不支持这个工具,换成手机就没问题了

 关于微信JS-SDK 分享接口的两个报错记录