AngularJS中$http.jsonp跨域请求问题

废话不多说 直接上代码:

前端请求比如是这样:http://localhost:8080/angularjs/json/test.json 在执行请求的时候肯定会有跨域问题,解决办法是请求url后面必须加上JSON_CALLBACK

  如:“http://localhost:8080/angularjs/json/test.json?callback=JSON_CALLBACK

当然仅仅前端设置是不够的,需要后天返回一个jsonp格式的数据 ,而不是json数据,那么我们先比较一下这两者的区别:

json格式:
{
    "message":"获取成功",
    "state":"1",
    "result":{"name":"工作组1","id":1,"description":"11"}
}
jsonp格式:
callback({
    "message":"获取成功",
    "state":"1",
    "result":{"name":"工作组1","id":1,"description":"11"}
})

看出来区别了吧,在url中callback传到后台的参数是神马callback就是神马,jsonp比json外面有多了一层,callback()。这样就知道怎么处理它了。于是修改后台代码。(看不懂没关系,有你的后台小伙伴帮你解决,看关键地方!)

@RequestMapping(value = "/getGroupById")
  public String getGroupById(@RequestParam("id") Long id,
      HttpServletRequest request, HttpServletResponse response)
      throws IOException {
    String callback = request.getParameter("callback");
    ReturnObject result = null;
    Group group = null;
    try {
      group = groupService.getGroupById(id);
      result = new ReturnObject(group, "获取成功", Constants.RESULT_SUCCESS);
    } catch (BusinessException e) {
      e.printStackTrace();
      result = new ReturnObject(group, "获取失败", Constants.RESULT_FAILED);
    }
    String json = JsonConverter.bean2Json(result);
    response.setContentType("text/html");
    response.setCharacterEncoding("utf-8");
    PrintWriter out = response.getWriter();
    out.print(callback + "(" + json + ")");      <--- 关键代码在这里!!!
    returnnull;
  }
注意这里需要先将查询结果转换为json格式,然后用参数callback在json外面再套一层,就变成了jsonp。指定数据类型为jsonp的ajax就可以做进一步处理了。
到此跨域问题解决,亲测完美解决。
参考文档:http://blog.csdn.net/cn_hhaip/article/details/50040383
		跨域

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值