使用axios nginx的配置
时间: 2023-07-08 08:37:19 浏览: 46
在使用 axios 和 nginx 时,需要注意一些配置问题。
首先,在配置 nginx 反向代理时,需要将 axios 请求的域名和端口号指定为 nginx 代理的域名和端口号,例如:
```
location /api {
proxy_pass http://backend_server:8080;
proxy_set_header Host $host;
}
```
这里将所有以 `/api` 开头的请求转发到 `http://backend_server:8080`。注意要设置 `proxy_set_header Host $host`,否则后端服务可能无法正确获取请求的域名和端口号。
其次,在使用 axios 发送请求时,需要手动配置一些请求和响应拦截器来处理一些 nginx 反向代理后可能出现的问题,例如:
```
import axios from 'axios';
const instance = axios.create({
baseURL: '/api', // 基础URL为nginx代理的地址
timeout: 1000 * 5, // 请求超时时间
});
// 请求拦截器
instance.interceptors.request.use(
config => {
config.headers['Content-Type'] = 'application/json';
return config;
},
error => {
return Promise.reject(error);
}
);
// 响应拦截器
instance.interceptors.response.use(
response => {
return response.data;
},
error => {
const { response } = error;
if (response) {
// 处理响应错误码等信息
} else {
// 处理请求超时等错误信息
}
return Promise.reject(error);
}
);
export default instance;
```
这里我们手动设置了基础 URL 为 `/api`,并在请求拦截器中手动设置了请求头的 Content-Type,以及在响应拦截器中处理了可能出现的错误信息。