Real World 的 GraphQL 版本

在很久之前的一篇 文章 介绍了我做的一个 RealWorld 的 SpringBoot + MyBatis 的实现。这个项目我也一直在维护,一方面是因为这是一个很好的 demo 项目,可以很好的体现一些设计思路 文章 也都说了不再重复。另一方面,我觉得也是一个新人练手不错的选择,可以让大家可以通过这个项目来入门。

最近在做 GraphQL 的调研和测试,我第一个想到的就是把这个项目添加上 GraphQL 的接口,一方面可以熟悉 GraphQL 的体系,另一方面也是个很好的机会去验证下是不是 REST 层是按照 六边形架构 或者说是 洋葱架构 那样子做成的是薄薄的一层,可以轻易的被替换掉。

对 api 层与 application 层做重构

当然,api 层和 application 层一点都不修改就能添加 GraphQL 是不可能的。主要是因为之前有不少的逻辑写在了 SpringBoot 的 Controller 里面了。那么这一部分的工作基本就是把大量放在 Controller 的代码挪动到 application 层。

确认 GraphQL 的 schema

然后就需要按照 REST api 提供一个对等的 GraphQL 的 schema 了。这里参考的是 https://github.com/thebergamo/realworld-graphql/blob/master/data/schema.graphql 这里。

Real World 似乎对 GraphQL 这部分的工作不太伤心,这个东西已经挺久的了,但是官方并没有很好的支持。

不过它这个 schema 明显有两个问题:

  1. 少了 unfavoriteArticleMutation
  2. deleteArticle 返回了错误的结果,明明应该是 DeletionStatus

https://apis.guru/graphql-voyager/ 做展示基本就是这个样子:

schema 在 https://github.com/gothinkster/spring-boot-realworld-example-app/blob/master/src/main/resources/schema/schema.graphqls 可以看到。

可以看到 GraphQL 的 schema 是一张图,有点像是数据库的 ER Diagram。不过很显然,GraphQL 的关系肯定不是数据库级别的 CRUD 而是一个业务层级的关联图:

  1. UserProfile 下可以有很多 Article 的视图 favorites feed
  2. Article 则有其自己的全量属性:author comments
  3. Comment 也有自己的 article author

这部分让我想起来 DDD 书中提到的 Domain Model 对象之间的关联关系(第五章 A Model Expressed in Software)。和 REST 相比,通过 GraphQL 所组织的 schema 有更好的整体性和一致性。当然,这也有可能是它的缺点:它缺少了 REST 的那种随便搞个接口的灵活性。

增加 GraphQL 的代码

这里的实现采用了 Netflix DGS 这个框架,很符合 SpringBoot 的设计逻辑,并且最近也一直在密集的更新中。

从文件组织上看,每个 Entity 或者是 EntityList 可以组织一个 Datafetcher 提供给具体某一个 Query 下的特定 type 的查询。而针对某个 Entity 的 Mutation 可以放到一起?这部分不太确定,可能还是刚刚开始做,感受不是很明显。

对于 nested query 的处理

既然是一张图,那么查询就可以是一个树,比如可以有这么一个查询:

query {
  me {
    profile {
      articles {
        edges {
          node {
            comments {
              edges {
                node {
                  body
                }
              }
            }
          }
        }
      }
    }
  }
}

获取当前用户的 articles 并且包含它的 commentbody。类似的问题在 Nested data fetchers 有做一些阐述。而我这个例子就是遇到了 https://netflix.github.io/dgs/advanced/context-passing/#no-showid-use-local-context 这部分阐述的情况,需要自己创建一个 Map 并放到 localContext 中做传递。具体的代码如下:

ArticleDatafetcher.java:

package io.spring.graphql;

...

@DgsComponent
public class ArticleDatafetcher {

  ...

  @DgsData(parentType = PROFILE.TYPE_NAME, field = PROFILE.Articles)
  public DataFetcherResult<ArticlesConnection> userArticles(
      ...
      DgsDataFetchingEnvironment dfe) {

    User current = SecurityUtil.getCurrentUser().orElse(null);
    Profile profile = dfe.getSource();

    CursorPager<ArticleData> articles;

    ...

    graphql.relay.PageInfo pageInfo = buildArticlePageInfo(articles);
    ArticlesConnection articlesConnection =
        ArticlesConnection.newBuilder()
            .pageInfo(pageInfo)
            .edges(
                articles.getData().stream()
                    .map(
                        a ->
                            ArticleEdge.newBuilder()
                                .cursor(a.getCursor().toString())
                                .node(buildArticleResult(a))
                                .build())
                    .collect(Collectors.toList()))
            .build();
    return DataFetcherResult.<ArticlesConnection>newResult()
        .data(articlesConnection)
        .localContext( // 这里将 slug : article 的 map 传递到下一个层级了
            articles.getData().stream().collect(Collectors.toMap(ArticleData::getSlug, a -> a)))
        .build();
  }

  ...
}

CommentDatafetcher.java:

package io.spring.graphql;

...

@DgsComponent
public class CommentDatafetcher {
  ...

  @DgsData(parentType = ARTICLE.TYPE_NAME, field = ARTICLE.Comments)
  public DataFetcherResult<CommentsConnection> articleComments(
      ...
      DgsDataFetchingEnvironment dfe) {

    if (first == null && last == null) {
      throw new IllegalArgumentException("first 和 last 必须只存在一个");
    }

    User current = SecurityUtil.getCurrentUser().orElse(null);
    Article article = dfe.getSource();
    Map<String, ArticleData> map = dfe.getLocalContext(); // 获取 map
    ArticleData articleData = map.get(article.getSlug()); // 使用 slug 获取具体的 ArticleData

    CursorPager<CommentData> comments;
    
    ...

    graphql.relay.PageInfo pageInfo = buildCommentPageInfo(comments);
    CommentsConnection result =
        CommentsConnection.newBuilder()
            .pageInfo(pageInfo)
            .edges(
                comments.getData().stream()
                    .map(
                        a ->
                            CommentEdge.newBuilder()
                                .cursor(a.getCursor().toString())
                                .node(buildCommentResult(a))
                                .build())
                    .collect(Collectors.toList()))
            .build();
    return DataFetcherResult.<CommentsConnection>newResult()
        .data(result)
        .localContext(
            comments.getData().stream().collect(Collectors.toMap(CommentData::getId, c -> c))) // 这里同样传递了一个 id : comment 的 map 到下一个层级
        .build();
  }

  ...
}

这种传递 map 的方式也算是官方指定的最佳实践了吧,并且基本不可或缺。因为很多时候 Source 和实际从 Application 层传递的 DTO 的类型就是不一样的,可能缺了不少数据。

效果

只要 Application 层保证重用并且捋清楚了 DataFetcher 之间的数据传递关系,后面做起来感觉就一马平川了,毕竟这也不是一个什么很大很复杂的项目。

完成之后感觉这种网状关系的调用体验还是很好的,感觉对 API 的调用方来说,一旦熟悉了这种模式就可以更容易的组合各种比较复杂的视图,而不会像 REST 那样担心大量的手工数据组合。

开发过程中的一些小问题

  1. Intellij 对 GraphQL 本身的支持还不够好
  2. Dgs 是个比较新的框架,加上国内似乎很少有做类似东西的人,资料很少
  3. RealWorld 本身对 GraphQL 的推进也很慢,后续我应该会增加英文版本的 ReadME 介绍 GraphQL 这部分的工作,并且希望可以有前端做支持
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 204,530评论 6 478
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 86,403评论 2 381
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 151,120评论 0 337
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 54,770评论 1 277
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 63,758评论 5 367
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,649评论 1 281
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 38,021评论 3 398
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,675评论 0 258
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,931评论 1 299
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,659评论 2 321
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,751评论 1 330
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 33,410评论 4 321
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,004评论 3 307
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,969评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 31,203评论 1 260
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 45,042评论 2 350
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 42,493评论 2 343

推荐阅读更多精彩内容