GraphQL入门2
将服务器端的代码升级了一下:
|
var GraphQLSchema = require('graphql').GraphQLSchema; var GraphQLObjectType = require('graphql').GraphQLObjectType; var GraphQLString = require('graphql').GraphQLString; var GraphQLList = require('graphql').GraphQLList; var fetch = require('node-fetch'); require("babel-polyfill"); var BASE_URL = 'http://localhost:3000'; var persons = [ { id: "1", first_name: "Jack", last_name: "Zhang" , department: "Depart1", friends: [1] }, { id: "2", first_name: "Tom", last_name: "Wang" , department: "Depart2", friends: [1, 2] } ]; function getPersonByUrl(args, relativeURL) { var person = persons.find(function (item) { if (args.id) { return item.id == args.id; } if (args.department) { return item.department == args.department; } }); return person; //fetch('${BASE_URL}${relativeURL}') // .then(function (res) { return res.json() }) // .then(function (json) { return json.person }) } function getFriendByPersonId(friendID) { var person = persons.find(function (item) { return item.id == friendID; }); return person; //fetch('${BASE_URL}${relativeURL}') // .then(function (res) { return res.json() }) // .then(function (json) { return json.person }) } var PersonType = new GraphQLObjectType( { name: 'Person', description: '...', fields: ()=>({ id: { type: GraphQLString, resolve : function (person) { return person.first_name; } }, firstName: { type: GraphQLString, resolve : function (person) { return person.first_name; } }, lastName: { type: GraphQLString, resolve : function (person) { return person.last_name; } }, department: { type: GraphQLString, resolve : function (person) { return person.department; } }, //email: { type: GraphQLString }, //userName: { type: GraphQLString }, //id: { type: GraphQLString }, friends: { type: new GraphQLList(PersonType), resolve: function (person) { return person.friends.map(getFriendByPersonId); } } }) }); var QueryType = new GraphQLObjectType({ name: 'Query', desription: '...', fields: { person: { type: PersonType, args: { id: { type: GraphQLString }, department: { type: GraphQLString } }, resolve: function (obj, args, context, info) { return getPersonByUrl(args, null); } } } }); var GraphQLSchemaObj = new GraphQLSchema({ query: QueryType }); module.exports = GraphQLSchemaObj; |
主要有以下几处更改:
- 将模拟的数据源persons单独提出来成为一个全局变量.
- 数据源中增加了department等几个属性.
- getPersonByUrl函数支持id和department参数.
- 增加了getFriendByPersonId函数用来解析friends属性.
- PersonType的fields属性使用了()=>来解决friends属性中使用本类型时本类型尚未初始化的问题.
下面是客户端的测试代码:
app.js
|
console.log('Hello world'); ////Arguments //var Test1 = require('./Test1'); //Test1.Execute(); ////Alias //var Test2 = require('./Test2'); //Test2.Execute(); ////Alias with sub-selection //var Test3 = require('./Test3'); //Test3.Execute(); ////Fragments //var Test4 = require('./Test4'); //Test4.Execute(); //Variblies //var Test5 = require('./Test5'); //Test5.Execute(); //Directives //var Test6 = require('./Test6'); //Test6.Execute(); |
具体的测试类:
Alias:
|
//Test2: Aliases var gRequest = require('graphql-request').request; exports.Execute = function () { const query = '{' + ' Depart1Person: person(department: "Depart1") {' + ' firstName,' + ' lastName,' + ' department' + ' }' + ' Depart2Person: person(department: "Depart2") {' + ' firstName,' + ' lastName,' + ' department' + ' }' + '}'; gRequest('http://localhost:1337/graphql/graphql', query).then(function (data) { console.log(data) }); }; |
运行结果如下:
|
{ Depart1Person: { firstName: 'Jack', lastName: 'Zhang', department: 'Depart1' }, Depart2Person: { firstName: 'Tom', lastName: 'Wang', department: 'Depart2' } } |
Aliases -- sub selection
|
//Test3: Aliases -- sub selection var gRequest = require('graphql-request').request; var util = require('util'); exports.Execute = function () { const query = '{' + ' Depart1Person: person(department: "Depart1") {' + ' firstName,' + ' lastName,' + ' department,' + ' friends' + ' {' + ' firstName,' + ' lastName' + ' }' + ' }' + ' Depart2Person: person(department: "Depart2") {' + ' firstName,' + ' lastName,' + ' department,' + ' friends' + ' {' + ' firstName,' + ' lastName' + ' }' + ' }' + '}'; gRequest('http://localhost:1337/graphql/graphql', query).then(function (data) { console.log(util.inspect(data, { showHidden: false, depth: null })) }); }; |
运行结果如下:
|
{ Depart1Person: { firstName: 'Jack', lastName: 'Zhang', department: 'Depart1', friends: [ { firstName: 'Jack', lastName: 'Zhang' } ] }, Depart2Person: { firstName: 'Tom', lastName: 'Wang', department: 'Depart2', friends: [ { firstName: 'Jack', lastName: 'Zhang' }, { firstName: 'Tom', lastName: 'Wang' } ] } } |
Fragements:
|
//Test4: Fragements var gRequest = require('graphql-request').request; var util = require('util'); exports.Execute = function () { var query = '{' + ' Depart1Person: person(department: "Depart1") {' + ' ...personFields' + ' }' + ' Depart2Person: person(department: "Depart2") {' + ' ...personFields' + ' }' + '}' + '' + 'fragment personFields on Person {' + ' firstName,' + ' lastName,' + ' department,' + ' friends{' + ' firstName,' + ' lastName' + ' }' + '}'; //gRequest('http://localhost:1337/graphql/graphql', query).then(function (data) { console.log(data) }); gRequest('http://localhost:1337/graphql/graphql', query).then(function (data) { console.log(util.inspect(data, { showHidden: false, depth: null })) }); }; |
运行结果如下:
|
{ Depart1Person: { firstName: 'Jack', lastName: 'Zhang', department: 'Depart1', friends: [ { firstName: 'Jack', lastName: 'Zhang' } ] }, Depart2Person: { firstName: 'Tom', lastName: 'Wang', department: 'Depart2', friends: [ { firstName: 'Jack', lastName: 'Zhang' }, { firstName: 'Tom', lastName: 'Wang' } ] } } |
Varibles:
|
//Test5: Variables var gRequest = require('graphql-request').request; var util = require('util'); exports.Execute = function () { var query = 'query PersonWithDept($dept: String) {' + ' + ' + ' + '}' + '' + 'fragment personFields on Person {' + ' + ' + ' department,' + ' + ' + ' + ' + '}'; var varibles = { "dept": "Depart1" }; //gRequest('http://localhost:1337/graphql/graphql', gRequest('http://localhost:1337/graphql/graphql', query, varibles).then(function (data) { console.log(util.inspect(data, { }); }; |
运行结果如下:
|
{ person: { firstName: 'Jack', lastName: 'Zhang', department: 'Depart1', friends: [ { firstName: |
Directives:
|
//Test6: Directives var gRequest = require('graphql-request').request; var util = require('util'); exports.Execute = function () { var query = 'query PersonWithDept($dept: String, $withFriends: + ' person(department: $dept) {' + ' ...personFields' + ' }' + '}' + '' + 'fragment personFields on + ' firstName,' + ' lastName,' + ' department,' + ' friends @include(if: $withFriends){' + ' firstName,' + ' lastName' + ' }' + '}' ; var varibles1 = { "dept": "Depart1", "withFriends": true }; var varibles2 = { "dept": "Depart1", "withFriends": false }; //gRequest('http://localhost:1337/graphql/graphql', gRequest('http://localhost:1337/graphql/graphql', query, varibles1).then(function (data) { console.log(util.inspect(data, { }); gRequest('http://localhost:1337/graphql/graphql', query, varibles2).then(function (data) { console.log(util.inspect(data, { }); }; |
运行结果如下:
|
{ person: { firstName: 'Jack', lastName: 'Zhang', department: { person: { firstName: 'Jack', lastName: 'Zhang', department: 'Depart1', friends: [ { firstName: |
注意客户端代码中使用了,是为了打印出json的子对象,
GraphQL入门2的更多相关文章
- Vue项目中GraphQL入门学习与应用
1.GraphQL是什么,能干什么? 正如官网所说,GraphQL是一种用于API查询的语言.Facebook 的移动应用从 2012 年就开始使用 GraphQL.GraphQL 规范于 2015 ...
- GraphQL入门有这一篇就足够了
GraphQL入门有这一篇就足够了:https://blog.csdn.net/qq_41882147/article/details/82966783 版权声明:本文为博主原创文章,遵循 CC 4. ...
- GraphQL入门1
1. 资源: 主站: https://graphql.org/ 中文站: http://graphql.cn 入门视频: https://graphql.org/blog/rest-api-graph ...
- Graphql入门
Graphql入门 GraphQL是一个查询语言,由Facebook开发,用于替换RESTful API.服务端可以用任何的语言实现.具体的你可以查看Facebook关于GraphQL的文档和各种语言 ...
- GraphQL 入门介绍
写在前面 GraphQL是一种新的API标准,它提供了一种更高效.强大和灵活的数据提供方式.它是由Facebook开发和开源,目前由来自世界各地的大公司和个人维护.GraphQL本质上是一种基于api ...
- GraphQL入门3(Mutation)
创建一个新的支持Mutation的Schema. var GraphQLSchema = require('graphql').GraphQLSchema; var GraphQLObjectType ...
- 《分享》Graphql入门与实践
最近项目用到了graphql,学习了一些并在公司做了一个小分享,希望对你有帮助 一.介绍 Graphql是一种面向数据的API查询语言 Graphql给前端提供一种强力的查询工具,我们可以根据自己定义 ...
- GraphQL快速入门教程
摘要: 体验神奇的GraphQL! 原文:GraphQL 入门详解 作者:MudOnTire Fundebug经授权转载,版权归原作者所有. GraphQL简介 定义 一种用于API调用的数据查询语言 ...
- 前端从零开始学习Graphql
学习本姿势需要电脑装有node,vue-cli相关环境,以及要有node,express,koa,vue相关基础 本文相关demo的github地址: node服务:https://github.co ...
随机推荐
- 【gearman】学习笔记
学习资料:http://gearman.org/manual/ 1.Gearman是跨语言的,client和worker可以用不同的语言来实现 2.client与job server之间的交互称为ta ...
- pytest六:parametrize-参数化
pytest.mark.parametrize 装饰器可以实现测试用例参数化. 1.这里是一个实现检查一定的输入和期望输出测试功能的典型例子 import pytest @pytest.mark.pa ...
- RabbitMQ(四): rabbitmq 的消息确认机制(事务+confirm)
在 rabbitmq 中我们可以通过持久化数据解决 rabbitmq 服务器异常的数据丢失问题. 问题:生产者将消息发送出去之后,消息到底有没有到达 rabbitmq 服务器.默认情况下是不知道的. ...
- JQUery利用Uploadify插件实现文件异步上传(十一)
一:简介: Uploadify是JQuery的一个上传插件,实现的效果非常好,带进度显示 ,且Ajax异步,能一次性上传多个文件,功能强大,使用简单 1.支持单文件或多文件上传,可控制并发上传的文件数 ...
- Array,ArrayList,泛型List比较
在C#中数组Array,ArrayList,泛型List都能够存储一组对象,但是在开发中根本不知道用哪个性能最高,下面我们慢慢分析分析. 一.数组Array 数组是一个存储相同类型元素的固定大小的顺序 ...
- 解决git仓库从http转为ssh所要处理的问题
https://www.cnblogs.com/lusecond/p/7607198.html 为了方便,一般我们克隆仓库的时候会选择http或者https协议 git clone https://g ...
- Spring之配置文件bean作用域的详细介绍
Spring的配置文件applicationContext.xml中bean作用域的详细介绍: 1:对象的创建:单例和多例 scope="singleton",默认值 ...
- xftp和xshell有什么区别
XshellXshell是一个用于MS Windows平台的强大的SSH,TELNET,和RLOGIN终端仿真软件.它使得用户能轻松和安全地从Windows PC上访问Unix/Linux主机.Xft ...
- mongo3.x配置说明
Mongodb 3.x配置说明,本文内容忽略了Enterprise版和一些不常用的配置. 一.配置说明 在Mongod安装包中,包含2个进程启动文件:mongod和mongos:其中mongd是核心基 ...
- UOJ Round #1 题解
题解: 质量不错的一套题目啊..(题解也很不错啊) t1: 首先暴力显然有20分,把ai相同的缩在一起就有40分了 然后会发现由于原来的式子有个%很不方便处理 so计数题嘛 考虑一下容斥 最终步数=初 ...