SpringBoot+VUE跨域问题

axios 添加 withCredentials = true 后出现了跨域问题 前端是 axios 向后端发送请求,根据 cookie 来判断当前用户是否登录,但是在请求的时候,没有携带 cookie。来让 axios 向后端请求的时候携带上 cookie。axios 默认不携带凭证(cookie)但是添加配置后,出现了跨域错误。前半部分是允许该地址进行跨域。后半部分是允许携带凭证。 阅读详情

场景及问题描述:

项目为前后端分离,后端项目使用Maven多模块项目+SpringBoot,前端使用 VUE。

后端在登录接口保存当前用户信息到session,前端请求后端接口,后端拦截器无法从session中获取当前登录的用户,前端出现以下跨域报错

 

错误信息:

The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

 

问题分析:

转自:https://www.jianshu.com/p/c115e4a24977

当请求的凭据模式为include时,相应中的Access-Control-Allow-Origin标头的值不能是通配符 "*"

如在请求定义中设置withCredentials标志,则会在请求中传递cookie等。
如果服务器返回任何set-cookie响应头, 那么必须返回Access-Control-Allow-Credentials: true, 否则将不会在客户端上创建 cookie
如果你这样设置,你需要同时指定了确切的Access-Control-Allow-Origin响应头,因为Access-Control-Allow-Origin: 不具有凭证兼容

--->当请求中携带cookie时, Access-Control-Allow-Origin必须要有确切的指定, 不能是通配符(*), 而withC

springboot跨域:Access to XMLHttpRequest at ' has been blocked by CORS policy: The value of the &a 目录 问题描述: springboot跨域解决: 问题描述: AccesstoXMLHttpRequestat'http://'hasbeenblockedbyCORSpolicy: Thevalueofthe'Access-Control-Allow-Origin'headerintheresponsemustnotbethewildcard'*'whentherequest'scredentialsmodeis'incl... 阅读详情

相关推荐

【Spring Boot 26】分别在SpringBoot和Vue中解决跨域问题

前端面试题汇总前端面试题是我面试过程中遇到的面试题,每一次面试后我都会复盘总结。

2401_84103903的博客 857

SpringBoot与Vue交互解决跨域问题【亲测已解决】

最近在利用springboot+vue整合开发一个前后端分离的个人博客网站,所以这一篇总结一下在开发中遇到的一个问题,**关于解决在使用vue和springboot在开发前后端分离的项目时,如何解决跨域问题。在这里分别分享两种方法,分别在`前端vue中解决`和在`后台springboot中解决`。**

m0_65634190的博客 3843

【Spring Boot 26】分别在SpringBoot和Vue中解决跨域问题(1)

由于文档内容过多,为了避免影响到大家的阅读体验,在此只以截图展示部分内容,详细完整版的JavaScript面试题文档,或更多前端资料可以点此处获取。[外链图片转存中…(img-D4iE2Q9B-1712997656095)]既有适合小白学习的零基础资料,也有适合3年以上经验的小伙伴深入学习提升的进阶课程,基本涵盖了95%以上前端开发知识点,真正体系化![外链图片转存中…(img-4Dkd0N6e-1712997656096)]

2401_84092398的博客 1125

SpringBoot+Vue完美解决跨域问题

本人做后端用springboot,同时前端用vue,遇到了跨域问题,以下为解决方案和心得 1、浏览器同源策略 什么是浏览器同源策略? 简单的来说,如果两个页面的协议,域名和端口(如有)都相同,则两个页面具有相同的源。 2、前端对跨域的设置 前端对跨域的设置仅仅需要在request中添加一个属性值withCredentials withCredentials=flase 或 withCrede...

yuanyaunlv的博客 2842

SpringBoot + Vue 中前后端分离的跨域问题解决

文章目录后端前端1 搭建vue项目2.修改跨域3.语法检查 针对后端使用8080和前端使用8080端口进行冲突的解决。 完整项目见:SpringBoot_Vue 后端 后端我们可以在application.properties中将端口改成8082。 spring.datasource.type=com.alibaba.druid.pool.DruidDataSource spring.data...

Heorin X的博客 1850

vue axios springboot 跨域导致后台无法获取session的问题

最近在做毕设,刚开始学vue,遇到了跨域问题。 经过搜索发现,大多数教程都是在前端axios设置 axios.defaults.withCredentials = true 同时后台设置拦截器,允许跨域 //这里括号中不能用 * corsConfiguration.addAllowedOrigin("http://localhost:8080"); 但是经过反复测试,你会发现网上的教程大部分都不管用,导致我浪费了整整一天的时间!!!! 关于上述教程有需要的可以自行百度。 最后重点来了!!!!!! 如果你是

qq_41202539的博客 987

springboot+vue 前后端分离项目实战四 解决vue不同的接口访问会有不同的sessionId和项目跨域问题

因为项目登录信息放到session中,vue不同的接口访问会有不同的sessionId,解决办法是在main.js中加入 axios.defaults.withCredentials = true 但是这样导致了一个跨域问题,后端Controller上加入@CrossOrigin不起作用了 所以后端项目可以加入CorsConfig接口,这样就完美解决了跨域问题 package com.face....

大鹏小站的博客 1425

vue+springboot前后端分离实现单点登录跨域问题处理

最近在做一个后台管理系统,前端是用时下火热的vue.js,后台是基于springboot的。因为后台系统没有登录功能,但是公司要求统一登录,登录认证统一使用.net项目组的认证系统。那就意味着做单点登录咯,至于不知道什么是单点登录的同学,建议去找一下万能的度娘。 刚接到这个需求的时候,老夫心里便不屑的认为:区区登录何足挂齿,但是,开发的过程狠狠的打了我一巴掌(火辣辣的一巴掌)。。。,所以这次必须...

zhuguang10的博客 1227

vue.js+springboot前后端分离,跨域不同请求时sessionId不一致问题解决方法

第一步:先解决不允许跨域请求的问题,vue.js使用的端口是8080,springboot后台使用的端口是8081,当前端调用后台http://localhost:8081的接口,会报不允许跨域请求方法的403错误,因此需要编写一个配置类解决跨域调用接口的问题。 import org.springframework.context.annotation.Bean; import org.spr...

WEN_Windy的博客 1545

spring boot+spring data-jpa+Vue+swagger ui2+axios 实现前后端分离一套增删改查,分页+解决跨域问题

今天整合了springboot+springdata-jpa+vue+swagger ui2+axios实现前后端分离写了一套增删改查,分页。希望可以给初学者一些帮助。 后端(idea中SpringBoot项目) SpringdatajpaApplication类 package com.changan.springdatajpa; import org.springframework....

小宋的博客 1757

【异常】跨域问题header in the response must not be the wildcard ‘*‘ when the request‘s credentials modeis

java前后端分离项目,前端ajax发送跨域请求时报错如下。

奶爸的编程之路,也就一周冷个三天 2454

个人博客-SpringBoot+Vue3项目实战(4)前后端联调并解决跨域问题

在前面两篇文章中,我们已经完成了前后端项目的搭建。既然是前后端分离的项目,那肯定绕不开使用发送请求。在的基础上,Jquery封装了Ajax方便在WEB发送请求。后来又出现了AxiosAxios基于(浏览器)和http(Node)封装,这使得Axios既可以在浏览器使用,也可以在Node服务端环境下使用。再到现在出现的不基于的fetch。而在真实企业开发中,前端通常使用Axios来发送请求,本文主要介绍Axios如何发送请求,以及前后端跨域问题的解决。

专注于图像领域,主要研究内容包括计算机视觉和深度学习,特别是在图像分类、目标检测和图像生成等方面有深入的研究和实践经验。 642

软考中级信息系统监理师(第二版)-第21章基础设施工程监理

由于网络信息技术的飞速发展,变化日新月异,网络设计不但要保证目前网络传输容量的要求,也要考虑今后网络的发展,满足当前以及今后相当一段时间内的网络需求,便于向新技术的升级和衔接,同时又需要保护原有的投资。通用布缆系统工程中,承建单位的竣工文档主要包括以下内容:承建合同,招标文件,投标文件,设计方案,工程实施组织设计方案,工程施工报告,隐蔽工程记录,变更记录,自测报告,信息点分布图(表),园区、楼宇、水平配线表,楼层平面图及无线设备点位图,无线设备信息表,竣工图纸等。多排安装时,列间距不应小于1200mm。

2301_78583973的博客 1400

【自动驾驶学习笔记——Prescan和Simulink 学习笔记和问题记录(1)】

主要记录一些Prescan/Simulink 联合仿真出现的问题。

ly1336545868的博客 1464

STM32与HT7038的高精度电能计量系统设计与实现

本文详细介绍了基于STM32微控制器与HT7038三相电能计量芯片的高精度电能计量系统设计与实现。文章从项目选型出发,深入剖析了硬件电路设计、SPI驱动开发、芯片校准及系统集成等关键环节,为智能电表、能源监控等应用提供了高性价比且稳定的国产化解决方案。

pytorch8learner的博客 389

Qt 6.5实战:用QMediaPlayer搞定RTSP监控流播放(附LAV Filters解码器避坑指南)

本文详细介绍了如何在Qt 6.5中使用QMediaPlayer实现低延迟RTSP监控流播放,并提供了LAV Filters解码器的配置避坑指南。通过优化缓冲策略和硬件加速设置,显著提升视频流的播放性能和稳定性,适用于工业视觉检测和安防监控等实时场景。

weixin_33712987的博客 397

芯片散热技术突破:多尺度结构与VC集成方案解析

在半导体技术快速发展的背景下,芯片散热成为制约性能提升的关键瓶颈。传统散热技术如风冷和水冷已接近物理极限,而两相浸没式液冷技术凭借其超高传热系数成为新的解决方案。通过多尺度表面结构设计与真空腔均热板(Vapor Chamber)的集成创新,可以显著提升沸腾性能,降低沸腾起始温差(ONB)并突破临界热流密度(CHF)限制。这种技术在数据中心、高性能计算(HPC)和边缘计算等高热流密度场景中具有重要应用价值,能有效提升能效比(PUE)并降低能耗。

weixin_36288992的博客 151

什么是 AI Agent?它和直接调用大模型 API 有什么区别?

什么是 AI Agent?它和直接调用大模型 API 有什么区别?

我哎GIS博客 6476

Sigrity Power SI 3D-EM Full Wave Extraction模式如何进行S参数提取和观测3D电磁场和远场实例分析(一)-差分过孔结构

Sigrity Power SI 3D-EM Full Wave Extraction模式如何进行S参数提取和观测3D电磁场和远场操作指导(一)详细介绍了3D-EM Full Wave Extraction全波S参数提取,下面以一个差分过孔结构进行实例分析,以下图为例。模式如何进行S参数提取和观测3D电磁场和远场实例分析(一)-差分过孔结构。是一个简单的4层板,top换层到bottom层的差分过孔结构。起始频率为100Mhz,截止频率为20Ghz,线性扫描。上面那根曲线是插损,下面那根线是回损。

weixin_54787054的博客 342

VB摄像头监控

该VB模块可对摄像头捕获的画面进行录像等,可在创建的窗口进行控制

温度PID控制PLC程序

温度PID稳定控制程序,适用于欧姆龙PLC,对其他PLC也具有很大参考价值

霍尼韦尔SoftMaster使用说明

霍尼韦尔SoftMaster使用说明

IEM模型,地表粗糙度模拟

利用微波反演土壤水分时候,利用IEM模型可以实现对随机地表的模拟

上一篇: mysql插入时间字段数据缺少13小时,页面回显正常
下一篇: SQL查询所有队伍数据,以及队伍关联的成员和队长
github_39325328
博客等级 码龄9年 34粉丝 72原创
评论 3
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值