1、angularjs的jsonp请求,其请求url后面必须加上JSON_CALLBACK
如:“http://localhost:8080/angularjs/json/phone.json?callback=JSON_CALLBACK”
2、callback=JSON_CALLBACK 是指指定回调函数的名称为JSON_CALLBACK ,这个名称在AngularJS发出请求时,会自动将JSON_CALLBACK替换成一个唯一的函数名,比如:"callback=angular.callbacks._0",这个可以通过浏览器debug模式查看. 我请求的url为“http://localhost:8080/angularjs/json/phone.json?callback=JSON_CALLBACK”
3、比较重要的,你的返回数据必须放在JSON_CALLBACK (json数据)里面。
注意:JSON_CALLBACK 必须是angularjs把你的JSON_CALLBACK 替换后的值,如:angular.callbacks._0,假设你请求到后台,你可以先获取到callback这个参数的值,然后把组装你要返回的json数据。
eg: 假设是SpringMVC
String callback = request.getParameter("callback");
JSONObject json =new JSONObject();
json.put("id", "123456");
json.put("username", "hhaip");
json.put("age", 25);
json.put("sex", "男");
return callback+"("+json+")"; //返回的json格式和下面我的例子一样
我请求的是一个.json文件,在tomcat里面直接新建了一个文件夹,里面放了一个.json文件,该文件里存放了json格式的数据,如下:
angular.callbacks._0([ //angular.callbacks._0不能写成JSON_CALLBACK
{
"id":"00001",
"name":"Nexus S",
"snippet":"Fast just got faster with Nexus S.",
"age":12,
"address":"江西九江"
},
{
"id":"00002",
"name":"Motorola XOOM™ with Wi-Fi",
"snippet":"The Next, Next Generation tablet.",
"age":21,
"address":"江西南昌"
},
{
"id":"00003",
"name":"MOTOROLA XOOM™",
"snippet":"The Next, Next Generation tablet.",
"age":22,
"address":"江西丰城"
}
,
{
"id":"00004",
"name":"一加X",
"snippet":"一加最新的一款轻期旗舰手机",
"age":19,
"address":"江西赣州"
}
,
{
"id":"00005",
"name":"锤子手机",
"snippet":"东半球最好用的手机",
"age":13,
"address":"江西上饶"
}
,
{
"id":"00006",
"name":"iphone 6s",
"snippet":"苹果6plus手机",
"age":18,
"address":"江西宜春"
}
])
4、$http.jsonp是向服务器发送请求,所以你不能直接就访问非服务器里的文件,那样会报错。
(1). 可以在tomcat的webapps文件夹里新建一个文件夹,里面放一个文件如:data.json,这样就是一个项目了。
(2). 然后启动你的tomcat,就启动服务了,数据就在服务器里。
(3). 请求的url可以写成http://localhost:8080/文件夹名/data.json?callback=JSON_CALLBACK
此博文为原创,转载请注明出处