JQuery jsonp调用

最新推荐文章于 2025-06-29 11:10:32 发布

just4you

最新推荐文章于 2025-06-29 11:10:32 发布

阅读量619

点赞数

CC 4.0 BY-SA版权

分类专栏： JavaScript 文章标签： jquery jsonp

本文链接：https://blog.youkuaiyun.com/just4you/article/details/52837138

JavaScript 专栏收录该内容

12 篇文章

订阅专栏

本文介绍了一个使用JSONP实现跨域请求的例子。通过HTML页面上的JavaScript代码发送请求到服务器端，服务器端则返回一个包含回调函数名的JSON对象。前端通过指定的回调函数处理返回的数据。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

服务器端

服务器端要返回一个字符串给js调用


@RequestMapping(value="/cb")
@ResponseBody
public JSONObject returnCallback(HttpServletRequest request){
    String cb = request.getParameter("callback");

    JSONObject json = new JSONObject();
    json.put("success",cb);
    return json;
}

HTML页面

页面发送请求并处理返回的结果

<html>
 <head>
  <title> new document </title>
  <script src="jquery-1.7.2.min.js"></script>
  <script>
    function getJsonUtf8(url,data,callbackFn){
        $.ajax({
            dataType:"jsonp",
            url:url,
            data:data,
            jsonp:"callback",//callback为关键字
            async:true,
            contentType:"application/jsonp;charset=utf-8",
            success:function(json){
                if(json){
                    callbackFn&&callbackFn(json);
                }else{
                }
            },
            error:function(err){

            }
        });
    }

$(function(){
    var url = '远程url';
    getJsonUtf8(url,{},function(res){
        alert(res);
    });
});
  </script>
 </head>
 <body>
 </body>
</html>