当前位置: 首页 > news >正文

跨域问题解决方案(三种)

Same Origin Policy同源策略(SOP)

具有相同的Origin,也即是拥有相同的协议、主机地址以及端口。一旦这三项数据中有一项不同,那么该资源就将被认为是从不同的Origin得来的,进而不被允许访问。

Cross-origin resource sharing跨域资源共享(CORS)

是一个W3C标准。允许浏览器向跨源(协议 + 域名 + 端口)服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制。
CORS需要浏览器和服务器同时支持。它的通信过程,都是浏览器自动完成,不需要用户参与。

对于开发者来说,CORS通信与同源的AJAX/Fetch通信没有差别,代码完全一样。
浏览器一旦发现请求跨源,就会自动添加一些附加的头信息,有时还会多出一次附加的请求,但用户不会有感觉。因此,实现CORS通信的关键是服务器。只要服务器实现了CORS接口,就可以跨源通信。

浏览器将CORS请求分成两类:简单请求(simple request)和非简单请求(not-so-simple request)。

  • 简单请求:只要在头信息增加一个Origin字段。是HEAD、GET、POST请求,并且HTTP的头信息不超出以下几种字段 Accept、Accept-Language、Content-Language、Last-Event-ID、Content-Type。反之,就是非简单请求。
  • 非简单请求:在正式通信之前,增加一次OPTIONS查询请求,称为"预检"请求(preflight)。浏览器先询问服务器,当前网页所在的域名是否在服务器的许可名单之中,以及可以使用哪些HTTP动词和头信息字段。只有得到肯定答复,浏览器才会发出正式的XMLHttpRequest请求,否则就报错。

Content-Type:只限于三个值application/x-www-form-urlencoded、multipart/form-data、text/plain

实现CORS很简单,就是在服务端加一些响应头,并且这样做对前端来说是无感知的
在这里插入图片描述

如果在开发中,发现每次发起请求都是两条,一次OPTIONS,一次正常请求,注意是每次,那么就需要配置Access-Control-Max-Age,避免每次都发出预检请求。

方法一

全局配置,(很多旧版的WebMvcConfigurerAdapter被标记为过时Deprecated)

@Configuration
public class CorsConfig implements WebMvcConfigurer{@Overridepublic void addCorsMappings(CorsRegistry registry){registry.addMapping("/**").allowedOrigins("*").allowedMethods("GET","HEAD","POST","PUT","DELETE","OPTIONS").allowCredentials(true).maxAge(3600).allowedHeaders("*");}
}

方法二

基于过滤器方式,在response中写入这些响应头。

@WebFilter(filterName = "CorsFilter")
@Configuration
public class CorsFilter implements Filter{@Overridepublic void doFilter(ServletRequest req,ServletResponse res,FilterChain chain) throws IOException, ServletException {HttpServletResponse response = (HttpServletResponse)res;response.setHeader("Access-Control-Allow-Origin","*");response.setHeader("Access-Control-Allow-Credentials", "true");response.setHeader("Access-Control-Allow-Methods", "POST, GET, PATCH, DELETE, PUT");response.setHeader("Access-Control-Max-Age", "3600");response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");chain.doFilter(req, res);}
}

方法三

@CrossOrigin注解的方式
注解可以放在method、class等上面,类似RequestMapping,也就是说,整个controller下面的方法可以都受控制,也可以单个方法受控制

public class GoodsController{@CrossOrigin(origins = "http://localhost:4000")@GetMapping("goods-url")public Response queryGoodsWithGoodsUrl(@RequestParam String goodsUrl)throws Exception{}
}

相关文章:

跨域问题解决方案(三种)

Same Origin Policy同源策略(SOP) 具有相同的Origin,也即是拥有相同的协议、主机地址以及端口。一旦这三项数据中有一项不同,那么该资源就将被认为是从不同的Origin得来的,进而不被允许访问。 Cross-origin resource…...

多轨音频编辑软件Multitrack Editor mac中文版主要功能

Multitrack Editor mac是一种音频编辑软件,它可以同时处理多个音轨。它通常用于录制、编辑和混合音乐、电影、电视和广播节目等多媒体项目。 Multitrack Editor的主要功能包括录音、编辑、混音和声音效果处理。使用该软件,用户可以同时录制和编辑多个音轨…...

工作中遇到的事务

文章目录 介绍原因分析:修改代码一波三折,再次出现问题 介绍 遇到了一个很有意思的问题。 在service层加了事务。 为了防止并发,在component层加了分布式锁。 先根据前端传入的id,在数据库中使用queryA()查到一个key然后对这个key进行加锁再…...

【论文写作】Latex 所有符号汇总参考

【论文写作】Latex 所有符号汇总参考 文章目录 【论文写作】Latex 所有符号汇总参考1. 希腊字母2. 数学构造3. 分割4. 累加累成等5. 标准函数名称6. 二进制符号(关系符号)7. 箭头8. 杂项符号(其他的符号)9. 数学模式重音、音节10.…...

pom.xml中解决“vulnerable dependency maven:org.yaml:snakeyaml:1.33“警告问题

问题 当我们引入依赖的时候,pom文件会有这样的提示,其大概的意思就是 maven:org.yaml:snakeyaml:1.30"表示通过Maven引入了一个潜在的安全漏洞依赖项"org.yaml:snakeyaml:1.30" 解决办法 其实我们就是要更改这个依赖的版本&#xff0c…...

栈和队列-Java

目录 一、栈 1.1 概念 1.2 栈的使用 1.3 栈的模拟实现 1.4 栈的应用场景 1.5 概念区分 二、队列 2.1 概念 2.2 队列的使用 2.3 队列的模拟实现 2.4 循环队列 三、双端队列 四、面试题 一、栈 1.1 概念 栈:一种特殊的线性表,只允许在固定的一端进行插…...

ORA-07445: exception encountered: core dump [kdxlin()+4088]---惜分飞

abort方式关闭数据库,启动报错 Tue Sep 19 21:52:56 2023 NOTE: dependency between database orcl and diskgroup resource ora.DATA.dg is established Tue Sep 19 21:52:57 2023 Reconfiguration started (old inc 4, new inc 6) List of instances: 1 (myinst:…...

【C刷题】day3

一、选择题 1、已知函数的原型是: int fun(char b[10], int *a); ,设定义: char c[10];int d; ,正确的调用语句是( ) A: fun(c,&d); B: fun(c,d); C: fun(&c,&d); D: fun(&c,d); 【答案…...

go 线程限制数量 --chatGPT

问:runTask(names, limit), 遍历启动以names的子名称的工作线程 name测试打印,上限数量是limit, 要求打印所有names gpt: 你可以使用 Go 协程来实现 runTask 函数,该函数会遍历启动以 names 子名称的工作线程,并在达到上限数量 …...

【Linux网络编程】日志与守护进程

日志是网络服务器程序在后台以守护进程的形式运行时,处理情况的描述被打印到了日志文件里面,方便维护人员查看。 1.前台进程与后台进程 左边会话输入命令 sleep 10000 & 代表进程后台运行,右边会话输入命令 sleep 20000可以看到命令行解…...

多输入多输出 | MATLAB实现CNN-BiGRU卷积双向门控循环单元多输入多输出

多输入多输出 | MATLAB实现CNN-BiGRU卷积双向门控循环单元多输入多输出 目录 多输入多输出 | MATLAB实现CNN-BiGRU卷积双向门控循环单元多输入多输出预测效果基本介绍程序设计往期精彩参考资料 预测效果 基本介绍 MATLAB实现CNN-BiGRU卷积双向门控循环单元多输入多输出&#xf…...

Qt: 鼠标形状设置

设置全局鼠标形状 设置完毕后,整个APP的任何窗体,包括Dialog中的鼠标形状都会被修改为设定类型,某一个控件设定的鼠标形状将被替换。一般不建议使用 QCursor cursor;//创建鼠标对象 cursor.setShape(Qt::CursorShape::ClosedHandCursor);//…...

【Oracle】Oracle系列之七--表的创建与管理

文章目录 往期回顾前言1. 表的创建2. 表的修改3. 表中数据的增删改查(1)插入数据(2)删除数据(3)更新数据 4. 表的Merge5. 表的删除6. 表的重命名7. 表的索引(1)B树索引(2…...

C/C++运算符超详细讲解(系统性学习day5)

目录 前言 一、运算符的概念与分类 二、算术运算符 三、关系运算符 四、逻辑运算符 五、赋值运算符 六、运算符的优先级 总结 前言 本篇文章是对运算符的具体讲解。 一、运算符的概念与分类 概念: 运算符就是一种告诉编译器执行特定的数学或逻辑操作的符…...

Android 遍历界面所有的View

关于作者:CSDN内容合伙人、技术专家, 从零开始做日活千万级APP。 专注于分享各领域原创系列文章 ,擅长java后端、移动开发、商业变现、人工智能等,希望大家多多支持。 目录 一、导读二、概览三、实践四、 推荐阅读 一、导读 我们…...

建筑能源管理(1)——建筑能源管理的概念

1、什么是建筑能源管理 目前,主要有三种不同的类型能源管理: (1)节约型能源管理 又称“减少能耗型”能源管理。这种管理方式着眼于能耗数量上的减少,采取限制用能的措施。例如,在非人流高峰时段停开部分电梯、在室外气温特别高时…...

SpringSecurity

明文存储密码,前加{noop}...

C++ vector模拟实现

目录 一.默认成员函数 二.扩容相关函数 三.[]重载 四.修改函数 五.迭代器 继上次写完string之后,可以写一个vector练练手以及熟悉其底层。vector是一个顺序表,相比普通数组不同点在于顺序表的数据必须是连续存放的。 一.默认成员函数 string是只存放字符…...

BUUCTF:[GYCTF2020]FlaskApp

Flask的网站,这里的功能是Base64编码解码,并输出 并且是存在SSTI的 /hint 提示PIN码 既然提示PIN,那应该是开启了Debug模式的,解密栏那里随便输入点什么报错看看,直接报错了,并且该Flask开启了Debug模式&am…...

好玩的调度技术

好玩的调度技术 文章目录 好玩的调度技术前言一、乱金柝-空间剥离二、拖拽编辑三、全端兼容 前言 最近感觉自己抑郁了,生态技术实在太庞大太复杂,所以我决定先停一段时间,在停下写生态的这两天写了几个调度的小玩意换换脑子,很有…...

FMCP协议:构建创作者统一文件管理中枢,打破应用孤岛

1. 项目概述:一个为创作者而生的文件管理中枢如果你是一位内容创作者,无论是视频剪辑师、摄影师、平面设计师,还是播客制作人,你的工作流里一定少不了与海量文件打交道。原始素材、工程文件、渲染输出、版本迭代……这些文件散落在…...

终极指南:如何用Chromatic快速掌握Chromium/V8通用修改器

终极指南:如何用Chromatic快速掌握Chromium/V8通用修改器 【免费下载链接】chromatic Universal modifier for Chromium/V8 | 广谱注入 Chromium/V8 的通用修改器 项目地址: https://gitcode.com/gh_mirrors/be/chromatic 想象一下,你正在开发一个…...

Cursor-Learner:基于编辑器历史数据,自动生成个性化AI编程助手Prompt

1. 项目概述:一个帮你“诊断”编程习惯的智能助手 如果你和我一样,每天都在和 Cursor 或 WindSurf 这类 AI 驱动的代码编辑器打交道,那你肯定也遇到过这样的困惑:为什么有时候 AI 助手能精准地理解你的意图,写出漂亮的…...

Google Calendar智能安排深度拆解(Gemini原生集成技术白皮书级解析)

更多请点击: https://intelliparadigm.com 第一章:Gemini Google Calendar智能安排技术全景概览 Gemini 与 Google Calendar 的深度集成标志着日程管理进入语义理解驱动的新阶段。该能力并非简单调用 API,而是依托 Gemini 模型对自然语言指…...

AI建站多语言怎么做?先懂业务,再谈翻译

AI建站多语言怎么做?先懂业务,再谈翻译当同行还在卷“建站速度”时,聪明的出海商家已经开始卷“AI可见度”了。据近期行业数据显示,超过60%的海外采购商开始习惯使用ChatGPT、Perplexity等AI工具寻找供应商,而非传统的…...

Davinci vs. 其他BI工具怎么选?从私有化部署和二次开发角度深度对比

Davinci vs. 主流BI工具技术选型指南:私有化部署与二次开发实战解析 当企业数据量突破TB级时,我们技术团队曾面临一个关键抉择:是继续支付每年六位数的商业BI服务费,还是转向可深度定制的开源方案?这个决策不仅关乎成本…...

大模型动态计算:按需推理更高效

一种让大语言模型更智能地思考难题的方法 这项新技术使大语言模型能够根据问题的难度,动态调整用于推理的计算量。 为了使大语言模型在回答较难问题时更加准确,研究人员可以让模型花费更多时间来思考潜在解决方案。但是,赋予大语言模型这种能…...

从配置字到实际运动:手把手教你用EtherCAT调试伺服电机的控制模式(以倍福TwinCAT3为例)

从配置字到实际运动:手把手教你用EtherCAT调试伺服电机的控制模式(以倍福TwinCAT3为例) 在工业自动化现场,伺服电机的精准控制往往决定着整条产线的运行效率。当面对一台全新的伺服驱动器时,如何快速完成从参数配置到实…...

2026最权威的十大AI辅助论文工具实测分析

Ai论文网站排名(开题报告、文献综述、降aigc率、降重综合对比) TOP1. 千笔AI TOP2. aipasspaper TOP3. 清北论文 TOP4. 豆包 TOP5. kimi TOP6. deepseek 要降低AIGC也就是人工智能生成内容的检测率,关键之处在于减少机器生成的痕迹,还要增加文本的…...

喜马拉雅音频下载终极指南:如何永久保存付费专辑到本地

喜马拉雅音频下载终极指南:如何永久保存付费专辑到本地 【免费下载链接】xmly-downloader-qt5 喜马拉雅FM专辑下载器. 支持VIP与付费专辑. 使用GoQt5编写(Not Qt Binding). 项目地址: https://gitcode.com/gh_mirrors/xm/xmly-downloader-qt5 还在为喜马拉雅…...