Axios & fetch api & Promise & POST

https://github.com/axios/axios

https://appdividend.com/2018/02/20/vue-js-axios-tutorial/#Vue_js_Axios_Post_Example

http://codeheaven.io/how-to-use-axios-as-your-http-client/


$ npm i -S axios

bug


mounted() {
console.log(`fetch data after mounted lifecycle!`);
// let url = "http://localhost:8888/preview-user";
// let url = "./preview-user.js";
// let url = "./preview-user.json";
let url = "http://10.1.5.202/es6-test/axios/preview-user.json";
Axios.get(url)
// .then(res => res.json())
.then((res) => {
let {
data: json
} = res;
console.log(`json =`, json);
console.log(`json.data =`, json.data);
// console.log(`res.data.data =`, res.data.data);
// console.log(`res =`, res);
// console.log(`res.message =`, res.message);
// console.log(`res.data.length =`, res.data.length, JSON.stringify(res.data[0], null, 4));
});
},

Axios & Fetch

https://stackoverflow.com/questions/40844297/what-is-difference-between-axios-and-fetch

https://medium.com/@thejasonfile/fetch-vs-axios-js-for-making-http-requests-2b261cdd3af5

https://css-tricks.com/using-data-in-react-with-the-fetch-api-and-axios/


vue & mounted

https://stackoverflow.com/questions/32413905/initializing-vue-data-with-ajax/32443886#32443886

vue & created

https://stackoverflow.com/questions/47635503/fetch-data-with-vue-from-web-api


Ajax

Asynchronous JavaScript And XML

https://en.wikipedia.org/wiki/Ajax_(programming)

pagination


let table = new Uint8Array(100).map((item, i) => (item = i)); table.slice(0, 50);
table.slice(1*50, 1*50 + 50);

shit aliyun



fetch(url, {
body: `nickname=xxxxx&_csrf_token=MD2ToUvQZ-3fk-g-gxczDhwiptfdRBnA57isO7wjBSE`,
cache: "no-cache",
credentials: "same-origin",
// credentials: "include",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
method: "POST",
mode: "cors",
redirect: "follow",
referrer: "no-referrer",
})
.then(res => res.json())
.then(json => {
// json
console.log(`json =`, JSON.stringify(json, null, 4));
return json;
})
.catch(err => console.error(`error =`, err));

shit aliyun


fetch(url, {
body: `nickname=xxxxx&_csrf_token=MD2ToUvQZ-3fk-g-gxczDhwiptfdRBnA57isO7wjBSE`,
cache: "no-cache",
credentials: "same-origin",
// credentials: "include",
headers: {
"Content-Type": "application/x-www-form-urlencoded",
},
method: "POST",
mode: "cors",
redirect: "follow",
referrer: "no-referrer",
})
.then(res => res.json())
.then(json => {
// json
console.log(`json =`, JSON.stringify(json, null, 4));
return json;
})
.catch(err => console.error(`error =`, err));

Axios & fetch api & Promise & POST的更多相关文章

  1. 基于Promise规范的fetch API的使用

    基于Promise规范的fetch API的使用 fetch的使用 作用:fetch 这个API,是专门用来发起Ajax请求的: fetch 是由原生 JS 提供的 API ,专门用来取代 XHR 这 ...

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

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

  3. vue-d2admin-axios异步请求登录,先对比一下Jquery ajax, Axios, Fetch区别

    先说一下对比吧 Jquery ajax, Axios, Fetch区别之我见 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被JQuery 1 ...

  4. Fetch API与POST请求那些事

    简述 相信不少前端开发童鞋与后端联调接口时,都会碰到前端明明已经传了参数,后端童鞋却说没有收到,尤其是post请求,遇到的非常多.本文以node.js作为服务端语言,借用express框架,简要分析客 ...

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

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

  6. Ajax新玩法fetch API

    目前 Web 异步应用都是基于 XMLHttpRequest/ActiveXObject (IE)实现的, 这些对象不是专门为资源获取而设计的,因而它们的 API 非常复杂,同时还需要开发者处理兼容性 ...

  7. 取消Fetch API请求

    如今,Fetch API已经成为现在浏览器异步网络请求的标准方法,但Fetch也是有弊端的,比如: Fetch还没有方法终止一个请求,而且Fetch无法检测上传进度 现在我们可以通过 AbortCon ...

  8. Fetch API 接口参考

    前言 Fetch API是新的ajax解决方案,用于解决古老的XHR对象不能实现的问题,Fetch API 提供了一个获取资源的接口(包括跨域请求),任何使用过 XMLHttpRequest 的人都能 ...

  9. fetch API 简单解读

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

随机推荐

  1. Python 初始—(多级字典)

    字典中 嵌套字典 如同json 对象, data={ "msg":{ “xxx.com”:["a","b"] } } data.values ...

  2. lnmp安装后,phpmyadmin空白

    使用lnmp 一键安装后,运行phpinfo是没有问题的,说明php没有问题,但是运行phpmyadmin确实一片空白,网上说的解决方案有几种: 1.config.inc.php增加一个配置$cfg[ ...

  3. 在haoodp-2.7.3 HA的基础上安装Hbase HA

    前提安装好hadoop基于QJM的高可用 node1 HMaster node2 HMaster.HRegionServer node3 HRegionServer node4 HRegionServ ...

  4. struts2属性驱动模型

    属性驱动模型的作用: 因为struts2与servlet API 实现了解耦,无法直接使用HttpServlet Request对象获取表单提交的参数,但Struts2提供了属性驱动模型机制来解决这个 ...

  5. js常用的2中排序方法:冒泡排序和快速排序

    冒泡排序:例如9 4 5 6 8 3 2 7 10 1 首先:9和4比较  4放前   4 9 5 6 8 3 2 7 10 1 4和5比较   4不动   4 9 5 6 8 3 2 7 10 1 ...

  6. asp.net高并发网站解决方案【未完成版本】

    场景:假设现在是一个电商网站,今天要举办活动,有10个商品低价销售,但是会来抢购的人会特别多,最后只有十个人可以成功的买到商品   明确2个问题 1.访问量:抢票时间断用户访问量 2.并发:1秒内请求 ...

  7. 【CSS】多行溢出显示省略号

    display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3;//超出三行隐藏 overflow: hidden; ...

  8. PyCharm 的安装与入门操作

    PyCharm是一种Python IDE,带有一整套可以帮助用户在使用Python语言开发时提高其效率的工具,比如调试.语法高亮.Project管理.代码跳转.智能提示.自动完成.单元测试.版本控制. ...

  9. C——可变参数

    1.要学可变参数,需要先了解C编译器对栈的管理 做个实验可以得到 #include <stdio.h> void func(int a, char b, int c, int d) { i ...

  10. 宁夏邀请赛F FLOYD

    Moving On Firdaws and Fatinah are living in a country with nn cities, numbered from 11 to nn.Each ci ...