Yêu cầu HTTP trong Node bằng Axios

Axios là một thư viện JavaScript rất tiện lợi để thực hiện các yêu cầu HTTP trong Node.js

Giới thiệu

Axios là một thư viện JavaScript rất phổ biến mà bạn có thể sử dụng để thực hiện các yêu cầu HTTP, hoạt động trong cả Trình duyệt vàNode.jsnền tảng.

Nó hỗ trợ tất cả các trình duyệt hiện đại, bao gồm hỗ trợ cho IE8 trở lên.

Nó dựa trên lời hứa và điều này cho phép chúng tôi viết mã không đồng bộ / chờ đợi để thực hiệnXHRyêu cầu rất dễ dàng.

Sử dụng Axios có khá nhiều lợi thế so với bản gốcAPI tìm nạp:

hỗ trợ các trình duyệt cũ hơn (Tìm nạp cần một polyfill)
có một cách để hủy bỏ một yêu cầu
có một cách để đặt thời gian chờ phản hồi
có bảo vệ CSRF tích hợp
hỗ trợ tiến trình tải lên
thực hiện chuyển đổi dữ liệu JSON tự động
hoạt động trong Node.js

Một video hướng dẫn

Xem video này, nơi tôi tạo máy chủ Express cung cấp điểm cuối POST và tôi thực hiện yêu cầu Axios đối với nó, để đăng dữ liệu:

Cài đặt

Axios có thể được cài đặt bằng cách sử dụngnpm:

npm install axios

hoặc làsợi:

yarn add axios

hoặc đưa nó vào trang của bạn bằng cách sử dụng unkg.com:

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

API Axios

Bạn có thể bắt đầu một yêu cầu HTTP từaxiosvật:

tôi sử dụngfoovàbarnhưtên ngẫu nhiên. Nhập bất kỳ loại tên nào để thay thế chúng.

axios({
  url: 'https://dog.ceo/api/breeds/list/all',
  method: 'get',
  data: {
    foo: 'bar'
  }
})

nhưng để thuận tiện, bạn thường sẽ sử dụng

axios.get()
axios.post()

(như trong jQuery bạn sẽ sử dụng$.get()và$.post()thay vì$.ajax())

Axios cung cấp các phương thức cho tất cả các động từ HTTP, ít phổ biến hơn nhưng vẫn được sử dụng:

axios.delete()
axios.put()
axios.patch()
axios.options()

và một phương thức để lấy tiêu đề HTTP của một yêu cầu, loại bỏ phần thân:

axios.head()

NHẬN yêu cầu

Một cách thuận tiện để sử dụng Axios là sử dụng cú pháp async / await hiện đại (ES2017).

Ví dụ Node.js này truy vấnAPI chóđể truy xuất danh sách tất cả các giống chó, sử dụngaxios.get()và nó tính chúng:

const axios = require('axios')
const getBreeds = async () => {
try {
return await axios.get(‘https://dog.ceo/api/breeds/list/all’)
} catch (error) {
console.error(error)
}
}
const countBreeds = async () => {
const breeds = await getBreeds()
if (breeds.data.message) {
console.log(Got </span><span style="color:#e6db74">${</span>Object.<span style="color:#a6e22e">entries</span>(<span style="color:#a6e22e">breeds</span>.<span style="color:#a6e22e">data</span>.<span style="color:#a6e22e">message</span>).<span style="color:#a6e22e">length</span><span style="color:#e6db74">}</span><span style="color:#e6db74"> breeds)
}
}
countBreeds()

Nếu bạn không muốn sử dụng async / await, bạn có thể sử dụngLời hứacú pháp:

const axios = require('axios')
const getBreeds = () => {
try {
return axios.get(‘https://dog.ceo/api/breeds/list/all’)
} catch (error) {
console.error(error)
}
}
const countBreeds = async () => {
const breeds = getBreeds()
.then(response => {
if (response.data.message) {
console.log(
Got </span><span style="color:#e6db74">${</span>Object.<span style="color:#a6e22e">entries</span>(<span style="color:#a6e22e">response</span>.<span style="color:#a6e22e">data</span>.<span style="color:#a6e22e">message</span>).<span style="color:#a6e22e">length</span><span style="color:#e6db74">}</span><span style="color:#e6db74"> breeds
)
}
})
.catch(error => {
console.log(error)
})
}
countBreeds()

Thêm thông số vào yêu cầu GET

Phản hồi GET có thể chứa các tham số trong URL, như sau:https://site.com/?foo=bar.

Với Axios, bạn có thể thực hiện việc này bằng cách sử dụng URL đó:

axios.get('https://site.com/?foo=bar')

hoặc bạn có thể sử dụng mộtparamstài sản trong các tùy chọn:

axios.get('https://site.com/', {
  params: {
    foo: 'bar'
  }
})

ĐĂNG yêu cầu

Thực hiện yêu cầu ĐĂNG giống như thực hiện yêu cầu GET, nhưng thay vìaxios.get, bạn dùngaxios.post:

axios.post('https://site.com/')

Một đối tượng chứa các tham số POST là đối số thứ hai:

axios.post('https://site.com/', {
  foo: 'bar'
})

Tải xuống miễn phí của tôiSổ tay Node.js