替代ajax的Fetch使用

最近参与同事的项目，是用fetch请求数据的，刚开始觉得和ajax请求差不多，结合第三方的类库使用就和使用jquery中的ajax请求数据差不多了，但是，实际使用时还是出现了一点点问题，主要是我最开始在自己测试使用时出现了跨域的问题，我们开发中引入的是whatwg-fetch这个库，基本使用不难，一般情况下入下：
以情请求返回的是json数据格式为例:

fetch("请求的URL"，{// 这个对象是请求的配置信息
        method: 'GET', 
        credientials： "include" ，
        mode: 'no-cors'，
        headers: { // 这个对象主要设置请求头的一些信息，例如：content-type、Content-Length、X-Custom-Header等 }，
        body： 请求的数据（即常用ajax请求部分的data）
}).then(res => res.json()).then(res => res)

①method：请求的方式GET/POST/.....等等

②credentials：一般设置fetch默认请求时是不能发送和接收cookie的若是要带上cookie，须在请求时配置credential，加上credentials: 'same-origin'，若是CORS请求（注cors请求默认不发送cookie和http认证信息），则要添加credentials:include

③mode：mode属性用来决定是否允许跨域请求，以及哪些response属性可读。可选的mode属性值为same-origin，no-cors以及cors。
    same-origin: 同源，若是请求跨域则直接进入error;
    no-cors: 永许来自其他域的图片、CDN脚本以及其他一些跨域资源，但是请求方式（method）必须是      HEAD/GET/POST中的一种；最重要的一点是：js不能访问Response中的任何属性，这保证了              serviceWorkers不会导致任何跨域情况下安全问题而泄露隐私。
    cors:通常用来跨域请求来获取第三方的api数据，这个模式遵CORS协议。但是这种模式下Response对     象只能取道部分headers里面的属性。

    着重说明：前面我所说的我用fetch测试时遇到的其中一个问题就是我用第三方的api取数据时，请求的数据返回来了，但是response里面取不到，一直报response.json()错误，引起这个的原因就是我将mode设置成no-cors了，其次CORS跨域还需要后端的支持，服务器要开启跨域访问（我用的是第三方的api没法去设置别人的服务器永许跨域）。报错的图片如下，供参考：

④headers：这部分主要设置请求头的一些参数。

⑤请求返回的是个一个promise对象，所以是then连写。

       fetch与我们通常的ajax请求的不同点是，哪怕请求出问题返回405或者500，请求都不会进入reject，还是会进入resolve，只有在网络出现问题或者某些原因阻止了请求的发送的情况下才会进入reject。