Cách buộc thông tin đăng nhập cho mọi yêu cầu Axios

Tôi đang sử dụng Axios để tương tác với một API đặt mã thông báo JWT.

API đã trả lại mã thông báo trong một cookie và tôi nhanh chóng nhận ra rằng mình cần phải đặtwithCredentials: truetrong các tùy chọn Axios:

import axios from 'axios'

axios.post(API_SERVER + ‘/login’, { email, password }, { withCredentials: true })

Nếu không, cookie sẽ không được lưu.

Tôi cũng cần đặt nó cho mọi yêu cầu khác mà tôi đã thực hiện, để gửi mã thông báo JWT đến máy chủ:

axios.get(API_SERVER + '/todos', { withCredentials: true })

Bây giờ, nó ổn đối với một số yêu cầu, nhưng đối với nhiều người, bạn có thể muốn sử dụng một cấu hình chung.

Bạn có thể làm điều đó bằng cách sử dụngcreate()để tạo một phiên bản Axios mới, sau đó bạn sẽ sử dụng nó trong các yêu cầu của mình:

import axios from 'axios'

const instance = axios.create({ withCredentials: true })

instance.get(API_SERVER + ‘/todos’)

Việc thêm mộtbaseURLbất động sản:

import axios from 'axios'

const instance = axios.create({ withCredentials: true, baseURL: API_SERVER })

instance.get(‘todos’)

Trong React tôi đã sử dụngaxios-hooksvà để cấu hìnhwithCredentialsTôi đã sử dụng mã này:

import axios from 'axios'
import useAxios, { configure } from 'axios-hooks'

const instance = axios.create({ withCredentials: true, baseURL: API_SERVER, })

configure({ instance })

const [{ data, loading, error }, refetch] = useAxios(‘todos’)

Tải xuống miễn phí của tôiSổ tay dành cho Người mới bắt đầu JavaScript


Các hướng dẫn js khác: