Axios调用同服务接口丢失端口致404，如何修复？

核心问题 #

你遇到的404错误及后续可能的返回值异常，源于三个关键遗漏点：

1. axios未配置baseURL导致端口缺失 #

在后端服务中调用相对路径/api/users时，axios默认会使用无端口的基础地址，导致请求变为http://localhost/api/users，而非预期的http://localhost:4000/api/users。

2. 未使用预先创建的axios实例client #

你已经生成了带缓存控制头的client实例，但实际请求却用了全局axios.get，导致之前配置的headers和后续要加的baseURL完全失效。

3. 异步请求未加await获取结果 #

axios.get是异步函数，直接赋值result得到的是Promise对象，而非接口返回的实际数据，直接赋值给ctx.body会导致返回内容不符合预期。

修正后的代码 #

import server from 'myserver';
import { verifyJwt } from 'jwt.middleware';
import axios from 'axios';

const app = server.getApp();

app.use(function (ctx, next) {
  ctx.cacheControl = {
    noCache: true
  };
  return next();
});

// 配置baseURL，指定后端服务的完整基础地址
const client = axios.create({
  baseURL: 'http://localhost:4000',
  headers: {
    'Cache-Control': 'no-cache',
    Pragma: 'no-cache',
    Expires: '0'
  }
});

const router = server
  .getRouter({ prefix: '/myuserendpoint' })
  .use(verifyJwt);

router.get('/goodusers', async ctx => {
     // 使用创建好的client实例，并添加await获取异步结果
     const result = await client.get('/api/users');    
     // 补充你的过滤逻辑，比如筛选符合条件的用户
     const goodUsers = result.data.filter(user => /* 你的业务过滤条件 */);
     ctx.body = goodUsers;
});

额外说明 #

• 若不想硬编码baseURL，可通过环境变量配置（如process.env.SERVER_BASE_URL），避免在不同环境重复修改代码。
• 过滤逻辑需根据你的业务需求补充，比如判断用户状态、权限等。

内容的提问来源于stack exchange，提问作者vaheeds