zoukankan      html  css  js  c++  java
  • 使用Javascript的JSONP原理

    jQuery的JSONP的方法

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <!--类型:请求方式GET / POST
        网址:请求地址
        async:布尔类型,默认为true表示请求是否为异步,如果为false表示为同步。
        数据类型:返回的数据类型
        JSONP:传递给请求处理程序或页面的,用以获得JSONP回调函数名的参数名(一般默认为:回调)
        jsonpCallback: “?” 自定义的JSONP回调函数名称,默认为jQuery的自动生成的随机函数名,也可以写,jQuery的会自动为你处理数据
        成功:调用成功执行的函数
        错误:异常处理函数-->
        <body>
        </body>
        <script type="text/javascript">
            $.ajax({
                url:'index.php',
                type:'get',
                dataType:'jsonp',
                //jsonp:'JSON_CALLBACK',
                jsonpCallback:'JSON_CALLBACK',
                success:function(data){
                    console.log(data)
                }
            })
        </script>
    </html>

    原生jsonp方法

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <!--首先JSON是一种基于文本的数据交换方式,叫做或者描述数据格式-->
        <!--当一个|网页在请求的JavaScript文件时则不受是否跨域的影响,凡是拥有” SRC”这个属性的标签都拥有跨域的能力,-->
        <!--比如<script>、<img>、<iframe>-->
        <!--所以我们这里运用了脚本标签的跨域能力,让它用一个回调函数包裹着一段JSON格式的数据,-->
        <!--当该数据返回到前端页面的时候,再我们这个执行就函数可以把数据读取出来-->
        <!--前端代码-->
        <!--jsonp.html-->
        <body>
            <button onclick="jsonpServer('jsonp.php')">JSONP</button>
        </body>
        <script>
            function jsonpServer(url) {
                var script = document.createElement("script");
                script.setAttribute("type", "text/javascript");
                script.setAttribute("src", url);
                document.body.appendChild(script);
            }   
            function JSON_CALLBACK(data) {
                console.log(data);
            }
        </script>
    </html>
  • 相关阅读:
    cogs 2507 零食店
    动态规划练习们~
    codevs 访问艺术馆
    搜索练习 (主要练剪枝23333)
    codevs 3119 高精度练习之大整数开根 (各种高精+压位)
    EntityFramework 两个参数连续(中间有空格)问题
    Mysql DELETE 不能使用别名? 是我不会用!
    MySQL 空间数据 简单操作
    C# String 字符拼接测试(“+”、string.Format、StringBuilder 比较)
    EntityFramework 事物引发的问题
  • 原文地址:https://www.cnblogs.com/LLX8/p/9212179.html
Copyright © 2011-2022 走看看