如何配置axios基本URL？

Question

我正在尝试配置我的 axios 基本 URL。我从以下 StackOverflow 问题中找到了以下代码：

如何为每个 http 调用中的默认请求标头创建 axios 配置？

但是，我收到“未处理的拒绝（类型错误）：无法读取未定义（匿名函数）的属性“数据””错误。这篇文章只有 2 年时间，使用了一个类，但在我的代码中，我使用了一个函数。

当我正常执行（不更改基本 URL）时，axios 调用工作正常。但是当我添加 axiosConfig 并更改基本 URL 时，我收到错误。

如果有人能对这个问题有所启发，我将不胜感激。

axiosConfig.js

import axios from "axios";

const baseURL = process.env.REACT_APP_BASE_URL;

const instance = axios.create({
  // .. congigure axios baseURL
  baseURL: `${baseURL}`
});

export default instance;

进行 axios 调用的文件

import axiosConfig from "../axios/axiosConfig";

export const getPosts = () => {
  const posts= (dispatch) => {
    return axiosConfig
      .get('/posts')
      .then((response) => { 
        dispatch({
          type: GET_POSTS,
          payload: response.data,
        });
      })
      .catch((error) => {
        dispatch({
          type: POSTS_ERROR,
          payload: error.response.data.message,
        });
      });
  };
  return posts;
};
     

Answer 1

它对我来说适用于生产和开发。

import axios from "axios";

const api = axios.create({
 baseURL: process.env.REACT_APP_BASE_URL || "http://localhost:3030",
});

export default api;

使用我做类似的事情

import api from "../services/api";
const response = await api.post("/sessions", { email, password });