GraphQL系统开发总结

1. 技术归纳

A. 前端采用vue-apolo客户端发送fetch方式的gql请求，并与axios结合使用。

通过apollo-link-http来创建httpLink，通过apollo-link-error、apollo-link来控制请求的拦截和错误处理，ApolloClient来创建请求客户端。

 

B. 服务端增加了基于/graphql接口的GraphQLController控制器来处理分发gql请求,

GraphQL的处理使用了GraphQL SPQR库，它可以通过注解的方式动态生成一个GraphQL模式来工作。主要是@GraphQLQuery和@GraphQLMutation来处理具体进入哪个方法，@GraphQLArgument用来提取方法中的参数

2. 学习收获

2.1 对vue-apolo的简单理解与剖析

基本用法：需要先通过graphql-tag库的gql方法创建scheme供apollo执行

apollo: {

  // Query with parameters

  ping: {

    // gql query

    query: gql`query PingMessage($message: String!) {

      ping(message: $message)

    }`,

    // Static parameters

    variables: {

      message: 'Meow',

    },

  },

},

Apollo的可配置性非常高，以下是常用的几个配置参数

l fetchPolicy ： 默认“cache-first”. 控制着与apollo cache的交互方式

可选项"cache-first" | "cache-and-network" | "network-only" | "cache-only" | "no-cache" | "standby"

l Skip ： 跳过query查询 Boolean

l errorPolicy ： "none" | "ignore" | "all"  默认为none  有时候会抛出空异常，此时设为ignor即可

l Result  和 update 都用来处理返回的数据，如果没有该参数  查询数据直接赋值给apollo的键（上述代码的ping）。值得注意的一点：通过apollo查询返回的数据是freeze状态，无法修改，可以通过对象浅拷贝或者序列化反序列化的方式解冻

 

2.2 Springboot 对AOP的处理方法：

AOP（Aspect-OrientedProgramming，面向方面编程），它利用一种称为“横切”的技术，剖解开封装的对象内部，并将那些影响了多个类的公共行为封装到一个可重用模块。就是将那些与业务无关，却为业务模块所共同调用的逻辑或责任封装起来，便于减少系统的重复代码，降低模块间的耦合度，并有利于未来的可操作性和可维护性。它可以方便地处理权限认证、日志、事务处理等需求。

实现AOP的技术，主要分为两大类：一是采用动态代理技术，利用截取消息的方式，对该消息进行装饰，以取代原有对象行为的执行；二是采用静态织入的方式，引入特定的语法创建“方面”，从而使得编译器可以在编译期间织入有关“方面”的代码。在工单系统中的对于gql请求权限的处理，使用了第一种动态代理的方法。而对于GraphQL控制器的处理，也是应用了该技术，导致最初选取GraphQLController作为横切点的时候，出现了该类已经被代理的错误，因此只能把gql的方法内容copy出来,放在新建的service中，而把改service最为切入点。该做法应该还存在可优化的地方。

3 . 不足

由于graphql的资料较少，vue-apollo的用例更少，大多用法是从react-apollo的文档拷贝和理解出来的，可能存在个别理解上的误区， 一些复杂且少用的属性或者方法由于没有相关资料而没有去尝试。

不过目前对gql的使用程度，基本已经能发挥出它的优势了。GraphQL主要针对数据的查询效率有极大的提升，它的缓存机制配合fetchPolicy的使用，能对于不同的查询做出不同的反应。比如查询一些配置数据，可以使用cache-first、cache-only，代表第一次查询后数据存在缓存，此后的查询不在访问后端，直接去缓存数据。也可以根据数据的更新频率，选择”cache-and-network" | "network-only”.而配置了”no-cache”之后，查询的数据不在存入缓存。

当前一个无法解决的缺陷就是 apollo请求超时的问题，httplink没有提供timeout的接口，导致无法中断或重连当前请求。