同源策略
- 浏览器的一种安全策略,所谓同源,指的是域名、协议、端口号彻底相同
- 限制:cookie、localStorage和IndexDB没法读取;没法操做跨域的iframe里的dom元素;Ajax请求不能发送
jsonp原理
- 本质是利用了标签(link,img,script,这里使用script)具备可跨域的特性,由服务端返回预先定义好的javascript函数的调用,而且将服务端数据以该函数参数的形式传递过来
- 前端javascript代码
<script>
function fuc(data){
console.log(data.name);
}
</script>
<script src="http://www.baidu.com/api.php?callback=fuc"></script>
<?php
$cb = $_GET['callback'];
$data = array(
'name'=> 'zs',
'age'=>18,
'gender'=>true
);
echo $cb.'('.json_encode($data).')';
?>
jsonp优势
- 完美解决在测试或者开发中获取不一样域下的数据,用户传递一个callback参数给服务端,而后服务端返回数据时会将这个callback参数做为函数名来包裹住JSON数据,这样客户端就能够随意定制本身的函数来自动处理返回数据了
jsonp缺点
- jsonp只支持get请求而不支持post请求
- 用session来判断当前用户的登陆状态,跨域时会出现问题
- jsonp存在安全性问题
特别注意
- 防止callback参数意外截断js代码,特殊字符单引号双引号,换行符存在风险
- 防止callback参数恶意添加script标签,形成xss漏洞
- 防止跨域请求滥用,阻止非法站点恶意调用
参考资料
你们好,我是小磊哥er!javascript