graphql
As you all know, REST APIs use status codes as a part of the response (200-ok, 404-not found, 500-internal server error etc.). In GraphQL it’s a bit different because in most cases you just get 200 (or 500 if something goes really bad). But without status code and status message information you won’t be able to represent the results of a client’s request.
众所周知,REST API使用状态码作为响应的一部分(200-确定,404-未找到,500-内部服务器错误等)。 在GraphQL中有所不同,因为在大多数情况下,您只会得到200(或者如果情况真的很糟糕则为500)。 但是如果没有状态码和状态消息信息,您将无法代表客户请求的结果。
For this article you’ll need at least basic GraphQL and Typescript knowledge.
对于本文,您至少需要基本的GraphQL和Typescript知识。
服务器端 (Server side)
On a server-side we’re going to use SDL first approach. First, let’s write type definitions for a super simple query, which will get a Customer by ID.
在服务器端,我们将首先使用SDL方法。 首先,让我们为一个超级简单的查询编写类型定义,这将通过ID获得一个Customer。
This query will return customer for all existing customers in you DB, but it can also return null
if you try to query for a nonexistent customer or if you don’t have permission to read that customer.
该查询将返回数据库中所有现有客户的客户,但是如果您尝试查询不存在的客户或您没有读取该客户的权限,则该查询也可以返回null
。
This solution is problematic because it doesn't provide any additional information about the data. Solution for that is a new layer in the type definition which will wrap customer type and add more information about response like status / status code and a message.
该解决方案有问题,因为它不提供有关数据的任何其他信息。 解决方案是类型定义中的新层,它将包装客户类型并添加有关响应的更多信息,例如状态/状态代码和消息。
We just introduced a new type calledCustomerResult
which wraps Customer and adds status and status message. In this case status is string, but it could be anything else what suits your needs (for example you could use integer and send HTTP codes).
我们刚刚引入了一种称为CustomerResult
的新类型,该类型包装了Customer并添加了状态和状态消息。 在这种情况下,状态为字符串,但可以是其他任何满足您需要的内容(例如,您可以使用整数并发送HTTP代码)。
You can also notice that now there is exclamation mark in customer query because CustomerResult
won't be null — it means there will always be at least something in the response.
您还可以注意到,由于CustomerResult
不会为空,因此客户查询中现在带有感叹号-这意味着响应中至少会包含某些内容。
That’s it from type definition side. Now we’re just missing resolver for this query. Naive solution could look like this:
从类型定义方面就是这样。 现在我们只是缺少此查询的解析器。 天真的解决方案可能是这样的:
After we start adding more and more resolvers we could notice that there is repetition of a pattern in all resolvers — we always need to wrap results into an object and send it. Let’s extract those pieces of code into universal utility functions.
在开始添加越来越多的解析器之后,我们可能会注意到所有解析器中都有重复的模式-我们始终需要将结果包装到一个对象中并发送它。 让我们将这些代码片段提取到通用实用程序函数中。
Those utility functions will make your code clean and DRY. If you need to replace a query status you do it on one place. Our resolvers will be nice and clean.
这些实用程序功能将使您的代码整洁干燥。 如果您需要替换查询状态,请在一个地方进行。 我们的解决者会很干净。
That’s it from the server-side. Thanks to the GraphQL all those responses are documented and easy to use for a client. Let’s have a look how you can utilise status messages in responses on a client side.
从服务器端就是这样。 多亏了GraphQL,所有这些响应都被记录在案,并且易于客户使用。 让我们看看如何在客户端的响应中利用状态消息。
客户端 (Client side)
We’re going to use Typescript, React and Apollo for our client examples but all those ideas can be easily used with different library and language. We will also skip setup and configuration of the app and show just the important bits.
我们将使用Typescript,React和Apollo作为我们的客户示例,但是所有这些想法都可以轻松地用于不同的库和语言。 我们还将跳过应用程序的设置和配置,仅显示重要的部分。
At first, we’ll need a query which will get our customer by ID.
首先,我们需要一个查询,该查询将按ID获取客户。
Now let’s think about response types since we’re using Typescript. If we have a look back into the server side part we can see that status can be one of the enum values of QueryStatus.
现在考虑一下响应类型,因为我们正在使用Typescript。 如果我们回顾一下服务器端部分,我们可以看到状态可以是QueryStatus的枚举值之一。
Problem is that ERROR and NOT_FOUND response statuses have a message and SUCCESS status doesn’t have a message but it has a node. If we write that idea as Typescript types we get something like this:
问题是ERROR和NOT_FOUND响应状态有消息,而SUCCESS状态没有消息,但有节点。 如果我们把这个想法写成Typescript类型,我们将得到如下内容:
Responses from server will always be Response
type-that means either Success, Error or NotFound. We just need to decide which one it is according to QueryStatus.
来自服务器的响应将始终为Response
类型-表示成功,错误或未找到。 我们只需要根据QueryStatus决定它是哪一个即可。
Now let's put it all together and create final piece of code — a component which will render all the results.
现在,我们将它们放在一起并创建最后的代码段—一个将呈现所有结果的组件。
This component will handle all status codes we defined, render data and it’ll do it all type safely.
该组件将处理我们定义的所有状态代码,呈现数据,并将其全部安全地键入。
Today we had a look how we can extend our GraphQL queries with status codes to add an information about data. It’s quite useful since with GraphQL we cannot utilise HTTP status codes as we do it with traditional REST APIs.
今天,我们了解了如何使用状态码扩展GraphQL查询,以添加有关数据的信息。 这非常有用,因为使用GraphQL不能像传统REST API一样使用HTTP状态代码。
翻译自: https://medium.com/swlh/status-codes-in-graphql-4cbf699bc2be
graphql