axios 简单常用笔记
2024-10-19 04:32:16
简单认知：
1、config.data是POST参数，config.params是GET参数
axios(url, [config]) + qs + application/x-www-form-urlencoded
https://github.com/axios/axios#axioscreateconfig
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- Vue -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.5.16/vue.min.js"></script>
<!-- jquery -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script> <script src="https://cdn.bootcss.com/qs/6.5.2/qs.min.js"></script>
<style>
html, body{
margin: 0;
padding: 0;
} #app { }
</style>
</head> <body>
<div id="app"></div>
</body>
<script> axios('http://120.77.146.174:84/api/admin/user/sysUser/login', {
method: 'POST',
headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'},
data: Qs.stringify({
userAccount: 'dgeduc-b',
userPwd: '123456',
type: 'account',
}),
}).then(response => {
console.log(20181203100805, response)
// return response.json()
})
</script>
</html>
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/axios/0.18.0/axios.min.js"></script>
</head> <body>
<div id="app"></div>
</body>
<script> /**
* get 请求
*/
axios.get('http://192.168.31.97/index.php?a=123').then(response => {
console.log(20181021221522, response)
}) /**
* post application/x-www-form-urlencoded;charset=utf-8
* https://github.com/axios/axios#browser
* 推荐使用 qs：
* $ cnpm install qs
* const params = qs.stringify({ 'a': 123 })
*/
const params = new URLSearchParams();
params.append('a', '123');
axios.post('http://192.168.31.97/index.php', params, {
headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'}
}).then(response => {
console.log(20181021221338, response)
}) /**
* post application/json;charset=utf-8
*/
axios.post('http://192.168.31.97/index.php', {a: 123}).then(response => {
console.log(20181021221338, response)
}) // ajax（默认是application/json;charset=utf-8）
axios({
method: 'post',
url: 'http://192.168.31.97/index.php',
data: {
firstName: 'Fred',
lastName: 'Flintstone'
}
}).then(response => {
console.log(20181021225057, response)
}) // ajax（指定为application/x-www-form-urlencoded;charset=utf-8）
const params2 = new URLSearchParams();
params2.append('firstName', 'Fred');
params2.append('lastName', 'Flintstone');
axios({
method: 'post',
url: 'http://192.168.31.97/index.php',
data: params2,
headers: {'Content-Type': 'application/x-www-form-urlencoded;charset=utf-8'},
}).then(response => {
console.log(20181021225057, response)
})
</script>
</html>
index.php
<?php
header('Access-Control-Allow-Origin:*');
header('Access-Control-Allow-Headers:x-requested-with,content-type');
// post（form） 和 get请求
var_dump($_REQUEST);
// application/json;charset=utf-8 的数据必须这样使用
var_dump($GLOBALS['HTTP_RAW_POST_DATA']);
最新文章
- Leetcode: Sentence Screen Fitting
- kubernetes听云实战发布版
- Lingo 做线性规划 - DEA
- php模拟多线程
- Java连接MySQL数据库及简单操作代码
- Scut：脚本引擎
- Android应用程序资源的查找过程分析
- oracle存储过程+游标处理select数据
- Spring学习笔记2——创建Product对象，并在其中注入一个Category对象
- Security.ssl-pinning
- Python编码问题小结
- C#生成PDF文件流
- Node 编码规范（优秀是一种习惯）
- 网站遭遇CC及DDOS攻击紧急处理方案
- jq:翻页时，保存上页多选框checkbox选中状态
- Unity3D Shader 半兰伯特光照模型
- SQL语法集合
- 接口测试——带token请求post接口（postman学习）
- mysql为int类型的字段php取出来之后为何变为string类型？
- postfix 如何设置邮件头翻译的功能