[vi] Kiến thức Sự khác nhau giữa Axios và Fetch

huypham94

New member
1. Cú pháp cơ bản
Cả fetch và Axios có cú pháp khá đơn giản trong việc thực hiện yêu cầu. Axios tốt hơn bởi vì tự động chuyển đổi dữ liệu trả về (response) tới JSON, vì vậy khi sử dụng Axios chúng ta có thể bỏ qua bước chuyển đổi dữ liệu trả về (response) tới JSON, không giống như Fetch() chúng ta vẫn có thể chuyển đổi dữ liệu trả về (response) tới JSON. Cuối cùng, phương thức ngắn gọn của Axios cho phép chúng ta thực hiện yêu cầu HTTP cụ thể dễ hơn.

2. Tương thích trình duyệt
Một trong nhiều lý do các lập trình viên ưu tiên Axios hơn Fetch là vì Axios được hỗ trợ trên nhiều trình duyệt và phiên bản chính, không giống Fetch nó chỉ hỗ trợ trong Chrome 42+, Firefox 39+, Edge 14+, and Safari 10.1+

3. Xử lý thời gian chờ phản hồi
Việc cài đặt timeout cho việc phản hồi (response) rất đơn giản thực hiện trong Axios bằng cách sử dụng option trong timeout bên trong đối tượng yêu cầu. Nhưng trong Fetch, nó không dễ dàng để làm điều này. Fetch cung cấp tính năng tương tự bằng cách sử dụng interface AbortController() nhưng nó mất nhiều thời gian để triển khai và có thể gây nhầm lẫn.

4. Bộ chặn các yêu cầu HTTP
Axios cho các lập trình viên chặn các yêu cầu HTTP. Bộ chặn HTTP là cần thiết khi chúng ta cần thay đổi các yêu cầu HTTP từ ứng dụng của chúng ta tới máy chủ. Bộ chặn cung cấp cho chúng ta khả năng làm đó mà không cần viết thêm code.

5. Thực hiện nhiều yêu cầu đồng thời
Axios cho phép chúng ta thực hiện nhiều yêu cầu HTTP với việc sử dụng phương thức axios.all(). Fetch() cung cấp cùng một tính năng với việc sử dụng phương thức promise.all(), chúng ta có thể thực hiện nhiều yêu cầu fetch() bên trong nó.

Tổng kết
Axios
fetch() đều là những cách tuyệt vời để sử dụng API nhưng tôi khuyên bạn nên sử dụng fetch() khi xây dựng các ứng dụng tương đối nhỏ và sử dụng Axios khi xây dựng các ứng dụng lớn vì lý do khả năng mở rộng.

Tham khảo: Consuming REST APIs In React With Fetch And Axios — Smashing Magazine
 

Facebook Comments

Top