最近接手公众号方面的开发,今天简单测试JSSDK使用
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html
1.设置js接口安全域名:
设置js接口
1》这个域名可以填写到自己项目的文件夹,例如我的域名www.juming.website/test
2》下载修改页面中的txt文件放到我们刚才写的域名的文件夹下:
txt文件下载
2.引入js文件,在我们要编写的html文件中像普通的js引入一样引入微信js:
<script src="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
3.书写config配置:
wx.config({ debug: true, //是否开启调试模式 appId: 'wx5e821bcd97fe****', //你的公众号的appid timestamp: 1578294325, //时间戳,用于生成凭证,这个可以随意生成 nonceStr: 'juming', //生成签名用的随机字符串,这个可以随意定义 signature: 'f74c46ca05d486e790066090d7527c6e81fc****', //签名 jsApiList: ['chooseImage'] //接口列表 });
4signature的生成:
1》首先要使用你的appid和screct生成access_token
https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=你的appid&secret=你的secret
2》用你的access_token 获取jsapi_ticket:
https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi
3》url为你引用微信jssdk那个文件的路径,例如我的路径是:
url=http://www.juming.website/test/index.html
4》文档中需要拼接字符串一共四个参数,timestamp、noncestr为你在wx.config中填写的参数
5》文档中说要对参数按照字段名的ASCII 码从小到大排序,排序后的参数顺序为:
jsapi_ticket noncestr timestamp url
6》拼接完字符串之后,我们需要对它进行sha1运算,我们新建一个php文件,代码如下:
$signature = sha1('jsapi_ticket='.$ticket.'&noncestr='.$noncestr.'×tamp='.$timestamp.'&url='.$url);
生成结果:cb4f23846c7f0ec20449e1281836d49cfd78e3c2
7》将生成的signature填写到config中
$data = [ 'jsapi_ticket' => $ticket, 'noncestr' => $noncestr, 'timestamp' => time(), 'signature' => sha1($signature), 'url' => $url ]; echo json_encode($data);
后面的代码就交给前端了
5.至此配置文件就完成了,按照官方的接口列表,我们就可以使用微信的sdk了: