跨域访问的解决及问题

最新推荐文章于 2024-07-06 09:00:00 发布

laokaizzz

最新推荐文章于 2024-07-06 09:00:00 发布

阅读量690

点赞数

分类专栏：解决问题

本文链接：https://blog.csdn.net/laokaizzz/article/details/77930897

版权

解决问题专栏收录该内容

233 篇文章 1 订阅

订阅专栏

跨域这么解决

a 网站某个页面(ori.html)要嵌套b网站中的详情页面。但是b网站中的详情页面（detail.html）的高度是动态的，要b网站告诉a网站。

解决方式：

a网站中增加一个cross.html页面。里面大概这么写

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=8,9,10,11" />
<title>   </title>
<script type="text/javascript">
	
	function load(){
		var _heigth = getQueryStringRegExp("height");
		parent.parent.resizeHeight(_heigth);
		
	}
	
	/**
	 * 获取iframe传递过来的参数
	 */
	function getQueryStringRegExp(name){  
	    var reg = new RegExp("(^|\\?|&)"+ name +"=([^&]*)(\\s|&|$)", "i");  
	    if (reg.test(location.href)) return decodeURIComponent(RegExp.$2.replace(/\+/g, " ")); return "";  
	}; 
</script>
</head>
<body οnlοad="load()">
</body>
</html>

a网站中的ori.html 里放一个iframe。src地址是b网站中的detail.html,并且在参数中加上cross.html 的地址。

例如：src地址 http://b.com/detail.html?callBackUrl=http://a.com/cross.html

b网站中的detail.html 中增加一个iframe。页面加载完成后，给iframe赋值src地址为传递过来的callBackUrl地址。

因为cross.html中写的是parent.parent.方法。所以实际上还是访问的他自己网站的内容。就没有跨域了。

测试环境使用没问题。

但是正式环境上有问题。提示401,发现response的页面是b页网站中的登录页面。。。

不知道怎么回事，cross.html不去a网站，而是在b网站找cross.html。经过搜索发现，可能是spring-security导致的。

http://blog.csdn.net/princeluan/article/details/73268637 但是我使用的网站中是spring3.x的，配置方式不一样，也不知道具体怎么配置。

打算通过nginx的配置来解决https://stackoverflow.com/questions/30731290/how-to-set-x-frame-options-allow-from-in-nginx-correctly

但是好像chorme浏览器不支持某种配置。上篇文章中提到：Chrome does not support allow-from

另外参考：https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy

单独访问对应的cross.html页面是ok的，但是在detail.html中的iframe访问就不行。跳转的是detail.html所在网站同名的页面里去了。经过观察发现，请求都是一样，只不过一个有refer，一个没有refer。没有refer的正常。于是，在对应的b网站的cross.html中加入了location.replace(this.location.href) . 这样变相的去掉了refer。就行了。

laokaizzz

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
跨域访问的解决及问题

跨域这么解决a 网站某个页面(ori.html)要嵌套b网站中的详情页面。但是b网站中的详情页面（detail.html）的高度是动态的，要b网站告诉a网站。解决方式：a网站中增加一个cross.html页面。里面大概这么写 function load(){ var _heigth = getQueryStringRegExp("height");
复制链接

扫一扫

专栏目录