Axios with Auth不是有效的axios实例

Question

我正在尝试使用axios.create()在axios post请求上设置Authorization。我将其放在一个文件中，当我尝试将该函数导入到我的React Native组件中时，我得到了以下错误：

axiosWithAuth.default().post is not a function

下面是我的函数代码：

import axios from 'axios';
import {AsyncStorage} from 'react-native';
// import AsyncStorage from '@react-native-community/async-storage'

async function axiosWithAuth() {
    const token = await AsyncStorage.getItem('userToken');
    console.log('token from asyncstorage' , token);
    return axios.create({headers : {'Content-Type': null, Authorization : token}})
}

export default axiosWithAuth;

我正在使用下面的React Native组件中的函数：

import axiosWithAuth from '../utils/axiosWithAuth';

const Recipe = (props) => {

const likeIt = () => {
        console.log('like pressed');
        console.log('props', props.recipe.id);
        setLike(!like);
        axiosWithAuth().post(`API_URL`,{})
            .then(res => console.log('response from post like: ', res.data))
            .catch(err => console.log('error in posting like', err.response))
    }
return (
      <Text>This is the Recipe Component </Text>
   )
}

Answer 1

您使用了带有axiosWithAuth函数的async。它返回的是Promise，而不是axios的实例。你必须这样写它

(await axiosWithAuth()).post(`API_URL`,{})
    .then(res => console.log('response from post like: ', res.data))
    .catch(err => console.log('error in posting like', err.response))

Answer 2

下面是工作的代码。创建一个变量并将其设置为await axiosWithAuth()。然后对该变量执行post请求。下面是axiosWithAuth函数的定义：

import axios from 'axios';
import {AsyncStorage} from 'react-native';

async function axiosWithAuth() {
    const userToken = await AsyncStorage.getItem('userToken');
    console.log('userToken', userToken);
    // return axios.create({headers : {'Content-Type': null, Authorization : userToken}})
    return axios.create({headers : {Authorization : userToken}})
}

export default axiosWithAuth;

下面是使用axiosWithAuth函数的代码：

import axiosWithAuth from '../utils/axiosWithAuth';

const likeIt = async () => {
        await setLike(!like);
        console.log('liked?', like);
        const axiosAuth = await axiosWithAuth();
        console.log('axiosAuth', axiosAuth);
        if (!like) {
            axiosAuth.post(`https://url`,{})
                .then(res => {
                    console.log('response from post like: ', res.data.message);
                })
                .catch(err => console.log('error in posting like', err.response))
        } else {
            axiosAuth.delete(`https://url`)
                .then(res => console.log('res from unlike', res))
                .catch(err => console.log('err from deleting like', err))
        }
    }