安卓手机vue+axios文件上传非常慢解决方案

最新推荐文章于 2023-11-15 16:02:54 发布

置顶

爱折腾的小码农

最新推荐文章于 2023-11-15 16:02:54 发布

阅读量1.6k

点赞数

分类专栏： vue 文章标签：上传慢 h5上传慢 vue上传慢 axios上传慢 html安卓上传慢

本文链接：https://blog.csdn.net/qq_38883889/article/details/98587919

版权

本文介绍了在部分安卓手机上，使用Vue和Axios进行文件上传时出现速度极慢的问题，以及如何通过切换到原生Ajax来改善这一情况。在华为、小米等安卓设备上，原本只需3秒的上传操作可能延长到15-30秒。作者分享了采用原生Ajax实现的代码片段，以供其他开发者参考。

摘要由CSDN通过智能技术生成

前几天用vue实现了一个前端，里面有一个图片上传的功能。
之前使用axios自带post上传数据能上传但是有一部分安卓手机上传非常非常非常非常的慢，包括华为手机、小米8等等（其他手机没具体测试过）。本来3秒内能搞定的那些手机却要15-30秒～～～。
客户看到这个上传也很不满意，有点蛋疼于是就各种百度后面看到一个大佬的博客说视频上传慢可以使用原生的ajax解决。
于是准备试一试结果还真能行，在这里我把代码贴出来希望能帮到大家。
前后代码对比如下：

_this.$axios
          .post(
            "api/report/uploader",
            avatarData, //data里面填入图片资源 avatarData，注意传值方式由后台定义
            {
   
              timeout:60000,
              headers: {
   
                "Content-Type": "multipart/form-data"
              },
              transformRequest: [
                function(data) {
   
                  return data;
                }
              ],
              onUploadProgress: progressEvent => {
   
                //上传进度捕获
                let complete =
                  ((progressEvent.loaded / progressEvent.total) * 100) | 0;

                _this.upload_progress = complete;

                // Indicator.open("正在上传 " + complete);
                // _this.data.uploadmessage = "上传 " + complete;
              }
            }
          )
          .then(function(res) {
   
            console.log(res.data);

            _this.upload_p