使用Axios / Sharp下载图像并调整其大小

时间:2019-07-04 14:43:32

标签: node.js axios sharp

我目前正在尝试使用Axios下载图像,然后调整结果大小并通过GraphQL解析器中的Node本地保存。

这是我正在使用的代码块:

axios.get(url)
    .then((response) => {
        const { set, collector_number } = response.data;
        const sourceUrl = response.data.image_uris.border_crop;
        const filename = `${set}/${collector_number}.png`;
        axios.get(sourceUrl, { responseType: 'arraybuffer' })
            .then((res) => {
                console.log(`Resizing Image!`)
                sharp(res)
                    .resize(226, 321)
                    .toFile(`../cardimg/${filename}`)
                    .then(() => {
                        console.log(`Image downloaded and resized!`)
                    })
                    .catch((err) => {
                        console.log(`Couldn't process: ${err}`);
                    })
            })
    })

当我执行代码(通过GraphQL突变)时,会引发错误,指出:Input file is missing

不确定是不是滥用了Axios,还是我对Sharp做了错误的事情。

有什么建议吗?最初,我担心我需要弄乱来自HTTP请求的响应的格式,但是据我所知,我做得正确。

谢谢!

我已经使用console.log来确保它确实是在抓取图像并且URL是正确的,所以已经过测试,因此sourceUrl确实是在抓取图像,我只是不确定如何正确地做任何事情-与-我正在抓取的数据。

1 个答案:

答案 0 :(得分:1)

axios返回完整的响应正文,如statusheadersconfig。响应正文位于.data键中。因此,您的情况将是:

axios.get(..).then((res) => { sharp(res.data)})

此外,promise中的Promise被认为是反模式,您可以轻松地将其链接起来。

let fileName;
axios.get(url)
  .then((response) => {
    const { set, collector_number } = response.data;
    const sourceUrl = response.data.image_uris.border_crop;
    filename = `${set}/${collector_number}.png`;
    return axios.get(sourceUrl, { responseType: 'arraybuffer' })
  })
  .then((res) => {
    console.log(`Resizing Image!`)
    return sharp(res.data)
      .resize(226, 321)
      .toFile(`../cardimg/${filename}`)
  })
  .then(() => {
    console.log(`Image downloaded and resized!`)
  })
  .catch((err) => {
    console.log(`Couldn't process: ${err}`);
  })