Javascript

jsonp通过JS源码实现和jquery实现!

本文主要是介绍jsonp通过JS源码实现和jquery实现!,对大家解决编程问题具有一定的参考价值,需要的程序猿们随着小编来一起学习吧!

 jsonp的源码其实不难,大概可以分为这么几步首先写个函数,然后动态创建script标签,然后赋值src属性,再将script标签添加到body里面。最后写个加载事件将地址传到函数里面即可!不知道大家发现没有,这个jsonp和ajax没有一点关系,它是通过src属性去请求响应。

    <script>
        // 回调函数
        // function run(a){
        //     console.log(a);
        // }
        // function addScript(src) {
        //     // 动态创建script标签
        //     const script = document.createElement('script');
        //     // 将传过来的src属性赋值给script的src属性
        //     script.src = src;
        //     // 将script标签添加到body里面
        //     document.body.appendChild(script);
        // }
        // window.onload = function(){
        //     // 传入src地址
        //     addScript("http://127.0.0.1:7777/1010/01.php?callback=run");
        // }
    </script>

下面就是在jquery中使用jsonp实现跨域的操作!这里大家需要注意的是success回调函数。

    <script>
        // 在jquery中使用jsonp实现跨域
        $.ajax({
            type: "get",//默认通过get方式传参
            dataType: "jsonp",
            jsonp: "qwe",//修改回调函数的名称
            url: "http://127.0.0.1:7777/1010/01.php",
            // 回调函数
            success: function (a) {
                console.log(a); 
                // console.log(JSON.parse(a))
            }
        })
    </script>

 

这篇关于jsonp通过JS源码实现和jquery实现!的文章就介绍到这儿,希望我们推荐的文章对大家有所帮助,也希望大家多多支持为之网!