JSONP(JSON with Padding)是一种实现跨域请求的方法,其原理如下:
1. 前端页面通过`<script>`标签动态创建一个请求,并将请求发送到目标服务器的一个特定的接口。
2. 目标服务器在接收到请求后,将要返回的数据包裹在一个指定的回调函数中,并将整个函数作为响应返回给前端页面。
3. 前端页面在创建请求时,需要定义一个回调函数,并将回调函数的名称作为参数传递给目标服务器。目标服务器会将返回的数据作为函数的参数传入,并在响应中执行该函数。
4. 前端页面在接收到响应后,即可在回调函数中获取到返回的数据。
关键点是,由于浏览器对于`<script>`标签的请求不受同源策略的限制,因此可以通过动态创建`<script>`标签实现跨域请求。而使用回调函数的方式,实际上是借助了 JavaScript 中的函数调用来获取到跨域返回的数据。
需要注意的是,JSONP只支持GET请求,不支持POST请求,且存在一定的安全风险,需要确保目标服务器可信并且返回的数据是可靠的。另外,在使用JSONP时,需要与目标服务器进行约定,确保前后端的回调函数名称一致,以便正确获取返回的数据。