常规跨域的方法

常见跨域的方法有:

1. 添加Access-Control-Allow-Origin
2. 后台服务器代理
3. Jsonp

1、2两种方法都是安全可靠的,3是不安全不可靠的

Json的本质

Json本质是引用并执行外部JavaScript脚本,原理是<scrpit>标签不受域名的限制,通过动态创建<scrpit>来执行js函数

Jsonp的使用

jQuery执行Jsonp使用

$.ajax(url,{         dataType:"jsonp",         error:function(jqXHR,textStatus,errorThrown)         {             //TODO         },         success:function(data)         {             //TODO         }     });

jQuery3.3.1加载执行外部js

function DOMEval( code, doc, node ) {     doc = doc || document;      var i,         script = doc.createElement( "script" );      script.text = code;     if ( node ) {         for ( i in preservedScriptAttributes ) {             if ( node[ i ] ) {                 script[ i ] = node[ i ];             }         }     }     doc.head.appendChild( script ).parentNode.removeChild( script ); }

不安全

用户输入不可信,外部脚本同样不可信。若A网站引用了B网站的跨域脚本,那么A网站的安全受B网站牵制。

安全情况下,safeapi.php

<?php date_default_timezone_set('asia/shanghai'); $result=json_encode(array("msg"=>"你好,当前时间:".date("Y-m-d H:i:s e"))); if(isset($_REQUEST['callback'])) {     header("Content-Type:text/javascript;charset=utf-8");      echo $_REQUEST['callback']."(".$result.")"; }else {     header("Content-Type:application/json;charset=utf-8");     echo $result; }

B网站受到攻击或恶意代码,danger.php

<?php header("Content-Type:text/javascript;charset=utf-8");  if(isset($_REQUEST['callback'])) {      echo $_REQUEST['callback']."(";  }else {     echo "_(";   } echo json_encode(array("msg"=>"你好,当前时间:".date("Y-m-d H:i:s"))); echo ");console.log('do something');";

在A网站下控制台输出 do something

思考

应该对网站安全进行隔离，不应轻易相信外部脚本,否则很容易造成账号泄漏等安全风险。如果的确需要引用执行外部脚本,可以使用CSP 策略指令进行白名单控制,如:

Content-Security-Policy: default-src 'self' trustedscripts.foo.comhttps://www.cnblogs.com/loveheihei/p/9882384.html