如何从 NextJS 应用程序获取经过身份验证的 Google Cloud Storage 请求？

Question

我正在使用 Cloud Storage 实例在我的 NextJS Web 应用程序上存储图像。

我指的是这样的图像：

... some code
image="https://storage.cloud.google.com/{my-project}/myimage.jpg"
... some more code 

我收到这样的错误：

GET http://localhost:3000/_next/image?url=https%3A%2F%2Fstorage.cloud.google.com{image link to Cloud Storage} 400 (Bad Request) 

在阅读了一些文档后，我发现我的 Firestore 设置为非公开的，因此只有某些经过身份验证的用户才能访问云内容。

我无法指定用户，因为我的本地开发人员环境在 localhost 上运行，而且我不知道 Firebase 将如何查看我的请求，因为我已经在本地计算机上使用gcloud auth login 。

我已经使用添加的next.config.js配置并重新启动了我的服务器：

module.exports = {
    images: {
        domains: ["storage.cloud.google.com"]
    }
}

我看到有一个答案Frontend Authenticated request Google Cloud Storage解释了使用令牌，但我不想管理另一个令牌。 是否有可以使用服务帐户管理访问权限的解决方案？

我想避免使用此解决方案公开所有图像。

我不想下载文档中提到的图像。

Answer 1

我发现可以限制存储桶，但是如果使用带有访问令牌的链接，则将访问该图像。

https://firebasestorage.googleapis.com/v0/b/{project-id}/o/{image path}?alt=media&token={token}

这不是我想要的理想方式，因为可以在源代码上查看令牌，并使图像存储桶几乎可以公开访问。