A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 刘宝 初级黑马   /  2019-5-31 13:10  /  724 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

jsonp的一个总体理念:
        客户端让服务器返回数据的同时,
        并告诉服务器,要调用哪个函数,
        服务器就返回调用该函数的形式,并且数据作为该函数调用的参数

可以理解为:服务器最终就是返回一条js函数调用语句,类似如下:
        xxx函数(数据);

具体代码:
        客户端写法(jQuery)
        $.ajax({
                url : 请求地址,
                data: 请求时要发送的数据,
                dataType: "jsonp",
                //成功后要做的事
                success : function(){ .... }
        })
        客户端写法(原生js)
        function test( data ){
                console.log(data);//处理数据
        }
        var script = document.createElement("script");
        script.src = "xxx.php?callback=test";
        document.body.append(script);
        服务器端:
        <?php
                $callback = $_GET['callback'];
                $arr = array(....);        //数据
                $data = json_encode($arr);
                echo $callback . "(" . $data . ")";
        ?>
       
       
XMLHttpRequest 2.0中的新特性:
1)超时特性:
    xhr.timeout = 2000;        //设置超时时间(毫秒)
    //如果超时了,怎么处理
    xhr.ontimeout = function(){ ... }

2)FormData对象:用于一次性收集form表单数据
    var formObj = document.querySelector("form表单");
    var formData = new FormData(formObj);
    //然后直接作为xhr的send参数:
    xhr.send( formData );
    细节:
        2.1)xhr此时只能是post请求
        2.2)xhr此时无需设置请求头
        2.3)FormData还可以追加数据,形式为:
             formData.append('key', "value");
   

3)监听文件上传进度:
    xhr.upload.onprogress = function(e){
        var current = e.loaded;        //已上传 的 数据大小
        var total = e.total;        //要上传的总数据大小
        //然后就可以去根据这两个数据设定进度条的表现了
    }
提示:
        测试大文件,需要去php.in中修改以下两个配置:
        post_max_size,  upload_max_filesize




0 个回复

您需要登录后才可以回帖 登录 | 加入黑马