codecamp

Request属性:cache

cache 只读属性

Request中包含较多的属性,其中,我们已经介绍过了body属性bodyUsed属性,在本小章节内容中,你将会认识到更多的Request属性!

Request接口的cache只读属性包含请求的缓存模式。它控制请求将如何与浏览器的HTTP缓存进行交互。

cache 属性语法

var currentCacheMode = request.cache;

cache 属性

一个RequestCache值。可用的值是:

  • default:浏览器在HTTP缓存中查找匹配的请求。
    • 如果有匹配项并且它是新的,则将从缓存中返回。
    • 如果有匹配项,但是已经过期,则浏览器将向远程服务器发出有条件的请求。如果服务器指示资源没有改变,它将从缓存中返回。否则,资源将从服务器下载,并且缓存将被更新。
    • 如果不匹配,浏览器将发出正常的请求,并用下载的资源更新缓存。
  • no-store:浏览器从远程服务器获取资源,而不先查看缓存,并且不会使用下载的资源更新缓存。
  • reload:浏览器从远程服务器获取资源,而不先查看缓存,然后用下载的资源更新缓存。
  • no-cache :浏览器在HTTP缓存中查找匹配的请求。
    • 如果有新的或旧的匹配,浏览器将向远程服务器发出有条件的请求。如果服务器指示资源没有改变,它将从缓存中返回。否则,资源将从服务器下载,缓存将被更新。
    • 如果不匹配,浏览器将发出正常的请求,并用下载的资源更新缓存。
  • force-cache:浏览器在HTTP缓存中查找匹配的请求。
    • 如果有新的或旧的匹配,它将从缓存中返回。
    • 如果不匹配,浏览器将发出正常的请求,并用下载的资源更新缓存。
  • only-if-cached:浏览器在HTTP缓存中查找匹配的请求。
    • 如果有新的或旧的匹配,如果将从缓存返回。
    • 如果不匹配,浏览器将返回一个错误。
    该"only-if-cached"模式只能用于请求的mode为"same-origin"的情况。如果请求的redirect属性是"follow",并且重定向不违反"same-origin"模式,则会遵循缓存重定向。

cache 示例

// Download a resource with cache busting, to bypass the cache
// completely.
fetch("some.json", {cache: "no-store"})
  .then(function(response) { /* consume the response */ });

// Download a resource with cache busting, but update the HTTP
// cache with the downloaded resource.
fetch("some.json", {cache: "reload"})
  .then(function(response) { /* consume the response */ });

// Download a resource with cache busting when dealing with a
// properly configured server that will send the correct ETag
// and Date headers and properly handle If-Modified-Since and
// If-None-Match request headers, therefore we can rely on the
// validation to guarantee a fresh response.
fetch("some.json", {cache: "no-cache"})
  .then(function(response) { /* consume the response */ });

// Download a resource with economics in mind!  Prefer a cached
// albeit stale response to conserve as much bandwidth as possible.
fetch("some.json", {cache: "force-cache"})
  .then(function(response) { /* consume the response */ });

规范

规范 状态 注释
Fetch
在该规范中“cache”的定义
Living Standard
初始定义(Initial definition)

浏览器兼容性

  • 电脑端
Feature
Chrome
Edge
Firefox(Gecko)
Internet Explorer
Opera
Safari(WebKit)
基本的支持 每日构建 (是) 支持:48(48) 不支持

不支持

支持:11
only-if-cached 不支持 支持:50(50) 不支持 不支持 不支持
  • 移动端
Feature Android Edge Firefox Mobile (Gecko) Firefox OS (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
基本的支持 不支持
(是) 不支持
不支持
不支持
不支持
不支持
不支持
only-if-cached 不支持
? 不支持
不支持
不支持
不支持
不支持
不支持
Body接口:Request()构造函数
Request属性:context
温馨提示
下载编程狮App,免费阅读超1000+编程语言教程
取消
确定
目录

Fetch API官方文档指南

Fetch API方法

WindowOrWorkerGlobalScope执行者:window

window属性

WindowOrWorkerGlobalScope执行者:WorkerGlobalScope

关闭

MIP.setData({ 'pageTheme' : getCookie('pageTheme') || {'day':true, 'night':false}, 'pageFontSize' : getCookie('pageFontSize') || 20 }); MIP.watch('pageTheme', function(newValue){ setCookie('pageTheme', JSON.stringify(newValue)) }); MIP.watch('pageFontSize', function(newValue){ setCookie('pageFontSize', newValue) }); function setCookie(name, value){ var days = 1; var exp = new Date(); exp.setTime(exp.getTime() + days*24*60*60*1000); document.cookie = name + '=' + value + ';expires=' + exp.toUTCString(); } function getCookie(name){ var reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)'); return document.cookie.match(reg) ? JSON.parse(document.cookie.match(reg)[2]) : null; }