我的博客项目-前端

79 阅读1分钟

简介

Typescript+vite+vue3.x。

使用技术

技术版本
vue3.x
element-plus

项目进度

创建项目

npm create vite@latest

跨域请求

//vite-config.vue
//代理对象
let proxyObj = {};

// 代理对象,后面的数组中的字符表示,表示代理的路由
//即只有/api/**的路径会被匹配到后端,后端也需要添加前缀/api/,否则无法匹配
proxyObj['/api/'] = {
    //websocket
    ws: true,
    /* 为true 时,代理才会生效,将请求转发到target */
    changeOrigin: true,
    //目标地址
    target: 'http://localhost:8081',
    //不重写请求地址
    //因为后端可能有前置路径,可能是/api/xxxx,使用pathRewrite 的目的就是为了能够不要写/api ,而是直接写/xxx这样就比较舒服
    pathRewrite: {
        //   “^/” 表示匹配除了 “/"以外的所有
        '': '/'
    }
};
export default defineConfig({
    //.....
    //跨域请求
    server: {
        open: true,
        host: 'localhost',
        port: 4000,
        //是否开启https
        https: false,
        //以上的ip和端口是我们本机的;下面为需要跨域的
        proxy: proxyObj

    }
})