<分区>
我的网站上有一个页面,我从 Firebase Cloud Firestore 中检索了 1 个项目。这个网站是用 Vue.js 和 Nuxt.js 制作的。我通过我和我的 friend 用 Express.js 制作的 API 获得这个项目。页面上有一个图片库,我想使用包 Photoswipe
来滑动图片,但我需要图片尺寸。由于我在将文档保存到 firebase 时无法设置尺寸,因此我试图在 API 中接收项目时获取图像尺寸。我试图通过在循环遍历所有图库图像的 foreach 循环中使用包 probe-image-size
来做到这一点。
我的问题是我似乎无法从 .then()
promise 的内部将维度值设置为 data
对象。
我已经尝试从 promise 中返回值,但这似乎对我不起作用。
这是获取特定项目的 API 端点:
router.get('/:id', api(async req => {
let item, doc = null
try {
doc = await collection.doc(req.params.id).get()
} catch (err) {
console.error(`Error getting project ${req.params.id}:`, error);
}
if (doc && doc.exists) {
const data = doc.data()
const probe_promises = data.images.map(image => probe(image.url).then(res => {
image.width = res.width;
image.height = res.height;
}))
await Promise.all(probe_promises)
console.log(data.images);
item = data
}
return item
}));
这是抛出 Request failed with status code 500
错误的部分,没有这部分代码工作正常:
const probe_promises = data.images.map(image => probe(image.url).then(res => {
image.width = res.width;
image.height = res.height;
}))
await Promise.all(probe_promises)
console.log(data.images);
这是它抛出的确切错误:
Request failed with status code 500
[0]
[0] at createError (node_modules/axios/lib/core/createError.js:16:15)
[0] at settle (node_modules/axios/lib/core/settle.js:17:12)
[0] at IncomingMessage.handleStreamEnd (node_modules/axios/lib/adapters/http.js:237:11)
[0] at IncomingMessage.emit (events.js:208:15)
[0] at IncomingMessage.EventEmitter.emit (domain.js:471:20)
[0] at endReadableNT (_stream_readable.js:1161:12)
[0] at processTicksAndRejections (internal/process/task_queues.js:77:11)
奇怪的是,当我删除 probe
代码并重新加载页面,然后再次添加代码并再次重新加载页面时,它工作正常。