原文:微信JS-SDK“分享信息设置”API及数字签名生成方法(NodeJS版本)

先上测试地址以示成功:

用微信打开下面地址测试

http://game.4gshu.com/deep-love/index.html

获直接扫二维码君

用异步ajax的方式获取数字签名


异步的方式好

1、前后端分离啊

2、一个服务可以供多个微信公众帐号的数字签名服务

在服务器端用NodeJS跑起一个数字签名生成服务,web端用ajax方式请求NodeJS服务获取数字签名信息

得到信息后配置微信JS-SDK

步骤


第一步 认证的微信公众帐号

首先你得拥有一个通过认证了的微信公众号或者开发者帐号,没有通过认证的公众帐号。数字签名认证也能成功,但是分享信息是无法设置成功的;
 

第二步 添加安全域名

在公众帐号平台后台添加app运行的域名地址,可以理解为为某个域名添加白名单功能
以我们公司旗下的榕树下为例:
微信公众号是:榕树下,添加了game.4gshu.com为安全域名,那么我在game.4gshu.com上的网页可以使用榕树下公众帐号的数字签名了
 

第三步 生成数字签名

在微信公众平台后台上面能找到一个 appid 及 secret字符串
通过这两个数据,请求微信提供的两个公开API地址,生成对应的access_token后再生成ticket再通过规则加密成数字签名
注意,数字签名必须在服务端生成,这里我以NodeJS来实现
数字签名具体生成过程,NodeJS版本
1、获取微信签名所需的access_token
https.get('https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=你的appid写在这里&secret=你的secret写在这里', function(_res) {
// 这个异步回调里可以获取access_token
})

2、获取微信签名所需的ticket

https.get('https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=上一步中获取的access_token&type=jsapi', function(_res){
// 这个异步回调里可以获取ticket
});
3、生成数字签名具体方法
ticket、 noncestr、timestamp、url通过微信的规则用sha1加密
noncestr和timestamp在微信官方sample包中有具体的生成方法函数
 // noncestr
var createNonceStr = function() {
return Math.random().toString(36).substr(2, 15);
}; // timestamp
var createTimeStamp = function () {
return parseInt(new Date().getTime() / 1000) + '';
};

也可以参考我代码中的代码

 // 计算签名方法
var calcSignature = function (ticket, noncestr, ts, url) {
var str = 'jsapi_ticket=' + ticket + '&noncestr=' + noncestr + '&timestamp='+ ts +'&url=' + url;
shaObj = new jsSHA(str, 'TEXT');
return shaObj.getHash('SHA-1', 'HEX');
}
var signature = calcSignature(ticket, noncestr, timestamp, url);
4、返回输出signature数字签名以及在生成数字签名时用到的timestamp、nonceStr、url、及appid
因为在客户内初始化微信JS-SDK中还要用到
 
5、至此数字签名生成成功
 

第四步 在web中如何使用数字签名?

1、引入微信JS-SDK
 
2、请求服务器获取数字签名
在web上用ajax方式请求NodeJS服务地址,请求时将当前web地址url上传至服务器
服务器生成数字签名后返回:
signature,timestamp, appid, nonceStr
这四个数据用于配置微信JS-SDK
wx.config({
debug: true,
appId: appid,
timestamp: timestamp,
nonceStr: nonceStr,
signature: signature,
jsApiList: [
'checkJsApi',
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'hideMenuItems',
'chooseImage'
]
});

3、在wx.ready内调用API

wx.ready(function(){
var sdata = {
title: '那年|时光遗忘了,文字却清晰地复刻着',
desc: '那年|时光遗忘了,文字却清晰地复刻着',
link: 'http://game.4gshu.com/deep-love/index2.html',
imgUrl: 'http://game.4gshu.com/xuangedan/other-project/2015-01-06/img/share-wx-logo.jpg',
success: function () {
alert('用户确认分享后执行的回调函数');
},
cancel: function () {
alert('用户取消分享后执行的回调函数');
}
};
wx.onMenuShareTimeline(sdata);
wx.onMenuShareAppMessage(sdata);
});

4、搞定

关于数字签名过期与微信API的1w次请求的限制问题


由于微信提供的两个数字签名生成API有7200秒的有效期,并且暂时有1w次的限制,所以在我们自己服务器上需要将数字签名缓存
 
逻辑是:
如果用户请求时没缓存中没有数字签名,那么请求执行第三步 生成数字签名
如果缓存中有,并且是在2小时内那么直接返回数字签名信息,不去请求微信服务器
如果缓存中的数字签名过期了(超过2小时)则还是执行第三步 生成数字签名
 
 
注意:由于微信规定地址栏中的参数发生变化都认作是新的请求地址,数字签名也需要重新生成。
 
新生成的数字签名将存入cachedSignatures对象内
缓存中的数据结构将url设为key
数据结构如下:
var cachedSignatures =  {
'http://game.4gshu.com/': {
appid: ’微信认证帐号的的appid'
,secret: '微信认证帐号的secret'
,timestamp: '1421135250'
,noncestr: 'ihj9ezfxf26jq0k'
}
}

测试项目源码


我的项目源码已经放到Github上了,有需要的可以pull下来看一看,

NodeJS我也是一知半解,将就着用,多有不足之处,欢迎交流

源码地址:https://github.com/willian12345/wechat-JS-SDK-demo

 ======== ======== ======== ======== ======== ======== ======== ======== ======== ========
博客园willian12345
by sheldon.wang

微信JS-SDK“分享信息设置”API及数字签名生成方法(NodeJS版本)的更多相关文章

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

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

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

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

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

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

  4. 微信js SDK接口

    微信JS-SDK说明文档 http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html 一.微信登录功能 在进行微信OAut ...

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

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

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

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

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

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

  8. 调用微信js sdk

    场景:需要调用微信获取当前位置的借口. 途径:查看微信 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 .后 ...

  9. 微信JS SDK使用权限签名算法

    jsapi_ticket 生成签名之前必须先了解一下jsapi_ticket,jsapi_ticket是公众号用于调用微信JS接口的临时票据.正常情况下,jsapi_ticket的有效期为7200秒, ...

随机推荐

  1. C++ Primer 学习笔记_53_类和数据抽象 --友元、static员

    分类 --友元.static成员 一.友元 友元机制同意一个类将对其.友元关系:一个样例 如果一个窗体管理类Window_Mgr可能须要訪问由其管理的Screen对象的内部数据.Screen应该同意其 ...

  2. ExtJs迄今datefield控制设置默认值

    假设extjs4 datefield日期控件设置默认值.为当天的前一月,和后一月 Ext.Date.MONTH      月 Ext.Date.YEAR         年 Ext.Date.DAY  ...

  3. Web Service简单入门示例

    Web Service简单入门示例     我们一般实现Web Service的方法有非常多种.当中我主要使用了CXF Apache插件和Axis 2两种. Web Service是应用服务商为了解决 ...

  4. [ Talk is Cheap Show me the CODE ] : jQuery Mobile工具栏

    [ Talk is Cheap Show me the CODE ] : jQuery Mobile工具栏 Written In The Font " Wirte less Do more& ...

  5. R三星463无线网卡驱动,声音驱动程序,FN快捷键驱动,Easy_Display_Manager

    http://download.csdn.net/detail/u012120447/7568369 当我们重装系统,该卡不能使用,您需要使用快捷键无法使用时, Easy_Display_Manage ...

  6. 返璞归真 asp.net mvc (3) - Controller/Action

    原文:返璞归真 asp.net mvc (3) - Controller/Action [索引页] [源码下载] 返璞归真 asp.net mvc (3) - Controller/Action 作者 ...

  7. POJ 3177 Redundant Paths POJ 3352 Road Construction(双连接)

    POJ 3177 Redundant Paths POJ 3352 Road Construction 题目链接 题意:两题一样的.一份代码能交.给定一个连通无向图,问加几条边能使得图变成一个双连通图 ...

  8. TCP/IP具体解释--nagle算法和TCP_NODELAY

    在client一直给server发送小数据的时候,接受到一个回应会在非常长的时间以后,可是将多个小数据写操作合并成一个写操作,问题就没了. 这个事件的缘由可能是TCP_NODELAY的原因 如今大概明 ...

  9. shell编程三大神器之grep

  10. LINQ之路(1):LINQ基础

    本文将从什么是LINQ(What).为什么使用LINQ(Why)以及如何使用LINQ(How)三个方面来进行说明. 1.什么是LINQ LINQ(Language Integrated Query)是 ...