fetch() does the same thing as XHR, but fetch return a promise.

fetch('password.txt', {
'method': 'PUT',
'headers': {
'X-Something-nothing': 'fetch rocks!'
}
}).then( response => {
if(response.status === ){
return response.text()
}else{
throw "Cannot fetch data"
}
}).then( data => {
console.log(data);
}).catch( err => {
console.error(err)
})

Check the reponse API here: Link

Besides text(), you can use json() or blob().

'no-cors' and opaque responses

If I request //google.com from this site using XHR or plain fetch it will fail. This is because it's a CORS request and the response doesn't have CORS headers.

However, with fetch, you can make a no-cors request:

fetch('//google.com', {
mode: 'no-cors'
}).then(function(response) {
console.log(response.type); // "opaque"
});

More

[Javascript] Fetch API的更多相关文章

  1. (转)这个API很“迷人”——新的Fetch API

    原文:https://hacks.mozilla.org/2015/03/this-api-is-so-fetching 原标题是This API is So Fetching,Fetching也可以 ...

  2. JavaScript Promise API

    同步编程通常来说易于调试和维护,然而,异步编程通常能获得更好的性能和更大的灵活性.异步的最大特点是无需等待."Promises"渐渐成为JavaScript里最重要的一部分,大量的 ...

  3. 【译】JavaScript Promise API

    原文地址:JavaScript Promise API 在 JavaScript 中,同步的代码更容易书写和 debug,但是有时候出于性能考虑,我们会写一些异步的代码(代替同步代码).思考这样一个场 ...

  4. 使用Vue cli3搭建一个用Fetch Api的组件

    系列参考 ,英文原文参考 我的git代码: https://github.com/chentianwei411/Typeahead 目标: 建立一个输入关键字得到相关列表的组件,用Vuejs2和Fet ...

  5. Cross-origin resource sharing JSON with Padding 同源策略 JSONP 为什么form表单提交没有跨域问题,但ajax提交有跨域问题? XMLHttpRequest and the Fetch API follow the same-origin policy 预检请求(preflight request)

    https://zh.wikipedia.org/wiki/跨来源资源共享 跨来源资源共享(CORS)是一份浏览器技术的规范,提供了 Web 服务从不同域传来沙盒脚本的方法,以避开浏览器的同源策略[1 ...

  6. Axios & fetch api & Promise & POST

    Axios & fetch api & Promise & POST https://github.com/axios/axios https://appdividend.co ...

  7. fetch API 简单解读

    http://f2e.souche.com/blog/fetch-api-jie-du/?utm_source=tuicool&utm_medium=referral 在我们日常的前端开发中, ...

  8. ES6 Fetch API HTTP请求实用指南

    本次将介绍如何使用Fetch API(ES6 +)对REST API的 HTTP请求,还有一些示例提供给大家便于大家理解. 注意:所有示例均在带有箭头功能的 ES6中给出. 当前的Web /移动应用程 ...

  9. 了解 Fetch API与Fetch+Async/await

    背景 提及前端与服务器端的异步通信,离不开 Ajax (Asynchronous JavaScript and XML).实际上我们常说的 Ajax 并非指某一项具体的技术,它主要是基于用脚本操作 H ...

随机推荐

  1. ANDROID_MARS学习笔记_S01原始版_002_实现计算乘积及menu应用

    一.代码 1.xml(1)activity_main.xml <RelativeLayout xmlns:android="http://schemas.android.com/apk ...

  2. [译]GotW #3: Using the Standard Library (or, Temporaries Revisited)

    高效的代码重用是良好的软件工程中重要的一部分.为了演示如何更好地通过使用标准库算法而不是手工编写,我们再次考虑先前的问题.演示通过简单利用标准库中已有的算法来避免的一些问题. Problem JG Q ...

  3. java数组或集合返回空的问题

    在有返回值的情况下,平时我写代码基本遇到错误什么都是返回null,我因为我觉得把数组或集合这个初始化占空间. 但是我发现这样在每次客户段调用都要进行非空判断,而且有时调用内置api还容易报错误,于是解 ...

  4. C#的同步和异步调用方法

    同步和异步大家都明白什么意思,在这里不多介绍了. namespace ConsoleTest { class Program { static void Main(string[] args) { C ...

  5. ☀【jQuery 优化】jQuery基础教程(第3版)

    jQuery代码优化:选择符篇 √ http://www.ituring.com.cn/article/377 jQuery代码优化:遍历篇 √ http://www.ituring.com.cn/a ...

  6. [Android] An internal error occurred during: "Launching New_configuration". Path for project must have only one segment.

    出错: An internal error occurred during: "Launching New_configuration". Path for project mus ...

  7. 关于ButterKnife 8.1.0使用遇到的问题

    ButterKnife注解方式 和eventbus 差不多 都很好用 @OnClick(R.id.button) void onButtonClick() { //TODO implement Toa ...

  8. c#打印机设置,取得打印机列表及相应打印机的所有纸张格式

    using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...

  9. linux系统利用yum安装其他软件或服务

    1.下载yum的配置源(最好用网易163的源,也可以使其他的源) wget http://docs.linuxtone.org/soft/lemp/CentOS-Base.repo 下载到 /etc/ ...

  10. 最近用unity5弄的一些渲染

    unity5 人皮渲染  Skin Shading 换了一种方法,优化了一下代码,unity5效果很好,消耗不大 点开可查看大图 加入了次表面散射的阴影与自阴影 unity5  ocean real- ...