调用微信JS-SDK配置签名
前后端进行分开开发:
1:后端实现获取
+++接口凭证:access_token (公众号的全局唯一接口调用凭据)
** GET 获取:https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
+++接口票据:jsapi_ticket ( JS-SDK 配置签名票据)
** GET获取:https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi
2:进行字典URL键值对的格式排序(即key1=value1&key2=value2…)拼接成字符串
(微信配置签名以)
详情:#附录1-JS-SDK使用权限签名算法 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
后端实现了签名配置,前端调用后端提供的接口即可
注意:打开是在自己服务号配置好的域名形式打开:如 http://buy.shopline.com//html/index.html
在微信开发工具或是微信上,打开 便会提示 配置具体是否成功信息!
config:ok即表示完成配置,就可以调用 JS-SDK了,实现自己具体的想要的JS-SDK提供的接口!
/js/wxconfig.js
//配置 wx.config
//这一步配置成功的 $.ajax({
url: '/config',
type: 'GET',
//必须进行 url 编码
////////////////////
data: {
url: location.href.split('#')[0]//@todo 重要:后台需要获取签名使用
},
dataType: 'json',
success: function (res) {
wx.config({
beta: true,
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: res.appid, // 必填,公众号的唯一标识 wx4943f6480a79a436
timestamp: res.timestamp, // 必填,生成签名的时间戳
nonceStr: res.nonceStr, // 必填,生成签名的随机串
signature: res.signature,// 必填,签名,见附录1
jsApiList: ['chooseInvoice', 'chooseCard'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
});
}
})
//index.html
<script src="http://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>
<script src="/js/wxconfig.js"></script>
<script>
wx.ready(function () {
//此处配置完成,根据自己需求进行接口是否配置完成调用
//wx.ready 如 document.ready
});
</script>
只要这一步,成功了!下面干正事......
调用微信JS-SDK配置签名的更多相关文章
- 微信JS SDK配置授权,实现分享接口
微信开放的JS-SDK面向网页开发者提供了基于微信内的网页开发工具包,最直接的好处就是我们可以使用微信分享.扫一扫.卡券.支付等微信特有的能力.7月份的时候,因为这个分享的证书获取问题深深的栽了一坑, ...
- 调用微信js sdk
场景:需要调用微信获取当前位置的借口. 途径:查看微信 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 .后 ...
- 微信JS SDK接入的几点注意事项
微信JS SDK接入,主要可以先参考官网说明文档,总结起来有几个步骤: 1.绑定域名:先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”.备注:登录后可在“开发者中心”查看对 ...
- 实战微信JS SDK开发:贺卡制作与播放(1)
前段时间忙于CanTK 2.0的开发,所以博客一直没有更新.CanTK 2.0主要增强了游戏和富媒体的开发,现在编码和测试基本完成了,等文档完成了再正式发布,里面有不少激动人心的功能,等发布时再一一细 ...
- 微信js sdk上传多张图片
微信js sdk上传多张图片,微信上传多张图片 该案例已tp3.2商城为例 直接上代码: php代码: public function ind(){ $appid="111111111111 ...
- 微信JS SDK使用权限签名算法
jsapi_ticket 生成签名之前必须先了解一下jsapi_ticket,jsapi_ticket是公众号用于调用微信JS接口的临时票据.正常情况下,jsapi_ticket的有效期为7200秒, ...
- 微信js SDK接口
微信JS-SDK说明文档 http://mp.weixin.qq.com/wiki/7/aaa137b55fb2e0456bf8dd9148dd613f.html 一.微信登录功能 在进行微信OAut ...
- 微信js sdk分享开发摘记java版
绑定域名和引入js的就不说了 废话不说直接上代码 public void share(HttpServletRequest request) throws Exception { StringBuff ...
- 关于微信JS SDK接口wx.previewImage预览接口的使用
然后后之前的项目,突然往微信上迁移了,一些微信的接口没怎么用过,比较陌生,这次的功能是想调用微信的接口,实现图片放大的功能, 就找到官方文档:http://qydev.weixin.qq.com/wi ...
- 微信支付配置信息,JSAPI接口,H5调用微信js接口支付,微信公众号支付
微信支付已经做完了,没接触过微信的我,经历了非常艰难的3天,才把微信支付给做出来,对于专业的人来说,估计就是一小时就搞定的事情了,虽然说做了很长时间,但是确实也学到东西了,也收获了不少,下面跟大家分享 ...
随机推荐
- fio 测试 磁盘I/O: ls -1 /sys/block/sda/queue/ | awk '{cmd="cat "i$0; print i$0; system(cmd) }' i=`pwd`'/'
小型计算机系统接口(SCSI,Small Computer System Interface) SAS(Serial Attached SCSI,串列SCSI) SCSI 硬盘名称: sd[a-p] ...
- 20180323 DataTable增加DataRow方式优化
1. 我开始开发程序时,很多问题考虑不周期,不断的在改进中 最开始我的写法,创建一个DataTable 的Columns,采用语句 dt2.Columns.Add("ID"); 这 ...
- 3 jmeter的两种录制方法
录制1-badboy(推荐) badboy是一款自动化测试工具,它可以完成简单的功能测试和性能测试.其实它是一款独立的测试工具,只不过它录制东西导出的格式适用于jmeter,所以我们经常把jmeter ...
- winform里直接使用WCF,不需要单独的WCF项目
https://www.cnblogs.com/fengwenit/p/4249446.html 依照此法建立即可, 但是vs生成的配置有误,正确配置如下 <?xml version=" ...
- c#获取Amr文件的时长(毫秒)亲测有效
/// <summary> /// c#获取Amr文件的时长(毫秒) /// </summary> /// <param name="fileName" ...
- React篇-子组件调用父组件方法,并传值
react 中子组件调用父组件的方法,通过props: 父组件: isNote(data){} <div className="tabC01"> <FTab ta ...
- 常用笔记:Linux
Linux打包压缩排除指定文件夹: 使用Linux的tar 命令打包压缩文件夹,有时候需要排除里面的某几个文件夹,加上--exclude参数: tar -zcvf blog.tar.gz --excl ...
- 【LeetCode每天一题】Substring with Concatenation of All Words(具备列表中所有单词的字串)
You are given a string, s, and a list of words, words, that are all of the same length. Find all sta ...
- 修改CentOS的IP地址
一.临时修改 命令:ifconfig eth0 192.168.1.147 重启或者关机后,iP地址将会恢复到修改之前的状态. 二.永久修改 命令: vi /etc/sysconfig/network ...
- 如何打印一棵树(Java)
1.有一棵多叉树,将它打印出来. import java.util.LinkedList; /** * 需求:按层打印一棵树 * 说明:树是保存在一个链表中 * created by wangjunf ...