时间戳

首页 > 解决方案 > 当 Access-Control-Allow-Headers 中不允许 Cache-Control 标头时如何规避浏览器缓存

javascript - 当 Access-Control-Allow-Headers 中不允许 Cache-Control 标头时如何规避浏览器缓存

问题描述

我正在使用 GitHub API 来请求需要更新的通知。问题是我的浏览器经常从浏览器缓存而不是从 Internet 加载我的请求的答案，这当然不是最新的。为了防止这种情况并告诉浏览器不要使用缓存，我读到应该使用Cache-Control标头。问题是 GitHub API 中似乎没有Cache-Control标头Access-Control-Allow-Headers，所以我不允许Cache-Control在我的请求中使用标头。

那么，如果我不允许使用Cache-Control标头，我应该如何阻止我的浏览器从缓存中加载响应？为什么 GitHub API 首先禁止Cache-Control标头，有什么好的理由吗？

只是为了提供更多上下文，我在 JavaScript 中使用 fetch API 并尝试了下面的代码

res = await fetch('https://api.github.com/notifications', {method: 'Get', 
    headers: {    
        'accept': 'application/vnd.github.v3+json', 
        'authorization': "token " + token,  
        'Cache-Control': 'no-cache'               
}});

我收到错误消息：

CORS 策略已阻止从源“ http://api.github.com/notifications ”获取“ http://127.0.0.1:5500 ”的访问权限：Access-Control 不允许请求标头字段缓存控制- 预检响应中的允许标头。

你能推荐我解决我的问题的最佳方法吗？

标签： javascripthttpcorsgithub-apifetch-api

解决方案

从GitHub 文档上的通知页面...

通知针对使用 Last-Modified 标头进行轮询进行了优化。如果没有新通知，您将看到 304 Not Modified 响应，保持当前速率限制不变。有一个 X-Poll-Interval 标头指定允许轮询的频率（以秒为单位）。在服务器负载高的时候，时间可能会增加。请服从标题。

他们还使用 curl 提供了这个示例......

# Add authentication to your requests
curl -I https://api.github.com/notifications
HTTP/1.1 200 OK
Last-Modified: Thu, 25 Oct 2012 15:16:27 GMT
X-Poll-Interval: 60

# Pass the Last-Modified header exactly
curl -I https://api.github.com/notifications
   -H "If-Modified-Since: Thu, 25 Oct 2012 15:16:27 GMT"
HTTP/1.1 304 Not Modified
X-Poll-Interval: 60

他们使用的Last-Modified标题包含上次更新通知的日期。您在请求中使用标头将该日期回显到服务器，If-Modified-Since如果内容没有更改，您将收到不包含任何内容的“304 Not Modified”状态响应。

正如文中所说，他们还提供了一个轮询间隔标题，您应该阅读并确保您的通知更新功能不会比指定的间隔更频繁地运行，在他们的示例中是“60”（秒），意思是“不超过超过一分钟一次”。

关于另一个答案的注释-您绝对不应该使用缓存破坏查询参数。GitHub 提供了一种机制来控制缓存并控制其服务器上的负载以保持可用性。忽视这一点会给每个人带来问题，并且可能违反他们的使用条款。

推荐阅读