zoukankan      html  css  js  c++  java
  • jsonp实现跨域请求

    直接用原生ajax请求另一个域的资源,会被同源策略限制,而用<script src="url"></script>这种方式“引入url”,实际上引入了一个js代码,就不会被同源策略限制,可以请求到。

    用这个有一个前提就是对方网站后台的返回确实设置了js代码块或者某个callback函数,所以这种请求方式是有特定应用场景的,并不是跨域都能用这种。

    1. javascript方式

        <script>
            function getContent() {
                /* 原生ajax会被同源限制
                var xhr = new XMLHttpRequest();
                xhr.open('GET','http://weatherapi.market.xiaomi.com/wtr-v2/weather?cityId=101121301');
    
                xhr.onreadystatechange = function () {
                  console.log(xhr.responseText);
                };
                xhr.send();
                
                var tag = document.createElement('script');
               tag.src = 'http://weatherapi.market.xiaomi.com/wtr-v2/weather?cityId=101121301';#}
               document.head.appendChild(tag);
           document.head.removeChild(tag);
            }
            
            /* 回调函数,这个得看api的写法,有的是动态的,有的是写死的。 */
            function list(arg) {
                console.log(arg)
            }
        </script>
    

    2. jquery ajax

    用这种<script src>引入的方式的话,是不用发POST请求的,因为ajax如下的配置实际上就做了如上的事,也是封装了引入方式,所以最终ajax写POST请求会变为GET请求发送。

    $.ajax({
           url:'http://weatherapi.market.xiaomi.com/wtr-v2/weather?cityId=101121301',
        //这儿写GET,POST都一样,最后都发的是GET请求。
           type:'POST',
           dataType:'jsonp',
           jsonp:'callback',
           jsonpCallback:'list',
    })    
  • 相关阅读:
    Maccms后门分析复现(并非官网的Maccms){10.15 第二十二天}
    BurpSuite详解
    java数据类型转换
    java常用关键字(static、final、this、super)
    工厂设计模式
    java singleton(单例设计模式)
    完成一个springboot项目的完整总结------三
    完成一个springboot项目的完整总结-------二
    完成一个springboot项目的完整总结一
    ER图的构建
  • 原文地址:https://www.cnblogs.com/NoYone/p/8270831.html
Copyright © 2011-2022 走看看