接口封装
前端的动态数据交互离不开服务端提供的接口,在一个前后端分离的中后台项目中,接口的请求和响应是必不可少的。 那么在架构一个中后台系统的时候,我们如何有效的管理和封装接口,提高项目接口调用的统一性、可维护性,以及在后端接口还没有开发完成,在仅有契约的基础上我们如何有效的模拟接口的调用呢? 接下来便会对以上问题提供个人解决方案供大家参考。 1. 不封装存在的问题 首先谈谈接口封装,因为我们使用的请求库是 axios,所以接下来的示例都以 axios 来举例。 那么在没有封装接口的项目中,你可能随处可见接口的直接调用方法,比如像这样: axios.post('/user', { firstName: 'zhang', lastName: 'san' }) .then(function (response) { console.log(response); }); ... axios.get('/user?ID=12345') .then(function (response) { // handle success console.log(response); }); 复制代码 这样的写法会存在一些缺点,主要有以下几点: 接口 url 没有统一管理,散落在项目的各个地方 如果需要在接口调用成功和失败时做一些处理,需要在每个地方进行添加 特殊请求头以及取消请求方法需要单独进行编写 2.