Vue3 配置 vite.config.js 解决跨域问题

最新推荐文章于 2025-04-15 18:44:05 发布

她似晚风般温柔789

最新推荐文章于 2025-04-15 18:44:05 发布

阅读量4.7k

点赞数 33

分类专栏：项目踩坑日记技术分享文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.youkuaiyun.com/weixin_56050344/article/details/136451013

版权

本文介绍了在Vue3项目中，通过修改`vite.config.js`的请求代理设置，解决从http://localhost:5173访问http://localhost:8080时的跨域问题，重点讲解了axios配置和Vite的proxy设置方法。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

Vue3 配置 vite.config.js 解决跨域问题

问题再现

Access to XMLHttpRequest at ‘http://localhost:8080/user/register’ from origin ‘http://localhost:5173’ has been blocked by CORS policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

在这里插入图片描述

解决问题

原 request.js

// 导入 axios 依赖
import axios from 'axios';
// 定义baseUrl
const baseURL = 'http://localhost:8080';
// 创建实例
const instance = axios.create({
   
    baseURL: baseURL,
});


// 添加响应拦截器
instance.interceptors.response.use(
    result => {