代码之家 › 专栏 › 技术社区 › stop-error

如何使firebase图像URL缓存,而不必将其放在静态文件夹中?

firebase-storage firebase reactjs javascript

stop-error · 技术社区 · 2 年前

我在我的react应用程序中有以下逻辑,我使用firestore存储imgae url,我的图像在firestore存储上

const imgLink = "https://firebasestorage.googleapis.com/somepnglink

<img src={imgLink} />

我的网络标签图片第二次加载!第一次加载给出200,因为这是图像第一次加载

以前,当我将图像存储在react静态文件夹中时,它们会缓存在浏览器内存中,现在我必须等待响应发生,然后加载图像!! 如何让浏览器从firbase stroage缓存我的图像,而不必每次都调用并等待响应,因为我的图像当时无法加载?我能忍受这种明显的负荷。。。不是问题。但在那之后,图像应该缓存在浏览器中,所以为什么不立即从那里加载它们,而不必等待对服务器的调用呢?

1 回复 | 直到 2 年前

Dharmaraj 2 年前

你有 cache-control 请求中的标头?您可以使用指定 cacheControl 上传文件或使用时在对象元数据中 updateMetadata() 函数为现有文件添加。

没有缓存控制标头:

使用“缓存控制”标头:

默认情况下,标题将设置为 private, max-age=0 。您可以使用 更新元数据() 如下所示:

await updateMetadata(storageRef, {
  cacheControl: 'public, max-age=300',
})

或者,您可以使用 Google Cloud Storage 控制台手动编辑元数据。

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前

SlickRed · 我无法使用JS关注HTML元素

1 年前

Mayron Guedes · 如果登录名不在本地存储中,如何重定向页面?

1 年前

assembler · Nextjs没有处理发布请求

1 年前

PavelB · 如何使用Seleniumwebdriver和mocha只运行一个测试文件?

1 年前

BADRUM · 执行两个获取功能后,如何导航回页面?

1 年前

Toniq · javascript为php保存多维数组

1 年前

Natalie Smyth · 隐藏类只在我试图切换的两个部分中的一个部分上工作

1 年前

SkyWalker · 在JavaScript中,合并日期-时间序列的有效算法是什么?

1 年前