Hướng dẫn can i use fetch in javascript? - tôi có thể sử dụng tìm nạp trong javascript không?

Question

API Fetch cung cấp một giao diện để tìm nạp các tài nguyên (bao gồm cả trên mạng). Nó có vẻ quen thuộc với bất kỳ ai đã sử dụng

fetch(url) .then(response => { // handle the response }) .catch(error => { // handle the error });

Nội dung chính Show

Khái niệm và sử dụng
Sự khác biệt từ jQuery
Hủy bỏ một tìm nạp
Lấy giao diện
Thông số kỹ thuật
Tính tương thích của trình duyệt web
Gửi một yêu cầu
Đọc phản hồi
Xử lý các mã trạng thái của phản hồi
Ví dụ API tìm nạp JavaScript
Bản tóm tắt
Chúng ta có thể sử dụng Fetch trong JavaScript không?
Làm thế nào để tìm nạp trong JavaScript?
Làm thế nào để tôi lấy được trên JavaScript?
Là tìm nạp JavaScript?

Code language: JavaScript (javascript)

2, nhưng API mới cung cấp một bộ tính năng mạnh mẽ và linh hoạt hơn.

Lưu ý: Tính năng này có sẵn trong nhân viên web This feature is available in Web Workers

Khái niệm và sử dụng

Fetch cung cấp một định nghĩa chung về các đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

3 và

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 (và những thứ khác liên quan đến các yêu cầu mạng). Điều này sẽ cho phép chúng được sử dụng bất cứ nơi nào cần thiết trong tương lai, cho dù đó là cho nhân viên dịch vụ, API bộ đệm và những thứ tương tự khác xử lý hoặc sửa đổi các yêu cầu và phản hồi, hoặc bất kỳ loại trường hợp sử dụng nào có thể yêu cầu bạn tạo phản hồi của mình Về mặt chương trình (nghĩa là việc sử dụng chương trình máy tính hoặc hướng dẫn lập trình cá nhân).

Nó cũng xác định các khái niệm liên quan như CORS và ngữ nghĩa tiêu đề gốc HTTP, thay thế các định nghĩa riêng biệt của chúng ở nơi khác.

Để thực hiện yêu cầu và tìm nạp tài nguyên, hãy sử dụng phương thức

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5. Nó được triển khai trong nhiều giao diện, cụ thể là

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

6 và

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

7. Điều này làm cho nó có sẵn trong hầu hết mọi bối cảnh bạn có thể muốn tìm nạp tài nguyên.

Phương thức

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 có một đối số bắt buộc, đường dẫn đến tài nguyên bạn muốn tìm nạp. Nó trả về một

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

9 giải quyết cho

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 cho yêu cầu đó - ngay khi máy chủ phản hồi với các tiêu đề - ngay cả khi phản hồi của máy chủ là trạng thái lỗi HTTP. Bạn cũng có thể tùy chọn chuyển trong một đối tượng Tùy chọn

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

1 làm đối số thứ hai (xem

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

3).even if the server response is an HTTP error status. You can also optionally pass in an

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

1 options object as the second argument (see

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

3).

Khi

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 được truy xuất, có một số phương pháp có sẵn để xác định nội dung cơ thể là gì và cách xử lý nó.

Bạn có thể tạo một yêu cầu và phản hồi trực tiếp bằng cách sử dụng các trình xây dựng

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

4 và

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

5, nhưng thật không phổ biến khi thực hiện trực tiếp điều này. Thay vào đó, những thứ này có nhiều khả năng được tạo ra dưới dạng kết quả của các hành động API khác (ví dụ:

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

6 từ nhân viên dịch vụ).

Sự khác biệt từ jQuery

Thông số kỹ thuật

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

7 khác với

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

8 theo ba cách chính:

Lời hứa được trả lại từ

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 sẽ không từ chối trạng thái lỗi HTTP ngay cả khi phản hồi là HTTP

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

0 hoặc

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

1. Thay vào đó, nó sẽ giải quyết bình thường (với trạng thái

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

2 được đặt thành

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

3) và nó sẽ chỉ từ chối lỗi mạng hoặc nếu mọi thứ ngăn yêu cầu hoàn thành.won't reject on HTTP error status even if the response is an HTTP

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

0 or

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

1. Instead, it will resolve normally (with

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}



Code language: JavaScript (javascript)

2 status set to

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

3), and it will only reject on network failure or if anything prevented the request from completing.

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 sẽ không gửi cookie có nguồn gốc chéo trừ khi bạn đặt tùy chọn init thông tin đăng nhập (thành

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

5).won't send cross-origin cookies unless you set the credentials init option (to

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

5).

Vào tháng 4 năm 2018, thông số kỹ thuật đã thay đổi chính sách thông tin đăng nhập mặc định thành
```
async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)
```
6. Các trình duyệt sau đây đã vận chuyển một lần tìm nạp gốc lỗi thời và được cập nhật trong các phiên bản này: Firefox 61.0b13, Safari 12, Chrome 68.
Nếu bạn đang nhắm mục tiêu các phiên bản cũ hơn của các trình duyệt này, hãy chắc chắn bao gồm tùy chọn
```
async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)
```
7 init trên tất cả các yêu cầu API có thể bị ảnh hưởng bởi cookie/trạng thái đăng nhập người dùng.

Hủy bỏ một tìm nạp

Để hủy bỏ không đầy đủ

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 và thậm chí

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

2, các hoạt động, hãy sử dụng các giao diện

async function fetchText() {
    let response = await fetch('/readme.txt');

    console.log(response.status); // 200
    console.log(response.statusText); // OK

    if (response.status === 200) {
        let data = await response.text();
        // handle data
    }
}

fetchText();
Code language: JavaScript (javascript)

0 và

async function fetchText() {
    let response = await fetch('/readme.txt');

    console.log(response.status); // 200
    console.log(response.statusText); // OK

    if (response.status === 200) {
        let data = await response.text();
        // handle data
    }
}

fetchText();
Code language: JavaScript (javascript)

1.

Lấy giao diện

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5

Phương pháp

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 được sử dụng để lấy tài nguyên.

Đại diện cho các tiêu đề phản hồi/yêu cầu, cho phép bạn truy vấn chúng và thực hiện các hành động khác nhau tùy thuộc vào kết quả.

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

3

Đại diện cho một yêu cầu tài nguyên.

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4

Đại diện cho phản hồi cho một yêu cầu.

Thông số kỹ thuật

Sự chỉ rõ
Tìm nạp tiêu chuẩn # Fetch-method # fetch-method

Tính tương thích của trình duyệt web

Bảng BCD chỉ tải trong trình duyệt

Xem thêm

Tóm tắt: Trong hướng dẫn này, bạn sẽ tìm hiểu về API tìm nạp JavaScript và cách sử dụng nó để thực hiện các yêu cầu HTTP không đồng bộ.: in this tutorial, you’ll learn about the JavaScript Fetch API and how to use it to make asynchronous HTTP requests.

API Fetch là giao diện hiện đại cho phép bạn thực hiện các yêu cầu HTTP cho các máy chủ từ trình duyệt web.

Nếu bạn đã làm việc với đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

2 (

async function fetchText() {
    let response = await fetch('/readme.txt');

    console.log(response.status); // 200
    console.log(response.statusText); // OK

    if (response.status === 200) {
        let data = await response.text();
        // handle data
    }
}

fetchText();
Code language: JavaScript (javascript)

7), API tìm nạp có thể thực hiện tất cả các tác vụ như đối tượng

async function fetchText() {
    let response = await fetch('/readme.txt');

    console.log(response.status); // 200
    console.log(response.statusText); // OK

    if (response.status === 200) {
        let data = await response.text();
        // handle data
    }
}

fetchText();
Code language: JavaScript (javascript)

7.

Ngoài ra, API tìm nạp đơn giản và sạch hơn nhiều. Nó sử dụng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

9 để cung cấp các tính năng linh hoạt hơn để thực hiện các yêu cầu cho các máy chủ từ trình duyệt web.

Phương pháp

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 có sẵn trong phạm vi toàn cầu hướng dẫn các trình duyệt web gửi yêu cầu đến URL.

Gửi một yêu cầu

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 chỉ yêu cầu một tham số là URL của tài nguyên mà bạn muốn tìm nạp:

let response = fetch(url);
Code language: JavaScript (javascript)

Phương thức

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 trả về

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });



Code language: JavaScript (javascript)

9 để bạn có thể sử dụng các phương thức

200
OK
Code language: JavaScript (javascript)

4 và

200
OK
Code language: JavaScript (javascript)

5 để xử lý nó:

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

Khi yêu cầu hoàn thành, tài nguyên có sẵn. Tại thời điểm này, lời hứa sẽ giải quyết thành một đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4.

Đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 là trình bao bọc API cho tài nguyên được tìm nạp. Đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 có một số thuộc tính và phương thức hữu ích để kiểm tra phản hồi.

Đọc phản hồi

Nếu nội dung của phản hồi ở định dạng văn bản thô, bạn có thể sử dụng phương thức

200
OK
Code language: JavaScript (javascript)

9. Phương thức

200
OK
Code language: JavaScript (javascript)

9 trả về một

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

9 giải quyết với các nội dung hoàn chỉnh của tài nguyên được tìm nạp:

fetch('/readme.txt')
    .then(response => response.text())
    .then(data => console.log(data));
Code language: JavaScript (javascript)

Trong thực tế, bạn thường sử dụng ________ 62/________ 63 với phương pháp

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 như thế này:

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

Bên cạnh phương thức

200
OK
Code language: JavaScript (javascript)

9, đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 còn có các phương pháp khác như

let response = await fetch('/non-existence.txt');

console.log(response.status); // 400
console.log(response.statusText); // Not Found
Code language: JavaScript (javascript)

7,

let response = await fetch('/non-existence.txt');

console.log(response.status); // 400
console.log(response.statusText); // Not Found
Code language: JavaScript (javascript)

8,

let response = await fetch('/non-existence.txt');

console.log(response.status); // 400
console.log(response.statusText); // Not Found
Code language: JavaScript (javascript)

9 và

400
Not Found
Code language: JavaScript (javascript)

0 để xử lý loại dữ liệu tương ứng.

Xử lý các mã trạng thái của phản hồi

Đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 cung cấp mã trạng thái và văn bản trạng thái thông qua các thuộc tính

400
Not Found
Code language: JavaScript (javascript)

2 và

400
Not Found
Code language: JavaScript (javascript)

3. Khi một yêu cầu thành công, mã trạng thái là

400
Not Found
Code language: JavaScript (javascript)

4 và văn bản trạng thái là

400
Not Found
Code language: JavaScript (javascript)

5:

async function fetchText() {
    let response = await fetch('/readme.txt');

    console.log(response.status); // 200
    console.log(response.statusText); // OK

    if (response.status === 200) {
        let data = await response.text();
        // handle data
    }
}

fetchText();
Code language: JavaScript (javascript)

Output:

200
OK
Code language: JavaScript (javascript)

Nếu tài nguyên được yêu cầu không tồn tại, mã phản hồi là

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

0:

let response = await fetch('/non-existence.txt');

console.log(response.status); // 400
console.log(response.statusText); // Not Found
Code language: JavaScript (javascript)

Output:

400
Not Found



Code language: JavaScript (javascript)

Nếu URL được yêu cầu ném lỗi máy chủ, mã phản hồi sẽ là

async function fetchText() {
    let response = await fetch('/readme.txt');
    let data = await response.text();
    console.log(data);
}
Code language: JavaScript (javascript)

1.

Nếu URL được yêu cầu được chuyển hướng đến phần mới với phản hồi

400
Not Found
Code language: JavaScript (javascript)

8,

400
Not Found
Code language: JavaScript (javascript)

2 của đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 được đặt thành

400
Not Found
Code language: JavaScript (javascript)

4. Ngoài ra thuộc tính

[{ "username": "john", "firstName": "John", "lastName": "Doe", "gender": "Male", "profileURL": "img/male.png", "email": "" }, { "username": "jane", "firstName": "Jane", "lastName": "Doe", "gender": "Female", "profileURL": "img/female.png", "email": "" } ]

Code language: JSON / JSON with Comments (json)

2 được đặt thành

[{ "username": "john", "firstName": "John", "lastName": "Doe", "gender": "Male", "profileURL": "img/male.png", "email": "" }, { "username": "jane", "firstName": "Jane", "lastName": "Doe", "gender": "Female", "profileURL": "img/female.png", "email": "" } ]

Code language: JSON / JSON with Comments (json)

3.

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 trả về một lời hứa từ chối khi xảy ra lỗi thực sự như thời gian chờ trình duyệt web, mất kết nối mạng và vi phạm CORS.

Ví dụ API tìm nạp JavaScript

Giả sử rằng bạn có một tệp JSON định vị trên máy chủ web với các nội dung sau:

[{ "username": "john", "firstName": "John", "lastName": "Doe", "gender": "Male", "profileURL": "img/male.png", "email": "" }, { "username": "jane", "firstName": "Jane", "lastName": "Doe", "gender": "Female", "profileURL": "img/female.png", "email": "" } ]

Code language: JSON / JSON with Comments (json)

Những điều sau đây cho thấy trang HTML:

html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Fetch API Demotitle>
    <link rel="stylesheet" href="css/style.css">
head>
<body>
    <div class="container">div>
    <script src="js/app.js">script>
body>
html>
Code language: HTML, XML (xml)

Trong

[{ "username": "john", "firstName": "John", "lastName": "Doe", "gender": "Male", "profileURL": "img/male.png", "email": "" }, { "username": "jane", "firstName": "Jane", "lastName": "Doe", "gender": "Female", "profileURL": "img/female.png", "email": "" } ]

Code language: JSON / JSON with Comments (json)

5, chúng tôi sẽ sử dụng phương thức

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 để lấy dữ liệu người dùng và hiển thị dữ liệu bên trong phần tử

[{ "username": "john", "firstName": "John", "lastName": "Doe", "gender": "Male", "profileURL": "img/male.png", "email": "" }, { "username": "jane", "firstName": "Jane", "lastName": "Doe", "gender": "Female", "profileURL": "img/female.png", "email": "" } ]

Code language: JSON / JSON with Comments (json)

7 với lớp

[{ "username": "john", "firstName": "John", "lastName": "Doe", "gender": "Male", "profileURL": "img/male.png", "email": "" }, { "username": "jane", "firstName": "Jane", "lastName": "Doe", "gender": "Female", "profileURL": "img/female.png", "email": "" } ]

Code language: JSON / JSON with Comments (json)

8.

Đầu tiên, khai báo chức năng

[{ "username": "john", "firstName": "John", "lastName": "Doe", "gender": "Male", "profileURL": "img/male.png", "email": "" }, { "username": "jane", "firstName": "Jane", "lastName": "Doe", "gender": "Female", "profileURL": "img/female.png", "email": "" } ]

Code language: JSON / JSON with Comments (json)

9 lấy

html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Fetch API Demotitle>
    <link rel="stylesheet" href="css/style.css">
head>
<body>
    <div class="container">div>
    <script src="js/app.js">script>
body>
html>
Code language: HTML, XML (xml)

0 từ máy chủ.

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

0

Sau đó, phát triển chức năng

html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Fetch API Demotitle>
    <link rel="stylesheet" href="css/style.css">
head>
<body>
    <div class="container">div>
    <script src="js/app.js">script>
body>
html>
Code language: HTML, XML (xml)

1 hiển thị dữ liệu người dùng:

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

1

Kiểm tra bản demo API tìm nạp.

Bản tóm tắt

API tìm nạp cho phép bạn yêu cầu không đồng bộ cho tài nguyên.

Sử dụng phương thức

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

5 để trả về một lời hứa giải quyết thành đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4. Để có được dữ liệu thực tế, bạn gọi một trong các phương thức của đối tượng phản hồi, ví dụ:

200
OK
Code language: JavaScript (javascript)

9 hoặc

let response = await fetch('/non-existence.txt');

console.log(response.status); // 400
console.log(response.statusText); // Not Found
Code language: JavaScript (javascript)

7. Các phương pháp này giải quyết vào dữ liệu thực tế.

Sử dụng các thuộc tính

400
Not Found
Code language: JavaScript (javascript)

2 và

400
Not Found
Code language: JavaScript (javascript)

3 của đối tượng

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

4 để có được văn bản trạng thái và trạng thái của phản hồi.

Sử dụng phương thức

200
OK
Code language: JavaScript (javascript)

5 hoặc câu lệnh

fetch(url)
    .then(response => {
        // handle the response
    })
    .catch(error => {
        // handle the error
    });
Code language: JavaScript (javascript)

00 để xử lý yêu cầu thất bại.

Hướng dẫn này có hữu ích không?

Chúng ta có thể sử dụng Fetch trong JavaScript không?

Phương thức Fetch () trong JavaScript được sử dụng để yêu cầu dữ liệu từ máy chủ.Yêu cầu có thể thuộc bất kỳ loại API nào trả về dữ liệu trong JSON hoặc XML.Phương thức Fetch () yêu cầu một tham số, URL để yêu cầu và trả lại lời hứa.. The request can be of any type of API that return the data in JSON or XML. The fetch() method requires one parameter, the URL to request, and returns a promise.

Làm thế nào để tìm nạp trong JavaScript?

Phương thức Fetch () có một đối số bắt buộc, đường dẫn đến tài nguyên bạn muốn tìm nạp.Nó trả về một lời hứa giải quyết phản hồi cho yêu cầu đó - ngay khi máy chủ phản hồi với các tiêu đề - ngay cả khi phản hồi của máy chủ là trạng thái lỗi HTTP.

Làm thế nào để tôi lấy được trên JavaScript?

Cách tiếp cận: Đầu tiên tạo tệp JavaScript cần thiết, tệp HTML và tệp CSS.Sau đó lưu trữ URL API trong một biến (ở đây API_URL).Xác định hàm async (ở đây getApi ()) và vượt qua API_URL trong hàm đó.Xác định một phản hồi không đổi và lưu trữ phương thức dữ liệu được tìm nạp theo Await Fetch ().

Là tìm nạp JavaScript?

Do đó, theo nghĩa rộng nhất, Fetch là không chặn và không chặn DOM.non-blocking and doesn't block the DOM.

programming javascript Fetch API fetch() Fetch JavaScript Fetch JavaScript w3schools node-fetch Fetch data Fetch API JavaScript Fetch get

Hướng dẫn can i use fetch in javascript? - tôi có thể sử dụng tìm nạp trong javascript không?

Khái niệm và sử dụng

Sự khác biệt từ jQuery

Hủy bỏ một tìm nạp

Lấy giao diện

Thông số kỹ thuật

Tính tương thích của trình duyệt web

Xem thêm

Gửi một yêu cầu

Đọc phản hồi

Xử lý các mã trạng thái của phản hồi

Ví dụ API tìm nạp JavaScript

Bản tóm tắt

Chúng ta có thể sử dụng Fetch trong JavaScript không?

Làm thế nào để tìm nạp trong JavaScript?

Làm thế nào để tôi lấy được trên JavaScript?

Là tìm nạp JavaScript?

Bài Viết Liên Quan

Quảng Cáo

Có thể bạn quan tâm

Toplist được quan tâm

Quảng cáo

Xem Nhiều

Quảng cáo

Chúng tôi

Điều khoản

Trợ giúp

Mạng xã hội