第一次使用nginx反向代理的大坑

最新推荐文章于 2024-04-22 09:35:58 发布

略略略～

最新推荐文章于 2024-04-22 09:35:58 发布

阅读量1.1k

点赞数

分类专栏：前端 nginx webpack-dev-server

本文链接：https://blog.csdn.net/weixin_42252518/article/details/104341083

版权

本文详细介绍了在项目中如何通过webpack-dev-server进行代理配置，并结合nginx设置反向代理解决跨域问题。在实现过程中，强调了webpack代理路径的设定以及nginx location匹配规则的重要性，同时解释了nginx中的一些关键内置参数含义，帮助开发者避免常见错误。

摘要由CSDN通过智能技术生成

项目需求：

通过webpack-dev-server中间件代理访问配置在nginx上的反向代理服务端口，从而实现跨域请求资源。

最终实现

webpack配置

devServer: {
   
    host: 'localhost',
    port: 8000,
    proxy: {
     // 代理配置
      '/v1':{
   
        target: "http://localhost:8001", // 代理服务器地址，nginx会监听此接口下的请求，并代理请求真正的网址
        pathRewrite: {
   '^/v1' : ''}
      }
    }
  }</