一、前提:

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

二、简单复述文档:

1、引入JS文件

在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.4.0.js

如需进一步提升服务稳定性,当上述资源不可访问时,可改访问:http://res2.wx.qq.com/open/js/jweixin-1.4.0.js (支持https)。

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

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

所有需要使用JS-SDK的页面必须先注入配置信息

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 () {

          // 设置成功

        }

});

微信开发平台官方文档: https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115

 三、写代码

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

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

config通过

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

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

关于微信JS-SDK 分享接口的两个报错记录的更多相关文章

  1. 微信开发(2):微信js sdk分享朋友圈,朋友,获取config接口注入权限验证(转)

    进行微信开发已经一阵子了,从最初的什么也不懂,到微信授权登录,分享,更改底部菜单,素材管理,等. 今天记录一下微信jssdk 的分享给朋友的功能,获取config接口注入. 官方文档走一下简单说:四步 ...

  2. 微信js sdk分享开发摘记java版

    绑定域名和引入js的就不说了 废话不说直接上代码 public void share(HttpServletRequest request) throws Exception { StringBuff ...

  3. JS版微信6.0分享接口用法分析

    本文实例讲述了JS版微信6.0分享接口用法.分享给大家供大家参考,具体如下: 为了净化网络,整顿诱导分享及诱导关注行为,微信于2014年12月30日发布了<微信公众平台关于整顿诱导分享及诱导关注 ...

  4. 微信JS SDK接入的几点注意事项

    微信JS SDK接入,主要可以先参考官网说明文档,总结起来有几个步骤: 1.绑定域名:先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”.备注:登录后可在“开发者中心”查看对 ...

  5. 实战微信JS SDK开发:贺卡制作与播放(1)

    前段时间忙于CanTK 2.0的开发,所以博客一直没有更新.CanTK 2.0主要增强了游戏和富媒体的开发,现在编码和测试基本完成了,等文档完成了再正式发布,里面有不少激动人心的功能,等发布时再一一细 ...

  6. 微信js sdk上传多张图片

    微信js sdk上传多张图片,微信上传多张图片 该案例已tp3.2商城为例 直接上代码: php代码: public function ind(){ $appid="111111111111 ...

  7. 微信扫一扫JSSDK 扫一扫报错 invalid signature 问题

    交代一下业务场景 在在四个页面都需要用到扫一扫去扫二维码.然而在图三-我的订单 下单中这个页面扫一扫不起效,当时就郁闷了为啥其他页面有用,这里却没用,开始调试吧. 报错信息是签名验证不成功. 自己去打 ...

  8. IntelliJ IDEA中Mapper接口通过@Autowired注入报错的正确解决方式

    转载请注明来源:四个空格 » IntelliJ IDEA中Mapper接口通过@Autowired注入报错的正确解决方式: 环境 ideaIU-2018.3.4.win: 错误提示: Could no ...

  9. 微信JS SDK配置授权,实现分享接口

    微信开放的JS-SDK面向网页开发者提供了基于微信内的网页开发工具包,最直接的好处就是我们可以使用微信分享.扫一扫.卡券.支付等微信特有的能力.7月份的时候,因为这个分享的证书获取问题深深的栽了一坑, ...

随机推荐

  1. JAVA Set 交集,差集,并集

    /** * Created by yuhui on 2017/7/11 0011. */ import java.util.HashSet; import java.util.Set; public ...

  2. 我珍藏的神兵利器 - 效率工具for Win[转]

        工欲善其事必先利其器. 我一直都在不断挑选和优化自己的兵器,以追求着最高效率. 此篇分享下我的私家珍藏的各种神兵利器.如果有朋友能推荐更好的,那就不枉此篇. 分为Windows软件和开发工具两 ...

  3. Supervisor管理进程

    Supervisor管理进程 转载 2016年04月14日 18:26:45 标签: supervisord 28344 Supervisor重新加载配置启动新的进程 liaojie 发布于 1年前, ...

  4. Linux时间子系统之(五):POSIX Clock

    专题文档汇总目录 Notes: 本章主要介绍了若干种类的静态时钟,这些时钟都可以通过k_clock表示,注册到posix_clocks中.这些都是静态时钟,可以分为三大类:各种REALTIME时钟.带 ...

  5. Python web(Django)连接Sql server

    (开开心心每一天~ ---虫瘾师) Python Web(Django) 与SQL SERVRE的连接----Come QQ群:607021567(里面有很多开源代码和资料,并且python的游戏也有 ...

  6. vue2.0填坑有感(持续更新ing)

    1.请求数据 用本地json数据进行mock的时候,一般放在created 过程就Ok了,这样可以尽早获取数据:如果有依赖dom必须存在的清空,就放到mounted里面,具体用法如下所示: // cr ...

  7. 2013-09-16 构建C1000K的服务器(1) – 基础

    http://www.ideawu.net/blog/archives/740.html 著名的 C10K 问题提出的时候, 正是 2001 年, 到如今 12 年后的 2013 年, C10K 已经 ...

  8. 各位情人节快乐, Python帮忙撒狗粮, 我连夜做了这个程序!

    阅读本文大概需要5分钟 码农的情人节 一年一度的情人节要来啦,这个浪漫温馨的节日,走在大街小巷,走在地铁里,走在商场里,走在电影院,姑娘们手里几乎都捧着一束花,心里都是乐滋滋的,一脸幸福的样子,忽然想 ...

  9. ResultSet,RowSet,OracleCachedRowSet和RowSetMetaData区别及联系

    在java主要涉及到数据开发的过程中,我们会和数据库打交道很多,其中使用了数据集比如ResultSet和RowSet,经常使用两种,还有其它的一些,那么这两种的主要区别是什么呢?我们先来看它们引入的方 ...

  10. 理解 RxJava 的线程模型

    来源:鸟窝, colobu.com/2016/07/25/understanding-rxjava-thread-model/ 如有好文章投稿,请点击 → 这里了解详情 ReactiveX是React ...