翻译正在进行中。

这是一个实验中的功能
此功能某些浏览器尚在开发中,请参考浏览器兼容性表格以得到在不同浏览器中适合使用的前缀。由于该功能对应的标准文档可能被重新修订,所以在未来版本的浏览器中该功能的语法和行为可能随之改变。

Fetch API 的 Request接口?用来表示资源请求。
 

你可以使用  Request.Request() ?构造函数创建一个Request 对象,但是你可能会遇到一个 Request 对象作为其它 API 的操作被返回,比如一个 service worker的FetchEvent.request

构造器

Request.Request()
创建一个新的 Request 对象。

属性

Request.method 只读
包含请求的方法 (GET, POST, 等.)
Request.url 只读
包含这个请求的URL。
Request.headers 只读
包含请求相关的Headers对象。
Request.context 只读  
包含请求的上下文(例如:audio, image, iframe, 等)
Request.referrer 只读
?包含请求的来源 (例如:client)。
Request.referrerPolicy 只读
?包含请求来源的策略 (例如:no-referrer)。
Request.mode 只读
包含请求的模式 (例如: cors, no-cors, same-origin, navigate).
Request.credentials 只读
包含请求的证书(例如: omit, same-origin).
Request.redirect 只读
包含?如何处理重定向模式,它可能是一个 follow error或者manual
Request.integrity 只读
包含请求的子资源的完整性值 (例如: sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=).
Request.cache 只读
包含请求的缓存模式 (例如: default, reload, no-cache).

Request实现了Body, 所以它还具有以下属性可用:

Body.body 只读
一个简单getter用于曝光一个ReadableStream的主体内容.
Body.bodyUsed 只读
存储一个Boolean判断主体是否已经被用于一个响应中.

方法

Request.clone()
创建当前request的副本。

Request实现 Body, 因此它也有以下方法可用:

Body.arrayBuffer()
返回解决一个ArrayBuffer表示的请求主体的promise.
Body.blob()
返回解决一个Blob表示的请求主体的promise.
Body.formData()
返回解决一个FormData表示的请求主体的promise.
Body.json()
返回解决一个JSON表示的请求主体的promise.
Body.text()
返回解决一个USVString(文本)表示的请求主体的promise.

注意:这些Body功能只能运行一次; 随后的调用将通过空strings/ ArrayBuffers解析.

示例

在下面的代码中,我们使用 Request ( ) 构造函数创建了一个新的 request实例 (用来请求同一目录下的图片), 然后返回请求的一些属性。

const myRequest = new Request('http://localhost/flowers.jpg');

const myURL = myRequest.url; // http://localhost/flowers.jpg
const myMethod = myRequest.method; // GET
const myCred = myRequest.credentials; // omit

然后,通过将Request对象作为参数传递给GlobalFetch.fetch()调用来获取此请求,例如:

fetch(myRequest)
  .then(response => response.blob())
  .then(blob => {
    myImage.src = URL.createObjectURL(blob);
  });/pre>

在下面的代码片段中,我们使用Request()构造函数创建了一个新的request,其中包含一些初始数据和正文内容,用于需要主体有效载荷的api请求:

const myRequest = new Request('http://localhost/api', {method: 'POST', body: '{"foo":"bar"}'});
 
const myURL = myRequest.url; // http://localhost/api
const myMethod = myRequest.method; // POST
const myCred = myRequest.credentials; // omit
const bodyUsed = myRequest.bodyUsed; // true

注意:body类型只能是一个Blob,BufferSource, FormData, URLSearchParams, USVString 或者ReadableStream类型,因此增加一个JSON对象的有效载荷则需要字符串化该对象.

例如,您可以通过将Request对象作为参数传递给GlobalFetch.fetch()调用来获取此api请求,并获得响应:

fetch(myRequest)
  .then(response => {
    if (response.status === 200) {
      return response.json();
    } else {
      throw new Error('Something went wrong on api server!');
    }
  })
  .then(response => {
    console.debug(response);
    // ...
  }).catch(error => {
    console.error(error);
  });

规范

Specification Status Comment
Fetch
Request
Living Standard Initial definition

浏览器兼容性

 

 

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidEdge MobileFirefox for AndroidOpera for AndroidiOS SafariSamsung Internet
Basic support
Experimental
Chrome Full support 42Edge Full support YesFirefox Full support 39IE No support NoOpera Full support 28Safari No support NoWebView Android Full support 42Chrome Android Full support 42Edge Mobile Full support YesFirefox Android Full support YesOpera Android Full support 28Safari iOS No support NoSamsung Internet Android Full support 4.0
Request() constructor
Experimental
Chrome Full support 42
Full support 42
Full support 41
Notes
Notes Some default values for the init parameter changed in Chrome 47. See the Properties section for details.
Edge Full support 15Firefox Full support 39
Full support 39
Full support 34
Disabled
Disabled From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE No support NoOpera Full support 29
Full support 29
Full support 28
Disabled
Disabled From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Full support 10.1WebView Android Full support 42
Full support 42
Full support 41
Notes
Notes Some default values for the init parameter changed in Chrome 47. See the Properties section for details.
Chrome Android Full support 42
Full support 42
Full support 41
Notes
Notes Some default values for the init parameter changed in Chrome 47. See the Properties section for details.
Edge Mobile Full support YesFirefox Android Full support YesOpera Android No support NoSafari iOS Full support 10.3Samsung Internet Android Full support 4.0
Full support 4.0
Full support 5.0
Notes
Notes Some default values for the init parameter changed in Samsung Internet 5.0. See the Properties section for details.
cache
Experimental
Chrome No support No
Notes
No support No
Notes
Notes Nightly build
Edge Full support YesFirefox Full support 48IE No support NoOpera No support NoSafari Full support 11WebView Android No support NoChrome Android No support NoEdge Mobile Full support YesFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
clone
Experimental
Chrome Full support 42
Full support 42
Full support 41
Disabled
Disabled From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Full support YesFirefox Full support 39
Full support 39
Full support 34
Disabled
Disabled From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE No support NoOpera Full support 29
Full support 29
Full support 28
Disabled
Disabled From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari No support NoWebView Android No support NoChrome Android No support NoEdge Mobile Full support YesFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
context
ExperimentalDeprecatedNon-standard
Chrome No support 42 — 46Edge ? Firefox No support 39 — 42
Notes
No support 39 — 42
Notes
Notes see bug 1188062 for more information.
IE No support NoOpera No support 28 — 29Safari No support NoWebView Android No support 42 — 46Chrome Android No support 42 — 46Edge Mobile ? Firefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android Full support 4.0
credentials
Experimental
Chrome Full support 42
Full support 42
Full support 41
Disabled
Disabled From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Full support YesFirefox Full support 39
Full support 39
Full support 34
Disabled
Disabled From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE No support NoOpera Full support 29
Full support 29
Full support 28
Disabled
Disabled From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari No support NoWebView Android No support NoChrome Android No support 42 — 46Edge Mobile Full support YesFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android Full support 4.0
destination
Experimental
Chrome Full support 65Edge Full support 14Firefox Full support 61IE No support NoOpera Full support 52Safari No support NoWebView Android ? Chrome Android Full support 65Edge Mobile ? Firefox Android Full support 61Opera Android Full support 52Safari iOS No support NoSamsung Internet Android ?
headers
Experimental
Chrome Full support 42
Full support 42
Full support 41
Disabled
Disabled From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Full support YesFirefox Full support 39
Full support 39
Full support 34
Disabled
Disabled From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE No support NoOpera Full support 29
Full support 29
Full support 28
Disabled
Disabled From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari No support NoWebView Android No support NoChrome Android No support 42 — 46Edge Mobile Full support YesFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android Full support 4.0
integrity
Experimental
Chrome Full support 46Edge Full support YesFirefox Full support YesIE No support NoOpera Full support YesSafari No support NoWebView Android No support NoChrome Android Full support 46Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support 5.0
keepalive
Experimental
Chrome Full support 66Edge Full support 15Firefox ? IE ? Opera Full support 43Safari ? WebView Android No support NoChrome Android Full support 66Edge Mobile ? Firefox Android ? Opera Android Full support 43Safari iOS ? Samsung Internet Android No support No
method
Experimental
Chrome Full support 42
Full support 42
Full support 41
Disabled
Disabled From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Full support YesFirefox Full support 39
Full support 39
Full support 34
Disabled
Disabled From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE No support NoOpera Full support 29
Full support 29
Full support 28
Disabled
Disabled From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari No support NoWebView Android No support NoChrome Android No support 42 — 46Edge Mobile Full support YesFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android Full support 4.0
mode
Experimental
Chrome Full support 42Edge Full support YesFirefox Full support 39IE No support NoOpera Full support 29Safari No support NoWebView Android Full support 49Chrome Android Full support 49Edge Mobile Full support YesFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android Full support 5.0
redirect
Experimental
Chrome Full support 46Edge Full support YesFirefox Full support YesIE No support NoOpera Full support YesSafari No support NoWebView Android No support NoChrome Android Full support 46Edge Mobile Full support YesFirefox Android Full support YesOpera Android Full support YesSafari iOS No support NoSamsung Internet Android Full support 5.0
referrer
Experimental
Chrome Full support 42
Full support 42
Full support 41
Disabled
Disabled From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Full support YesFirefox Full support 47IE No support NoOpera Full support 29
Full support 29
Full support 28
Disabled
Disabled From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari No support NoWebView Android No support NoChrome Android No support NoEdge Mobile Full support YesFirefox Android No support NoOpera Android No support NoSafari iOS No support NoSamsung Internet Android No support No
referrerPolicyChrome Full support 52Edge No support NoFirefox Full support 52IE No support NoOpera Full support 39Safari Full support 11.1WebView Android Full support 52Chrome Android Full support 52Edge Mobile No support NoFirefox Android Full support 52Opera Android Full support 39Safari iOS No support NoSamsung Internet Android Full support 7.2
signalChrome ? Edge Full support 16Firefox ? IE ? Opera ? Safari ? WebView Android ? Chrome Android ? Edge Mobile ? Firefox Android ? Opera Android ? Safari iOS ? Samsung Internet Android ?
url
Experimental
Chrome Full support 42
Notes
Full support 42
Notes
Notes Fragment support added in Chrome 59.
Edge Full support YesFirefox Full support 39
Full support 39
Full support 34
Disabled
Disabled From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE No support NoOpera Full support 29
Notes
Full support 29
Notes
Notes Fragment support added in Opera 46.
Safari No support NoWebView Android Full support 42
Notes
Full support 42
Notes
Notes Fragment support added in Chrome 59.
Chrome Android Full support 42
Notes
Full support 42
Notes
Notes Fragment support added in Chrome 59.
Edge Mobile Full support YesFirefox Android No support NoOpera Android Full support 29
Notes
Full support 29
Notes
Notes Fragment support added in Opera 46.
Safari iOS No support NoSamsung Internet Android Full support 4.0

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Experimental. Expect behavior to change in the future.
Experimental. Expect behavior to change in the future.
Non-standard. Expect poor cross-browser support.
Non-standard. Expect poor cross-browser support.
Deprecated. Not for use in new websites.
Deprecated. Not for use in new websites.
See implementation notes.
See implementation notes.
User must explicitly enable this feature.
User must explicitly enable this feature.

相关链接

文档标签和贡献者

此页面的贡献者: wyyhttp, freeshineit, johnlin0207, qinghaitvxq, mo-n, gafish, looch5
最后编辑者: wyyhttp,