微信小程序上传大视频文件到七牛 CDN

文章目录

    目前有个需求是使用微信小程序上传视频到后台,视频长度在三分钟左右,大小在 500M 左右。

    微信小程序官方提供了 wx.chooseVideo 接口 ,以拍摄视频或从手机相册中选视频,然后使用七牛的三方上传 SDK 进行上传。

    https://github.com/gpake/qiniu-wxapp-sdk

    wx.chooseVideo 返回的数据

    duration: 17
    errMsg: "chooseVideo:ok"
    height: 1080
    size: 42860973
    tempFilePath: "wxfile://tmp_e21ce2292ded4a8b7ed6b204174a81fc136aaeb5fe4d264a.mp4"
    width: 1920
    

    展示上传进度

    一个可以监听上传进度变化事件,以及取消上传任务的对象

    https://developers.weixin.qq.com/miniprogram/dev/api/UploadTask.html

    三方 CDN 的上传 SDK, 例如七牛 CDN、阿里云 CDN,如果是基于这个 UploadTask 做的,是可以查看上传进度的。

    防止手机自动锁屏,中断上传

    wx.setKeepScreenOn(OBJECT)

    设置是否保持常亮状态。仅在当前小程序生效,离开小程序后设置失效。

    https://developers.weixin.qq.com/miniprogram/dev/api/setKeepScreenOn.html

    // 保持屏幕常亮
    wx.setKeepScreenOn({
        keepScreenOn: true
    })
    

    在小米 Note3 上似乎不生效,但是在我的小米 5x 上倒是没有问题。

    iphone 上点击选择视频按钮无响应问题

    去掉参数 maxDuration,解决。

    iphone 上选择视频之后报错

    uploadFile:fail file path invalid

    猜测,是否等待 100ms 之后就能正常

    https://developers.weixin.qq.com/community/develop/doc/000aae784a09a02ddb288350d56c00?highline=upload

    setTimeout 500 毫秒,依旧不行。

    只要是 400M 以上的大视频文件,就 100% 报错 uploadFile:fail file path invalid。

    所以,根本问题应该是苹果手机上不能选择特别大的文件。解决方法应该是,判断是苹果手机,并且文件特别大,需要启用压缩参数。

    测试了一下,苹果 ios 上没有明显的规律,100 多M 的视频,有的能上传,有的不能,所以 100M 也不是一个临界值。由于我们上传的都是大视频,所以,干脆只要是苹果手机,都进行压缩得了。

    wx.getSystemInfo({
      success(res) {
        console.log(res.platform)  // 判断是否是 ios
      }
    })
    

    关闭小程序似乎不影响上传 。。。

    测试一下。我偶然一次,在进度 100% 后,关闭了小程序,但是再次打开,依然收到了上传成功的回调。

    我觉得难以理解。

    早上在网上看到一种说法是,微信小程序会先将文件上传到腾讯的服务器做中转,然后再发送到目标服务器。

    这种说法没有得到官方的肯定,但是,如果真是这样,那就能完美解释这种现象了。

    上传进度 100% 只是说明文件传输到了腾讯服务器上,这时候关闭小程序,实际上并不影响文件的传输,因为此时文件正在腾讯服务器上往七牛 CDN 传输,然后再次打开小程序,回调也能处理了。

    iphone 上进度错误

    已经上传完成了,但是还是停留在 97%.

    最佳的策略应该是停留在 99%,完成之后,再变成 100%。

    that.setData({
          progress: 100,   // 防止进度显示异常
    })
    

    进度 100% 之后,感觉还要等一半时间

    原因是 uploadfile 是先将文件传输到腾讯的服务器,再由腾讯服务器转发到七牛的服务器。

    上传过程中,网络断开重试问题

    uploadFile:fail 网络连接已中断

    参考

    关于作者 🌱

    我是来自山东烟台的一名开发者,有感兴趣的话题,或者软件开发需求,欢迎加微信 zhongwei 聊聊,或者关注我的个人公众号“大象工具”, 查看更多联系方式