Ajax跨域问题jsonp解决办法（前后台）

Ajax直接请求普通文件存在跨域无权限访问的问题（静态页、动态页、web服务、wcf只要是跨域请求一律不准）

jsonp解决方法：

一、使用jsonp实现跨域请求

前端开发中，所有带src属性的标签都可以跨域访问其他服务器文件。jsonp实现的原理也是如此。

以jsonp的数据类型进行请求时，Js会动态在页面中添加script标签，将请求内容放置到src中。

jsonp类型请求数据时，只能用get

jsonp方式请求不支持修改头部信息参数。服务器端数据返回也需要做相应的处理，返回的数据必须是一个JS代码。Jsonp请求时，设置jsonpCallback参数假设为reciver，服务器处理数据返回格式类似于reviver(\'datas need retun \')，请求成功后，会自动调用前端reciver方法。

JQ前端请求代码:

[javascript]

$.ajax({  
        type: "get",  
        async: false,  
        url: "http://192.168.2.229:8081/api/web_search_directnew.html",  
        dataType: "jsonp",  
        jsonpCallback: "receive", //自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据    
        success: function(data) {  
            console.log(data)  
        },  
        error: function() {  
            alert(\'fail\');  
        }  
    });  
function receive(data){  
      
}

原生JS：

<!DOCTYPE html>
        <html>
          <head>
            <title></title>
            </head>
            <body>
                <script>
                 var receive = function (data) {
                    alert(\'您查到的信息：名字\' + data.name，年龄\' + data.age \');//调用已经得到的json格式的数据
                };
　　　　　　　　  　var script = document.createElement(\'script\');  
　　　　　　　　　　script.src = "http://192.168.2.229:8081/api/web_search_directnew.html";
　　　　　　　　　　//要向服务器请求的数据地址　　　　　　　　　　
　　　　　　　　　　document.getElementsByTagName(\'head\')[0].appendChild(script);//创建script标签，插入HTML中，用src跨域请求

　　　　　　　　　　/*document.body.insertBefore(script,document.body.firstChild);*/

 　　　　　　</script>
　　 　　</body> 
</html>

//后台就不写了

java后台代码:

[java]

def index() {  
        def a = [:]  
        a.name = "张小白"  
        a.age = 12  
        a.sex = \'男\'  
        a = a as JSON  
        render params.callback + "(\'" + a + "\')"  
    }

该协议的一个要点就是允许用户传递一个callback参数给服务端，然后服务端返回数据时会将这个callback参数作为函数名来包裹住json数据这样客户端就可以随意定制自己的函数来自动处理返回数据