webpack 配置proxy 解决跨域问题

前言:公司前期一直使用express和koa框架做项目,请求一直在服务端,所以没有遇到跨域的问题。在使用react做纯view项目的时候,跨域的问题就伴随而来。怎么解决呢?除了让后端解决外,可以在webpack的配置上解决这个问题,下面我介绍少一下解决的方法。

在确认node_modules包含http-proxy-middleware模块的情况下配置devServer如下,否则先npm安装一下再配置。

devServer: {
        proxy: {
          '/api': {
            target: 'https://xxx.sendinfo.com.cn',
            secure: false,
            changeOrigin:true //允许跨域请求
          }
        },
        contentBase: "./public", //本地服务器所加载的页面所在的目录
        colors: true, //终端中输出结果为彩色
        historyApiFallback: true, //不跳转
        inline: true, //实时刷新
        hot: true  // 使用热加载插件 HotModuleReplacementPlugin
    }
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • nodejs服务实现反向代理,解决本地开发接口请求跨域问题 前后端分离项目需要解决第一个问题就是,前端本地开发时如...
    莫逐阅读 61,022评论 0 4
  • 什么是跨域? 2.) 资源嵌入:、、、等dom标签,还有样式中background:url()、@font-fac...
    电影里的梦i阅读 2,393评论 0 5
  • 前端将大型项目分成一个个单独的模块,一般封装好的每个模块都会实现一个目的明确的完成的功能。如何处理这些模块以及模块...
    pixels阅读 3,449评论 1 14
  • 有人说,观察可以在后天培养,肯定是真的,那到底跟智商有没有关系呢,这我不得而知了。观察是前提,思考是基础,从而能够...
    劲松阅读 585评论 0 1
  • 最近我经常被人问到一个问题:「你从事的是什么职业的?」 说真的,我可以回答我的职业是生活、我无业、我自由业、我每天...
    庄13台妹PKGIRL阅读 890,583评论 395 1,791