介绍
前端开发中，有时需要调用服务端API接口获取数据，而@communities-webruntime/services就是帮助前端开发者快速实现这个功能。
@communities-webruntime/services是一个npm包，支持在浏览器和Node.js环境下使用。它提供了一个类，用于发送HTTP请求并解析响应数据。
安装
你可以在项目的根目录下通过npm包管理工具安装@communities-webruntime/services：
npm install @communities-webruntime/services
使用
使用@communities-webruntime/services非常简单，只需要通过import引入，并创建实例对象，然后调用相应的方法即可。
创建实例
创建一个新的@communities-webruntime/services实例：
import { Services } from '@communities-webruntime/services';
const services = new Services({
baseURL: 'https://api.example.com',
headers: {
'Authorization': 'Bearer token',
},
});可以在创建实例时，传入一些可选参数：
- baseURL: 基础URL，用于构造请求的URL。
- headers: 请求头。
- timeout: 请求超时时间。
- responseType: 响应数据类型，可选值为'json'或'text'。
发送请求
发送GET请求
services.get('/users').then((res) => {
console.log(res.data);
}).catch((err) => {
console.error(err);
});发送POST请求
services.post('/users', { name: '张三', age: 18 }).then((res) => {
console.log(res.data);
}).catch((err) => {
console.error(err);
});发送PUT请求
services.put('/users/1', { name: '李四' }).then((res) => {
console.log(res.data);
}).catch((err) => {
console.error(err);
});发送DELETE请求
services.delete('/users/1').then((res) => {
console.log(res.data);
}).catch((err) => {
console.error(err);
});发送请求时附加参数
-- -------------------- ---- -------
---------------------- -
------- -
----- --
------ ---
--
-------- -
------------------- -----------------
--
------------- -- -
----------------------
-------------- -- -
-------------------
---拦截器
@communities-webruntime/services提供了请求和响应拦截器，可以在请求前和响应后做一些处理。
请求拦截器
services.interceptors.request.use((config) => {
config.headers['X-Request-Id'] = Math.random().toString(16).slice(2, 10);
return Promise.resolve(config);
}, (error) => Promise.reject(error));响应拦截器
services.interceptors.response.use((response) => {
if (response.status === 200) {
return Promise.resolve(response);
} else {
return Promise.reject(response);
}
}, (error) => Promise.reject(error));错误处理
@communities-webruntime/services在发送请求时，会在发生错误或返回失败响应时，抛出异常。
可以在catch中捕获异常并处理错误。
-- -------------------- ---- -------
--------------------------------- -- -
----------------------
-------------- -- -
-- -------------- -
---------------------------------
- ---- -
---------------------------
-
---总结
通过本文的介绍，我们了解了如何使用@communities-webruntime/services发送HTTP请求，以及如何使用拦截器、错误处理等功能。
使用@communities-webruntime/services可以简化HTTP请求操作，方便前端开发者快速调用服务端API接口。
完整代码示例：https://github.com/example/project。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/5eedb494b5cbfe1ea06112eb