前端和后端之间的CORS 跨域和解决办法

什么是CORS(Cross-Origin Resource Sharing,跨源资源共享)

        跨源资源共享(CORS,或通俗地译为跨域资源共享)是一种基于 HTTP 头的机制,该机制通过允许服务器标示除了它自己以外的其他源(域、协议或端口),使得浏览器允许这些源访问加载自己的资源。跨源资源共享还通过一种机制来检查服务器是否会允许要发送的真实请求,该机制通过浏览器发起一个到服务器托管的跨源资源的“预检”请求。在预检中,浏览器发送的头中标示有 HTTP 方法和真实请求中会用到的头。

什么是跨域?


        跨域是指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的,是浏览器对javascript施加的安全限制。

        例如:a页面想获取b页面资源,如果a、b页面的协议、域名、端口、子域名不同,所进行的访问行动都是跨域的,而浏览器为了安全问题一般都限制了跨域访问,也就是不允许跨域请求资源。注意:跨域限制访问,其实是浏览器的限制。理解这一点很重要!!!

        同源策略:是指协议,域名,端口都要相同,其中有一个不同都会产生跨域; 可以参考 Web安全 - 浏览器的同源策略

当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域

 

当前页面url当前页面url是否跨域原因
http://www.test.com/http://www.test.com/index.html同源(协议、域名、端口号相同)
http://www.test.com/https://www.test.com/跨域协议不同(http/https)
http://www.test.com/http://www.baidu.com/跨域主域名不同(test/baidu)
http://www.test.com/http://blog.test.com/跨域子域名不同(www/blog)
http://www.test.com:8080/http://www.test.com:7001/跨域端口号不同(8080/7001)

为什么会有跨域的问题?

在同源策略下,会有以下限制:

  • 无法获取非同源的 Cookie、LocalStorage、SessionStorage 等
  • 无法获取非同源的 dom
  • 无法向非同源的服务器发送 ajax 请求

        但是我们又经常会遇到前后端分离,不在同一个域名下,需要ajax请求数据的情况。那我们就要规避这种限制。 可以在网上搜到很多解决跨域的方法,有些方法比较古老了,现在项目中用的比较多的是 jsonp 和 CORS(跨域资源共享)

cors跨域解决办法

cors跨域解决办法有很多我们将全局配置适配器和全局过滤器这两种

  • 全局配置适配器
@Configuration
public class WebMvcConfig extends WebMvcConfigurerAdapter {@Overridepublic void addCorsMappings(CorsRegistry registry) {registry.addMapping("/**").allowedOrigins("*").allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")//针对header单独设置,不然无法获取header中的请求信息,前端也无法拿到响应中的                   // header信息,OPTIONS请求也会经过拦截器,在进行登录拦截时候要注意特殊处理.allowedHeaders("*").exposedHeaders("access-control-allow-headers","access-control-allow-methods","access-control-allow-origin","access-control-max-age","X-Frame-Options")// 表明在3600秒内,不需要再发送预检验请求,可以缓存该结果.maxAge(3600).allowCredentials(true);}
}

全局过滤器

通过实现Fiter接口在请求中添加一些Header来解决跨域的问题

@Component
public class CorsFilter implements Filter {@Overridepublic void doFilter(ServletRequest request, ServletResponse response, FilterChain chain)throws IOException, ServletException {HttpServletResponse res = (HttpServletResponse) response;res.addHeader("Access-Control-Allow-Credentials", "true");res.addHeader("Access-Control-Allow-Origin", "*");res.addHeader("Access-Control-Allow-Methods", "GET, POST, DELETE, PUT");res.addHeader("Access-Control-Allow-Headers", "Content-Type,X-CAF-Authorization-Token,sessionToken,X-TOKEN");if (((HttpServletRequest) request).getMethod().equals("OPTIONS")) {response.getWriter().println("ok");return;}chain.doFilter(request, response);}@Overridepublic void destroy() {}@Overridepublic void init(FilterConfig filterConfig) throws ServletException {}
}

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

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

相关文章

Docker之安装Nginx

🎉🎉欢迎来到我的CSDN主页!🎉🎉 🏅我是君易--鑨,一个在CSDN分享笔记的博主。📚📚 🌟推荐给大家我的博客专栏《Docker之Dockerfile构建镜像》。🎯&…

为什么 macOS 比 Windows 稳定?

在计算机操作系统领域,macOS 和 Windows 分别是苹果公司和微软公司的主打产品。尽管两者都拥有大量的用户群体,但在稳定性和用户体验方面,macOS 常常被认为优于 Windows。那么,为什么 macOS 比 Windows 更稳定呢? 我们…

算法题-爬楼梯-不同思路解法

主要记录个人思考过程,不同方案实现思路的演变 题目 假设你正在爬楼梯。需要 n 阶你才能到达楼顶。 每次你可以爬 1 或 2 个台阶。你有多少种不同的方法可以爬到楼顶呢? 示例 1: 输入:n 2 输出:2 解释:…

C++系列-第1章顺序结构-9-字符类型char

在线练习: http://noi.openjudge.cn/ https://www.luogu.com.cn/ 总结 本文是C系列博客,主要讲述字符类型char 字符类型char 在C编程语言中,char是一种基本的数据类型,它用于存储单个字符。字符可以是字母、数字、标点符号或者…

简单的推箱子游戏实战

目录 项目分析 地图初始化 背景图片 游戏场景图片: 热键控制 按键设置 确定人物位置 实现人物移动(非箱子,目的地) 推箱子控制 游戏结束 最终代码 合法性判断: 项目分析 墙:0,地板:1,箱子目的地:2,小人:3,箱子:4,箱子命中目标:5 地图初始化 背景图片 #include <…

基于SkyEye仿真飞腾处理器:运行U-Boot并加载Phytium-FreeRTOS

仿真平台在帮助提升研发效率、加快产品面市时间上的作用已得到诸多验证&#xff0c;通过对处理器进行仿真来支持嵌入式系统及软件的虚拟化开发、测试和验证成为目前应用较为广泛的方法。天目全数字实时仿真软件SkyEye是一款基于可视化建模的硬件行为级仿真平台&#xff0c;在众…

leetcode:1736. 替换隐藏数字得到的最晚时间(python3解法)

难度&#xff1a;简单 给你一个字符串 time &#xff0c;格式为 hh:mm&#xff08;小时&#xff1a;分钟&#xff09;&#xff0c;其中某几位数字被隐藏&#xff08;用 ? 表示&#xff09;。 有效的时间为 00:00 到 23:59 之间的所有时间&#xff0c;包括 00:00 和 23:59 。 …

selenium处理下拉框

当想要爬取的数据由下拉框来选择时&#xff0c;应该如何处理&#xff1f; 页面如下&#xff1a; 目的获得电影的详细信息&#xff0c;包括票房&#xff0c;上映日期等。 代码如下&#xff1a; from selenium import webdriver from selenium.webdriver.support.select impor…

C语言——大头记单词

归纳编程学习的感悟&#xff0c; 记录奋斗路上的点滴&#xff0c; 希望能帮到一样刻苦的你&#xff01; 如有不足欢迎指正&#xff01; 共同学习交流&#xff01; &#x1f30e;欢迎各位→点赞 &#x1f44d; 收藏⭐ 留言​&#x1f4dd; 每一发奋努力的背后&#xff0c;必有加…

Ubuntu18.04在线镜像仓库配置

在线镜像仓库 1、查操作系统版本 rootubuntu:~# lsb_release -a No LSB modules are available. Distributor ID: Ubuntu Description: Ubuntu 18.04.5 LTS Release: 18.04 Codename: bionic 2、原文件备份 sudo cp /etc/apt/sources.list /etc/apt/sources.list.bak 3、查…

【开源】基于JAVA语言的陕西非物质文化遗产网站

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 设计目标2.2 研究内容2.3 研究方法与过程2.3.1 系统设计2.3.2 查阅文献2.3.3 网站分析2.3.4 网站设计2.3.5 网站实现2.3.6 系统测试与效果分析 三、系统展示四、核心代码4.1 查询民间文学4.2 查询传统音乐4.3 增改传统舞…

零售EDI:Babylist EDI 项目案例

Babylist 与各种不同的品牌和零售商合作&#xff0c;包括婴儿用品、玩具、衣物和其他相关产品的制造商。用户可以在 Babylist 上浏览各种不同的产品&#xff0c;并根据自己的需求和喜好选择适合的项目。本文将为大家介绍对接Babylist 的EDI项目案例。 Babylist EDI 需求 传输协…

linux文件比较工具diff-关于参数-pN的设置方法

非纯文本文件比较可用cmp命令 第一&#xff1a;利用diff创建分析文件&#xff0c;处理补丁&#xff08;patch&#xff09;功能的文件 案例&#xff1a;多数用于同一软件的不同版本之间&#xff0c;比如比较配置文件和源文件的区别&#xff0c;生成补丁文件&#xff0c;执行更…

Midjourney网页版

引言 基于国外的api开发开发了一款网页版的midjourney&#xff0c;文末有链接 相关资源 Midjourney官方教学资料Midjourney官网discord官网B站学习资源推荐 账号注册 获取网络访问权限 使用Midjourney的前提是计算机有外网访问权限 此处推荐两款软件,lantern的优势是免费&…

windows vscode jsoncpp cmake c++ 构建项目

jsoncpp的编译和使用推荐文章&#xff1a;jsoncpp的编译和使用 | 爱编程的大丙 (subingwen.cn)https://www.subingwen.cn/cpp/jsoncpp/从这个链接下载jsoncpp-master&#xff1a;https://github.com/open-source-parsers/jsoncpp 可以把这个文件夹名字改成jsoncpp&#xff0c;…

LLM之LangChain(二)| LangChain中的Agent

在本文中&#xff0c;我们将讨论LangChain中的Agent及其各种类型。但在深入研究Agent之前&#xff0c;让我们先了解一下什么是LangChain和Agent。 一、什么是LangChain&#xff1f; LangChain是一种功能强大的自动化工具&#xff0c;可用于各种任务&#xff0c;它提供了可用于…

Cobalt: 我愿称之为IDEA最美配色☕️

先来个预览&#xff1a; Cobalt是为IntelliJ IDEA和Java语言优化的一个配色主题&#xff0c;以现代和科技感的蓝色为主。题主相信哪怕是一个简单的主题配色&#xff0c;都是可以给开发者们带来更有生产力、更舒适的创作心境。希望你会喜欢&#xff01; 另外Cobalt这个名字取自…

【开源】基于JAVA的教学资源共享平台

目录 一、摘要1.1 项目介绍1.2 项目录屏 二、功能模块2.1 数据中心模块2.2 课程档案模块2.3 课程资源模块2.4 课程作业模块2.5 课程评价模块 三、系统设计3.1 用例设计3.2 类图设计3.3 数据库设计3.3.1 课程档案表3.3.2 课程资源表3.3.3 课程作业表3.3.4 课程评价表 四、系统展…

04章【面向对象(上)】

文章目录 面向对象基本概念类与对象类和对象的定义格式对象与内存分析封装性构造方法this关键字值传递与引用传递对象的一对一关系static关键字main方法分析代码块单例设计模式对象数组与管理 面向对象基本概念 什么是面向对象&#xff1a; 面向对象是一种编程思想。面向对象…

经典ABR算法介绍:Pensieve (SIGCOMM ‘17) 原理及训练指南

文章目录 前言Pensieve原理*Pensieve重训练参考Oboe [SIGCOMM 18]Comyco [MM 19]Fugu [NSDI 20] A3C熵权重衰减思路实现 前言 Pensieve是DASH点播视频中最经典的ABR算法之一&#xff0c;也是机器学习类&#xff08;Learning-based&#xff09;ABR算法的代表性工作。Pensieve基…