【原创】从Rest到Graphql

 

引言

开局两张图,内容全靠编~



ok,如图所示,我在去年曾经写过一篇文章

ps:中小型公司慎重,不要玩前后端分离架构!前端工作量贼大!

那么用上了前后端分离架构后,后端的API一般会按照Restful风格来设计!ResultFul推荐每个URL能操作具体的资源,而且能准确描述服务器对资源的处理动作,通常服务器对资源支持get/post/put/delete/等,用来实现资源的增删改查。前后端分离的架构下,这些api-url是对接的桥梁,采用ResultFul接口地址含义才更清晰、见名知意。
那么,在实践RestFul风格的API的有一个致命的缺陷,是神马类?嗯,带着你的疑惑开始本文

正文

RestFul的缺陷

假设,此时我们有两个资源分别是BookAuthor,这两个资源对应的ER图如下

相应的API有

POST /books
GET /books/{id}
POST /authors
GET /authors/{id}

我们有一个需求,需要查询id=1的图书信息!
那我们的请求地址是这样的

GET /books/1

返回结果是这样的

[{     "id": 1,     "bookname": Harry Potter,     "price": 56.00,     "author_id": 2 }]

这时候前端MM拿到这个结果后,傻了眼!这里怎么能直接返回author_id呢,难道直接把author_id显示在界面上么?不可能啊,界面上要显示的是author_name才行!

OK,那么在这种情况下,有两种方式可以解决问题!

(1) 跟后端沟通,让他增加一个接口
嗯,我们复习一下什么是VO对象。
VO(View Object):视图对象,用于展示层,它的作用是把某个指定页面(或组件)的所有数据封装起来。
那可以让后端封装一个接口,后端帮你把数据拼装好,提供API如下

GET /bookVOs/1

这样直接返回的结果就是

[{     "id": 1,     "bookname": Harry Potter,     "price": 56.00,     "author_name": J. K. Rowling }]

当然,因为你这是临时让后端加接口,可能会有如下情形产生

OK,回到正题,这样做的缺点主要有两个

  • 前后端强耦合在一起,前端界面发生变动,后端VO对象跟着一起变
  • 如果BookVO对象在手机端、PC端、APP端的显示内容都不一样,你可能在项目中会有BookPcVO类、BookH5VO类、BookAppVO类,VO类大大膨胀!

(2) 自己做适配
这个也很简单,前端获得结果后,取出author_id: 2这条记录,然后再去调用地址

GET /authors/2

得到结果,然后进行组装显示!

当然,这个时候会有如下情形产生(这就是我注孤生的原因!)

当然,这种做法的缺点也很明显

  • 返回了一堆前端并不需要的数据
  • 徒增前后端的交互次数

ok,通过上面的描述,大家应该能体会到Rest的缺点:REST接口时返回的数据格式、数据类型都是后端预先定义好的,如果返回的数据格式并不是调用者所期望的,调用者在处理上比较麻烦!

那么,有没有办法让前端自定灵活的使用查询语句,自己想捞什么数据就捞什么数据呢?
有的,那就是Graphql!

Graphql的出现

Graphql其实要这样理解
Graphql=grap(图)+query+lanage
是一种基于图的查询语言!那么,这张图长什么样?
OK,首先你要声明一下,你的图结构,嗯,用的就是Graphql的语法啦,像下面这样

type 
                        
关键字:
50000+
5万行代码练就真实本领
17年
创办于2008年老牌培训机构
1000+
合作企业
98%
就业率

联系我们

电话咨询

0532-85025005

扫码添加微信