Axios & fetch api & Promise & POST
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的更多相关文章
- 基于Promise规范的fetch API的使用
基于Promise规范的fetch API的使用 fetch的使用 作用:fetch 这个API,是专门用来发起Ajax请求的: fetch 是由原生 JS 提供的 API ,专门用来取代 XHR 这 ...
- 使用Vue cli3搭建一个用Fetch Api的组件
系列参考 ,英文原文参考 我的git代码: https://github.com/chentianwei411/Typeahead 目标: 建立一个输入关键字得到相关列表的组件,用Vuejs2和Fet ...
- vue-d2admin-axios异步请求登录,先对比一下Jquery ajax, Axios, Fetch区别
先说一下对比吧 Jquery ajax, Axios, Fetch区别之我见 引言 前端技术真是一个发展飞快的领域,我三年前入职的时候只有原生XHR和Jquery ajax,我们还曾被JQuery 1 ...
- Fetch API与POST请求那些事
简述 相信不少前端开发童鞋与后端联调接口时,都会碰到前端明明已经传了参数,后端童鞋却说没有收到,尤其是post请求,遇到的非常多.本文以node.js作为服务端语言,借用express框架,简要分析客 ...
- (转)这个API很“迷人”——新的Fetch API
原文:https://hacks.mozilla.org/2015/03/this-api-is-so-fetching 原标题是This API is So Fetching,Fetching也可以 ...
- Ajax新玩法fetch API
目前 Web 异步应用都是基于 XMLHttpRequest/ActiveXObject (IE)实现的, 这些对象不是专门为资源获取而设计的,因而它们的 API 非常复杂,同时还需要开发者处理兼容性 ...
- 取消Fetch API请求
如今,Fetch API已经成为现在浏览器异步网络请求的标准方法,但Fetch也是有弊端的,比如: Fetch还没有方法终止一个请求,而且Fetch无法检测上传进度 现在我们可以通过 AbortCon ...
- Fetch API 接口参考
前言 Fetch API是新的ajax解决方案,用于解决古老的XHR对象不能实现的问题,Fetch API 提供了一个获取资源的接口(包括跨域请求),任何使用过 XMLHttpRequest 的人都能 ...
- fetch API 简单解读
http://f2e.souche.com/blog/fetch-api-jie-du/?utm_source=tuicool&utm_medium=referral 在我们日常的前端开发中, ...
随机推荐
- DECODE函数简介
在上一篇bolg中讲到ORACLE优化的时候提到DECODE()函数,以前自己用的也比较少,上网查了一下,还挺好用的一个函数,写下来希望对朋友们有帮助哈! https://www.cnblogs.co ...
- 变量类型 ROWID 和 UROWID
ROWID: ROWID为该表行的唯一标识,是一个伪列,这个伪列可以用SELECT查看,但是不可以用INSERT, UPDATE来修改,不可以用DELETE来删除. UROWID: ROWID可 ...
- git和svn的混用
服务器上的项目是使用svn进行管理的. 本来本地的项目也是通过svn进行管理的,但是后来使用svn的分支功能进行项目的测试/新功能等等时,总是会出现各种各样的问题,遂转投git. 因为git的分支机制 ...
- class 类 this指向的问题
ES6 实现了类的概念 class Prosen { } ES5使用函数模拟 function Prosen() { } ES6中的 class定义一个类, 其内部包含 constructor构造函数 ...
- Ansible学习 Playbooks_1
Playbooks是Ansible中执行较复杂任务的一种的方式,Playbook由1个或多个play组成,语法格式是YAML,下面以一个简单的任务为例,开始我们的Playbook学习: 任务描述: 1 ...
- 分析setup/hold电气特性从D触发器内部结构角度
上图是用与非门实现的D触发器的逻辑结构图,CP是时钟信号输入端,S和R分别是置位和清零信号,低有效; D是信号输入端,Q信号输出端; 这里先说一下D触发器实现的原理:(假设S和R信号均为高,不进行置位 ...
- Python的循环正确的操作使用方法详解
要计算1+2+3,我们可以直接写表达式: >>> 1 + 2 + 3 6 要计算1+2+3+...+10,勉强也能写出来. 但是,要计算1+2+3+...+10000,直接写表达式就 ...
- paramiko基本操作
paramiko 是一个用作远程控制的模块,它遵循SSH2协议,支持以加密和认证的方式来进行远程服务器的连接.操作.上传和下载. 官方文档地址:http://docs.paramiko.org/ pa ...
- python-12正则表达式
import re #re.search方法 re.search 扫描整个字符串并返回第一个成功的匹配. re.match('com', 'www.runoob.com') #匹配失败 None re ...
- Smail 中的一些点
smali中所有操作都需要经过寄存器, 本地寄存器以v开头, 参数寄存器以p开头, 非static方法中p0是this 没有-object后缀的操作指令表示操作的对象是基本类型 invoke-dire ...