React解决跨域问题

1.在src目录下创建文件setupProxy.js,然后写入以下代码

const proxy = require('http-proxy-middleware')

module.exports = function(app){
	app.use(
		proxy('/api1',{ //遇见/api1前缀的请求，就会触发该代理配置
			target:'http://localhost:5000', //请求转发给谁
			changeOrigin:true,//控制服务器收到的请求头中Host的值
			pathRewrite:{'^/api1':''} //重写请求路径(必须)
		}),
		proxy('/api2',{
			target:'http://localhost:5001',
			changeOrigin:true,
			pathRewrite:{'^/api2':''}
		}),
	)
}

proxy中可以配置多个需要访问的域名

2.请求的代码中要写上你原来的域名+后缀路径

如果http://localhost:3000中找不到，就会在api1中找

  getStudentInfo = () =>{
    axios.get('http://localhost:3000/api1/students')
    .then(
      response =>{
        console.log(response)
      },
      error =>{
        console.log(error)
      }
    )
  }

3.重启服务

npm start

ok!跨域问题解决！