前端在项目目录中next.config.js文件中添加以下代码
async rewrites() {return [{source: "/api/:path*",destination: `${process.env.NEXT_PUBLIC_API_DOMAIN}/api/:path*`,basePath: false}]}
截图:
-
source: "/api/:path*"
: 定义了一个 URL 模式,匹配所有以/api/
开头的请求,并将:path*
作为一个通配符来匹配其后的路径部分。 -
destination: "${process.env.NEXT_PUBLIC_API_DOMAIN}/api/:path*"
: 将匹配的请求代理到NEXT_PUBLIC_API_DOMAIN
所定义的后端 API。process.env.NEXT_PUBLIC_API_DOMAIN
是一个环境变量,通常在.env
文件中定义。例如,如果NEXT_PUBLIC_API_DOMAIN
(后端接口ip:端口)的值是https://api.example.com
,那么请求http://localhost:3000/api/users
就会被代理到https://api.example.com/api/users
。 -
basePath: false
: 禁用basePath
,确保重写规则不受basePath
配置的影响。
注意:不要配置axios的baseURL,让其默认是localhost:xxx地址请求接口,它会转发到${process.env.NEXT_PUBLIC_API_DOMAIN}/api/:path*地址