博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
GraphQL入门1
阅读量:7244 次
发布时间:2019-06-29

本文共 2396 字,大约阅读时间需要 7 分钟。

1. 资源:

     主站:

     中文站:

     入门视频: 这个网址中向下拉, 会看到这个入门视频:

   

 

   从第15分钟看到第30分钟就可以.

   官方Tutorial: https://graphql.org/graphql-js/mutations-and-input-types/ 

2. 服务器端代码示例.

     a) 首先用VS2013新建一个Node.js express 4项目.

      

 

 

 b) 添加一个router, 当然也可以直接用app.js.这里为了不影响其他router, 新建了一个router.

  

 

 

 

c) GraphQL.js的内容如下:

var express = require('express');

var graphQLHTTP = require('express-graphql');

var schema = require('../schemas/Schema1');

var router = express.Router();

 

router.use(graphQLHTTP({

    schema: schema,

    graphiql : true

}));

 

module.exports = router;

 

d) Schema1.js 的内容如下:

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');

 

var BASE_URL = 'http://localhost:3000';

 

function getPersonByUrl(relativeURL) {

    return { first_name: "Wang", last_name: "Tom" };

 

    //fetch('${BASE_URL}${relativeURL}')

    //    .then(function (res) { return res.json() })

    //    .then(function (json) { return json.person })

}

 

var PersonType = new GraphQLObjectType({

    name: 'Person',

    description: '...',

    fields: {

        firstName: {

            type: GraphQLString,

            resolve : function (person) {

               return person.first_name

            }

        },

        lastName: {

            type: GraphQLString,

            resolve : function (person) {

                return person.last_name

            }

        },

        //email: { type: GraphQLString },

        //userName: { type: GraphQLString },

        //id: { type: GraphQLString },

        //friends: {

        //    type: GraphQLList(PersonType),

        //    resolve: function (person) {

        //        return person.friends.map(getPersonByUrl);

        //    }

        //}

    }

});

 

var QueryType = new GraphQLObjectType({

    name: 'Query',

    desription: '...',

    fields: {

        person: {

            type: PersonType,

            args: {

                id: {type: GraphQLString}

            },

            resolve: function () { return getPersonByUrl('/people/${args.id}') }

        }

    }

   

});

 

var GraphQLSchemaObj = new GraphQLSchema({

    query: QueryType

});

 

 

module.exports = GraphQLSchemaObj;

 

e) 代码中用到的node module都要装上.

f) VS中按F5运行起来后, <新建的router>就是基于GraphQL建立的router.

    访问 , 输入查询就可以看到结果.

    

 

     router中的graphiql : true参数应该就是控制是否有这个测试页面的.

 

3. 客户端代码示例:

   a) 建立一个Node console application.

 

 

   b) 在app.js中写入如下的代码:

 

 

 

console.log('Hello world');

 

var gRequest = require('graphql-request').request;

 

const query = '{'

            + ' person(id:"1"){'

            + '    firstName'

            + '  }'

            + '}';

 

gRequest('http://localhost:1337/graphql/graphql', query).then(function (data) { console.log(data) });

 

   执行node app.js后,结果如下:

 

 

 

4. 上面说的都是Node.js的版本, 其他语言的服务器和客户端的API看这个页面:

 

转载地址:http://zhybm.baihongyu.com/

你可能感兴趣的文章
在 Linux 上用火狐浏览器保护你的隐私
查看>>
《Hadoop MapReduce性能优化》一1.4 影响MapReduce性能的因素
查看>>
阿里云容器服务-高可用Kubernetes部署指南
查看>>
Make 命令教程
查看>>
Storm-源码分析-Stats (backtype.storm.stats)
查看>>
Java FP: 伪造闭包工厂,创建域对象
查看>>
《Linux C编程从入门到精通》一2.3 Linux中的代码编辑器vim
查看>>
《Redis入门指南》一5.1 PHP与Redis
查看>>
《Hack与HHVM权威指南》——1.6.2 未决的类型
查看>>
RPC综述 - PB, Thrift, Avro
查看>>
userdel 命令 - 从Linux系统中删除用户账户
查看>>
《Visual C++ 开发从入门到精通》——1.4 技术解惑
查看>>
属于自己的持续集成系统
查看>>
Java核心技术卷I基础知识2.4 运行图形化应用程序
查看>>
android 减少图片出现oom错误
查看>>
《C语言及程序设计》实践项目——循环嵌套
查看>>
阿里价值“千万”的秒杀场景参数优化
查看>>
互联网创业公司黑话指南,很严肃的,不许笑!
查看>>
设计模式之适配器模式
查看>>
2017新年快乐特效
查看>>