1.碰到过跨域问题吗，个别跨域问题是怎么解决的？

浏览器都有一个“同源策略”限度，限度了ajax的申请同源策略：示意申请的协定，域名，端口号雷同，就是同源，ajax只能拜访同源的申请。

同源策略的限度：

  1. ajax只能申请同源的地址
  2. js只能获取同源的cookie及本地存储
  3. js只能操作同源的dom

同源策略的限度，使网络之间互相拜访的安全性失去了进步。

办法一：jsonp跨域

原理：尽管同源策略限度了ajax的跨域申请，然而并没有限度标签上的src 和href拜访不同域下的资源，jsonp就是利用了这一点。

1.  $.ajax({    2.      url: "http://www.kugou.com/yy/index.php?r=play/getdata&_=1497972864535",    3.      dataType: 'jsonp',    //设置dataType为jsonp    4.      data:{hash: "ECB956D9AD23EC123617F63EC6E90A7F",album_id:"1008922"},   //url前面的参数    5.      success: function (data) {    6.          console.log(data);    7.      }    8.  });

办法二： 批改响应头

Cross-Origin Resource Sharing（CORS）跨域资源共享是一份浏览器技术的标准，与 JSONP 不同，CORS 除了 GET 要求办法以外也反对其余的 HTTP 要求。服务器个别须要减少如下响应头的一种或几种：

1.  //设置跨域拜访的中间件    2.  router.all('*', function(req, res, next) {    3.    res.header("Access-Control-Allow-Origin", "*"); //容许所有的外来地址 都能够拜访    4.    res.header("Access-Control-Allow-Headers", "X-Requested-With");//查看是不是ajax拜访    5.    res.header("Access-Control-Allow-Methods", "POST,GET");//容许申请的办法是post 和get    6.    res.header("Content-Type", "application/json;charset=utf-8");//设置响应的头部    7.    next();    8.  });

除此之外还有：window.name+iframe的形式， window.postMessage()的办法，批改document.domain跨子域等办法。

2.平时都接触过哪些ajax提交形式，个别什么时候用什么解决形式？

  • get  个别用于获取数据的时候
  • post  用于创立数据的时候
  • put  用于批改数据（不严格的时候也能够不必）
  • delete  用于删除数据

3.如何用原生ajax上传图片和文件，个别做下载/上传进度条是怎么做的？**

html局部

1.  <form action="">    2.          <label for="">    3.              姓名: <input type="text" name="name">    4.          </label>    5.          <label for="">    6.              文件：<input id="file" type="file" name="file">    7.          </label>    8.          <label for="">    9.              <input type="button" value="保留">    10.          </label>    11.  </form>    12.  <script>    13.  var btn = document.querySelector('[type=button]');    14.  btn.onclick = function () {    15.      // 文件元素    16.      var file = document.querySelector('[type=file]');    17.      // 通过FormData将文件转成二进制数据    18.      var formData = new FormData();    19.      // 将文件转二进制    20.      *****留神2******    21.      formData.append('upload', file.files[0]);    22.      *****留神1******    23.      var xhr = new XMLHttpRequest;    24.      xhr.open('post', 'file.php');    25.      // 监听上传进度    26.      xhr.upload.onprogress = function (ev) {    27.      // 事件对象    28.      // console.log(ev);    29.          var percent = (ev.loaded / ev.total) * 100 + '%';    30.          console.log(percent);    31.          progress.style.width = percent;    32.      }    34.      xhr.send(formData);    36.      xhr.onreadystatechange = function () {    37.              if(xhr.readyState == 4 && xhr.status == 200) {    38.                      //胜利时执行的代码    39.              }    40.      }    41.  }    42.  </script>

 留神一：应用jQuery的ajax，必须设置这两项：processData: false, contentType: false 为false。

1.  $.ajax({    2.      url: 'file.php',    3.      type: 'POST',    4.      data: formdata,                    // 上传formdata封装的数据    5.      dataType: 'JSON',    6.      cache: false,                      // 不缓存    7.      processData: false,                // 必须false，jQuery不要去解决发送的数据    8.      contentType: false,                // 必须false，jQuery不要去设置Content-Type申请头    9.      success:function (data) {          // 胜利回调    10.          console.log(data);    11.      }    12.  });

留神二：new FormData的参数是一个DOM对象，而非jQuery对象

var formData = new FormData($("#file")[0]);

参考：https://segmentfault.com/a/1190000012327982#articleHeader2

还有jQuery中ajax上传的进度条，能够参考：https://blog.csdn.net/github_37373329/article/details/79270373