JSONP
什么是JSONP
JSONP (JSON with Padding)是JSON的一种“使用模式”,可用于解决主流浏览器的跨域数据访问的问题。
由于浏览器同源策略的限制,网页中无法通过Ajax请求非同源的接口数据。但是<script>标签不受浏览器同源策略的影响,可以通过src属性,请求非同源的js 脚本。
因此,JSONP的实现原理,就是通过<script>标签的src属性,请求跨域的数据接口,并通过函数调用的形式,接收跨域接口响应回来的数据。
JSONP-演示跨域Ajax数据请求存在的问题:
示例代码:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <script src="/js文件/jquery-3.6.0.js"></script> </head> <body> </body> <script> $.ajax({ method: 'GET', url: 'http://ajax.frontend.itheima.net:3006/api/jsonp', data: { name: 'zs', age: 20 }, success: function (res) { console.log(res); } }) </script> </html>