zoukankan      html  css  js  c++  java
  • ajax跨域请求的处理

    跨域的情形有很多种,网上有人给出了一份表格,

    表格中标识为”不允许”通信的情况都属于跨域。实际网络服务中需要跨域的情况确实存在,于是开发者们提供了一种解决方案,就是使用jsonp格式进行数据交互,它不是标准的json格式,而是形如”callback(json)”的格式,这样在使用ajax跨域请求的时候就需要对后台的返回值做一下处理,不能返回json数据了。

    不跨域时的ajax请求一般是:

    $.ajax({

                  type: 'POST',               

                    url: "getData.do", 

                    dataType:'json',

                    data:{id:id },

                    async:true, 

                   success: function (data) {                        

                     $.messager.alert('OOOOPS','请求成功!','info');                                                         

                    },             

                   error: function (XMLHttpRequest, textStatus, errorThrown) {        

                          //请求失败处理函数    

                        // alert(XMLHttpRequest.status);//404

                       // alert(XMLHttpRequest.readyState);//4

                       // alert(textStatus);         //error

                     $.messager.alert('TIPS',textStatus,'info');

                    }

                  }); 

    如果是跨域的请求,这个ajax就要改写成这样:

    $.ajax({

                  type: 'POST',               

                   url: "getData.do", 

                    dataType:'jsonp',

                    jsonp:'callback',

                   data:{id:id },

                    async:true, 

                   success: function (data) {                        

                    $.messager.alert('OOOOPS','请求成功!','info');                                                        

                    },             

                   error: function (XMLHttpRequest, textStatus, errorThrown) {              

                          //请求失败处理函数    

                        // alert(XMLHttpRequest.status);//404

                       // alert(XMLHttpRequest.readyState);//4

                       // alert(textStatus);         //error

                     $.messager.alert('TIPS',textStatus,'info');

                    }

                  });      

    那么后台方法的接口也要做相应的修改,因为多了个参数jsonp啊!

     @RequestMapping("getData")

     @ResponseBody

    public String queryData(HttpServletRequest request,String id) {   

    String callback = request.getParameter("callback");//接收ajax传递的jsonp参数

    //中间数据处理的代码段

    String res = callback+"({'sucess':'true'})";

                 return res;   //返回值给ajax回调函数

    }

  • 相关阅读:
    nginx error_log报错upstream timed out (110: Connection timed out)
    ubuntu12.04 nginx添加ssl认证
    TP5.0:同一个控制器访问不同方法
    TP5.0:的安装与配置
    html常用的小技能
    详情介绍win7:编辑文件夹时提示操作无法完成,因为其中的文件夹或文件已在另一个程序中打开的解决过程
    详细讲解:通过phpstudy 设置站点域名、站点域名管理
    tp3.2.3自定义全局函数的使用
    详细讲解:tp3.2.3生成验证码并进行验证(ajax校验返回及自定义返回)
    WPS去掉英语单词下面的红斜线
  • 原文地址:https://www.cnblogs.com/tulpen/p/8093571.html
Copyright © 2011-2022 走看看