关于 GraphQL

关于 GraphQL

理念

大致来讲就是说统一 API 端点,不像 RestAPI 一样各种请求路径,请求方法。

// 以下均为示例代码

// RestAPI

requests.baseURL = 'https://xxxx.xxx/api'

// 需要记住各类请求路径 
// 对应的请求方法 
// 需要了解传递的参数
const login = (params) => requests.post('/login', params)
const search = (params) => requests.get('/search', params)
const editor = (params) => requests.patch('/editor', params)

// GraphQL

// 统一请求端点
// 统一 post 请求
const client = GraphQL('<baseURL>')

// 需要什么数据自己编写 gql 语句
// 可以根据需求灵活获取数据
const login = () => client.query({ query: gql`<query content>` })
const login = () => client.query({ query: gql`<query content>` })
const editor = () => client.query({ query: gql`<query content>` })

在实际业务中应用

公司用的开源的 strapi

首先,一定要约定好结构!

否则就会和我一样拿个数据要走十几层深度拿。

const response = requestGoods()

// 此处为举例
// 并不涉及实际业务
const image = response
  .data           // 请求响应数据
  .Goods          // 商品数据结构对象
  .data           // 商品数据列表
  [0]             // 第一项商品
  .attributes     // 第一项商品属性
  .details        // 第一项商品明细信息 与它平级的大概有 名称,价格,规格这些
  .attributes     // 第一项商品明细信息属性
  .platforms      // 第一项商品可售卖的平台
  .data           // 第一项商品可售卖的平台列表数据
  [0]             // 第一项商品可售卖的平台的第一项
  .attributes     // 第一项商品可售卖的平台的第一项平台属性
  .image          // 第一项商品可售卖的平台的第一项平台图标
  .data           // 第一项商品可售卖的平台的第一项平台图标数据
  .attributes     // 第一项商品可售卖的平台的第一项平台图标属性
  .url            // 第一项商品可售卖的平台的第一项平台图标路径

说是方便前端查询数据,想要什么数据就弄什么数据,但是实际上没有约定,没有规范就容易这样。


关于 GraphQL
http://localhost:8080/archives/guan-yu-graphql
作者
inksha
发布于
2024年09月21日
许可协议