什么是跨域及怎么解决跨域问题？

最新推荐文章于 2024-02-04 13:19:51 发布
最新推荐文章于 2024-02-04 13:19:51 发布
阅读量2.3k 收藏 7
点赞数
分类专栏： JSP Java
原文链接：https://blog.csdn.net/lianzhang861/article/details/84871369
版权
Java 同时被 2 个专栏收录
89 篇文章 2 订阅
订阅专栏
JSP
25 篇文章 1 订阅
订阅专栏

什么是跨域？

这篇博文解释的挺清楚，我直接引用 https://blog.csdn.net/lambert310/article/details/51683775

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

所谓同源是指，域名，协议，端口均相同，只要有一个不同，就是跨域。不明白没关系，举个栗子：

http://www.123.com/index.html 调用 http://www.123.com/server.php （非跨域）

http://www.123.com/index.html 调用 http://www.456.com/server.php （主域名不同:123/456，跨域）

http://abc.123.com/index.html 调用 http://def.123.com/server.php （子域名不同:abc/def，跨域）

http://www.123.com:8080/index.html 调用 http://www.123.com:8081/server.php （端口不同:8080/8081，跨域）

http://www.123.com/index.html 调用 https://www.123.com/server.php （协议不同:http/https，跨域）

请注意：localhost和127.0.0.1虽然都指向本机，但也属于跨域。

浏览器执行javascript脚本时，会检查这个脚本属于哪个页面，如果不是同源页面，就不会被执行。

跨域会阻止什么操作？

浏览器是从两个方面去做这个同源策略的，一是针对接口的请求，二是针对Dom的查询

1.阻止接口请求比较好理解，比如用ajax从http://192.168.100.150:8020/实验/jsonp.html页面向http://192.168.100.150:8081/zhxZone/webmana/dict/jsonp发起请求，由于两个url端口不同，所以属于跨域，在console打印台会报No 'Access-Control-Allow-Origin' header is present on the requested resource

值得说的是虽然浏览器禁止用户对请求返回数据的显示和操作，但浏览器确实是去请求了，如果服务器没有做限制的话会返回数据的，在调试模式的network中可以看到返回状态为200，且可看到返回数据

2.阻止dom获取和操作

关于iframe中对象的获取方式请看：https://blog.csdn.net/lianzhang861/article/details/84870484

比如a页面中嵌入了iframe，src为不同源的b页面，则在a中无法操作b中的dom，也没有办法改变b中dom中的css样式。

而如果ab是同源的话是可以获取并操作的。

<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
		<style type="text/css">
			iframe{
				width:100%;height:800px;
			}
		</style>
	</head>
	<body>
		<!--<iframe src="http://192.168.100.150:8081/zhxZone/webmana/attachment/imageManager" frameborder="0" id="iframe"></iframe>-->
		<iframe src="http://192.168.100.150:8020/实验/jsonp.html" frameborder="0" id="iframe"></iframe>
		<script type="text/javascript">
			var i=document.getElementById("iframe");
			i.onload=function(){
				/*console.log(i.contentDocument)
				console.log(i.contentWindow.document.getElementById("text").innerHTML)*/
				var b=i.contentWindow.document.getElementsByTagName("body")[0];
				i.contentWindow.document.getElementById("text").style.background="gray";
				i.contentWindow.document.getElementById("text").innerHTML="111";
			}
		</script>
	</body>
</html>

改变了iframe中的元素 

甚至是可以获取iframe中的cookie

var i=document.getElementById("iframe");
i.onload=function(){
	console.log(i.contentDocument.cookie)
}

不用说也知道这是极为危险的，所以浏览器才会阻止非同源操作dom

浏览器的这个限制虽然不能保证完全安全，但是会增加攻击的困难性

虽然安全机制挺好，可以抵御坏人入侵，但有时我们自己需要跨域请求接口数据或者操作自己的dom，也被浏览器阻止了，所以就需要跨域

跨域的前提肯定是你和服务器是一伙的，你可以控制服务器返回的数据，否则跨域是无法完成的 

解决跨域的方法

1.前端方法就用jsonp

jsonp是前端解决跨域最实用的方法

原理就是html中 的link,href,src属性都是不受跨域影响的，link可以调用远程的css文件，href可以链接到随便的url上，图片的src可以随意引用图片，script的src属性可以随意引入不同源的js文件

看下面代码，a.html页面中有一个func1方法，打印参数ret

<body>
	<script type="text/javascript">
		function func1(ret){
			console.log(ret)
		}
	</script>
	<script src="http://192.168.100.150:8081/zhxZone/webmana/dict/jsonp.js" type="text/javascript" charset="utf-8"></script>
</body>

而引入的jsonp.js中的代码为：

func1(111)

可想而知结果会打印出 111，也就是说a页面获取到了jsonp.js中的数据，数据是以调用方法并将数据放到参数中返回来的

但是这样获取数据,必须a.html中的方法名与js中的引用方法名相同，这样就是麻烦很多，最好是a.html能将方法名动态的传给后台，后台返回的引入方法名就用我传给后台的方法名，这样就做到了由前台控制方法名

总之要做到的就是前台像正常调接口一样，后台要返回回来js代码即可

现在改为动态方法名：我请求的接口传入callback参数，值为方法名func1

<body>
	<script type="text/javascript">
		function func1(ret){
			console.log(ret)
		}
		
	</script>
	<script src="http://192.168.100.150:8081/zhxZone/webmana/dict/jsonp?callback=func1" type="text/javascript" charset="utf-8"></script>
</body>

后台返回不同编程语言不同，我使用的是java，所以我展示一下java返回的方法

//jsonp测试
@ResponseBody
@RequestMapping(value = "jsonp", produces = "text/plain;charset=UTF-8")
public void jsonp(String callback, HttpServletRequest req, HttpServletResponse res) {
    List<Map<String,Object>> list = new ArrayList<Map<String,Object>>();
    RetBase ret=new RetBase();
    try {
        res.setContentType("text/plain");
        res.setHeader("Pragma", "No-cache");
        res.setHeader("Cache-Control", "no-cache");
        res.setDateHeader("Expires", 0);
        Map<String,Object> params = new HashMap<String,Object>();
        list = dictService.getDictList(params);
        ret.setData(list);
        ret.setSuccess(true);
        ret.setMsg("获取成功");
        PrintWriter out = res.getWriter();
        //JSONObject resultJSON = JSONObject.fromObject(ret); //根据需要拼装json
        out.println(callback+"("+JSON.toJSONString(ret)+")");//返回jsonp格式数据
        out.flush();
        out.close();
    } catch (Exception e) {
        e.printStackTrace();
    }
}

上述java代码相当于我返回了 " func1(数据) "的代码，所以返回数据成功打印，完成了跨域请求

到这里，每次请求数据还要引入一个js才行，代码有些杂乱，前端可以继续优化代码，动态的生成script标签

<script type="text/javascript">
	function func1(ret){
		console.log(ret)
	}
	var url="http://192.168.100.150:8081/zhxZone/webmana/dict/jsonp?callback=func1";
	var s=document.createElement("script");
	s.setAttribute("src",url);
	document.getElementsByTagName("head")[0].appendChild(s);
	
</script>

这样，原生的jsonp跨域就基本完成了，但是用起来不是很方便

我推荐使用jquery封装的jsonp，使用起来相对简单

使用起来跟使用ajax类似，只是dataType变成了jsonp，且增加了jsonp参数，参数就是上述的callback参数，不需要管他是啥值，因为jq自动给你起了个名字传到后台，并自动帮你生成回调函数并把数据取出来供success属性方法来调用

jq jsonp标准写法：

$.ajax({
    type: 'get',
    url: "http://192.168.100.150:8081/zhxZone/webmana/dict/jsonp",
    dataType: 'jsonp',
    jsonp:"callback",
    async:true,
    data:{
        
    },
    success: function(ret){
        console.log(ret)
    },
    error:function(data) {
    },
});

jq jsonp的简便写法：

$.getJSON("http://192.168.100.150:8081/zhxZone/webmana/dict/jsonp?callback=?",function(ret){
	console.log(ret)
})

后台接收到的callback参数，jq自己起的名字

这样使用起来就跟ajax一样顺手了，把返回的值在success中操作即可，只不过是可以跨域了

这里针对ajax与jsonp的异同再做一些补充说明：

1、ajax和jsonp这两种技术在调用方式上”看起来”很像，目的也一样，都是请求一个url，然后把服务器返回的数据进行处理，因此jquery框架都把jsonp作为ajax的一种形式进行了封装。

2、但ajax和jsonp其实本质上是不同的东西。ajax的核心是通过XmlHttpRequest获取非本页内容，而jsonp的核心则是动态添加

2.后台配置解决跨域

  要说前端解决跨域用jsonp最好，但我更喜欢通过配置后台设置

同样，因为我用的java，所有我只能列举java的配置方法

我用的是 maven，spring mvc

首先在pom.xml中引入依赖

<!--跨域依赖-->
<dependency>
    <groupId>com.thetransactioncompany</groupId>
    <artifactId>cors-filter</artifactId>
    <version>1.7.1</version>
</dependency>
<dependency>
    <groupId>com.thetransactioncompany</groupId>
    <artifactId>java-property-utils</artifactId>
    <version>1.9</version>
</dependency>
<dependency>

然后在web.xml配置过滤器

<!--为了允许跨域访问-->
<filter>
    <filter-name>CorsFilter</filter-name>
    <filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
</filter>
<filter-mapping>
    <filter-name>CorsFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

这样前端就可以尽情跨域请求数据了，是不是很方便？

注意如果项目中配置了检测是否登录过滤器，可能会起冲突，因为没有登录的话每次都会跳转到登录接口。。。

 

下面再列举一些解决跨域方法，这些跨域方法有局限性也有特殊场景用途，应该了解一下

3.通过修改document.domain来跨子域

此方法有介绍价值，因为关系到操作dom方面的跨域

上述方法都只能解决请求跨域，而无法解决跨域操作dom，因为想操作dom条件比较苛刻，必须这两个域名必须属于同一个基础域名!而且所用的协议，端口都要一致

这个在这篇文章里有介绍 https://segmentfault.com/a/1190000005863659

document.domain

用来得到当前网页的域名。
比如在地址栏里输入：

代码如下:
javascript:alert(document.domain); //www.jb51.net

我们也可以给document.domain属性赋值，不过是有限制的，你只能赋成当前的域名或者基础域名。
比如：

代码如下:
javascript:alert(document.domain = "jb51.net"); //jb51.net
javascript:alert(document.domain = "www.jb51.net"); //www.jb51.net

上面的赋值都是成功的，因为www.jb51.net是当前的域名，而jb51.net是基础域名。
但是下面的赋值就会出来"参数无效"的错误：

代码如下:
javascript:alert(document.domain = "cctv.net"); //参数无效
javascript:alert(document.domain = "www.jb51.net"); //参数无效

因为cctv.net与www.jb51.net不是当前的域名也不是当前域名的基础域名，所以会有错误出现。这是为了防止有人恶意修改document.domain来实现跨域偷取数据。

利用document.domain 实现跨域：
前提条件：这两个域名必须属于同一个基础域名!而且所用的协议，端口都要一致，否则无法利用document.domain进行跨域.
Javascript出于对安全性的考虑，而禁止两个或者多个不同域的页面进行互相操作。
相同域的页面在相互操作的时候不会有任何问题。

比如在：aaa.com的一个网页(a.html)里面 利用iframe引入了一个bbb.com里的一个网页(b.html)。
这时在a.html里面可以看到b.html里的内容，但是却不能利用javascript来操作它。因为这两个页面属于不同的域，在操作之前，js会检测两个页面的域是否相等，如果相等，就允许其操作，如果不相等，就会拒绝操作。
这里不可能把a.html与b.html利用JS改成同一个域的。因为它们的基础域名不相等。(强制用JS将它们改成相等的域的话会报跟上面一样的"参数无效错误。")

所以如果在a.html里引入aaa.com里的另一个网页，是不会有这个问题的，因为域相等。
有另一种情况，两个子域名：
aaa.xxx.com
bbb.xxx.com

aaa里的一个网页(a.html)引入了bbb 里的一个网页(b.html)，
这时a.html里同样是不能操作b.html里面的内容的。
因为document.domain不一样，一个是aaa.xxx.com，另一个是bbb.xxx.com。
这时我们就可以通过Javascript，将两个页面的domain改成一样的，
需要在a.html里与b.html里都加入：

代码如下:
document.domain = "xxx.com";

这样这两个页面就可以互相操作了。也就是实现了同一基础域名之间的"跨域"。

4.通过window.name跨域

https://blog.csdn.net/u013558749/article/details/56968333

5.通过HTML5中新引进的window.postMessage方法来跨域传送数据

这个跨域主要是用于多iframe窗口之间消息传递或者父窗口与iframe传递消息的，属于比较狭义的跨域。比如在a界面修改内容，点击保存后b页面的表格自动刷新就可以使用这个。或者子iframe做了事件，父在跨域的情况下无法获取子的事件，但通过消息传递就可以间接获取到事件。

前提：跨域和被跨域的一方都是你可以控制的，一方写发送消息的，另一方写接收消息方法

注意这跨域的局限性在于必须在同一个window对象上，也就是说哪个window发送消息，只有本window才能接收到。

主要语法：

发送message

window.postMessage(message, targetOrigin);

监听并接收message

window.parent.addEventListener("message",function(res){
	console.log(res)
})

详细介绍看这个 https://blog.csdn.net/lianzhang861/article/details/100031166

这里面详细介绍了应用场景和注意事项

6.通过 CORS解决跨域

CORS背后的基本思想是使用自定义的HTTP头部允许浏览器和服务器相互了解对方，从而决定请求或响应成功与否.

*这其实和第2中方法（后台配置）基本相同，都是通过过滤器在response中返回头部，使服务器和浏览器可互通

Access-Control-Allow-Origin:指定授权访问的域
Access-Control-Allow-Methods：授权请求的方法（GET, POST, PUT, DELETE，OPTIONS等)

适合设置单一的（或全部）授权访问域，所有配置都是固定的，特简单。也没根据请求的类型做不同的处理

依旧是列举java中的方法。。。

首先自己写一个过滤器CORSFilter

package com.xxx.common.filter;
 
import org.springframework.stereotype.Component;
import org.springframework.web.filter.OncePerRequestFilter;
 
import javax.servlet.FilterChain;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;
 
/**
 * Created by 12143 on 2018/12/7.
 */
@Component
public class CORSFilter extends OncePerRequestFilter {
    @Override
    protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException {
        response.addHeader("Access-Control-Allow-Origin", "http://192.168.100.150:8020");
        //response.addHeader("Access-Control-Allow-Origin", "*");
        response.addHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE");
        response.addHeader("Access-Control-Allow-Headers", "Content-Type");
        response.addHeader("Access-Control-Max-Age", "1800");//30 min
        filterChain.doFilter(request, response);
    }
}

注意：Access-Control-Allow-Origin为*则允许所有url访问，如果为“http://192.168.100.150:8020”则只有此url才能访问，注意有端口的要把端口也写上
比如配置了http://192.168.56.130:8081，那么只有http://192.168.56.130:8081 能拿到数据，否则全部报403异常

然后在web.xml中添加此过滤器

<filter>
    <filter-name>CorsFilter</filter-name>
    <filter-class>com.xxx.common.filter.CORSFilter</filter-class>
</filter>
<filter-mapping>
    <filter-name>CorsFilter</filter-name>
    <url-pattern>/*</url-pattern>
</filter-mapping>

7.通过Nginx反向代理 

上个方法跨域是借助了浏览器对 Access-Control-Allow-Origin 的支持。但有些浏览器是不支持的，所以这并非是最佳方案,现在我们来利用nginx 通过反向代理 满足浏览器的同源策略实现跨域! 

这里是一个nginx启用COSR的参考配置

#
# Wide-open CORS config for nginx
#
location / {
     if ($request_method = 'OPTIONS') {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        #
        # Custom headers and headers various browsers *should* be OK with but aren't
        #
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
        #
        # Tell client that this pre-flight info is valid for 20 days
        #
        add_header 'Access-Control-Max-Age' 1728000;
        add_header 'Content-Type' 'text/plain charset=UTF-8';
        add_header 'Content-Length' 0;
        return 204;
     }
     if ($request_method = 'POST') {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
     }
     if ($request_method = 'GET') {
        add_header 'Access-Control-Allow-Origin' '*';
        add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
        add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
     }
}

 

chenbinqq
关注
  • 0
    点赞
  • 踩
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
什么是跨域？跨域解决方法.docx
11-23
什么是跨域？跨域解决方法.docx
什么是跨域？跨域解决方法
热门推荐
weixin_66375317的博客
05-02 9万+
什么是跨域？跨域解决方法
什么是跨域? 出现原因及解决方法
Knight
02-28 1万+
什么是跨域? 出现原因及解决方法
解决跨域问题8种方法，含网关、Nginx和SpringBoot~
最新发布
m0_67597657的博客
02-04 1466
跨域问题是浏览器为了保护用户的信息安全，实施了同源策略（Same-Origin Policy），即只允许页面请求同源（相同协议、域名和端口）的资源，当 JavaScript 发起的请求跨越了同源策略，即请求的目标与当前页面的域名、端口、协议不一致时，浏览器会阻止请求的发送或接收。
什么是跨域以及为什么会出现跨域以及跨域的解决方案
mischen520的博客
07-02 1万+
1.什么是跨域？ 跨域：指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。 • 同源策略：是指协议，域名，端口都要相同，其中有一个不同都会产生跨域；跨域举例： 2.为什么会出现跨域？ 我们都知道要想访问一个网站，首先要知道这个网站的URL，才能够进入该网站。而URL是由协议、域名、端口组成的（协议，浏览器自动填充；域名的端口默认为80，所以通常这两项不用输入）。而跨域就是说去访问的网站信息中的协议、域名、端口号这三者之中任意一个与当前页面的UR
什么是跨域，如何解决跨域（前后端）
jieyucx的博客
05-12 2713
跨域：指的是在网页端，发起一个跨越不同域名（协议、端口号）的HTTP请求的过程。例如：当一个页面的URL为http://a.com，通过Ajax向http://b.com发送请求，就是一个跨域请求。跨域问题是由浏览器的同源策略所引起的。同源策略限制了JS代码只能读取与其来源页面具有相同域名的数据。具体而言，同源策略是一种浏览器安全策略，它通过检查来源URL（协议 + 域名 +端口）是否与目标URL来源是否相同来决定是否允许跨域访问。同源策略主要限制以下四种行为。
什么是跨域、为什么要跨域、怎么解决跨域
qq_46034942的博客
04-29 1万+
什么是跨域、为什么要跨域、怎么解决跨域 ​ ​ 例如：http://192.168.0.1:8080与https://192.168.3.1:8080不是同源，因为协议不同，第一个冒号前面的为协议，中间的为域名，第二个冒号后面的为端口，只要满足有一处不同，则就不是同源。 所谓跨域就是从 A 向 B 发请求，如若他们的地址协议、域名、端口都不相同，直接访问就会造成跨域问题，跨域是非常常见的现象！请求是跨域的但并不一定会报错，普通的图片请求。css文件请求是不会报错的。报错的条件是浏览器的
Python项目跨域问题解决方案
12-17
2.安装跨域模块（一下代码修改都是在settings.dev下进行的） pip install django-cors-headers -i https://pypi.douban.com/simple 添加应用 　INSTALLED_APPS = ( 　... 　'corsheaders', 　... 　) 中间件设置...
Vue开发中遇到的跨域问题及解决方法
10-15
在本篇文章里小编给大家整理的是关于Vue开发中遇到的跨域问题及解决方法，需要的朋友们可以学习下。
Vue项目中跨域问题解决方案
01-19
使用http-proxy-middleware 代理解决（项目使用vue-cli脚手架搭建） Jquery jsonp 后台更改header header('Access-Control-Allow-Origin:*');//允许所有来源访问 header('Access-Control-Allow-Method:POST,GET')...
springboot后端解决跨域问题
08-26
今天小编就为大家分享一篇关于springboot后端解决跨域问题，小编觉得内容挺不错的，现在分享给大家，具有很好的参考价值，需要的朋友一起跟随小编来看看吧
最常见的六种跨域解决方案
m0_37873510的博客
08-27 3万+
常见的跨域解决方案
解决跨域问题（详解9种方法）
TongJ_的博客
08-14 7870
当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域。为了保证用户信息的安全性，防止恶意窃取当前网站的数据，禁止不同域直接与js代码交互。分布式项目：把后台放在一个服务器里，把前台放在一个服务器中，防止文件相互损坏，防止一个模块导致所有程序运行不起来，可以前后台同时开发，用来节省时间。...
什么是跨域？跨域详解
weixin_44091311的博客
12-17 4721
一、为什么会出现跨域问题 出于浏览器的同源策略限制。同源策略（Sameoriginpolicy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源（即指在同一个域）就是两个页面具有相同的协议（protocol），主机（host）和端口号（port） 二、什么是跨域 当一个请求url的协议、域名、端口三
什么是跨域，怎么解决跨域？
似水流年QC的博客
05-13 1万+
同源策略/SOP（Same origin policy）是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。JSON是一种数据交换格式（采用键值对的方式，无序组合，数组是有序组合），而JSONP是一种非官方跨域数据交互协议。跨域是指浏览器不能执行其他网站的脚本。它是浏览器同源策略造成的，是浏览器对JS实施的安全限制。注意：跨域限制是浏览器的机制，如果直接在服务端请求，是不会触发跨域限制的。
到底什么是跨域，如何解决跨域（常见的几种跨域解决方案）？
u011047968的专栏
03-13 5750
协议：http://子域名：www子域名：a.com端口号：8080请求资源地址：scripts/jquery.js跨域根本原因是由同源策略引起的。所谓同源是指域名，协议，端口相同，当页面在执行一个脚本时会检查访问的资源是否同源，如果非同源，在请求数据的时候浏览器会在控制台报一个异常，提示拒绝访问。注意：跨域限制访问，其实是浏览器的限制。理解这一点很重要！！！跨域访问的例子：请求跨域了，那么请求到底发出去没有？
解决跨域的三种方法
weixin_58448088的博客
02-21 1万+
1、详解解决跨域三种方法 2、瀑布流布局 3 、函数的节流 4、函数的防抖
什么是跨域？如何解决？
GSON的博客
11-01 3万+
一、什么是跨域？ 跨域：指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制。 例如：a页面想获取b页面资源，如果a、b页面的协议、域名、端口、子域名不同，所进行的访问行动都是跨域的，而浏览器为了安全问题一般都限制了跨域访问，也就是不允许跨域请求资源。注意：跨域限制访问，其实是浏览器的限制。理解这一点很重要！！！ 同源策略：是指协议，域名，端口都要相同，其中有一个不同都会产生跨域； 二、跨域访问示例 假设有两个网站，A网站部署在：.
什么是跨域？如何解决跨域问题？
05-27
为了解决跨域问题，可以采用以下几种方法： 1. JSONP：利用 `<script>` 标签的跨域特性，通过动态创建 `<script>` 标签来实现跨域数据获取。 2. CORS：服务端设置允许跨域访问的 HTTP 头，浏览器在请求时会自动...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值