ajax 使用 jsonp 跨域

可以先看 jsonp 教程。

记录下自己的实际使用方式。（最基本的用法）

前台部分

在 ajax 调用中增加 dataType、jsonp 参数以及 success 回调。

$.ajax({
    url: xxurl, // 后台接受请求的 url
    data: {xx}, // 要传给后台的数据
    dataType: 'jsonp',
    jsonp: 'callback',
    success: function(res) {
        // 在此执行回调
        // res为后台返回的 json 对象
    }
});

注意：

• 不支持 POST 方法。
• 只能异步。设置 async: false 无效。
• 由于只能异步，如果要兼容 safari，不能在回调函数中调用 window.open。

后台部分

譬如，jo 是一个包含返回数据的 JSONObject，以前的返回值为 jo.toString()。改为 jsonp 后，返回值为前台传来的参数 callback 的值加上"(" + jo.toString() +")"。

代码片段：

        String callback = WebUtils.getHTTPRequestParameter(req, "callback");
        if (StringUtils.isEmpty(callback)) {
            WebUtils.printAsJSON(res, jo);
        } else {
            WebUtils.printAsString(res, callback + "(" + jo.toString() + ")");
        }

这段代码兼容了普通 ajax 调用和 jsonp 方式调用。WebUtils.printAsString 是封装好的一个方法，用于向客户端返回数据。