美文网首页
webpack代理请求api,解决跨域问题。

webpack代理请求api,解决跨域问题。

作者: hansduo | 来源:发表于2017-12-29 11:07 被阅读0次

    前些时间学习react过程中,碰到一个情况。
    请求测试环境的api,因为跨域,在跑项目时报错。

    最初想法是nginx代理服务器地址和webpack地址,结果因为不清楚的原因(技术深度不够)。这个方法没能生效。

    之后就了解到了,webpack可以直接进行代理。将服务器api代理到webpcak同一个ip和端口下。

    暂时解决了本地开发的问题。

    devServer: {
        contentBase: './src/',
        historyApiFallback: true,
        hot: true,
        port: defaultSettings.port,
        publicPath: defaultSettings.publicPath,
        noInfo: false,
        proxy: {
          '/api': {
            target: 'http://localhost:8085/',
            pathRewrite: {'^/api' : '/seckill'},
            changeOrigin: true
          }
        }
      },
    

    主要是proxy内的设置。

    后台api完整地址:http://localhost:8085/seckill/time/now
    通过代理设置,在react内请求:http://localhost:8000/api/time/now 即是请求上面的接口。
    (webpack端口 8000)
    记录以备忘

    相关文章

      网友评论

          本文标题:webpack代理请求api,解决跨域问题。

          本文链接:https://www.haomeiwen.com/subject/ogkigxtx.html