Ajax的Post跨域请求

什么是跨域请求
同协议,同ip,同端口视为一个域,两个域之间互相访问就是跨域访问请求。
根据浏览器的同源策略,一个域中的脚本只具有访问本域资源的权限,无法访问其他域的资源。
如果域中的ajax直接访问另一个域的资源就会有问题,这就是我们说的js跨域请求问题

跨域请求的cors解决方案
跨域请求域有两种常用解决方案,jsonp和cors,
因为jsonp只能解决get请求问题,所以这里只介绍cors方法。

前端

    var loginReqbody = {
            "id" : username,
            "password" : password
        };
    $.ajax({
            url : "http://192.168.X.X:8081/XX/login",
            type : "POST",
            async : false,
            data : JSON.stringify(loginReqbody),
            //如果写了这句,还是会报跨域错误。可以在后台加上响应体头部content-type
            //contentType:"application/json",
            error : function() {
                alert("An error has occurred!");
            },
            success : function(data) {
                if (data.errCode == 0) {
                    console.log(data.result.loginToken);
                } else
                    alert(data.errMsg);
            }
        });

后台(响应体添加相应头部)

    response.setHeader( "Access-Control-Allow-Headers","Origin, X-Requested-With, Content-Type, Accept");//
    response.addHeader( "Access-Control-Allow-Origin", "*" ); //可以访问此域资源的域。*为所有
    response.addHeader( "Access-Control-Allow-Methods", "POST" ); //可以访问此域的脚本方法类型
    response.addHeader( "Access-Control-Max-Age", "1000" ); //

更多推荐

Ajax的Post跨域请求