Question

我正在使用sportradar api。我正在制作的api调用返回一个png图像。直到现在我已经做到了。

    const apiCall = (url) => {
        return axios.get(url).then((data) => {
            if(data){
                return Promise.resolve(data);
            }
            else{
                return Promise.reject();
            }
        });
    }

    //all data in data.assetlist
    for(let i=0; i<data.assetlist.length; i++){
        let imageLink = data.assetlist[i].links[12].href;
        let url = `https://api.sportradar.us/nfl-images-p3/ap_premium${imageLink}?api_key=${api_key}`;
        apiCall(url).then((data) => {
            console.log(data);
            let blob = new Blob(data, {type: "image/png"}); // didn't compile with this line

        });
   }

上面的代码工作正常并返回数据。但数据是奇怪的字符，如果我正确理解它，是因为图像是blob类型，我得到的是数据流。

我从here获取了参考并写了这一行

let blob = new Blob(data, {type: "image/png"});

我没有尝试这个，因为我担心数据太大，以至于它可能会导致系统崩溃（旧笔记本电脑）。如果我这样做，我想知道，如何将这个blob文件保存到我的系统作为png文件，如果没有，那么我想知道如何将这个数据流转换为图像，并可以下载并保存在一个本地目录。

Answer 1

如果您获得的图像已经是blob，您可以使用此库下载它： https://github.com/eligrey/FileSaver.js

let FileSaver = require('file-saver');
FileSaver.saveAs(blob, "my_image.png");

我认为你不应该如此担心它的大小而只是去做它。

Answer 2

经过大量研究，我发现了这个解决方案并且有效。

apiCall(url).then((response) => {
        response.data.pipe(fs.createWriteStream('test.jpg'));
    });

下载API返回的图像

2 个答案: