firebase - 下一个/图像 + Firebase 存储 403 读取时出错

Question

我正在尝试使用来自 next/image 的 Image 并正在使用 firebase 存储来存储图像文件。

但是，执行以下操作时出现 403（禁止）错误：

<Image src={profilePicURL} ...otherProps/>

我已经尝试使用 with<img>并且 url 工作正常，所以我认为这不是 url 或权限问题。

有谁知道问题可能是什么？

next.config.js

module.exports = withBundleAnalyzer({
   distDir: 'dist',
   images: {
      domains: ['firebasestorage.googleapis.com'],
   },
   webpack(config) {
      // config stuff
      return config
   }
})

Firebase 存储规则

match /profilePicture/{userID}/{fileName} {
   allow read: if request.auth != null;
   allow write: if request.auth.uid == userID;
}