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

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 荔鹿小姐 初级黑马   /  2019-6-6 08:52  /  1089 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

【发送请求】
同源:var xhr = new XMLHttpRequest();
1、收集表单数据使用时手动拼接;
2、通过FormData来收集:var myform = document.querySelecter("表单");
var formdata = new FormData(myform);这种方法只适用于post请求,并且不用设置请求头;
❤:事件监听:xhr.upload.onprogress=function(e){};可以打印一下e看下有些啥子属性;
可以进行追加表单中没有的表单formdata.append("键","值");
3、jQuery里面的表单序列化方法:元素.serialize();
不同源:跨域请求:script及img的src天然跨域和 jsonp
❤:jsonp原理:借用script的src属性天然的跨域来实现发送跨域请求;
function test(result){
            console.log(result);
        }
        // 定义自己的ajax
        var $ ={
            ajax:function(option){
                var url = option.url;
                var callback = option.callback;
                var dataType = option.dataType;
                // 当dataType为jsonp的时候我们需要发起一个跨域请求
                if(dataType == "jsonp"){
                    // 1.创建一个script标签
                    var script = document.createElement("script");
                    // 2.为script标签设置src属性,同时在src中传入之后需要挨靠的函数名称
                    script.src = url +"?callback="+callback;
                    // 3.将生成的script标签添加到页面结构中
                    document.body.appendChild(script);
                } }  };
        // 我也希望通过$.ajax的方式发送请求,当我传入dataType:jsonp的时候,希望能够发送一个跨域请求
        $.ajax({
            type:'get',
            url:'http://day8.com/corss.php',
            callback:'test',
            dataType:"jsonp"
        });
❤在$.ajax添加一个 dataType:"jsonp"用于区分是同源请求和跨域请求
【允许跨域请求】
服务端设定:header("Access-Control-Allow-Orign:*(或者一个url)");
客户端设定:jsonp请求:使用script的src属性天然的跨域特性;<script src="xx.php?callback=test">;

0 个回复

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