CODEWITHSUNDEEP
react-nativeaxios
pkay14
pkay14

Reputation: 25

How can I pass token from SecureStore to axiosInstance headers: Authorization in React-native?

How can I pass a token from SecureStore.getItemAsync to axiosInstance headers. getAccessToken() gives me promise, I understand I could do getAccessToken().then(token=>....), but how should I implement it in here?

import axios from 'axios';
import * as SecureStore from 'expo-secure-store'
import { useEffect, useState } from 'react';
const baseURL = 'http://000.000.0.000:8000/api/';

async function getAccessToken(){
    await SecureStore.getItemAsync('access_token')
}

const axiosInstance =
 axios.create({
    baseURL: baseURL,
    timeout: 5000,
    headers: {
        Authorization:  getAccessToken()
            ? 'JWT ' +  getAccessToken()
            : null,
        'Content-Type': 'application/json',
        accept: 'application/json',
    },
});

axiosInstance.interceptors.response.use(
    (response) => {
        console.log(response)
        return response;
    },

);

export default axiosInstance;

Upvotes: 1

Views: 776

Answers (2)

Usman Rana
Usman Rana

Reputation: 96

You can use this to update token.

async function setAccessToken(){
   let token=await SecureStore.getItemAsync('access_token')
   axiosInstance.defaults.headers.common['Authorization'] = `Bearer ${token}`
}

just call setAccessToken on start of you app or where you want to set Authorization token.

Upvotes: 3

Michael Bahl
Michael Bahl

Reputation: 3649

You could use request interceptor.

axios.interceptors.request.use(async req => {
  const access_token = await SecureStore.getItemAsync('access_token')

  req.headers.authorization = access_token;

  return req;
});

Upvotes: 2

Related Questions