如何使用ajax get rest api从aws s3中获取对象

Question

我的 s3 存储桶中有一个名为3514706-ironmanvr-promo-nologo.jpg的文件，我正在尝试使用 javascript rest api 下载该文件，这是我的代码

var jqxhr = $.ajax({
            url: "https://s3.amazonaws.com/asif.test/3514706-ironmanvr-promo-nologo.jpg",
            type: "GET",
            async: true
        })
            .done(function (data, textStatus, jqXhr) {
               console.log(data);

            })
            .fail(function (jqXhr, textStatus, errorThrown) {
                console.log(errorThrown);
                if (errorThrown === "abort") {
                    alert("Uploading was aborted");
                } else {
                    alert("Uploading failed");
                }
            })
            .always(function (data, textStatus, jqXhr) { });

但在数据中我得到这样的垃圾值

回应图片

我不知道如何处理这个。

Answer 1

我遇到了完全相同的问题，经过多次挖掘和脱毛后，我发现了这个答案：

https://medium.com/@timleland/set-image-src-from-amazon-s3-2232d246bebd

它为我解决了； 文章说：

“由于 Jquery ajax 不支持 responseType: 'blob'，您必须在 xhrFields 中设置值。另一个重要部分是使用 window.URL.createObjectURL 将 blob 转换为图像 src 的 url。”

 var loadImage = function (imageUrl) { $.ajax({ type: 'GET', url: imageUrl, dataType: null, data: null, xhrFields: { responseType: 'blob' }, success: function (imageData) { var blobUrl = window.URL.createObjectURL(imageData); $('#image-id').attr('src', blobUrl); } }); };