51Testing软件测试论坛

标题: JS----Jsonp 简单使用 [打印本页]
作者: 巴黎的灯光下    时间: 2019-4-8 14:56
标题: JS----Jsonp 简单使用
Jsonp 简单使用

客户端 - 直接提交:getJSON:
  1. $.getJSON("http://127.0.0.1/test.php?jsoncallback=?&t=5555&name=jack", function(data){
  2.     console.log(data)
  3.     console.log(data.name)  
  4. })
复制代码

客户端 - ajax提交:
  1. $('#form').on('submit', function(event) {
  2.     window.event.returnValue = false;

  4.     $.ajax({
  5.         url: "http://127.0.0.1/test/t1.php?t=5555",       // 服务器地址要注意是ipv4的，ipv6测试暂时没成功。
  6.         data:{name:'jack', age:$("[name='age']").val()},  // 传递数据
  7.         type: "POST",                                     // get/post都可以的请求方式
  8.         async: false,                                     // 是否同步，false为异步加载        
  9.         dataType: "jsonp",                                // 设置返回数据类型jsonp      
  10.         jsonp: "jsoncallback",                            // jsonp的字段，服务器返回的前缀要和这个一样
  11.         success: function (data) {
  12.             console.log(data)   
  13.             // console.log(data[0].name)

  15.             // 取数据：遍历数据
  16.             var ul = '<ul>';
  17.             // data为获取的数据，记得给服务器设置charset=utf-8;否则返回中文乱码
  18.             $.each(data, function (i, v) {
  19.                 ul += '<li>' + v.name + '</li>';
  20.             });

  22.             ul +='</ul>';


  25.             $("#result").append(ul);

  27.         },
  28.         error: function () {
  29.             console.log('fail');
  30.         }
  31.     });
  32. })
复制代码


服务端:
  1. header("Content-type:text/html;charset=utf-8");

  3. // htmlspecialchars() 函数把一些预定义的字符转换为 HTML 实体。
  4. // 获取回调函数名
  5. $jsoncallback = isset($_REQUEST['jsoncallback']) ? htmlspecialchars($_REQUEST['jsoncallback']) : '';

  7. // 方式1：json数据
  8. $jsonData1 = '[{name:"jack"},{name:"tom"}]';

  10. // 方式2：获取数据. 主意要为$_GET
  11. $jsonData2 = json_encode($_GET);

  13. // 输出json数据
  14. echo $jsoncallback . "(" . $jsonData1 . ")";
复制代码




欢迎光临 51Testing软件测试论坛 (http://bbs.51testing.com/) Powered by Discuz! X3.2