GraphQL:Node.js代码实现简单例子

在这里插入图片描述
GraphQL 是一种针对 Graph(图状数据)进行查询特别有优势的 Query Language(查询语言)

文档:
国内:https://graphql.cn/
国外:https://graphql.org/

一、一个简单的例子

文档:https://graphql.cn/graphql-js/

依赖

npm i --save graphql

示例

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

// 使用 GraphQL schema language 构建一个 schema
var schema = buildSchema(`
  type Query {
    hello: String
  }
`);

// 根节点为每个 API 入口端点提供一个 resolver 函数
var root = {
  hello: () => {
    return 'Hello world!';
  },
};

// 运行 GraphQL query '{ hello }' ,输出响应
graphql(schema, '{ hello }', root).then((response) => {
  console.log(response);
});

二、整合Express提供API服务

依赖

npm i --save express  express-graphql graphql cors axios

服务端 server.js

const express = require("express");
const cors = require("cors"); // 用来解决跨域问题

const { graphqlHTTP } = require("express-graphql");
const { buildSchema } = require("graphql");

// 创建 schema
// 1. 感叹号 ! 代表 not-null
const schema = buildSchema(`
  type Query {
    username: String
    age: Int!
  }
`);


//定义服务端数据
const root = {
  username: () => {
    return "李华";
  },
  age: () => {
    return Math.ceil(Math.random() * 100);
  },
};

const app = express();
app.use(cors());
app.use("/graphql", graphqlHTTP({
    schema: schema,
    rootValue: root,
    graphiql: true,  // 启用GraphiQL
  })
);

app.listen(3300, ()=>{
    console.log("Running a GraphQL API server at http://localhost:3300/graphql");
});


可视化地址:http://localhost:3300/graphql

客户端 client.js

const axios = require("axios");

let data = {
    query: '{username, age}'
}

axios.post("http://localhost:3300/graphql", data).then((res) => {
  console.log(res.data.data);
});
// { username: '李华', age: 26 }

参考
我为什么放弃RESTful,全面拥抱GraphQL
GraphQL一个简单的入门示例
GraphQL示例代码

三、看一个复杂一点的例子

用户User - 博客Blog - 地址Address 三者存在的一对一,一对多关系

服务端代码

var express = require("express");
var { graphqlHTTP } = require("express-graphql");
var {
  GraphQLSchema,
  GraphQLObjectType,
  GraphQLID,
  GraphQLString,
  GraphQLInt,
  GraphQLList,
} = require("graphql");

// 博客
var Blog = new GraphQLObjectType({
  name: "Blog",
  fields: {
    id: { type: GraphQLID },
    title: { type: GraphQLString },
    content: { type: GraphQLString },
    created_time: { type: GraphQLInt },
  },
});

// 地址
var Address = new GraphQLObjectType({
  name: "Address",
  fields: {
    id: { type: GraphQLID },
    name: { type: GraphQLString },
  },
});

// 用户 User 一对一 Address, User 一对多 Blog
var User = new GraphQLObjectType({
  name: "User",
  fields: {
    id: { type: GraphQLID },
    username: { type: GraphQLString },
    password: { type: GraphQLString },
    address: {
      type: Address,
      resolve(parent, args) {
        console.log(parent, args);
        return {
          id: parent.id,
          name: "name" + parent.id,
        };
      },
    },
    blogs: {
      type: new GraphQLList(Blog),
      args: {
        limit: { type: GraphQLInt },
      },
      resolve(parent, args) {
        console.log(parent, args);
        let list = [];
        for (let i =0; i < args.limit; i++) {
          list.push({
            id: i,
            title: "title" + i,
            content: "content" + i,
            created_time: i * 100,
          });
        }
        return list;
      },
    },
  },
});

var Query = new GraphQLObjectType({
  name: "Query",
  fields: {
    user: {
      type: User,
      args: {
        id: { type: GraphQLID },
      },
      resolve(parent, args) {
        console.log(parent, args);
        return {
          id: args.id,
          username: "admin" + args.id,
          password: "123456" + args.id,
        };
      },
    },
  },
});

var schema = new GraphQLSchema({
  query: Query,
});

//  express服务
var app = express();
app.use(
  "/graphql",
  graphqlHTTP({
    schema: schema,
    graphiql: true,
  })
);
app.listen(4000, () => {
  console.log("server at: http://localhost:4000/graphql");
});

客户端请求


const axios = require("axios");

let query = `
  {
    user(id: 3) {
      id
      username
      password
      blogs(limit: 2) {
        id
        title
        content
        created_time
      }
      address {
        id
        name
      }
    }
  }
`
axios.post("http://localhost:4000/graphql", {query}).then((res) => {
  console.log(res.data.data);
});
/**
{ user:
  { 
    id: '3',
    username: 'admin3',
    password: '1234563',
    blogs: [ [Object], [Object] ],
    address: { id: '3', name: 'name3' } 
  } 
}
 */ 

已标记关键词 清除标记
【为什么还需要学习C++?】 你是否接触很多语言,但从来没有了解过编程语言的本质? 你是否想成为一名资深开发人员,想开发别人做不了的高性能程序? 你是否经常想要窥探大型企业级开发工程的思路,但苦于没有基础只能望洋兴叹?   那么C++就是你个人能力提升,职业之路进阶的不二之选。 【课程特色】 1.课程共19大章节,239课时内容,涵盖数据结构、函数、类、指针、标准库全部知识体系。 2.带你从知识与思想的层面从0构建C++知识框架,分析大型项目实践思路,为你打下坚实的基础。 3.李宁老师结合4大国外顶级C++著作的精华为大家推出的《征服C++11》课程。 【学完后我将达到什么水平?】 1.对C++的各个知识能够熟练配置、开发、部署; 2.吊打一切关于C++的笔试面试题; 3.面向物联网的“嵌入式”和面向大型化的“分布式”开发,掌握职业钥匙,把握行业先机。 【面向人群】 1.希望一站式快速入门的C++初学者; 2.希望快速学习 C++、掌握编程要义、修炼内功的开发者; 3.有志于挑战更高级的开发项目,成为资深开发的工程师。 【课程设计】 本课程包含3大模块 基础篇 本篇主要讲解c++的基础概念,包含数据类型、运算符等基本语法,数组、指针、字符串等基本词法,循环、函数、类等基本句法等。 进阶篇 本篇主要讲解编程中常用的一些技能,包含类的高级技术、类的继承、编译链接和命名空间等。 提升篇: 本篇可以帮助学员更加高效的进行c++开发,其中包含类型转换、文件操作、异常处理、代码重用等内容。
©️2020 CSDN 皮肤主题: 编程工作室 设计师:CSDN官方博客 返回首页