React中axios及代理配置

一、axios

npm install axios
在组件中引入

import axios from 'axios'

二、middleware

npm install http-proxy-middleware --save
在src目录下新建setupProxy.js文件，里面配置

const { createProxyMiddleware } = require('http-proxy-middleware')

module.exports = function (app) {
  app.use(createProxyMiddleware('/api', {
    target: 'http://192.168.0.134:80',
    secure: false,
    changeOrigin: true,
    ws:true,
    pathRewrite: {
      "^/api": ""
    }
  }))
}

三、使用axios

装好后各模块版本

    "axios": "^0.21.1",
    "http-proxy-middleware": "^2.0.0",
    "react": "^17.0.2",

在组件中使用

componentDidMount(){
    axios.get('/api/register/GetStudent').then(res=>{
        console.log(res);
    })
}