微信jssdk的官方文档 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115
JSSDK使用步骤
步骤一:绑定域名
先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
备注:登录后可在“开发者中心”查看对应的接口权限。
步骤二:引入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 标准模块加载方法加载
步骤三:通过config接口注入权限验证配置
所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题会在Android6.2中修复)。
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识
timestamp: , // 必填,生成签名的时间戳
nonceStr: '', // 必填,生成签名的随机串
signature: '',// 必填,签名
jsApiList: [] // 必填,需要使用的JS接口列表
});
php代码:
public function actionSqrcode()
{
//时间戳
$wx['timestamp'] = time();
//生成签名的随机串
$wx['noncestr'] = md5(time());
//jsapi_ticket是公众号用于调用微信JS接口的临时票据。正常情况下,jsapi_ticket的有效期为7200秒,通过access_token来获取。
$wx['jsapi_ticket'] = $this->actionTicket();
//分享的地址,注意:这里是指当前网页的URL,不包含#及其后面部分,曾经的我就在这里被坑了,所以小伙伴们要小心了
$wx['url'] = 'http://'.$_SERVER['HTTP_HOST'].$_SERVER['REQUEST_URI'];
$string = sprintf("jsapi_ticket=%s&noncestr=%s×tamp=%s&url=%s", $wx['jsapi_ticket'], $wx['noncestr'], $wx['timestamp'], $wx['url']);
//生成签名
$wx['signature'] = sha1($string);
return $wx;
}
public function actionAccessToken(){
$file = file_get_contents('./token');
$info = json_decode($file,1);
if ($info && $info['time'] > time())
return $info['access_token'];
$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=你的appid&secret=你的微信秘钥";
$info = file_get_contents($url);
$info = json_decode($info,1);
if ($info){
$info['time'] = time()+$info['expires_in'];
file_put_contents('./token',json_encode($info));
return $info['access_token'];
}else{
return '失败';
}
}
public function actionTicket()
{
$file = file_get_contents('./ticket');
$info = json_decode($file,1);
if ($info && $info['time'] > time())
return $info['ticket'];
$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=".$this->actionAccessToken()."&type=jsapi";
$info = file_get_contents($url);
$info = json_decode($info,1);
if ($info){
$info['time'] = time()+$info['expires_in'];
file_put_contents('./ticket',json_encode($info));
return $info['ticket'];
}else{
return '失败';
}
}
public function actionCurl($url,$data,$type = 'json'){
if($type=='json'){//json $_POST=json_decode(file_get_contents('php://input'), TRUE);
$headers = array("Content-type: application/json;charset=UTF-8","Accept: application/json","Cache-Control: no-cache", "Pragma: no-cache");
$data=json_encode($data);
}
$curl = curl_init();
curl_setopt($curl, CURLOPT_URL, $url);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, FALSE);
curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, FALSE);
if (!empty($data)){
curl_setopt($curl, CURLOPT_POST, 1);
curl_setopt($curl, CURLOPT_POSTFIELDS,$data);
}
curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
//curl_setopt($ch, CURLOPT_HTTPHEADER, $headers );
$output = curl_exec($curl);
curl_close($curl);
return $output;
}
js代码:
<script>
$(function(){
$.ajax({
type:"get",
url:"actionSqrcode",
async:true,
success:function(res){
wx.config({
debug : false,
appId : 'res.appid',
timestamp : "res.timestamp",
nonceStr : "res.noncestr",
signature : "res.signature",
jsApiList : [
'updateTimelineShareData',
]
});
wx.ready(function () { //需在用户可能点击分享按钮前就先调用
wx.updateTimelineShareData({
title: 'xx注册领好礼', // 分享标题
link: "http://www.xxx.com", // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: 'http://www.xxx.com/123.jpg', // 分享图标
success: function (r) {
// 设置成功
}
});
});
}
});
})
</script>
网友评论