当前位置: 首页 > 后端技术 > PHP

Thinkphp3.2,微信JS-SDK开发过程中遇到的各种问题及细节分享

时间:2023-03-29 20:01:55 PHP

先完成官方文档的前两步(很容易理解,就不细说了):第一步:绑定域名并登录微信公众平台,进入“公众号设置”的“功能设置”,填写“JS接口安全域名”。备注:登录后可在“开发者中心”查看相应接口权限。第二步:导入JS文件在需要调用JS接口的页面导入如下JS文件,(支持https):jweixin-1.2.0.js备注:支持使用AMD/CMD标准模块加载方式加载和加载然后从第3步开始执行第3步:通过config接口注入权限验证配置。这个地方使用ajax来注入权限;变种链接=“”;//用于接收返回的url$(document).ready(function(){ajaxconfig();});functionajaxconfig(){/*获取当前页面的url,传给服务器完成签名。这是最大的陷阱。您必须在url上使用encodeURIComponent()。*因为页面一旦被分享,微信客户端会在你的链接末尾添加其他参数。如果当前链接不是动态获取的,共享页面的签名会失败。*/varurl=encodeURIComponent(window.location.href.split('#')[0]);vareventinfo={url:url,};$.ajax({type:"post",url:"{:U('Event/get_config')}",//服务器端urldata:eventinfo,dataType:'json',success:function(obj){//注入权限验证配置wx.config({debug:true,//实现阶段开启debugappId:obj.appId,//必填,公众号的唯一标识timestamp:obj.timestamp,//必填,生成签名的时间戳nonceStr:obj.nonceStr,//必填,生成签名随机字符串signature:obj.signature,//必填,签名jsApiList:[//必填,需要使用的JS接口列表,全部官方文档中列出了JS接口列表'checkJsApi','onMenuShareTimeline','onMenuShareAppMessage','onMenu分享QQ','onMenuShareWeibo']});链接=obj.url;//获取签名成功返回的url}})}wx.ready(function(){//注入权限验证成功后执行,以“分享给朋友”为例wx.onMenuShareAppMessage({title:'',//分享标题desc:'',//分享描述link:link,//分享链接,链接的域名或路径必须对应当前页面公众号JS安全域名为same(ajax返回的url)imgUrl:'',//分享图标type:'',//分享类型,音乐,视频或链接,不填默认为链接dataUrl:'',//iftype如果是音乐或视频,需要提供数据链接,默认为空success:function(){//用户确认分享后执行的回调函数},cancel:function(){//用户确认分享后执行的回调函数用户取消分享}});};接下来在服务端完成签名并返回权限验证配置信息下载示例代码pro官网提供,参考jssdk.php中的代码逐步实现。首先创建一个“事件”控制器:EventController.class.php;模板文件event.html;//控制器代码//获取一个随机字符串,直接复制jssdk.phpprivatefunctioncreateNonceStr($length=16){$chars="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";$str="";对于($i=0;$i<$length;$i++){$str.=substr($chars,mt_rand(0,strlen($chars)-1),1);}return$str;}//获取ticket,复制jssdk.php修改privatefunctiongetJsApiTicket(){//用于缓存jsapiTicket的文件地址,将官方例子中的jsapi_ticket.php复制到你的存储位置//拼接文件地址$jsapi_ticket_url=$_SERVER['DOCUMENT_ROOT']."/Public/js/home/event/jsapi_ticket.php";//jsapi_ticket应该全局存储和更新,下面代码写到文件中来做Example$data=json_decode($this->get_php_file($jsapi_ticket_url));//修改get_php_file()中的变量if($data->expire_timegetAccessToken();$url="https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken";$res=json_decode($this->httpGet($url));$ticket=$res->票;如果($ticket){$data->expire_time=time()+7000;$data->jsapi_ticket=$ticket;$this->set_php_file($jsapi_ticket_url,json_encode($data));//修改set_php_file()变量}}else{$ticket=$data->jsapi_ticket;}return$ticket;}//获取AccessToken,复制jssdk.php修改私有函数getAccessToken(){$appId="YourAppID";$appSecret="DeveloperpasswordAppSecret";//用于缓存AccessToken的文件地址,把官方例子中的access_token.php复制到你要存放的位置$access_token_url=$_SERVER['DOCUMENT_ROOT']."/public/js/home/event/access_token.php";//access_token应该全局存储和更新,下面的代码以写入文件为例$data=json_decode($this->get_php_file($access_token_url));//修改get_php_file()变量inif($data->expire_timehttpGet($url));$access_token=$res->access_token;如果($访问ss_token){$data->expire_time=time()+7000;$data->access_token=$access_token;$this->set_php_file($access_token_url,json_encode($data));//修改set_php_file()中的量}}else{$access_token=$data->access_token;}return$access_token;}//直接复制jssdk.phpprivatefunctionhttpGet($url){$curl=curl_init();curl_setopt($curl,CURLOPT_RETURNTRANSFER,true);curl_setopt($curl,CURLOPT_TIMEOUT,500);curl_setopt($curl,CURLOPT_SSL_VERIFYPEER,false);curl_setopt($curl,CURLOPT_SSL_VERIFYHOST,false);curl_setopt($curl,CURLOPT_URL,$url);$res=curl_exec($curl);curl_close($curl);return$res;}//直接复制jssdk.phpprivatefunctionget_php_file($filename){returntrim(substr(file_get_contents($filename),15));}//直接复制jssdk.phpprivatefunctionset_php_file($filename,$content){$fp=fopen($filename,"w");fwrite($fp,"".$content);fclose($fp);}publicfunctionget_config(){$url=urldecode(I('post.url'));//解码ajax发送的url!!!这里是坑$timestamp=time();//时间戳$nonceStr=$this->createNonceStr(16);//随机字符串$jsapiTicket=$this->getJsApiTicket();//ticket$string="jsapi_ticket=$jsapiTicket&noncestr=$nonceStr×tamp=$timestamp&url=$url";$signature=sha1($string);//signature//这里还可以返回分享标题,分享描述,缩略图地址等$config['appId']="AppID";$config['时间戳']=$时间戳;$config['nonceStr']=$nonceStr;$config['signature']=$signature;$config['url']=$url;$this->ajaxReturn($config);}在手机测试中,开启debug后,如果签名成功,会直接提示OK。能写能读3.url是否转码解码,这个地方很重要。否则,共享页面将无法签名。4、ajax返回的url和分享链接是否一致?