• jsonp的简单实现


    首先jsonp和json和ajax都没有太大的关系,


    json是一种数据格式,AJAX主要依靠XMLHttpRequest对象向服务器发送请求,获取数据,

    而jsonp是开发者为了绕过同源策略而动态创建的一段js代码,

    首先我们来看一段代码

    <script src="json.txt"></script>

    json.txt里面的代码:

    alert(0)

    那么这段代码是否会执行,还是报错,答案是肯定的,会执行

    javascript文件的后缀不一定必须是.js可以是任意的,

    简单来说jsonp就是先声明一个函数,然后动态创建一段javascript代码然后执行它,

    先写一个简单的例子

    打开百度的官网,F12点击network

    输入123后打开最后一个结果

    网址应该是https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?json=1&cb=cbFun&wd=123

    其中cbFun就是回调函数

    我们写一个简答的实现

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>Document</title>
    </head>
    <body>
        <div id="container"></div>
        <script>
            function cbFun(data){
                document.getElementById('container').innerHTML=JSON.stringify(data);
            }
            var scriptElement=document.createElement('script');
            scriptElement.src='https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?json=1&cb=cbFun&wd=123';
            document.body.appendChild(scriptElement);
        </script>
    </body>
    </html>

    这样我们就简单的实现了jsonp

    结果如图

  • 相关阅读:
    Map集合的四种遍历
    java 请求 google translate
    Linux 内核初级管理
    Linux GRUB
    Linux 系统启动流程
    Linux 任务计划 crontab
    Linux 进程管理工具
    Linux sudo实作
    Linux 进程管理
    Linux 网络配置命令:ip、ss
  • 原文地址:https://www.cnblogs.com/shuaihan/p/7270499.html
Copyright © 2020-2023  润新知