【ajax跨域问题解决之jsonp】

Jonny Jiang-zh

于 2022-11-15 17:46:58 发布

阅读量434

点赞数 1

CC 4.0 BY-SA版权

分类专栏： web前端文章标签： ajax javascript json

本文链接：https://blog.youkuaiyun.com/weixin_45571140/article/details/127870424

web前端专栏收录该内容

13 篇文章

订阅专栏

本文介绍了如何通过定义JavaScript回调函数m来处理Ajax请求的结果。使用jQuery的$.ajax方法，设置类型为GET，dataType为jsonp，并指定jsonpCallback为m。服务器端根据接收到的callback参数，返回格式化的JSON字符串。处理返回乱码问题，通过在@RequestMapping中设置charset为UTF-8。整个流程展示了前端与后端如何协同完成跨域数据的获取和处理。

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

定义处理结果的js函数：

    function m(p1){
        console.log(p1)
    }

ajax请求，同时指定拿到结果后的回调函数

    $.ajax({
        url:"xxx",
        type:"GET",
        dataType: 'jsonp',
        jsonpCallback:"m", // jsonp指定回调函数参数名，jsonpCallback指定回调函数
        contentType: "application/jsonp; charset=utf-8",
        success:function (param0,param1,param2){
                console.log(param0,param1,param2)
            },
        error:function (param0,param1,param2){
                console.log(param0,param1,param2)
            },
        complete:function (param0,param1,param2){
                console.log(param0,param1,param2)
            }
    });

服务端进行处理，当有callback参数时，返回对应的格式String。（方法名+“(”+‘服务端结果String’ +“)”)

    @ResponseBody
    @RequestMapping(method = RequestMethod.GET, value = "/xxx",produces = "text/plain;charset=UTF-8")
    public String getSrMsg(HttpServletRequest request, HttpServletResponse servletResponse){
        String callBack = request.getParameter("callback");
        if(callBack != null){
            return callBack + "(" + JSON.toJSONString(response) + ")";
        }
        return JSON.toJSONString(response);
    }

解决返回乱码

@RequestMapping(method = RequestMethod.GET, value = "/xxx",produces = "text/plain;charset=UTF-8")