Request屬性：cache

cache 只讀屬性

Request中包含較多的屬性，其中，我們已經(jīng)介紹過(guò)了body屬性與bodyUsed屬性，在本小章節(jié)內(nèi)容中，你將會(huì)認(rèn)識(shí)到更多的Request屬性！

Request接口的cache只讀屬性包含請(qǐng)求的緩存模式。它控制請(qǐng)求將如何與瀏覽器的HTTP緩存進(jìn)行交互。

cache 屬性語(yǔ)法

var currentCacheMode = request.cache;

cache 屬性值

一個(gè)RequestCache值?？捎玫闹凳牵?/p>

• default：瀏覽器在HTTP緩存中查找匹配的請(qǐng)求。
  • 如果有匹配項(xiàng)并且它是新的，則將從緩存中返回。
  • 如果有匹配項(xiàng)，但是已經(jīng)過(guò)期，則瀏覽器將向遠(yuǎn)程服務(wù)器發(fā)出有條件的請(qǐng)求。如果服務(wù)器指示資源沒(méi)有改變，它將從緩存中返回。否則，資源將從服務(wù)器下載，并且緩存將被更新。
  • 如果不匹配，瀏覽器將發(fā)出正常的請(qǐng)求，并用下載的資源更新緩存。
• no-store：瀏覽器從遠(yuǎn)程服務(wù)器獲取資源，而不先查看緩存，并且不會(huì)使用下載的資源更新緩存。
• reload：瀏覽器從遠(yuǎn)程服務(wù)器獲取資源，而不先查看緩存，然后用下載的資源更新緩存。
• no-cache ：瀏覽器在HTTP緩存中查找匹配的請(qǐng)求。
  • 如果有新的或舊的匹配，瀏覽器將向遠(yuǎn)程服務(wù)器發(fā)出有條件的請(qǐng)求。如果服務(wù)器指示資源沒(méi)有改變，它將從緩存中返回。否則，資源將從服務(wù)器下載，緩存將被更新。
  • 如果不匹配，瀏覽器將發(fā)出正常的請(qǐng)求，并用下載的資源更新緩存。
• force-cache：瀏覽器在HTTP緩存中查找匹配的請(qǐng)求。
  • 如果有新的或舊的匹配，它將從緩存中返回。
  • 如果不匹配，瀏覽器將發(fā)出正常的請(qǐng)求，并用下載的資源更新緩存。
• only-if-cached：瀏覽器在HTTP緩存中查找匹配的請(qǐng)求。
  • 如果有新的或舊的匹配，如果將從緩存返回。
  • 如果不匹配，瀏覽器將返回一個(gè)錯(cuò)誤。
  該"only-if-cached"模式只能用于請(qǐng)求的mode為"same-origin"的情況。如果請(qǐng)求的redirect屬性是"follow"，并且重定向不違反"same-origin"模式，則會(huì)遵循緩存重定向。

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 */ });

規(guī)范

瀏覽器兼容性

• 電腦端

• 移動(dòng)端