vue3delete请求报403forbidden,前后端解决方式,cookie无效问题

在做开发时,前期已经在Controller类加上@CrossOrigin(origins = "*"),发送get和post请求都没问题,但遇到delete请求时,又报出跨域问题

一.前端添加proxy代理服务器(未能解决)

在vue.config.js中使用devServer配置代理,在文件中添加

devServer:{proxy:{"/api":{target:"http://localhost:9998",changeOrigin: true,pathRewrite:{"^/api": ""},}}}

然后在你的axios配置文件中将baseURL改成

const API = axios.create({baseURL:'/api', timeout: 2000                  
})

这是因为proxy中设置了target,则此时请求地址变为http://localhost:9998/api
但同时在proxy中添加了pathRewrite属性,它是一个正则表达式,匹配/api并替换为“”(空字符串),所以实际请求地址依然为http://localhost:9998/接口名称
使用proxy代理服务器的目的是:
解决跨域问题,我们的前端项目和代理服务器有相同的端口,访问代理服务器不存在跨域问题,然后由代理服务器去访问target目标地址。

二.后端重写addCorsMappings跨域方法(成功)

我这里是在src文件夹下,新建了config文件夹,创建了MyConfiguration类实现了WebMvcConfigurer,具体如下:

import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.CorsRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;@SuppressWarnings("deprecation")
@Configuration
public class MyConfiguration implements WebMvcConfigurer {@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/**").allowedMethods("GET","POST","DELETE","PUT","OPTIONS") //允许的请求类型//允许携带头信息(该处为所有头信息,可根据自己的需求修改).allowedHeaders("*").allowedOrigins("*").maxAge(3600);}
}

在后端重写addCorsMappings方法成功解决了delete的跨域问题

三. 解决响应头中携带set-cookie,但是cookie无法存在浏览器application中

使用cookie是希望浏览器保存,在后续请求中,携带cookie发送至后台
我尝试直接将cookie加在response中,但是浏览器application还是无法查看到

  1. 前端要设置withCredentails
    在axios配置文件中添加withCredentials: true,此属性可实现在后续的请求中均携带cookie,发送至后台
    2.后端要设置allowCredentials和allowOrigin
    在这里插入图片描述
    注意:一旦前端设置了withCredentials属性,后端也必须对应设置allowCredentials为true;此外allowOrigins必须设置为源地址,如果是设置为*是无效的。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/355034.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

DAY04 HTMLCSS

文章目录 一 表单(1) 数字控件(2) 颜色控件(3) 日期控件(4) 月份控件(5) 星期控件(6) 搜索控件(7) 范围控件 二 浮动框架三 结构化标签四 CSS1 CSS概述2 CSS的编写位置1. inline style 行内样式2. inner style 内部样式3. outer style 外部样式4. 小结 3 CSS选择器1. 通用选择器…

【StableDiffusion】Prompts 提示词语法;高阶用法;写作顺序是什么,先写什么后写什么

Prompt 写作顺序 第一步:画质词画风词 第一步先写“画质词”和“画风词” 画质词如下: 画风词如下: 第二步:画面主体描述 人物性别、年龄、发型、发色、情绪表情、衣服款式、衣服颜色、动作、饰品、身材、五官微调 第三步&…

Python基础教程(二十四):日期和时间

💝💝💝首先,欢迎各位来到我的博客,很高兴能够在这里和您见面!希望您在这里不仅可以有所收获,同时也能感受到一份轻松欢乐的氛围,祝你生活愉快! 💝&#x1f49…

Redis分片集群搭建

主从模式可以解决高可用、高并发读的问题。但依然有两个问题没有解决: 海量数据存储高并发写 要解决这两个问题就需要用到分片集群了。分片的意思,就是把数据拆分存储到不同节点,这样整个集群的存储数据量就更大了。 Redis分片集群的结构如…

嵌入式系统软件开发环境_2.一般架构

1.Eclipse框架 嵌入式系统软件开发环境是可帮助用户开发嵌入式软件的一组工具的集合,其架构的主要特征离不开“集成”问题,采用什么样的架构框架是决定开发环境优劣主要因素。Eclipse框架是当前嵌入式系统软件开发环境被普遍公认的一种基础环境框架。目…

基 CanMV 的 C 开发环境搭建(Linux,Ubuntu篇)

不论是使用 CanMV 提供的基于 C 语言和 FreeRTOS 的应用开发方式开发应用程序或是编译 CanMV 固件,都需要搭建基于 CanMV 的 C 开发环境,用于编译 CanMV 源码。 1. 开发环境搭建说明 CanMV 提供了基于 C 语言和 FreeRTOS 的应用开发…

Hive笔记-3

3.2.2 查看表 1) 展示所有表 (1) 语法: 语法: SHOW TABLES [IN database_name] LIKE [identifier_with_wildcards]; In database_name 写的是查哪个数据库,一般不写默认是当前数据库 Like 后面跟通配符表达式 (2) 案例: 查看在 db_hive1 数据库里有没有以 stu 开头的表 …

Zookeeper 一、Zookeeper简介

1.分布式系统定义及面临的问题 分布式系统是同时跨越多给物理主机,独立运行的多个软件所组成的系统。类比一下,分布式系统就是一群人一起干活。人多力量大,每个服务器的算力是有限的,但是通过分布式系统,由n个服务器组…

【Python日志模块全面指南】:记录每一行代码的呼吸,掌握应用程序的脉搏

文章目录 🚀一、了解日志🌈二、日志作用🌈三、了解日志模块⭐四、日志级别💥五、记录日志-基础❤️六、记录日志-处理器handler🎬七、记录日志-格式化记录☔八、记录日志-配置logger👊九、流程梳理 &#x…

RTSP/Onvif安防监控平台EasyNVR抓包命令tcpdump使用不了,该如何解决?

安防视频监控汇聚EasyNVR智能安防视频监控平台,是基于RTSP/Onvif协议的安防视频平台,可支持将接入的视频流进行全平台、全终端分发,分发的视频流包括RTSP、RTMP、HTTP-FLV、WS-FLV、HLS、WebRTC等格式。平台可提供的视频能力包括:…

SpringSecurity实战入门——认证

项目代码 gson/spring-security-demo 简介 Spring Security 是 Spring 家族中的一个安全管理框架。相比与另外一个安全框架Shiro,它提供了更丰富的功能,社区资源也比Shiro丰富。 一般来说中大型的项目都是使用SpringSecurity来做安全框架。小项目有Shiro的比较多,因为相比…

HTML静态网页成品作业(HTML+CSS+JS)—— 美食企业曹氏鸭脖介绍网页(4个页面)

🎉不定期分享源码,关注不丢失哦 文章目录 一、作品介绍二、作品演示三、代码目录四、网站代码HTML部分代码 五、源码获取 一、作品介绍 🏷️本套采用HTMLCSS,使用Javacsript代码实现 图片轮播切换,共有4个页面。 二、…

宕机了, redis如何保证数据不丢?

前言 如果有人问你:"你会把 Redis 用在什么业务场景下?" 我想你大概率会说:"我会把它当作缓存使用,因为它把后端数据库中的数据存储在内存中,然后直接从内存中读取数据,响应速度会非常快。…

分支结构相关

1.if 语句 结构: if 条件语句: 代码块 小练习: 使用random.randint()函数随机生成一个1~100之间的整数,判断是否是偶数 import random n random.randint(1,100) print(n) if n % 2 0:print(str(n) "是偶数") 2.else语…

【网络安全产品】---网闸

了解了不少安全产品,但是对网闸的理解一直比较模糊,今天 what 网闸是安全隔离与信息交换系统的简称,使得在不影响数据正常通信的前提下,让络在不连通的情况下数据的安全交换和资源共享,对不同安全域/网络之间实现真正…

【总线】AXI总线:FPGA设计中的通信骨干

目录 AXI4:高性能地址映射通信的基石 AXI4-Lite:轻量级但功能强大的通信接口 AXI4-Stream:高速流数据传输的利器 结语:AXI总线在FPGA设计中的重要性 大家好,欢迎来到今天的总线学习时间!如果你对电子设计、特别是FPGA和SoC设计…

简单分享github

一、官网 GitHub: Let’s build from here GitHub 二、注册 通过简单的注册步骤,你就可以拥有一个属于自己的GitHub账号。再简单注册完成之后会需要验证你所输入的邮箱才能正常使用你的GitHub。 三、设置自己的库 在注册完成之后,完成一些简单的设置之…

Python第二语言(十三、PySpark实战)

目录 1.开篇 2. PySpark介绍 3. PySpark基础准备 3.1 PySpark安装 3.2 掌握PySpark执行环境入口对象的构建 3.3 理解PySpark的编程模型 4. PySpark:RDD对象数据输入 4.1 RDD对象概念:PySpark支持多种数据的输入,完成后会返回RDD类的对…

5款堪称变态的AI神器,焊死在电脑上永不删除!

一 、AI视频合成工具——Runway: 第一款RunWay,你只需要轻轻一抹,视频中的元素就会被擦除,再来轻轻一抹,直接擦除,不喜欢这个人直接擦除,一点痕迹都看不出来。 除了视频擦除功能外,…

从复用性角度阐述中台建设

目录 复用性中台定义深思中台建设产品线形态何时演变中台能力落地中台 业务中台架构总结 技术学习永不止步,最近也是看了很多关于架构设计相关的专栏,慢慢总结出来一部分知识,代入自己的思考与理解,以及结合并反思自己之前公司的架…