zoukankan      html  css  js  c++  java
  • Vue 配置请求转发(vue2 和 vue3 的方式不同)

    前言

    使用 Vue 和 Spring Boot 开发前后端分离项目时,配置前端项目和后端项目在不同的端口下启动。

    步骤

    vue3

    在使用 vue-cli3 创建项目后,在项目的根目录下,新建 vue.config.js 文件,来配置关于请求转发:

    let proxyObj = {};
    proxyObj["/"] = {
        ws:false, // 关闭 webSocket
        target: "http://localhost:8081", // 后端的地址
        changeOrigin: true,
        pathRewrite: {
            '^/':''
        }
    }
    
    module.exports = {
        devServer:{
            host: "localhost",
            port: 8080,
            proxy: proxyObj
        }
    }
    

    将所有的 / 开头的请求转发到 8081 端口的地址上去。

    注意:修改了配置文件 vue.config.js 之后必须重启,否则不会生效。

    vue2

    在 vue2 中,有一个 config 目录,在 vue3 中,这个目录是不存在的。

    修改 config 目录下的 index.js 文件,修改 proxyTable,代码如下:

        proxyTable: {
          '/':{
            target: "http://localhost:8081", // 这个就是后端地址
            changeOrigin: true,
            pathRewrite: {
              '^/': ''
            }
          }
        }
    

    如下图:

    参考文章:https://blog.csdn.net/weixin_43272781/article/details/105019133

    每天学习一点点,每天进步一点点。

  • 相关阅读:
    团队站立会议09
    团队站立会议08
    团队绩效
    团队站立会议07
    团队站立会议06
    团队站立会议05
    团队站立会议04
    团队站立会议03
    团队站立会议02
    反转链表
  • 原文地址:https://www.cnblogs.com/youcoding/p/14563528.html
Copyright © 2011-2022 走看看