blob: 9cf321251902bfb4275058cf93dee3b0a889c31b (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
|
---
title: Request.cache
slug: Web/API/Request/cache
translation_of: Web/API/Request/cache
---
<div>{{APIRef("Fetch")}}</div>
<p><strong><code>cache</code></strong> 作为{{domxref("Request")}} 接口只读属性包含着请求的缓存模式。它控制着请求以何种方式与浏览器的 <a href="/en-US/docs/Web/HTTP/Caching">HTTP </a>缓存进行交互。</p>
<h2 id="Syntax">Syntax</h2>
<pre class="brush: js">var currentCacheMode = request.cache;</pre>
<h3 id="Value">Value</h3>
<p>A <code>RequestCache</code> value. The available values are:</p>
<ul>
<li><code>default</code> — 浏览器从HTTP缓存中寻找匹配的请求。
<ul>
<li>如果缓存匹配上并且有效（ <a href="/en-US/docs/Web/HTTP/Caching#Freshness">fresh</a>）, 它将直接从缓存中返回资源。</li>
<li>如果缓存匹配上但已经过期 ，浏览器将会使用传统（ <a href="/en-US/docs/Web/HTTP/Conditional_requests">conditional request</a> ）的请求方式去访问远程服务器 。如果服务器端显示资源没有改动，它将从缓存中返回资源。否则，如果服务器显示资源变动，那么重新从服务器下载资源更新缓存。</li>
<li>如果缓存没有匹配，浏览器将会以普通方式请求，并且更新已经下载的资源缓存。</li>
</ul>
</li>
<li><code>no-store</code> — 浏览器直接从远程服务器获取资源，不查看缓存，并且不会使用下载的资源更新缓存。</li>
<li><code>reload</code> — 浏览器直接从远程服务器获取资源，不查看缓存，然后使用下载的资源更新缓存。</li>
<li><code>no-cache</code> — 浏览器在其HTTP缓存中寻找匹配的请求。
<ul>
<li>如果有匹配，无论是新的还是陈旧的，浏览器都会向远程服务器发出条件请求。如果服务器指示资源没有更改，则将从缓存中返回该资源。否则，将从服务器下载资源并更新缓存。</li>
<li>如果没有匹配，浏览器将发出正常请求，并使用下载的资源更新缓存。</li>
</ul>
<code>force-cache </code>— 浏览器在其HTTP缓存中寻找匹配的请求。
<ul>
<li>如果有匹配项，不管是新匹配项还是旧匹配项，都将从缓存中返回。</li>
<li>如果没有匹配，浏览器将发出正常请求，并使用下载的资源更新缓存。</li>
</ul>
</li>
<li><code>only-if-cached</code> — 浏览器在其HTTP缓存中寻找匹配的请求。
<ul>
<li>如果有匹配项(新的或旧的)，则从缓存中返回。</li>
<li>如果没有匹配，浏览器将返回一个错误。</li>
</ul>
The <code>"only-if-cached"</code> mode can only be used if the request's <code><a href="https://developer.mozilla.org/en-US/docs/Web/API/Request/mode">mode</a></code> is <code>"same-origin"</code>. Cached redirects will be followed if the request's <code>redirect</code> property is <code>"follow"</code> and the redirects do not violate the <code>"same-origin"</code> mode.</li>
</ul>
<h2 id="Example">Example</h2>
<pre class="brush: js">// 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 */ });</pre>
<h2 id="Specifications">Specifications</h2>
<table class="standard-table">
<tbody>
<tr>
<th scope="col">Specification</th>
<th scope="col">Status</th>
<th scope="col">Comment</th>
</tr>
<tr>
<td>{{SpecName('Fetch','#dom-request-cache','cache')}}</td>
<td>{{Spec2('Fetch')}}</td>
<td>Initial definition</td>
</tr>
</tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{Compat("api.Request.cache")}}</p>
<h2 id="See_also">See also</h2>
<ul>
<li><a href="/en-US/docs/Web/API/ServiceWorker_API">ServiceWorker API</a></li>
<li><a href="/en-US/docs/Web/HTTP/Access_control_CORS">HTTP access control (CORS)</a></li>
<li><a href="/en-US/docs/Web/HTTP">HTTP</a></li>
</ul>
|
