zoukankan      html  css  js  c++  java
  • jsonp跨域请求的问题

    今天发现json取数据的时候有时会报如下的错误:

    No 'Access-Control-Allow-Origin' header is present on the requested resource. 

    我是有很多的子域名,网上说是跨域的的问题,貌似可以通过jsonp解决,于是测试了一下,遇到以下几个问题:

    1.jsonp好像是通过iframe创建<script>标签来执行请求的,所以默认是通过get方式请求,即使ajax请求的type设为post也被自动转为post,要想以post请求设置也比较麻烦,具体参考:http://stackoverflow.com/questions/3860111/how-to-make-a-jsonp-post-request-that-specifies-contenttype-with-jquery

    2.直接将函数放在document.ready闭包里,像下面的写法,不会走到receive函数里

    <script type="text/javascript">
    $(function() {
      //function viewWholePhone(url){
        $('#btn_show_num').click(function(){
        	$.ajax({
          type:"get",
            url:$(this).attr("data-check-url"),
            data:{sn:'{$sn}'},
            dataType: 'jsonp',  
            crossDomain: true,
            jsonp:"callback",
            jsonpCallback:"receive",
            success:function(ret){
            }
            });
        });
      //}
      function receive(ret) {  
        if(ret.status == 0 && ret.data!=null){
          $('#store_mobile').text(ret.data.store_mobile);
          $('#btn_show_num').hide();
        }else{
          if(ret.status == 300){
            location.href="{$site_url}/index.php?app=member&act=login&ret_url=";
          }else{
            alert(ret.msg);
            $('#btn_show_num').attr('readonly', 'true');
          }
        }
      } 
    });
    </script>
    

    下面这个样子是可以的

    <script type="text/javascript">
    function viewWholePhone(url){
      $.ajax({
    		  type:"POST",
          url:url,
          data:{sn:'{$sn}'},
          dataType: 'jsonp',  
          crossDomain: true,
          jsonp:"callback",
          jsonpCallback:"receive",
          success:function(ret){
          }
      });
    }
    function receive(ret) {  
      if(ret.status == 0 && ret.data!=null){
        $('#store_mobile').text(ret.data.store_mobile);
        $('#btn_show_num').hide();
      }else{
        if(ret.status == 300){
          location.href="{$site_url}/index.php?app=member&act=login&ret_url=";
        }else{
          alert(ret.msg);
          $('#btn_show_num').attr('readonly', 'true');
        }
      }
    } 
    </script>
    

      

      

  • 相关阅读:
    我的python之路5
    我的python之路4
    我的python之路3
    我的python之路2
    我的python之路1
    AJAX 表单提交 文件上传
    PBKDF2WithHmacSHA1算法
    Ant 随想
    maven 启蒙
    HELLO WORLD
  • 原文地址:https://www.cnblogs.com/jenqz/p/4460313.html
Copyright © 2011-2022 走看看