跨域的问题

最新推荐文章于 2024-10-06 20:16:20 发布
最新推荐文章于 2024-10-06 20:16:20 发布
阅读量97 收藏
点赞数
文章标签： java
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_51285237/article/details/119787144
版权
本文深入解读了跨域问题的本质，介绍了同源策略，并对比了JSONP和CORS两种解决策略。重点讲解了CORS的工作原理，包括服务器端如何设置Access-Control-Allow-Origin支持跨域，以及前端如何处理带cookie的请求。
摘要由CSDN通过智能技术生成

1.什么是跨域

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

        浏览器解析页面时,当页面中有ajax请求时,则要求页面的URL地址,与Ajax请求的地址必须满足同源策略的规范.

同源策略:

  • 请求协议 http:// https://
  • 请求域名
  • 请求的端口**
    上述的三项必须相同. 满足同源策略.浏览器可以解析数据,否则不能正常解析.

2.跨域解决策略

        旧的方式: JSONP(了解)
        新的方式: CORS 方式

3.CORS介绍

        **跨源资源共享 (CORS) （或通俗地译为跨域资源共享）**是一种基于HTTP 头的机制，该机制通过允许服务器标示除了它自己以外的其它origin（域，协议和端口），这样浏览器可以访问加载这些资源。跨源资源共享还通过一种机制来检查服务器是否会允许要发送的真实请求，该机制通过浏览器发起一个到服务器托管的跨源资源的"预检"请求。在预检中，浏览器发送的头中标示有HTTP方法和真实请求中会用到的头。
核心: 服务器在响应头中标识可以访问用户的地址. CORS服务端跨域
        （1）普通跨域请求：只需服务器端设置Access-Control-Allow-Origin

        （2）带cookie跨域请求：前后端都要进行设置

【前端设置】根据xhr.withCradentials判断是否有cookie

xhr.withCradentials=true；

【服务器端设置】服务器端对于CORS的支持，主要是通过设置Access-Control-Allow-Origin来进行的。如果浏览器检测到相应的设置，将可以允许ajax进行跨域的访问

qq_51285237
关注
GeoServer跨域问题.zip
10-21
在Web应用开发中，跨域问题是一个常见的挑战，特别是在利用Ajax进行异步数据交互时。由于浏览器的安全策略，不同源（域名、协议或端口）之间的请求会被阻止，除非服务器允许这些跨域请求。在GeoServer的环境中，当...
geoserver跨域问题jar包
06-25
标题中的“geoserver跨域问题jar包”指的是在使用GeoServer时遇到的跨域（Cross-Origin）限制问题。GeoServer是一款开源的地理信息系统（GIS）服务器，它允许用户发布地图服务并与其他Web应用程序交互。当不同的源...
Springboot解决跨域问题方案总结(包括Nginx，Gateway网关等)
热门推荐
qq_35716689的博客
03-23 25万+
跨域问题是浏览器为了保护用户的信息安全，实施了同源策略（Same-Origin Policy），即只允许页面请求同源（相同协议、域名和端口）的资源，当 JavaScript 发起的请求跨越了同源策略，即请求的目标与当前页面的域名、端口、协议不一致时，浏览器会阻止请求的发送或接收。
Axios解决跨域问题（Vue2版）
weixin_43565079的博客
09-13 6万+
什么是跨域 首先需要了解到浏览器的同源策略，同源策略是最核心也是最基本的安全功能，缺少同源策略浏览器的正常功能可能会受到影响。同源策略会阻止一个域的javascript脚本和另外一个域的能容进行交互。同源（即指在同一个域）就是两个页面具有相同的协议（protocol）、主机（host）和端口号（port）。 当一个请求url的协议、域名、端口三个之间任意一个与当前页面url不同即为跨域。 Vue中用Axios解决跨域问题 配置代理可解决使用Axios不能直接进行跨域...
什么是跨域？怎么解决跨域问题
lymt95的博客
11-27 2万+
同源策略 同源策略案例 什么是跨域 跨域解决方法 1.ajax的jsonp 2.CORS方式 3.nginx 转发
跨域问题详解
qq_38571892的博客
03-11 1万+
什么是跨域 跨域的概念很简单，即当一个请求URL的协议、域名、端口三者之间任意一个与当前页面URL不同则视为跨域，而跨域问题产生的原因主要是由浏览器的“同源策略”限制导致的，是浏览器对JavaScript 施加的安全限制。 什么是同源策略 所谓同源是指协议、域名以及端口要相同。我们举例说明：假如有这么一个网站：http://www.example.com/zw/index.html，很容易知道，它的协议是http://，域名是www.example.com，端口号是80(默认端口可以省略)，它的同源情况如下
前后端分离的跨域问题
小夏陌的博客
02-20 4万+
跨域问题原因 在现在流行的前后端分离开发中，跨域问题突显了出来，跨域问题的根本原因：浏览器有同源策略限制，当前域名的js只能读取同域下的窗口属性，这是一个基础安全功能。那么什么是同源策略呢？即两资源的URL中 协议，域名，端口，都相同则称为同源，若两资源为不同源，则不允许共享资源的。 例如：以http://www.baidu.com/dir1/a.html为例子 请求地址 结果 原因 http://www.baidu.com/dir1/b.html 成功 同一域名端口，相同文件夹 htt
Nginx 轻松解决跨域问题
leonnew的博客
04-01 1万+
当你遇到跨域问题，不要立刻就选择复制去尝试。请详细看完这篇文章再处理 。我相信它能帮到你。 # 分析前准备： 前端网站地址：http://localhost:8080 服务端网址：http://localhost:59200 首先保证服务端是没有处理跨域的，其次，先用postman测试服务端接口是正常的 当网站8080去访问服务端接口时，就产生了跨域问题，那么如何解决？接下来我把跨域遇到的各种情况都列举出来并通过nginx代理的方式解决（后台也是一样的，只要你理解的原理）。 跨.
nginx解决跨域问题
rolinabc的博客
12-29 1万+
在我们前端开发的过程中, 相信大家都遇到过一个让人头疼的问题,那就是跨域问题. 跨域解决的方式有很多,这里主要讲的是如何来使用 nginx来解决我们所遇到的跨域问题 首先,在我们开始之前,首先要知道跨域是如何产生的: 协议 ip 端口号 这三者有任何一个不同,就会产生跨域问题 了解了跨域的产生,接着我们就来看看,如何解决它 一.下载nginx 下载地址: http://ngin...
什么是跨域？——详解跨域问题及其解决方案
fudaihb的博客
07-06 6961
跨域问题是Web开发中常见且令人困扰的问题之一。理解跨域的原理及其解决方案对于前后端分离开发尤为重要。本文将详细介绍跨域的概念、产生原因、常见的跨域解决方案，并提供详细的代码示例，帮助读者深入理解跨域问题及其应对方法。
Ajax跨域问题
helpluozhao123的博客
11-03 3468
ajax 是不能跨域。那么怎么解决前端发送请求的跨域问题呢。超详细，1、设置响应头、2、通过jsonp 3、通过调用jQuery封装的jsonp 4、httpclient 5、nginx
Java跨域问题
weixin_43709291的博客
10-07 3536
跨域是指a页面想获取b页面资源，如果a,b页面的协议、域名、端口、子域名不同，或是a页面为ip地址，b页面为域名地址，所进行的访问行动都是跨域的，而浏览器为了安全问题一般都限制了跨域访问，也就是说不允许跨域请求资源。跨域问题的根本原因：因为浏览器收到同源策略的限制，当前域名的js只能读取同域名下的窗口属性。就是不同的域名，不同端口，不同协议不允许共享资源的，保障浏览器安全。preHandle：预处理，在业务处理器处理请求之前被调用，可以进行登录拦截，编码处理、安全控制、权限校验等处理；
详解Vue 开发模式下跨域问题
08-30
解决 Vue 开发模式下跨域问题 在 Vue 开发模式下，跨域问题是我们经常遇到的问题。跨域问题是指在不同的域名之间进行资源请求时，出现的安全限制问题。解决跨域问题是非常重要的，因为它会影响我们项目的正常运行。...
C#浏览器提示跨域问题解决方案
08-18
C#浏览器提示跨域问题解决方案 跨域问题是指在Web浏览器中，因为安全性限制，不能从一个域名下的页面访问另一个域名下的资源，这是浏览器的同源策略（Same-origin policy）所致。跨域问题在实际开发中经常遇到，...
Java服务器端跨域问题解决方案
08-25
Java服务器端跨域问题解决方案 Java 服务器端跨域问题解决方案是指在 Java 服务器端如何解决跨域问题的解决方案。跨域问题是指在 Ajax 请求中，因为安全限制，浏览器不能将数据发送到不同源（domain、protocol 或 ...
JDK1.0主要特性
最新发布
FoolRabbit的专栏
10-06 219
JDK1.0主要特性。
JavaScript ArrayBuffer的读写与类型转换
白瑕 的博客
10-01 461
所有视图的基本单位是ArrayBuffer, ArrayBuffer中只存储二进制格式的数据.ArrayBuffer不可直接读写, 必须通过视图(比如DataView)暴露的API.
spring-boot 整合 mybatis
m0_72168501的博客
09-29 562
spring boot 整合 mybatis
Java内存布局
阿呆的专栏
10-01 809
64位 JVM 不启用指针压缩时：Object Header 大小是16字节。64位 JVM 启用指针压缩时（默认）：Object Header 大小是12字节。32位 JVM：Object Header 大小是8字节。JVM在默认情况下启用指针压缩，但如果堆内存超过32GB，就会禁用指针压缩。32GB是压缩指针的最大寻址范围。超过32GB的堆内存中，压缩指针带来的性能提升并不显著，而且需要解压指针反而可能增加开销。
phpstudy 跨域问题
09-22
PHPStudy 中遇到跨域问题通常是由于浏览器的安全策略限制，不允许来自本地服务器（如 PHPStudy）的请求访问其他域名下的资源。当你尝试通过 PHPStudy 发起 AJAX 请求或者其他前端脚本去访问不在同一域内的 API 或静态文件时，浏览器会阻止这种请求以防止潜在的安全威胁。 解决 PHPStudy 跨域问题可以采取以下几种方法： 1. **允许 CORS**（Cross-Origin Resource Sharing）：在目标服务器上设置响应头，添加 `Access-Control-Allow-Origin` 字段，指定允许哪些源发起请求。例如，可以在 Apache 或 Nginx 配置文件中设置 CORS。 2. **JSONP**（JSON with Padding）：如果目标服务支持 JSONP，那么可以在 PHP 文件里动态生成 `<script>` 标签，通过 URL 参数传递回调函数名。 3. **代理设置**：在 PHPStudy 中，可以在配置的 HTTP 代理设置里，将所有请求转发到目标服务器，从而绕过浏览器的同源策略。 4. **本地服务器反向代理**：使用 PHPStudy 自带的或者第三方工具（如 Fiddler 或Charles）设置一个本地代理服务器，所有的跨域请求都先发送给这个代理，代理再转发到真实的目标服务器。 5. **使用 No-Cache 头部**：有些服务器端框架提供选项，可以临时关闭浏览器缓存，使得每次请求都会从服务器获取最新的内容。 在处理跨域问题时，还要注意安全性和隐私保护，尽量不要随意开放 CORS 权限，只对必要的请求开放。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值