Axiosを使用したAPI GETリクエストの実装方法とエラー処理

Axiosのインストール: まず、Axiosをインストールする必要があります。以下のコマンドを使用して、プロジェクトのディレクトリでAxiosをインストールします。

npm install axios

GETリクエストの実装: Axiosを使用してGETリクエストを実装するには、以下のようなコードを使用します。

const axios = require('axios');
axios.get('APIのURL')
  .then(response => {
    // レスポンスの処理
    console.log(response.data);
  })
  .catch(error => {
    // エラー処理
    console.error(error);
  });

上記のコードでは、axios.get()メソッドを使用してAPIのURLにGETリクエストを送信しています。成功した場合は、thenブロックでレスポンスデータを処理します。エラーが発生した場合は、catchブロックでエラーを処理します。

パラメータの追加: GETリクエストにパラメータを追加するには、以下のようにparamsオブジェクトを使用します。

axios.get('APIのURL', {
  params: {
    key1: 'value1',
    key2: 'value2'
  }
})
  .then(response => {
    // レスポンスの処理
    console.log(response.data);
  })
  .catch(error => {
    // エラー処理
    console.error(error);
  });

paramsオブジェクトには、GETリクエストのクエリパラメータをキーと値のペアで指定します。

ヘッダーの設定: GETリクエストのヘッダーを設定するには、以下のようにheadersオブジェクトを使用します。

axios.get('APIのURL', {
  headers: {
    'Authorization': 'Bearer ' + token,
    'Content-Type': 'application/json'
  }
})
  .then(response => {
    // レスポンスの処理
    console.log(response.data);
  })
  .catch(error => {
    // エラー処理
    console.error(error);
  });

headersオブジェクトには、ヘッダーのキーと値のペアを指定します。上記の例では、ベアラートークンを認証ヘッダーに追加しています。

これらの手順とコード例を使用して、Axiosを使用したAPIのGETリクエストを実装し、エラー処理を行うことができます。