Vue3 设置默认目标服务器的 URL

一、概述

在本地开发，由于 vue 端口和 spring boot 端口都在 8080, 会产生冲突，所以我将 spring boot 的端口改为了 8085 , 在 application.yml 中直接修改，如下所示

server:
  port: 8085 

然后本地去连，直接完整路径的 axios 请求是可以的，比如

axios({
        method: "GET",
        url: "http://localhost:8085/getVaule",
      })

通过 action 的方式访问后端却不可以，因为他是在默认 8080 的端口上。

二、解决方法

在 vue.config.js 中新建 devServer, 如以下

    devServer: {
        proxy: {
            '/': {
                target: 'http://localhost:8085', //设置你调用的接口域名和端口号 别忘了加 http
                changeOrigin: true,
                ws: false,
                pathRewrite: {}
            }
        }
    }

现在即可通过 action 的方式请求到后端。