jquery Ajax Jsonp 跨域调用

笔记之前先饿补一下Src和Href的区别及应用：

Src：source的缩写，页面加载时同步指向内部或外部资源的位置，资源内容将会嵌入到文档中当前标签所在位置，加载此指定项时会会暂停其他资源的下载，等待此资源下载完成才会进行其他资源下载。这里指定的资源可以为任何域名下的资源，也就是不存在同源问题。

Href：Hypertext Reference的缩写，页面加载时异步指向内部或外部资源位置并与其建立连接，加载此指定项时会继续其他资源的下载。这里指定的资源也可以为任何域名下的资源，不存在同源问题。

同源/非同源区分方式

在访问的路径中，只要协议、域名、端口有任何一个不同，都是一个不同源的地址。

Ajax跨域

在一个域名下使用Ajax技术请求非同源的资源。

一、JSONP Ajax 跨域

1)、原理

Jsonp Ajax 跨域原理很简单，它应用了Src请求的路径可以为非同源资源，srcipt的Src属性指向一个Servlet并为其添加一个callback参数，并需要servelt与它积极配合，返回结果是调用callback指定的JS函数格式，前端执行callback指定的JS函数。

2)、Jquery Jsonp Ajax 跨域例子 基于Spring MVC

前段代码： 

 

jQuery.ajax({
    type : "GET",   //此访问将会使用GET方式访问
    jsonp : "callback",
    jsonpCallback : "hellowCrossDomain", 
    dataType : "jsonp",
    url : "",
    data : "appid=1",   
    async : false,  
    success : function(result){

     //会在回调函数执行后 执行
    },

   error:function(){
    }
   });

 

 

//跨域访问服务端成功   回调函数

function hellowCrossDomain(result){

}

以上参数说明：

1、jsoup:‘callback’--> 回调函数参数名称(Parameter的KEY)，默认为callback，此参数名可以任意指定。

2、jsonpCallback :"hellowCrossDomain" -->回到函数参数值(Parameter的VALUE)，如果不指定系统会为任意指定一个函数名称。

3、 dataType : "jsonp"-->指定反馈参数类型

4、async : false-->用以指定此Ajax是否异步访问，true：异步(默认)，false：同步

5、url:""-->访问参数地址

二、java代码

@ResponseBody
@RequestMapping(value = "任意URL地址")
    public String hellowCrossDomain(HttpServletRequest request, HttpServletResponse response){
        String jsonpCallback = "";
        response.setContentType("text/plain"); 
        jsonpCallback = request.getParameter("callback");//回调函数的参数名称
        jsonpCallback+="([{'id':'1'},{'id','2'}])"; //返回列表
        return jsonpCallback;
    }