Axios는 자바스크립트에서 HTTP 요청을 보낼 때 사용하는 인기 있는 라이브러리입니다. 이 라이브러리를 사용하면 쉽게 서버와 통신할 수 있습니다. 이번에는 Axios와 함께 인증 토큰을 설정하는 방법에 대해 알아보겠습니다.

Axios 설치하기

먼저, Axios를 사용하기 위해 npm을 통해 라이브러리를 설치해야 합니다. 아래 명령을 사용하여 Axios를 설치할 수 있습니다:

npm install axios

인증 토큰 생성하기

일반적으로 서버는 사용자를 인증하기 위해 토큰을 발급합니다. 이 토큰은 사용자가 로그인할 때마다 서버로부터 제공되며, 이후에 모든 요청에 포함되어야 합니다.

아래는 서버로부터 토큰을 받아서 저장하는 예제입니다:

const token = "YOUR_AUTH_TOKEN";

Axios 인스턴스 생성하기

Axios는 기본 설정값을 제공합니다. 그러나 인증 토큰과 같은 사용자 지정 설정을 사용하기 위해서는 Axios 인스턴스를 생성하는 것이 좋습니다. 이를 통해 인증 토큰을 모든 요청에 자동으로 포함시킬 수 있습니다.

import axios from 'axios';

const instance = axios.create({
  headers: {
    'Authorization': `Bearer ${token}`
  }
});

인증 토큰을 사용하여 요청 보내기

이제 Axios 인스턴스를 사용하여 요청을 보낼 수 있습니다. 아래는 GET 요청 예제입니다:

instance.get('https://api.example.com/data')
  .then(response => {
    console.log(response.data);
  })
  .catch(error => {
    console.error(error);
  });

위 예제에서 보시다시피, 모든 요청에 인증 토큰이 포함되어 있습니다. 이제 서버는 이 토큰을 사용하여 사용자를 인증하고 요청을 처리할 수 있습니다.

Axios를 사용하여 인증 토큰을 설정하는 방법에 대해 알아보았습니다. 이를 통해 손쉽게 서버와 통신하고 인증을 구현할 수 있습니다. 문제가 발생한다면, Axios 공식 문서를 참조하여 문제를 해결할 수 있습니다.

참조

• Axios 공식 문서
• Axios GitHub 저장소