微信内调用微信jssdk上传图片

先引入微信jssdk的js

<script type="text/javascript" charset="utf-8" src="https://res.wx.qq.com/open/js/jweixin-1.4.0.js"></script>

微擎内可以直接调用微擎的方法,获取到jssdk需要的config 其他框架请根据微信官方文档生成
php

$account_api = WeAccount::create();$wx_config = $account_api->getJssdkConfig();

js

wx.config({
      // debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
     appId: '{$wx_config["appId"]}', // 必填,公众号的唯一标识
     timestamp: '{$wx_config["timestamp"]}', // 必填,生成签名的时间戳
     nonceStr: '{$wx_config["nonceStr"]}', // 必填,生成签名的随机串
     signature: '{$wx_config["signature"]}',// 必填,签名,见附录1
     jsApiList: ['chooseImage','getLocalImgData'] // 必填,需要使用的JS接口列表,所有JS接口列表见微信公众平台附录
});

wx.chooseImage({
       count: 1, //上传图片的张数,最多上传9张
    sizeType: ['original', 'compressed'],  // 可以指定是原图还是压缩图,默认二者都有
    sourceType: ['album', 'camera'],  // 可以指定来源是相册还是相机,默认二者都有
    success: function(res) {
        wx.getLocalImgData({
           localId: res.localIds[0], // 图片的localID
           success: function (res) {
              var localData = res.localData; // localData是图片的base64数据,可以用img标签显示,也可以传递到后端,生成图片
              if(localData.indexOf('data:image') == -1){
                      localData = 'data:image/jpg;base64,'+ localData;
              }
           }
        });
    },
    fail: function(res) {
    }
});

php解析base64图片保存

            $base64 = str_replace('\n','',$_GPC['img_base64']);
            preg_match('/^(data:\s*image\/(\w+);base64,)/', $base64, $result);
            $type = $result[2]; // 文件后缀
            $new_file = __DIR__.'/images/1/imgfile/';
            if (!file_exists($new_file)) {
                //检查是否有该文件夹,如果没有就创建,并给予最高权限
                mkdir($new_file, 0700);
            }
            $filename = md5(time()) . "." .$type; // 文件名
            $new_file = $new_file . $filename;  // 完整路径+文件名 
            $result = file_put_contents($new_file, base64_decode(str_replace($result[1], '', $base64))); // 大小
Last modification:December 13th, 2019 at 02:00 pm
If you think my article is useful to you, please feel free to appreciate

Leave a Comment

简爱博客