vue3+vite在vite中配置跨域

在vite.config.js中配置

import { defineConfig } from 'vite'
import vue from '@vitejs/plugin-vue'
import path from 'path';

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [vue()],
  base: "./",//打包路径
  resolve: {
    alias: {
      '@': path.resolve(__dirname, './src')//设置别名
    }
  },
  server: {
    open: true,//启动项目自动弹出浏览器
    port: 4000,//启动端口
    proxy: {
      '/api': {
        target: 'http://localhost:8080',	//实际请求地址
        changeOrigin: true,
        rewrite: (path) => path.replace(/^\/api/, '')
      },
    }
  }
  // server: {
  //   port: 4000,//启动端口
  //   open: true,
  //   proxy: {
  //     // 跨域简单写法写法
  //     '/api': 'http://123.56.85.24:5000'//代理网址
  //   },
  //   cors: true
  // },
})

配置好之后，路径必须带http://不然vite会报错，代理错误
配置好之后直接

var algorithmBASEURL:string='/api'
// 调用算法参数接口
function getAlgorithmParams(params:String){
    return request('get',algorithmBASEURL+`/algorithm?method=${params}`)
}

打开控制台看接口还是原来的路径，但配置好跨域后，接口就通了

注意：跨越配置好之后请求接口的baseUrl改为http://localhost 端口为当前项目启动的端口
且所有需要跨域的接口再加上http://localhost:端口 + ‘/api’