我目前正在尝试使用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确实是在抓取图像,我只是不确定如何正确地做任何事情-与-我正在抓取的数据。
答案 0 :(得分:1)
axios
返回完整的响应正文,如status
,headers
,config
。响应正文位于.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}`);
})