打开APP
userphoto
未登录

开通VIP,畅享免费电子书等14项超值服

开通VIP
thinkphp微信开发之jssdk图片上传并下载到本地服务器

随便写个方法 

public function test2(){        $Weixin = new \Weixin\Controller\BaseController();        $this->assign('signPackage', $Weixin->jssdk->GetSignPackage());        $this->display();}

test2.html核心代码

 <script type="text/javascript" src="__STATIC__/jquery-2.0.3.min.js"></script>    <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script><form action="{:U('doJoin')}"  method="post"><h3 class="title">参赛人员照片:</h3>                <div>                      <img class="preview" src="{$vote.vote_pic|get_cover='thumb'}" alt="">                   <if condition="!$vote['status']" ><button class="uploadImage" type="button" id="vote_pic">点击上传(建议上传800*600的png,jpg,或者gif格式图片)</button></if>                   <input type="hidden" name="vote_pic">                                   </div><button class="bbon" type="submit" id="submit">提交</button></form><script>   wx.config({    debug: false,    appId: '<?php echo $signPackage["appId"];?>',    timestamp: <?php echo $signPackage["timestamp"];?>,    nonceStr: '<?php echo $signPackage["nonceStr"];?>',    signature: '<?php echo $signPackage["signature"];?>',    jsApiList: [    // 所有要调用的 API 都要加到这个列表中    'chooseImage',    'previewImage',    'uploadImage',    'downloadImage'    ]  });  wx.ready(function () {// 5.1 拍照、本地选图      var images = {        localId: [],        serverId: []      };// 5.3 上传图片$(".uploadImage").click(function(){        var that =$(this);        images.localId = [];        wx.chooseImage({          success: function (res) {            images.localId = res.localIds;            if (images.localId.length == 0) {                alert('请先使用 chooseImage 接口选择图片');                return;            }            if(images.localId.length > 1) {                alert('目前仅支持单张图片上传,请重新上传');                images.localId = [];                return;            }            var i = 0, length = images.localId.length;            images.serverId = [];            function upload() {                         wx.uploadImage({                                    localId: images.localId[i],                                    success: function (res) {                                        i++;                                                                    that.siblings('img.preview').attr('src',images.localId[0]);                                        // alert('已上传:' + i + '/' + length);                                                                               images.serverId.push(res.serverId);                                        that.siblings('input[type=hidden]').val(images.serverId[0]);                                        // alert( that.siblings('input[type=hidden]').val());                                        if (i < length) {                                                upload();                                        }                                    },                                    fail: function (res) {                                                alert(JSON.stringify(res));                                     }                          });            }            upload();          }        });});        $("#submit").click(function(){    $.ajax({            type: 'post',            url: $("form").attr('action')  ,            data : $("form").serialize(),            dataType: 'json',            success : function(data){                    if(data.status){                                       alert(data.info);                                       window.location.href = data.url;                          }else{                                          }                                                                            }        });    return false;})       });</script>

提交到服务器端 服务器端处理过程如下

public doJoin(){        if(IS_POST && $_POST['vote_pic']){   //提交过来的vote_pic是微信服务器端的图像资源id            $pic_id = $_POST['vote_pic'];            $return = array();            C('WEIXIN_UPLOAD') = './Uploads/Weixin/';//定义保存路径                        $dir = realpath(C('WEIXIN_UPLOAD')).'/'.date('Y_m_d').'/';//为方便管理图片 保存图片时 已时间作一层目录作区分            if(!file_exists($dir)){                mkdir($dir,'0777');            }            $Weixin = new \Weixin\Controller\BaseController();            $pic_url = $Weixin->WechatAuth->mediaGet($pic_id); //获取服务器图片路径            $time = time().substr($pic_id, 9,3);            $filename = 'wx_'.$time.'.jpg';   //定义图片文件名            $Http = new \Org\Net\Http;            if($Http::curlDownload($pic_url,$dir.$filename)){//http下载图片                $this->success('提交成功',U('index'));            }           }            }

 

本站仅提供存储服务,所有内容均由用户发布,如发现有害或侵权内容,请点击举报
打开APP,阅读全文并永久保存 查看更多类似文章
猜你喜欢
类似文章
【热】打开小程序,算一算2024你的财运
js-sdk 调用微信接口
微信JS-SDK使用范例
微信JSSDK分享功能详解
【微信JSSDK】PHP版微信录音文件下载
图像接口
微信JSSDK说明文档
更多类似文章 >>
生活服务
热点新闻
分享 收藏 导长图 关注 下载文章
绑定账号成功
后续可登录账号畅享VIP特权!
如果VIP功能使用有故障,
可点击这里联系客服!

联系客服