微信图像接口

来源：互联网发布：权知开封府编辑：程序博客网时间：2024/05/29 11:29

前几天weiphp下做了一下微信图像接口的测试，实现了通过jssdk图像的拍照，选择上传等等，现在分享一下。

首先导入了一下微信给出的jssdk.php的类文件，写成Jssdk.class.php(注：我是在weiphp开发的)，同时新建一个Api文件夹与控制器同一级，把Jssdk放在该文件夹下面然后在自己插件的控制器下面导入该类文件。

<span style="color:#ff0000;">  use Addons\Suggestions\Api\Jssdk;</span>

实现文件的导入，
因此我们可以在控制器下实例化这个类文件。

<span style="color:#ff0000;">  $jssdk = new Jssdk("你的appId", "你的appSecret");      $signPackage = $jssdk->GetSignPackage();</span>

<span style="color:#ff0000;">  var_dump($signPackage);exit(); //你可以把获取的数据dump出来，然后注释掉。</span>

  返回的<span style="font-family: Arial, Helvetica, sans-serif;">$signPackage包含了你接口注入权限，我们把返回的数据分配到前台</span>

<span style="font-family:Arial, Helvetica, sans-serif;"><span style="color:#ff0000;">    $this->assign('app',$signPackage);</span></span>

<span style="font-family:Arial, Helvetica, sans-serif;"><span style="white-space: pre;"></span>因此我们在前台可以接收到我们需要的数据，把数据放在js里的里再次之前导入js库</span>

<span style="font-family:Arial, Helvetica, sans-serif;"></span><pre name="code" class="html">

<span style="font-family:Arial, Helvetica, sans-serif;"><span style="color: rgb(51, 51, 51); font-family: 'Microsoft Yahei', 宋体, Tahoma, Arial; font-size: 14px; line-height: 21px;">     在需要调用JS接口的页面引入如下JS文件，（支持https）：</span><a target=_blank href="http://res.wx.qq.com/open/js/jweixin-1.0.0.js" class="external free" rel="nofollow" target="_blank" style="color: rgb(54, 103, 153); text-decoration: none; font-family: 'Microsoft Yahei', 宋体, Tahoma, Arial; font-size: 14px; line-height: 21px;">http://res.wx.qq.com/open/js/jweixin-1.0.0.js</a></span>

<span style="font-family:Arial, Helvetica, sans-serif;"><span style="color:#ff0000;">            var appId="{$app['appId']}";            var timestamp="{$app['timestamp']}";            var nonceStr="{$app['nonceStr']}";            var signature= "{$app['signature']}";             //alert(appId);            // alert(timestamp);            //alert(nonceStr);            //  alert(signature);</span></span>

<span style="font-family:Arial, Helvetica, sans-serif;"><span style="color:#ff0000;">           然后配置congig</span></span>

<span style="font-family:Arial, Helvetica, sans-serif;"><span style="color:#ff0000;"><span style="white-space:pre"></span></span></span><pre name="code" class="javascript">        wx.config({   <span style="white-space:pre"></span>debug: false,//开始的时候填true   <span style="white-space:pre"></span>appId: appId,    timestamp:timestamp,   nonceStr: nonceStr,  signature: signature,  jsApiList: [        <span style="white-space:pre"></span>'checkJsApi',      <span style="white-space:pre"></span>  'onMenuShareTimeline',       <span style="white-space:pre"></span> 'onMenuShareAppMessage',       <span style="white-space:pre"></span> 'onMenuShareQQ',       <span style="white-space:pre"></span> 'onMenuShareWeibo',       <span style="white-space:pre"></span> 'hideMenuItems',       <span style="white-space:pre"></span> 'showMenuItems',       <span style="white-space:pre"></span> 'hideAllNonBaseMenuItem',       <span style="white-space:pre"></span> 'showAllNonBaseMenuItem',       <span style="white-space:pre"></span> 'translateVoice',      <span style="white-space:pre"></span>  'startRecord',       <span style="white-space:pre"></span> 'stopRecord',       <span style="white-space:pre"></span> 'onRecordEnd',       <span style="white-space:pre"></span> 'playVoice',       <span style="white-space:pre"></span> 'pauseVoice',      <span style="white-space:pre"></span>  'stopVoice',       <span style="white-space:pre"></span> 'uploadVoice',     <span style="white-space:pre"></span>   'downloadVoice',       <span style="white-space:pre"></span> 'chooseImage',      <span style="white-space:pre"></span>  'previewImage',      <span style="white-space:pre"></span>  'uploadImage',      <span style="white-space:pre"></span>  'downloadImage',       <span style="white-space:pre"></span> 'getNetworkType',      <span style="white-space:pre"></span>  'openLocation',      <span style="white-space:pre"></span>  'getLocation',      <span style="white-space:pre"></span>  'hideOptionMenu',      <span style="white-space:pre"></span>  'showOptionMenu',      <span style="white-space:pre"></span>  'closeWindow',      <span style="white-space:pre"></span>  'scanQRCode',       <span style="white-space:pre"></span> 'chooseWXPay',       <span style="white-space:pre"></span> 'openProductSpecificView',       <span style="white-space:pre"></span> 'addCard',       <span style="white-space:pre"></span> 'chooseCard',     <span style="white-space:pre"></span>   'openCard'    <span style="white-space:pre"></span> ]  });

<span style="white-space:pre"></span><pre name="code" class="javascript"> <span style="white-space:pre"></span>wx.ready(function () {                      // 在这里调用 API                                                   <span style="white-space:pre"></span>  var images = {     <span style="white-space:pre"></span>   localId: [],      <span style="white-space:pre"></span>   serverId: []   <span style="white-space:pre"></span> };    <span style="white-space:pre"></span>document.querySelector('#chooseImage').onclick = function () {     <span style="white-space:pre"></span>    wx.chooseImage({        <span style="white-space:pre"></span> success: function (res) {       <span style="white-space:pre"></span>         images.localId = res.localIds;              <span style="white-space:pre"></span>  var image = document.createElement("img");              <span style="white-space:pre"></span>  image.src = res.localIds;              <span style="white-space:pre"></span>  document.querySelector("#imageList").appendChild(image);        <span style="white-space:pre"></span> }        <span style="white-space:pre"></span> });            <span style="white-space:pre"></span> }<span style="white-space:pre"></span>   <span style="white-space:pre"></span> document.querySelector("#previewImage").onclick = function(){      <span style="white-space:pre"></span>wx.previewImage({       <span style="white-space:pre"></span> <span style="white-space:pre"></span>current: "localIds",       <span style="white-space:pre"></span> urls :  [                  <span style="white-space:pre"></span>"http://img3.douban.com/view/photo/photo/public/p2152117150.jpg",                  <span style="white-space:pre"></span>"http://img3.douban.com/view/photo/photo/public/p2152117150.jpg"      <span style="white-space:pre"></span>  ]    <span style="white-space:pre"></span>  })   <span style="white-space:pre"></span> } <span style="white-space:pre"></span> document.querySelector("#uploadImage").onclick = function(){  <span style="white-space:pre"></span>if(images.localId.length <= 0){  <span style="white-space:pre"></span>alert("请选择照片");  <span style="white-space:pre"></span>return false;  <span style="white-space:pre"></span>}  <span style="white-space:pre"></span>var i = 0, len = images.localId.length;  <span style="white-space:pre"></span>function upload(){  <span style="white-space:pre"></span>wx.uploadImage({  <span style="white-space:pre"></span>localId: images.localId[i],  <span style="white-space:pre"></span>isShowProgressTips:1,  <span style="white-space:pre"></span>success : function(res){  <span style="white-space:pre"></span>i++;  images.serverId.push(res.serverId);                 <span style="white-space:pre"></span>  var serverId = res.serverId;                 <span style="white-space:pre"></span> alert(serverId);  if(i<len){  upload();                         <span style="white-space:pre"></span>}  <span style="white-space:pre"></span>},  <span style="white-space:pre"></span>fail: function(res){  <span style="white-space:pre"></span>alert(JSON.stringify(res));  <span style="white-space:pre"></span>}  <span style="white-space:pre"></span>})  <span style="white-space:pre"></span>}  <span style="white-space:pre"></span>upload();<span style="white-space:pre"></span>  };       <span style="white-space:pre"></span>  document.querySelector("#downloadImage").onclick = function(){  <span style="white-space:pre"></span>if(images.serverId.length<=0){  <span style="white-space:pre"></span>alert("服务器端暂无照片");  <span style="white-space:pre"></span>return false;  <span style="white-space:pre"></span>}  <span style="white-space:pre"></span>var i = 0,len = images.serverId.length;  <span style="white-space:pre"></span>alert(len);  <span style="white-space:pre"></span>function down(){  <span style="white-space:pre"></span>wx.downloadImage({  <span style="white-space:pre"></span>serverId: images.serverId[i],  <span style="white-space:pre"></span>isShowProgressTips: 1,  <span style="white-space:pre"></span>success: function(res){  <span style="white-space:pre"></span>i++;  <span style="white-space:pre"></span>alert(res.localId);  <span style="white-space:pre"></span>if(i<len){  <span style="white-space:pre"></span>down();  <span style="white-space:pre"></span>}<span style="white-space:pre"></span>  <span style="white-space:pre"></span>}  <span style="white-space:pre"></span>})  <span style="white-space:pre"></span>}  <span style="white-space:pre"></span>down(); <span style="white-space:pre"></span> }                                           <span style="white-space:pre"></span> });

基本上完成了。

0 0