Axios 是一个基于 Promise 的 HTTP 客户端库,可以用于浏览器和 Node.js。下面是一个使用 Axios 发送常规的 GET 请求,并同时获取请求进度的代码示例:
// 引入 Axios
const axios = require('axios');
// 定义请求 URL
const url = 'https://example.com/api/data';
// 发送 GET 请求并同时获取进度
axios({
method: 'get',
url: url,
onDownloadProgress: function(progressEvent) {
// 计算进度百分比
const progress = Math.round((progressEvent.loaded * 100) / progressEvent.total);
console.log(`下载进度:${progress}%`);
},
})
.then(function(response) {
// 请求成功处理响应
console.log('请求成功', response.data);
})
.catch(function(error) {
// 请求失败处理错误
console.error('请求失败', error);
});
在这个示例中,我们使用 Axios 的 axios 函数发送一个 GET 请求,并传递一个包含 onDownloadProgress 回调函数的配置对象。
在 onDownloadProgress 回调函数中,我们可以获取到一个 progressEvent 对象,其中包含了有关下载进度的信息。通过计算已下载的字节数与总字节数的比例,我们可以得到一个进度百分比,并将其打印出来。
如果你要在浏览器中运行这段代码,需要先引入 Axios 库。你可以使用以下 CDN 引入 Axios:
然后将上述 JavaScript 代码放入 标签中。记得将 url 变量替换为你想要请求的实际 URL。
这是一个简单的使用 Axios 发送 GET 请求并获取进度的示例,你可以根据自己的需求进行修改和扩展。