Create Axios instance with taking token from AsyncStorage

A better way would probably be using axios interceptors. this way you can both intercept the request and send your tokens and also when you send refreshed tokens in response you can get that and save them in async storage.


Below is how I managed to solve the problem.

As @Prithwee said, I decided to use axios( not react-native-axios) interceptors and set it up in App.js as follows.

import React, {Component} from 'react';
import DrawerNavigator from './Utils/DrawerNavigator'
import {
  createAppContainer
} from 'react-navigation';
import axios from 'axios'
import AsyncStorage from "@react-native-community/async-storage"

axios.defaults.baseURL='http://192.168.1.100:8080/api'

axios.interceptors.request.use(
  async config => {
    const token = await AsyncStorage.getItem('token')
    if (token) {
      config.headers.Authorization = "Bearer "+token
    }
    return config
  },
  error => {
    return Promise.reject(error)
  }
);

const App = createAppContainer(DrawerNavigator);

export default App;