微信JSSDK上传图片报{"errcode":40007,"errmsg":"invalid media_id"}错误,修复办法


2020-08-30 17:13:46 by Sikoay with 0 comments 1 Hits
Blog 1

最近在使用wx.uploadImage() JSSDK 上传图片时,正常返回了serverId,但传到PHP端一直报{"errcode":40007,"errmsg":"invalid media_id"}错误

在严格审查代码无误后,百度了很久都没法解决。。。最后的最后终于发现原因!!!

原来是微信开发者工具调用图片上传接口不会返回正确的serverId(media Id),在使用手机查看后,发现 serverId 的确返回的确不同了,传到后端后正确使用接口获取到了图片。。

 

无语。。

贴一个代码:

JS:

// 调取照相机和相册
function takePicture() {
  wx.chooseImage({
    count: 1,
    sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有
    sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机,默认二者都有
    success: function (data) {
      localIds = data.localIds[0];   // 返回选定照片的本地ID列表,localId可以作为img标签的src属性显示图片
      // 上传到微信服务器
      uploadImage(localIds);
      // 获取本地图片接口,在本地显示
      // wxgetLocalImgData(localIds);
    },
    fail: function (res) {
      alterShowMessage("操作提示", JSON.stringify(res), "1", "确定", "", "", "");
    }
  });
}

// 上传到微信服务器,然后通知后端,让后端下载,并返回图片URL
function uploadImage(e) {
  wx.uploadImage({
    localId: e, // 需要上传的图片的本地ID,由chooseImage接口获得
    isShowProgressTips: 1, // 默认为1,显示进度提示
    success: function (res) {
      getImageUrl(res.serverId)
    },
    fail: function (error) {
      picPath = '';
      localIds = '';
      alert(Json.stringify(error));
    }
  });
}
// 将mediaId通知后端,让后端下载
function getImageUrl(id){
      $.ajax({
      type: "POST",
      url: "{{ route('wechat.getUrlImage') }}",
      data: {
        id : id
      },
      dataType: "json",
        success: function(data) {
          var tmpl = '<li class="weui-uploader__file" ><img src="#url#"/>' +
              '<input type="hidden" name="proimg[]" value="#url#"></li>';
          $("#uploaderFiles").append($(tmpl.replace(new RegExp("#url#", "g"), data.url)));
      },
        error: function(error) {
          alert('错误');
          alert(error);
          alert(error.data);
      }
    });
}

 

PHP: 使用了Laravel-wechat插件

    public function getImageUrl(Request $request){
        $app = app('wechat.official_account');
        $stream = $app->media->get($request->input('id'));


        if ($stream instanceof \EasyWeChat\Kernel\Http\StreamResponse) {
            // 以内容 md5 为文件名存到本地
            $filename = $stream->save(storage_path().'/app/wechat');

            $file=new File(storage_path().'/app/wechat/'.$filename);
            $oss_filename = Storage::disk('oss')->putFile('/', $file);
            // 自定义文件名,不需要带后缀
            // $stream->saveAs('保存目录', '文件名');

            return response()->json([
                'state' => '0',
                'url'=>Storage::url($oss_filename)
            ]);
        }else{
            return response()->json($stream,500);
        }

    }

Tags:

回复 (0)

Leave a Comment