微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

json – 将2个REST端点合并到单个GraphQL响应中

graphQL新手,我使用以下架构:
type Item {
    id: String,valueA: Float,valueB: Float
  }

  type Query {
    items(ids: [String]!): [Item]
  }

我的API可以在每种类型的单个请求(A& B)上返回多个项目,但不能同时返回两个项目,即:

对typeA的REST请求:api / a / items?id = [1,2]
响应:

[
  {"id":1,"value":100},{"id":2,"value":30}
]

对typeB的REST请求:api / b / items?id = [1,"value":50},"value":20} ]

我想将这两个api端点合并到一个graphQL响应中,如下所示:

[
  {
    id: "1",valueA: 100,valueB: 50
   },{
    id: "2",valueA: 30,valueB: 20
    }
 ]

问:如何编写一个解析器,为每种类型运行一次获取(获取多项响应),确保在查询缺少类型时不会触发不必要的提取,即:

{items(ids:["1","2"]) {
  id
  valueA
}}

上面的例子应该只获取api / a / items?id = [1,2]并且graphQL响应应该是:

[
  {
    id: "1",valueA: 100
  },valueA: 30
  }
]

解决方法

所以我假设您使用JavaScript作为语言.在这种情况下,您需要的是不使用直接查询,而是使用片段

所以查询将成为

{
    items(ids:["1","2"]) {
       ...data
    }}

    fragment data on Item {
        id
      valueA
    }
}

接下来在解析器中,我们需要访问这些片段以查找作为片段一部分的字段,然后根据相同的数据解析数据.下面是一个简单的nodejs文件

const util = require('util');

var { graphql,buildSchema } = require('graphql');

var schema = buildSchema(`
    type Item {
        id: String,valueB: Float
    }

    type Query {
        items(ids: [String]!): [Item]
    }
`);

var root = { items: (source,args,root) => {
        var fields = root.fragments.data.selectionSet.selections.map(f => f.name.value);
        var ids = source["ids"];

        var data = ids.map(id => {return {id: id}});
        if (fields.indexOf("valueA") != -1)
        {
            // Query api/a/items?id=[ids]
            //append to data;
            console.log("calling API A")
            data[0]["valueA"] = 0.12;
            data[1]["valueA"] = 0.15;
        }

        if (fields.indexOf("valueB") != -1)
        {
            // Query api/b/items?id=[ids]
            //append to data;
            console.log("calling API B")
            data[0]["valueB"] = 0.10;
            data[1]["valueB"] = 0.11;
        }
        return data
},};

graphql(schema,`{items(ids:["1","2"]) {
       ...data
    }}

    fragment data on Item {
        id
      valueA
    }

    `,root).then((response) => {
    console.log(util.inspect(response,{showHidden: false,depth: null}));
});

如果我们运行它,输出

calling API A
{ data: 
   { items: [ { id: '1',valueA: 0.12 },{ id: '2',valueA: 0.15 } ] } }

如果我们将查询更改为

{
    items(ids:["1","2"]) {
       ...data
    }}

    fragment data on Item {
        id
        valueA
        valueB
    }
}

输出

calling API A
calling API B
{ data: 
   { items: 
      [ { id: '1',valueA: 0.12,valueB: 0.1 },valueA: 0.15,valueB: 0.11 } ] } }

因此,这演示了如何在不需要字段时避免调用api A / B.正如你所要求的那样

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


什么是深拷贝与浅拷贝?深拷贝与浅拷贝是js中处理对象或数据复制操作的两种方式。‌在聊深浅拷贝之前咱得了解一下js中的两种数据类型:
前言 今天复习了一些前端算法题,写到一两道比较有意思的题:重建二叉树、反向输出链表每个节点 题目 重建二叉树: 输入某二叉树的前序遍历和中序遍历的结果,请重建出该二叉树。假设输入的前序遍历和中序遍历的结果中都不含重复的数字。例如输入前序遍历序列 {1,2,4,7,3,5,6,8} 和中序遍历序列 {
最近在看回JavaScript的面试题,this 指向问题是入坑前端必须了解的知识点,现在迎来了ES6+的时代,因为箭头函数的出现,所以感觉有必要对 this 问题梳理一下,所以刚好总结一下JavaScript中this指向的问题。
js如何实现弹出form提交表单?(图文+视频)
js怎么获取复选框选中的值
js如何实现倒计时跳转页面
如何用js控制图片放大缩小
JS怎么获取当前时间戳
JS如何判断对象是否为数组
JS怎么获取图片当前宽高