Fetch API

The Fetch API cung cấp giao diện để tìm nạp tài nguyên (bao gồm thông qua mạng). It will seem familiar to anyone who has used XMLHttpRequest, but the new API provides a more powerful and flexible feature set.

Concepts and usage

Fetch cung cấp một định nghĩa chung về các đối tượng Request and Response (và mọi thứ khác liên quan đến các request network). Điều này cho phép chúng được sử dụng ở bất cứ nơi nào cần chúng trong tương lai, cho dù đó là service workers, Cache API, và những thứ tương tự khác mà có khả năng xử lý hoặc sửa đổi các request và responses, hoặc bất kỳ trường hợp nào mà yêu cầu bạn tự tạo ra responses trong chương trình của chính mình.

Nó cũng cung cấp một định nghĩa cho các khái niệm liên quan như CORS and the HTTP Header, thay thế các định nghĩa riêng biệt của chúng ở nơi khác.

Để thực hiện một request và tìm nạp tài nguyên, use the WindowOrWorkerGlobalScope.fetch() method. Nó được triển khai trong nhiều interfaces, đặc biệt là Window và WorkerGlobalScope. Điều này làm cho nó có sẵn trong hầu hết mọi ngữ cảnh mà bạn có thể muốn tìm nạp tài nguyên.

The fetch() method có một đối số bắt buộc, đó chính là đường dẫn đến tài nguyên bạn tìm nạp. Nó returns a Promise thứ mà sẽ giải quyết và đưa ra một Response cho request đó, bất kể là thành công hay thất bại. Bạn có thể tùy chỉnh việc truyền một đối tượng tùy chỉnh init như là một đối số thữ hai (see Request).

Cho đến khi một Response được truy xuất, có một số methods có sẵn để xác định nội dung body là gì và cách nó được xử lý như thế nào. (see Body).

Bạn có thể tạo ra một request và response trực tiếp bằng cách sử dụng Request() và Response() constructors, nhưng cách làm này là không phổ biến. Thay vào đó, những thứ này có thể được tạo ra bằng cách là kết quả trả về của các hành động API khác (ví dụ, FetchEvent.respondWith() from service workers).

Differences from jQuery

The fetch khác với jQuery.ajax() in ba điểm chính sau:

  • The Promise được trả về từ fetch() sẽ không từ chối trạng thái lỗi ngay cả khi response là HTTP 404 or 500. Thay vào đó, nó sẽ xử lý bình thường (với trạng thái OK được set thành false), và nó sẽ chỉ từ chối khi gặp lỗi network hoặc có bất cứ thứ gì ngăn chặn hoàn thành request.
  • fetch() sẽ không nhận cross-site cookies. You không thể thiết lập một cross site session bằng fetch(). Set-Cookie headers từ các site khác sẽ âm thầm bị bỏ qua.
  • fetch() sẽ không send cookies, trừ khi bạn set the credentials init option.
    • Từ Tháng 8 25, 2017: Thông số kĩ thuật đã thay đổi từ thông tin đăng nhập mặc định thành same-origin. Firefox đã thay đổi từ phiên bản 61.0b13.)

Note: Tìm hiểu thêm về cách sử dụng Fetch API tại Using Fetch, và học các khái niệm tại  Fetch basic concepts.

Huỷ bỏ fetch

Browsers have started to add experimental support for the AbortController and AbortSignal interfaces (aka The Abort API), which allow operations like Fetch and XHR to be aborted if they have not already completed. See the interface pages for more details.

Fetch Interfaces

WindowOrWorkerGlobalScope.fetch()
The fetch() method được sử dụng để tìm nạp tài nguyên.
Headers
Đại diện cho các response/request headers, cho phép bạn truy vấn chúng and thực hiện các hành động khác nhau phụ thuộc vào các kết quả..
Request
Đại điện cho một request tài nguyên.
Response
Đại điện cho một Response của một Request.

Fetch mixin

Body
Cung cấp các methods liên quan đến body của response/request, cho phép bạn khai báo kiểu nội dung của chúng và cách chúng được xử lý.

Specifications

Specification Status Comment
Fetch Living Standard Initial definition

Browser compatibility

BCD tables only load in the browser

See also