微信公众号开发--微信JS-SDK扫一扫功能
来源:互联网 发布:淘宝奥特曼星计划 编辑:程序博客网 时间:2024/06/18 13:48
首先请阅读微信JS-SDK说明文档,了解微信JS的相关说明。
根据官方的使用步骤,关键的有以下几步
- 绑定域名(很关键)
- 引入JS文件(很简单)
- 通过config接口注入权限验证配置(很重要)
- 通过ready接口处理成功验证(还没用到)
- 通过error接口处理失败验证(还没用到)
绑定域名
如果域名绑定有误,会出现如下错误提示
错误的域名配置示例:
`http://gwchsk.imwork.net/wechat/order/test.html`
域名配置错误的提示信息:
{“errMsg”:”config:invalid url domain”}
所以,域名配置的时候一定要注意
1. 域名不要以http:开头
2. 域名不要配置到具体的页面
配置成功的提示如下
引入JS文件
一行代码就可以了
- 1
- 1
通过config接口注入权限验证配置
这一步非常重要,也是最关键的一步,这一部分
先看官方的示例
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
这里需要从服务器端网页面传递的参数有timestamp、nonceStr和signature而appId和jsApiList都是固定的,这里直接写在页面中。
首先,编写服务器端代码,生成timestamp、nonceStr和signature。
在生成timestamp、nonceStr和signature的时候有两个参数需要获取
一个是access_token,另一个是jsapi_ticket。
access_token的获取需要AppId和AppSecret,获取地址如下,发送GET请求
- 1
- 1
通过HttpClient发送http请求就可以获取到access_token
得到access_token之后,采用http GET方式请求获得jsapi_ticket
- 1
- 1
注意,access_token和jsapi_ticket得有效期为7200秒,开发者必须在自己的服务全局缓存
获得jsapi_ticket之后,就可以生成JS-SDK权限验证的签名了。
签名算法
签名生成规则如下:参与签名的字段包括noncestr(随机字符串), 有效的jsapi_ticket, timestamp(时间戳), url(当前网页的URL,不包含#及其后面部分) 。对所有待签名参数按照字段名的ASCII 码从小到大排序(字典序)后,使用URL键值对的格式(即key1=value1&key2=value2…)拼接成字符串string1。这里需要注意的是所有参数名均为小写字符。对string1作sha1加密,字段名和字段值都采用原始值,不进行URL 转义。
签名算法的实现
最难的就是签名算法的实现部分,幸好微信给了demo,网上好多人都在找,这里我把签名算法的实现贴出来,代码来自微信demo
下载地址
Java代码如下,做了一点点修改
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 20
- 21
- 22
- 23
- 24
- 25
- 26
- 27
- 28
- 29
- 30
- 31
- 32
- 33
- 34
- 35
- 36
- 37
- 38
- 39
- 40
- 41
- 42
- 43
- 44
- 45
- 46
- 47
- 48
- 49
- 50
- 51
- 52
- 53
- 54
- 55
- 56
- 57
- 58
- 59
- 60
- 61
- 62
- 63
- 64
- 65
- 66
- 67
- 68
- 69
- 70
- 71
- 72
- 73
- 74
- 75
- 76
- 77
- 78
- 79
- 80
- 81
- 82
Controller的代码
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
在Controller中将如下参数写进了jsp页面
- 1
- 2
- 3
- 1
- 2
- 3
其次编写jsp页面的代码
在jsp页面中需要将wx.config重的参数进行配置
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
在页面中读值
- 1
- 2
- 3
- 1
- 2
- 3
然后赋值
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
写一个按钮和输入框,将扫描的结果放进输入框
- 1
- 2
- 1
- 2
给按钮绑定事件,并执行微信扫码
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
- 1
- 2
- 3
- 4
- 5
- 6
- 7
- 8
- 9
- 10
- 11
- 12
- 13
- 14
- 15
- 16
- 17
- 18
- 19
运行结果如图
扫一包抽纸
扫网址
微信JS-SDK中的扫一扫就基本实现了。
- 微信公众号开发--微信JS-SDK扫一扫功能
- 微信公众号开发--微信JS-SDK扫一扫功能
- 微信公众号开发--微信JS-SDK扫一扫功能
- 微信公众号开发--微信JS-SDK扫一扫功能(一)
- 微信公众号开发--微信JS-SDK扫一扫功能 《二jsp》
- 微信公众号开发JS-SDK
- [微信JS-SDK]微信公众号JS开发之卡券领取功能详解
- 【微信公众平台开发】微信JS-SDK开发
- 微信公众号 JS-SDK DEMO
- 微信公众号开发SDK
- 微信公众号【微信JS-SDK支付】
- 微信公众号开发--微信JS-SDK分享到朋友圈和分享给朋友
- 关于微信公众号开发【微信JS-SDK】报错:config invalid url domian
- 微信公众平台开发:JS-SDK之分享功能整理(Java)
- 微信公众平台开发:接入JS-SDK和实现分享功能
- 微信公众平台开发:JS-SDK之分享功能整理
- 微信公众平台开发 Node.js SDK
- Node.js微信公众号开发
- java 消息推送的比较
- Android版本更新知识(检测、升级)总结
- Next Permutation
- 算法—猜拳游戏
- (原创)HyperPacer使用技巧之集合点设置
- 微信公众号开发--微信JS-SDK扫一扫功能
- 阿里云centos修改ssh端口后连接失败
- SDUT 3812 离散题目18
- iOS开发
- webservice注解
- python计算文件夹大小(linux du命令 简化版)
- 1.什么是缓存
- sklearn分类算法测试以及自动化调参
- 【微小说】理想