带有来自 GCS 的公共 URL 的图像不会在状态更新后立即显示，但在刷新页面后有效

Question

我有一个表单，可以使用@Google Cloud/Storage将数据上传到mongoDB，并将图像上传到谷歌云存储中的存储桶中。这些图像具有公共URL。提交后，我立即对后台进行API调用，然后更新我的状态。然而，最近上传的图像不会显示，只会显示403错误。使用img标签在公共URL上获取请求时出错

我的提交处理程序函数：

const handleSubmit = async () => {
const repairData = new FormData();
try {
if (state.device && state.issue && state.image) {
repairData.append("device", state.device);
repairData.append("customer", user._id);
repairData.append("issue", state.issue);
repairData.append("image", state.image);
repairData.append("expedite", state.expedite);
await api.post("/requests/create", repairData, {
headers: { "auth-token": token },
});
setState({
device: "",
issue: "",
image: null,
expedite: "No",
hasError: false,
errorMessage: "",
});
setShow(false);
getRepairs();
} else {
setState({
...state,
success: false,
hasError: true,
errorMessage: "Missing required information!",
});
}
} catch (error) {
console.log(error);
}
};

我的API调用函数：

const getRepairs = async () => {
try {
const response = await api.get("/user/requests/", {
headers: { "auth-token": token },
});
setRequests([...response.data.repairs]);
} catch (error) {
console.log(error);
}
};

仅显示缓存的图像。当刷新页面时，图像将相应地显示。我也可以在浏览器上查看图像。我试过像这样的东西，但仍然不起作用。

Answer 1

正如@Jan Hernandez所说，我检查了我的谷歌云上传功能，它正在响应，尽管它还没有完成上传！愚蠢的我。

原始

await storage
.bucket(process.env.BUCKET_NAME)
.upload(filename, options, (err, file, cb) => {
if (err)
return res.status(409).json({
message: "Error uploading!",
});
});
return res.status(200).json({
repair: req.repair,
message: "Upload successful",
});

正确

await storage
.bucket(process.env.BUCKET_NAME)
.upload(filename, options, (err, file, cb) => {
if (err)
return res.status(409).json({
message: "Error uploading!",
});
res.sendStatus(200);
});