Shaoli's Blog

React 使用 http-proxy-middleware代理多个跨域

create-react-app脚手架低于2.0版本时候,可以使用对象类型

"proxy": {
    "/api": {
      "target": "http://localhost:8888",
      "changeOrigin": true
    }
}


最新的create-react-app脚手架2.0版本以上只能配置string类型

"proxy": "http://localhost:5000"


当然,官网也给了新的方法,在src下新建文件setupProxy.js,无需单独应用,webpack会自动引入文件。

npm install http-proxy-middleware
# yarn add http-proxy-middleware


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

module.exports = (app) => {
  app.use(
    createProxyMiddleware('/api', {
      target: 'http://122.111.111.11',
      pathRewrite: {
        '^/api': '/',
        changeOrigin: true
      }
    })
  )
  app.use(
    createProxyMiddleware('/oss', {
      target: 'http://oss-cn-hangzhou.aliyuncs.com',
      pathRewrite: {
        '^/oss': '/',
        changeOrigin: true
      }
    })
  )
}
    评论列表

  • 暂无评论...快来说说吧!
person
0 / 16
comment
0 / 100