php跨域进击技巧_搞清楚跨域搞工作

为啥你一定要会而且搞清楚跨域？

用不用的到先不说，有其余2个主要缘故原由：

口试必考

超级多的网站并没有防跨域攻击 ，嘿嘿...

跨域这两个字，跨是个动词，那么‘域’到底是什么鬼？

大略的说便是网址，域指的是协议+主机+端口组成的网址，比如 https://www.toutiao.com

同源策略是浏览器对不同域之间访问资源的限定：

1. 不同域之间不可以发送 HTTP 要求

2. 浏览器不同窗口的 DOM BOM 工具是独立的，无法访问

3. iframe标签嵌套的页面也遵守同源策略

跨域攻击指的是第一种情形。

如果浏览器没有这些限定会怎么样？

比如黑别人的扣扣，我完备可以在自己的网站引用扣扣官网的html，js等仿照官网，欺骗别人上岸，然后记录输入的账号密码等。

这里只先容几种常用的

jsonp是为理解决跨域要求的DIY出来的方法，而且也比较方便，大部分的跨域问题都利用此种办法办理

事理

同源策略中，src属性的要求不会被限定跨域，那么可以利用这点完成跨域要求，但须要和后端合营

实现

步骤：

1. src指定接口，返回的代码会被视为js代码实行

<script src=\公众https:www.bbb.com/test.php?callback=myCallback\公众></script>

2. 写个全局函数

var myCallback = function(data) {

　console.log(data);

};

注：一样平常是全局的，指定工具下的方法也可，但须要和后端协商好

3. 后端返回拼接后的js代码

<?php

　$callback=$_GET['callback'];

　$data='sfsdfsdfas';

　echo $callback.'(\"大众'.$data.'\"大众)';

>

//返回给前端并被作为js实行，调用相应的函数，得到传回来的数据

callback(\"大众sfsdfsdfas\"大众)

利用jQ更大略些:

不须要回调函数写在success里即可，这样可以不配置全局函数（jsonpCallback），jQ自动天生完成后自动销毁

$.ajax({

　url:\"大众https:www.bbb.com/test.php\"大众,

　dataType:\公众jsonp\"大众,

　type:\"大众get\公众,

　// jsonp:\"大众callback\"大众,

　// jsonpCallback:\公众jsonpcallback\公众,

　success:function(data){

　　console.log(data);

　},

　error:function(data){

　　onsole.log(data);

　}

})

缺陷

只能是get要求（src发送的都是get）

如果你只是想调用另一个网站的页面，直接用iframe即可。
如果想获取它的数据可以利用H5的 postMessage

window.postMessage(data,域)通报信息可以跨域

域为 时，不限定。

步骤：

1. 利用iframe引入另一个网站

<iframe id=\公众hisPage\"大众 src=\"大众https://www.bbb.com/test.html\"大众 onLoad=\"大众onLoad()\"大众></iframe>

<script>

function onLoad(){

　var hisPage = document. getElementById ( 'hisPage' );

　var hisWindow = hisPage. contentWindow;

　hisWindow. postMessage ( 'asfdsfds', );

}

</script>

2. 另一个网站利用onmessage事宜监听数据

window.onmessage=function(e){

　e= e|| event;

　console.log(e.data);//值在data属性里

}

缺陷：限于H5，不适宜用于直接要求接口，但可以变通，也须要相互配和

此办法由后端完成，后端访问没有浏览器的同源策略限定，也就不存在跨域问题。

后端一样平常也有限定，比如没上岸则无官僚求接口等。

比如你想访问 https:www.bbb.com/test.php ,通过代理办理步骤如下：

1. 前端要求后真个某个接口（即代理）

2. 这个接口仿照要求（包含合法的用户信息）去访问　https:www.bbb.com/test.php

3. 得到返回数据后再传给前端

目标域的后端可以通过修正header，来许可所有来源的访问，或指定访问源

在php接口脚本中加入以下两句即可：

//许可所有来源访问

header('Access-Control-Allow-Origin:');

//许可访问的办法

header('Access-Control-Allow-Method:POST,GET');

前端也要修正

$.ajax({

　url:\公众https:www.bbb.com/test.php\公众,

　xhrFields: {

　　// 前端设置是否带cookie

　　withCredentials: true

　},

　//会让要求头中包含跨域的额外信息，但不会含cookie

　crossDomain: true,

　success:function(){...}

});

跨域到这里搞清楚了，下篇文章搞事情——CSRF 跨域攻击

【javascript】【javascript】【javascript】【javascript】【javascript】【javascript】