- yarn add http-proxy-middleware安装跨域包
- 在src目录下创建 setupProxy.js 文件,配置如下
const { createProxyMiddleware } = require("http-proxy-middleware");
module.exports = function (app) {
app.use(
createProxyMiddleware("/api", {
target: "http://www.web-jshtml.cn/api/react",
changeOrigin: true,
pathRewrite:{
"^/api":""
}
})
);
};
- 配置axios,请求器,拦截器,默认请求地址,超时时间,配置请求方法
yarn add axios
新建utils文件夹,建立http.js用来封装请求方法,如下
import axios from "axios";
const instance = axios.create({
baseURL: "/api",
timeout: 3000,
});
instance.interceptors.request.use(
function (config) {
return config;
},
function (error) {
return Promise.reject(error);
}
);
instance.interceptors.response.use(
function (response) {
return response;
},
function (error) {
return Promise.reject(error);
}
);
//导出一个post请求方法
export const post = (url, params) => {
return instance.post(url, params);
};
//然后再在src下新建api目录,用来存放所有的api请求,下建commonApi.js
import {post} from "../utils/http"
export const getLoginSms = (params) => post('/getSms/', params);
//后面的页面里面,就可以直接引入getLoginSms使用了。