接口API设计学习报告

15331023 陈康怡

什么是API?

API即Application Programming Interface。API是一种通道,负责一个程序与另一个程序的沟通。而对于web端开发而言,API可以理解为前后端协商好的交互规范。前端根据API规范发送请求,后端根据API规范响应请求。通过API可以实现前后端分离。一个好的API可以让前后端的开发人员各司其职,专注于深耕自己的领域。

为什么前后端要分离?

传统的MVC模型

传统的MVC模型是非常好的协作模式,Controller、Model、View层分离,前后端分工比较清晰,但仍不足够。

传统MVC模型的典型问题:

  1. 前端开发重度依赖开发环境,开发效率低。这种架构下,前后端协作有两种模式:一种是前端写demo,写好后,让后端去套模板。这种模式的好处是前端可以基于本地开发demo,效率高。不足之处在于前端所做的demo需要后端使用模板再改写一遍(如HTML改为JSP),容易出错,沟通成本高。 另一种协作模式是前端负责浏览器端的所有开发和服务器端的 View 层模板开发。 好处是 UI 相关的代码都是前端去写就好,后端不用太关注,不足就是前端开发重度绑定后端环境,环境成为影响前端开发效率的重要因素。

  2. 前后端职责仍旧纠缠不清。页面路由等功能本应该是前端最关注的功能,但却是由后端实现。Controller层与Model层往往也会纠缠不清。

  3. 对前端发挥的局限。后端性能优化受后端框架限制,难以使用Comet、Bigpipe等技术方案来优化性能。

分离的目的:
1. 关注点分离
2. 职责分离
3. 对的人做对的事
4. 更好的共建模式
5. 快速的反应变化

前后怎么分离?

第一阶段:基于Ajax的SPA:

CDN(内容分发网络)发送网页内容,通过基于JavaScript的AJAX实现与后端的交互。缺点是浏览器端会十分复杂,尤其是JavaScript部分的代码。

第二阶段:浏览器端的分层架构:
前后端约定交互规范,前端在浏览器端完成业务逻辑。前端需要数据时,根据API向后端请求,后端根据API发回响应(一般为JSON格式)。前端得到数据后使用模板引擎渲染显示。

前后端分离的难点:

  1. 前后端接口的约定。如果后端接口设计存在缺陷,或业务模型不够稳定,那么前端开发会很痛苦。这一块在业界有 API Blueprint 等方案来约定和沉淀接口,==在阿里,不少团队也有类似尝试,通过接口规则、接口平台等方式来做。有了和后端一起沉淀的接口规则,还可以用来模拟数据,使得前后端可以在约定接口后实现高效并行开发。== 相信这一块会越做越好。

  2. 前端开发的复杂度控制SPA 应用大多以功能交互型为主,JavaScript 代码过十万行很正常。大量 JS 代码的组织,与 View 层的绑定等,都不是容易的事情。

后端 前端
提供数据 接收数据,返回数据
处理业务逻辑 处理渲染逻辑
Server-side MVC架构 Client-side MV*架构
代码跑在服务器上 代码跑在浏览器上

API设计原则

  1. 接口返回数据即显示:前端仅做渲染逻辑处理;
  2. 渲染逻辑禁止跨多个接口调用;
  3. 前端关注交互、渲染逻辑,尽量避免业务逻辑处理的出现;
  4. 请求响应传输数据格式:JSON,JSON数据尽量简单轻量,避免多级JSON的出现;

RESTful接口规范

RESTful接口规范,是基于REST理念设计的接口规范,具体详见:http://www.ruanyifeng.com/blog/2014/05/restful_api.html

REST本身并没有创造新的技术、组件或服务,而隐藏在RESTful背后的理念就是使用Web的现有特征和能力, 更好地使用现有Web标准中的一些准则和约束。

API文档编写

API文档编写需要包括:

  • 简要描述
  • 请求URL
  • 请求方式、参数
  • 返回示例
  • 返回参数说明
  • 备注

这里是一个示例:http://www.showdoc.cc/web/#/demo?page_id=9

参考链接:

  1. https://www.jianshu.com/p/c81008b68350
  2. http://www.ruanyifeng.com/blog/2014/05/restful_api.html

前后端分离&接口API设计学习报告的更多相关文章

  1. 前后端分离后台api接口框架探索

    前言 很久没写文章了,今天有时间,把自己一直以来想说的,写出来,算是一种总结吧!  这篇文章主要说前后端分离模式下(也包括app开发),自己对后台框架和与前端交互的一些理解和看法.     前后端分离 ...

  2. 前后端分离后API交互如何保证数据安全性

    前后端分离后API交互如何保证数据安全性? 一.前言 前后端分离的开发方式,我们以接口为标准来进行推动,定义好接口,各自开发自己的功能,最后进行联调整合.无论是开发原生的APP还是webapp还是PC ...

  3. 【laravel5.5+Passport】laravel5的前后端分离之Passport设计

    项目中使用到了laravel5的passport组件,进行前后端分离的 api认证部分: 前后端分离的api认证,我们用的是: [密码授权令牌],需要用户登录->指定client_id/clie ...

  4. 如何处理好前后端分离的 API 问题(转载自知乎)

    9 个月前 API 都搞不好,还怎么当程序员?如果 API 设计只是后台的活,为什么还需要前端工程师. 作为一个程序员,我讨厌那些没有文档的库.我们就好像在操纵一个黑盒一样,预期不了它的正常行为是什么 ...

  5. 前后端分离后API交互如何保证数据安全性?

    一.前言 前后端分离的开发方式,我们以接口为标准来进行推动,定义好接口,各自开发自己的功能,最后进行联调整合.无论是开发原生的APP还是webapp还是PC端的软件,只要是前后端分离的模式,就避免不了 ...

  6. FastAPI + Vue 前后端分离 接口自动化测试工具 apiAutoTestWeb

    apiAutoTestWeb使用说明 apiAutoTestWeb是为apiAutoTest的可视化版本,其采用前后端分离(FastAPI + Vue2)方式实现 具体使用: Python3 + Fa ...

  7. swagger -- 前后端分离的API接口

    文章目录 一.背景 二.swagger介绍 三.在maven+springboot项目中使用swagger 四.swagger在项目中的好处 五.美化界面 参考链接:5分钟学会swagger配置 参考 ...

  8. vue 前后端分离 接口及result规范 及drf安装使用方法

    接口 # 接口:url链接,通过向链接发送不同的类型请求与参数得到相应的响应数据​# 1.在视图层书写处理请求的 视图函数# 2.在路由层为视图函数配置 url链接 => 产生接口# 3.前台通 ...

  9. 前后端分离 接口管理神器——Rap本地搭建

    我这里要用做mockserver的就是rap了,rap结合了团队管理,项目管理,文档编写.Mock.js.可视化.接口过渡.文档历史版本(赞).mock插件(线上线下切换就只需要注释一句代码就OK), ...

随机推荐

  1. Linux练习例题(附答案)

    1.通过ps命令的两种选项形式查看进程信息 2.通过top命令查看进程 3.通过pgrep命令查看sshd服务的进程号 4.查看系统进程树 5.使dd if=/dev/zero of=/root/fi ...

  2. python-装饰器1

    python-装饰器1 定义本质就是函数,(装饰其他函数)就是为其他函数添加附加功能原则:1.不能修改被装饰的函数的源代码2.不能修改被装饰的函数的调用方式 def logger(): print(' ...

  3. python-函数3(全局变量与局部变量)

    python-函数3(全局变量与局部变量) 全局变量与局部变量 school = "goy edu" 全局变量,在最上面定义的 def change_name(name): glo ...

  4. 安装Python包报错——ReadTimeoutError

    一.问题:安装python包的时候报错ReadTimeoutError——Read time out. 二.解决办法三种方法,一是切换下载源:二是下载相应平台的安装包后安装:三是下载源码编译安装:  ...

  5. .net中对象序列化技术

    序列化是将对象状态转换为可保持或传输的格式的过程.与序列化相对的是反序列化,它将流转换为对象.这两个过程结合起来,可以轻松地存储和传输数据.例如,可以序列化一个对象,然后使用 HTTP 通过 Inte ...

  6. 怎样减少 Android 应用包 60% 的大小?

    简评: 应用的大小也是用户体验的一个重要方面,而减少 Android 应用安装包大小其实一点也不复杂. 对于移动应用来说,应用安装包的大小当然是越小越好.特别是对于一些欠发达地区,你不希望用户因为手机 ...

  7. htmlunit与Jsoup

    //这个函数的目的是在获取页面的同时,也获取链接对应的cookiepublic static HtmlPage getCookieAndHtml(String url)throws IOExcepti ...

  8. 调试dcc 试图将u-boot放入ocm运行碰到的问题

    1. 起因: gd->mon_len = (ulong)&__bss_end - (ulong)_start; 在u-boot.map中查找,发现__bss_end并不是u-boot.b ...

  9. git shell 右键启动注册表

    Windows Registry Editor Version 5.00 [HKEY_CLASSES_ROOT\Directory\Background\shell\Git Bash Here] ): ...

  10. 数据结构——Bloom Filter

    1. 一个很长的二进制向量和一个映射函数 2.用于检索一个元素是否在集合中,但有一定的错误概率:通过BloomFilter的元素不一定在集合当中,但是不通过BloomFilter的元素一定不在集合当中 ...