axios 发送请求 小记

使用Axios发起HTTP请求
本文介绍了如何使用Axios库发起GET和POST请求,并展示了如何处理并发请求。通过示例代码,读者可以了解到如何传递参数、处理响应以及组织请求。

get 请求

axios.get('/user', { params: { ID: 12345 } }) .then(function (response) { console.log(response); }) .catch(function (response) { console.log(response); });

 

post 请求

axios.post('/user', { firstName: 'Fred', lastName: 'Flintstone' }) .then(function (response) { console.log(response); }) .catch(function (response) { console.log(response); });

 

 

并发多个请求

function getUserAccount() { return axios.get('/user/12345'); }

function getUserPermissions() { return axios.get('/user/12345/permissions'); }

axios.all([getUserAccount(), getUserPermissions()]) .then(axios.spread(function (acct, perms) { // Both requests are now complete }))

 

转载于:https://www.cnblogs.com/liuyuea/p/9151346.html

### 使用 Axios 发送 HTTP 请求 #### 安装 Axios 为了使用 Axios,在项目中安装 Axios 库是必要的。可以通过 npm 或 yarn 来完成这一操作。 ```bash npm install axios ``` 或者 ```bash yarn add axios ``` #### 配置默认参数 可以设置全局的默认配置项,比如基础 URL 和认证头部信息,这有助于简化后续请求中的重复配置[^2]: ```javascript import axios from 'axios'; // 设置默认的基础URL和授权令牌 axios.defaults.baseURL = "https://api.example.com"; axios.defaults.headers.common['Authorization'] = `Bearer YOUR_ACCESS_TOKEN`; ``` #### 发送 GET 请求 下面是一个简单的例子,展示了如何利用 Axios 发起一个 GET 请求,并处理返回的数据。 ```javascript async function fetchData() { try { const response = await axios.get('/endpoint'); console.log(response.data); } catch (error) { console.error('There was an error!', error); } } ``` 此代码片段定义了一个名为 `fetchData` 的函数,该函数会尝试获取指定路径 `/endpoint` 下的数据,并打印出来;如果过程中遇到任何错误,则会在控制台记录这些异常情况。 #### 处理 POST 请求和其他类型的请求 除了 GET 方法外,还可以很容易地发出其他类型的 HTTP 请求,如 POST、PUT 等。这里给出一个提交表单数据的例子: ```javascript const postData = async () => { try { let payload = { title: 'foo', body: 'bar', userId: 1 }; const result = await axios.post('/posts', payload); console.log(result.status); // 输出状态码, 如 201 Created } catch (err) { console.error(err.message); } }; ``` 这段 JavaScript 代码实现了向服务器发送 JSON 数据的功能,同时捕获可能发生的网络或其他运行时错误。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值