Question

我是使用AXIOS的新手。目前，我正在开发结合AXIOS代码的laravel框架。

我使用axios代码获取图像URL，并将其存储到AWS S3中。我可以将图像存储到S3中，但是图像文件不正确。该图像文件只是一个图标图像。而不是图片网址中的图片。

这是代码

axios.get('https://www.instagram.com/p/B_zZCRpB895/media/?size=t', { responseType: "blob" })
      .then(function (response) { 
        var reader = new window.FileReader();
        reader.readAsDataURL(response.data);
        reader.onload = function () {  
          var imageDataUrl = reader.result; 
 
          var params = { 
                    Bucket: 'thumbnail', 
                    Key: 'shortlist/image.jpg', 
                    Body: imageDataUrl
          };
          s3.upload(params, function (err, data) { 
              console.log('result:');
              console.log(err, data);
              console.log('\n');
              var s3url = data.Location;

              console.log('s3 url: ' + s3url); 
          });

        }

      });

代码var imageDataUrl = reader.result; 返回此结果

image/jpeg;base64,/9j/4AAQSkZJRgABAgAAAQABAAD/7QB8UGhvdG9zaG9wIDMuMAA4QklNBAQAAAAAAF8cAigAWkZCTUQyMzAwMDk2OTAxMDAwMDhiMDMwMDAwNmEwNDAwMDA2OTA1MDAwMDg1MDkwMDAwODQwYjAwMDBmMzBjMDAwMDQ1MGYwMDAwZjUxMDAwMDBiMzEyMDAwMAD/2wBDAAYEBQYFBAYGBQYHBwYIChAKCgkJChQODwwQFxQYGBcUFhYaHSUfGhsjHBYWICwgIyYnKSopGR8tMC0oMCUoKSj/2wBDAQcHBwoIChMKChMoGhYaKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCgoKCj/wgARCACWAJYDACIAAREBAhEB/8QAHAAAAQUBAQEAAAAAAAAAAAAABgADBAUHAgEI/8QAGgEAAgMBAQAAAAAAAAAAAAAAAgQAAQMFBv/aAAwDAAABEAIQAAAAz+DZVIFDELgbKuHOUJu2FVowaVxHp5uk7kcrV/cNvm0d+n8GZW05wWLnedGi2Ee6r06pYiPk45cCDwqqsJi7TzW5Hu2ZNqKHQMSEBI1mSrmfyUoc5KheDnWo5Lr3U47UWdHsK9OqWEUd9UXLHgeg4wM8m+66anoY1b8zqll/h2wyFkWk9DWrHq3ogqjijvurw..........

我如何使用正确的图像文件将结果图像上传到S3？

请帮助

Answer 1

您必须将base64图像转换为blob，然后使用流将其上传到S3：

      ...
 
      var imageDataUrl = reader.result; 

      fetch(imageDataUrl)
         .then(res => res.blob())
            .then(blob => {

               //blob is your binary file
               var params = { 
                    Bucket: 'thumbnail', 
                    Key: 'shortlist/image.jpg', 
                    Body: blob
               };

              s3.upload(params, function (err, data) { 
              console.log('result:');
              console.log(err, data);
              console.log('\n');
              var s3url = data.Location;
              console.log('s3 url: ' + s3url); 
      });
              })

使用axios上传到AWS S3时映像文件不正确

1 个答案: