使用 jsonp 跨域请求数据报错 “Unexpected token :” 的解决办法

错误的原因是:服务端返回数据的格式有问题。

使用 jQuery的ajax方法($.ajax)
方法中参数的含义

type:请求方式 GET/POST
url:请求地址
async:布尔类型,默认为true 表示请求是否为异步,如果为false表示为同步。
dataType:返回的数据类型
jsonp:传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
jsonpCallback:自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
success:调用成功执行的函数
error:异常处理函数


更详细的可以查看 jQuery 手册。
在线jQuery手册地址:http://jquery.cuishifeng.cn/jQuery.Ajax.html

根据 jsonp 的官方描述:
jsonp官方说明

所以,后台返回的数据应该使用这种形式

修改代码:

前端请求

 $.ajax({  
        type: "get",  
        async: false,  
        url: "http://127.0.0.1:8081/food/6",  
        dataType: "jsonp",  
        jsonp:"callback",
        jsonpCallback:"success_jsonpCallback",
        success: function(data){  
            alert(data); 
        },  
        error: function(){  
            alert('fail');  
        }  
    });

后台返回数据

@RequestMapping(value="/{foodId}",produces = "text/plain;charset=utf-8")
@ResponseBody
public String getFoodsById(@PathVariable int foodId){
    Foods foodById = foodService.getFoodById(foodId);
    String objectToJson = JsonUtils.objectToJson(foodById);
    return "success_jsonpCallback("+ objectToJson +");";
}
阅读更多
想对作者说点什么?

博主推荐

换一批

没有更多推荐了,返回首页