备案控制台
开发者社区 开发与运维 文章 正文

NodeJs中使用Apollo Server构建GraphQL API服务

2022-06-25 626
版权
版权声明：
本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《 阿里云开发者社区用户服务协议》和 《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写 侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
简介： GraphQL是一种通过强类型查询语言构建api的新方法。GraphQL于2015年由Facebook发布，目前正迅速获得关注，并被Twitter和Github等其他大型公司所采用，之前写过一篇《浅谈NodeJS搭建GraphQL API服务》只是简单介绍构建API。在本文中，我们将介绍如何使用Apollo Server在Node.js中设置GraphQL服务器。

image.png

GraphQL是一种通过强类型查询语言构建api的新方法。GraphQL于2015年由Facebook发布，目前正迅速获得关注，并被Twitter和Github等其他大型公司所采用，之前写过一篇《浅谈NodeJS搭建GraphQL API服务》只是简单介绍构建API。在本文中，我们将介绍如何使用Apollo Server在Node.js中设置GraphQL服务器。

服务器上GraphQL的高级概述

一旦熟悉了所有的活动部件，GraphQL的上手实际上就非常简单。GraphQL服务是通过一个模式定义的，其工作原理大致如下:

image.png

Types：类型

类型是数据模型的强类型表示，这是一个使用Apollo的graphql-tools定义的帖子类型的示例，在本教程中将使用它来定义架构。

import User from "./user_type";
const Post = `
  type Post {
    id: Int!
    title: String!
    body: String!
    author_id: Int!
    author: User
  }
`;
export default () => [Post, User];


Queries：查询

查询是定义可以针对架构运行哪些查询的方式，这是模式的RootQuery中的一个查询的示例；

const RootQuery = `
  type RootQuery {
    posts: [Post]
    post(id:Int!): Post
    users: [User]
    user(id:Int!): User
  }
`;


Mutations：更改

更改（Mutations）类似于post请求（尽管它们实际上只是查询的同步版本），它们允许将数据发送到服务器以执行插入、更新或者删除。下面是一个为新博客文章定义更改（Mutations）的例子，它接受输入类型PostInput并将新创建的文章作为post类型返回。

const RootMutation = `
  type RootMutation {
    createPost(input: PostInput!): Post
  }
`;


Subscriptions：订阅

订阅允许通过GraphQL订阅服务器发布实时事件，下面定义了一个订阅的示例：

const RootSubscription = `
  type RootSubscription {
    postAdded(title: String): Post
  }
`;


现在，可以通过在createPost突变解析器中运行此事件，将事件发布到订阅的事件。

pubsub.publish(‘postAdded’, { postAdded: post });


Resolvers：解析器

解析器是执行操作以响应查询、变异或订阅的地方，在这里，可以进入数据库层执行CRUD操作并返回适当的响应。如下的示例：

resolvers: {
  RootQuery: {
    posts: () => posts,
    post: async (_, { id }) => 
      await Post.query()
  },
  RootMutations: {
    createPost: async (_, { input }) => 
      await Post.query.insert(input)
  },
  RootSubscriptions: {
    postAdded: {
    subscribe: () => 
      pubsub.asyncIterator('postAdded')
  },
  Post: {
    author: async post => 
      await User.query().where("id", "=", post.author_id)
  }
}


Schema：模式

模式（Schema）是将所有活动部分连接在一起，构建服务的API。

开始进入项目

如果想要查看的代码，请在此处找到一个仓库。

安装依赖

首先创建一个项目，这里命名为：graphql-hello-api

mkdir graphql-hello-api


然后进入目录，执行一下命令：

yarn init


添加必须的依赖：

yarn add apollo-server graphql


创建Hello

创建一个名为src的文件夹，为了更好展示整个过程，不同的示例命名为不同的文件名称，先来创建一个文件：index001.js。

首先定义了一个查询类型：

const typeDefs = gql`
    type Query {
        hello: String
    }
`;


接下来定义解析器（或GraphQL教程中的根）来解析给定的查询：

const resolvers = {
    Query: {
        hello: () => {
            return "Hello World!";
        },
    },
};


最后，实例化ApolloServer，然后启动服务。

const server = new ApolloServer({ typeDefs, resolvers });
server.listen(3005).then(({ url }) => {
    console.log(`🚀 GraphQL Server ready at ${url}`);
});


index001.js的所有代码如下：

const { ApolloServer, gql } = require("apollo-server");
const typeDefs = gql`
    type Query {
        hello: String
    }
`;
const resolvers = {
    Query: {
        hello: () => {
            return "Hello World!";
        },
    },
};
const server = new ApolloServer({ typeDefs, resolvers });
server.listen(3005).then(({ url }) => {
    console.log(`🚀 GraphQL Server ready at ${url}`);
});


下面我们来启动GraphQL Server，进入文件夹src，执行如下命令，打开浏览器，输入http://localhost:3005/：

node index001.js


将看下如下界面：

image.png

按照上面的图的步骤，录入定义的查询{hello}，运行结果如下：

image.png

GraphQL查询的基本类型可以由字符串、整数、浮点数、布尔值和ID及其列表[]组成，下面开始添加一些逻辑代码。

在这里，使用不同的类型如下定义typeDefs。这!表示不可为空的结果。接下来我们创建index002.js，定义3个查询，分别为字符串、浮点数和[]。

const typeDefs = gql`
    type Query {
        today: String
        random: Float!
        fibonacci: [Int]
    }
`;


相应地设置解析器，如下：

const resolvers = {
    Query: {
        today: () => {
            return new Date().toDateString();
        },
        random: () => {
            return Math.random();
        },
        fibonacci: () => {
            return fibonacci(10);
        },
    },
};


现在可以看看完整的代码，即index.js的完整代码：

const { ApolloServer, gql } = require("apollo-server");
const fibonacci = (length) => {
    let nums = [0, 1];
    for (let i = 2; i <= length; i++) {
        nums[i] = nums[i - 1] + nums[i - 2];
    }
    return nums;
};
const typeDefs = gql`
    type Query {
        today: String
        random: Float!
        fibonacci: [Int]
    }
`;
const resolvers = {
    Query: {
        today: () => {
            return new Date().toDateString();
        },
        random: () => {
            return Math.random();
        },
        fibonacci: () => {
            return fibonacci(10);
        },
    },
};
const server = new ApolloServer({ typeDefs, resolvers });
server.listen(3005).then(({ url }) => {
    console.log(`🚀 GraphQL Server ready at ${url}`);
});


运行结果如下：

image.png

传递参数

现在来展示如何使用查询将一些参数传递给服务器，创建index003.js，本示例我们将定义查询获取一个指定长度的斐波那契数组，定义参数length。代码如下：

const typeDefs = gql`
    type Query {
        fibonacci(length:Int!): [Int]
    }
`;


接下来就是解析器，请注意，使用Apollo Server时，它的API于GraphQL API略有不同。参数通过第二个参数传递，格式为：fibonacci: (_, { length })，这里暂时忽略带有_的第一个参数。

const resolvers = {
    Query: {
        fibonacci: (_, { length }) => {
            return fibonacci(length);
        },
    },
};


这里是完整的代码：

const { ApolloServer, gql } = require("apollo-server");
const fibonacci = (length) => {
    let nums = [0, 1];
    for (let i = 2; i <= length; i++) {
        nums[i] = nums[i - 1] + nums[i - 2];
    }
    return nums;
};
const typeDefs = gql`
    type Query {
        fibonacci(length: Int!): [Int]
    }
`;
const resolvers = {
    Query: {
        fibonacci: (_, { length }) => {
            return fibonacci(length);
        },
    },
};
const server = new ApolloServer({ typeDefs, resolvers });
server.listen(3005).then(({ url }) => {
    console.log(`🚀 GraphQL Server ready at ${url}`);
});


在左边窗口输入查询：

{
  fibonacci(length:10)
}


运行结果如下：

image.png

对象类型

有时需要返回一个由基本类型构造的更复杂的对象，可以通过为它声明一个类（JavaScript ES6）类型来实现，新建一个文件index004.js，完整代码如下：

const { ApolloServer, gql } = require("apollo-server");
/**
 * 定义一个基础查询，返回查询RandomDie
 */
const typeDefs = gql`
    type RandomDie {
        numSides: Int!
        rollOnce: Int!
        roll(numRolls: Int!): [Int]
    }
    type Query {
        getDie(numSides: Int): RandomDie
    }
`;
class RandomDie {
    constructor(numSides) {
        this.numSides = numSides;
    }
    rollOnce() {
        return 1 + Math.floor(Math.random() * this.numSides);
    }
    roll({ numRolls }) {
        const output = [];
        for (let i = 0; i < numRolls; i++) {
            output.push(this.rollOnce());
        }
        return output;
    }
}
const resolvers = {
    Query: {
        getDie: (_, { numSides }) => {
            return new RandomDie(numSides || 6);
        },
    },
};
const server = new ApolloServer({ typeDefs, resolvers });
server.listen(3005).then(({ url }) => {
    console.log(`🚀 GraphQL Server ready at ${url}`);
});


在录入查询的时候就当调用getDie作为基础查询，如下：

{
  getDie(numSides:6){
    numSides,
    rollOnce,
    roll(numRolls:10)
  }
}


运行结果如下：

image.png

使用mutation

前面介绍了Mutations：更改，如果要修改服务器端数据，需要使用mutation代替query，创建index005.js。

const { ApolloServer, gql } = require("apollo-server");
const fakeDb = {};
const typeDefs = gql`
    type Mutation {
        setTitle(title: String): String
    }
    type Query {
        getTitle: String
    }
`;
const resolvers = {
    Mutation: {
        setTitle: (_, { title }) => {
            fakeDb.title = title;
            return title;
        },
    },
    Query: {
        getTitle: () => {
            return fakeDb.title;
        },
    },
};
const server = new ApolloServer({ typeDefs, resolvers });
server.listen(3005).then(({ url }) => {
    console.log(`🚀 GraphQL Server ready at ${url}`);
});


输入查询：

mutation{
  setTitle(title:"Hello DevPoint!")
}


执行结果如下：image.png


输入类型

有时希望将同类信息设计在一个对象里面进行维护或者规范输入，可以按照接口的方式定义输入类型结构，创建 index006.js，实现一个维护网站基本信息的示例，整体代码如下：

const { ApolloServer, gql } = require("apollo-server");
const { nanoid } = require("nanoid");
const typeDefs = gql`
    input SiteInput {
        title: String
        author: String
        url: String
    }
    type SiteDetail {
        id: ID!
        title: String
        author: String
        url: String
    }
    type Query {
        getSite(id: ID!): SiteDetail
    }
    type Mutation {
        createSite(input: SiteInput): SiteDetail
        updateSite(id: ID!, input: SiteInput): SiteDetail
    }
`;
class SiteDetail {
    constructor(id, { author, title, url }) {
        this.id = id;
        this.title = title;
        this.author = author;
        this.url = url;
    }
}
const fakeDb = {};
const resolvers = {
    Mutation: {
        createSite: (_, { input }) => {
            var id = nanoid();
            fakeDb[id] = input;
            return new SiteDetail(id, input);
        },
        updateSite: (_, { id, input }) => {
            if (!fakeDb[id]) {
                throw new Error("信息不存在 " + id);
            }
            fakeDb[id] = input;
            return new SiteDetail(id, input);
        },
    },
    Query: {
        getSite: (_, { id }) => {
            if (!fakeDb[id]) {
                throw new Error("信息不存在 " + id);
            }
            return new SiteDetail(id, fakeDb[id]);
        },
    },
};
const server = new ApolloServer({ typeDefs, resolvers });
server.listen(3005).then(({ url }) => {
    console.log(`🚀 GraphQL Server ready at ${url}`);
});


执行node index006.js运行，输入一下语句创建一个site信息对象，并查询新创建对象的ID：

mutation{
  createSite(input:{
    title:"DevPoint",
    author:"QuintionTang",
    url:"https://www.devpoint.com"}
  ){
    id
  }
}


运行结果如下：

image.png

接下来根据返回的ID，查询信息：

query{
  getSite(id:"w3pFxgiCyHgZ8vF6ip1D2"){
    id,
    author,
    title,
    author
  }
}


运行结果如下：

image.png

执行更新操作并查询最新数数据：

mutation{
  updateSite(id:"w3pFxgiCyHgZ8vF6ip1D2",input:{
    title:"DevPoint WebSite"
  }){
    id,
    title,
    author
  }
}


运行结果如下：

image.png

验证

之前有朋友问到是否有统一验证的地方。

GraphQL有没有统一的入口可以验证参数的有效性？

答案是有的，可以使用GraphQL的context在HTTP服务器和GraphQL服务器之间实现身份验证。通过自定义context构建功能，实现请求及用户权限的验证。本文只是简单介绍一下，下期专门写一遍GraphQL中的身份及请求合法性验证文章。

const server = new ApolloServer({
    typeDefs,
    resolvers,
    context: ({ req }) => {
        // 在这里进行请求验证
        const author = "QuintionTang";
        return { author };
    },
});


上面所有代码都提交到Github上了，github.com/QuintionTan…。

文章标签：
JavaScript
前端开发
API
数据库
关键词：
node.js API
node.js构建
API服务
API Server
构建API服务
天行无忌
目录
相关文章
牵着猫散步的鼠鼠
|
1天前
|
Kubernetes 安全 API
Kubernetes学习-集群搭建篇(三) Node配置完善和API概述
Kubernetes学习-集群搭建篇(三) Node配置完善和API概述
牵着猫散步的鼠鼠
13 3
Kubernetes学习-集群搭建篇(三) Node配置完善和API概述
ModelScope内容运营小助手
|
3天前
|
安全 API 开发者
智能体-Agent能力升级！新增Assistant API & Tools API服务接口
ModelScope-Agent是一个交互式创作空间，它支持LLM（Language Model）的扩展能力，例如工具调用（function calling）和知识检索（knowledge retrieval）。它已经对相关接口进行了开源，以提供更原子化的应用LLM能力。用户可以通过Modelscope-Agent上的不同代理（agent），结合自定义的LLM配置和消息，调用这些能力。
ModelScope内容运营小助手
39 4
请看我回答~
|
12天前
|
负载均衡 Java API
构建高效微服务架构：API网关与服务熔断策略
【5月更文挑战第2天】 在微服务架构中，确保系统的高可用性与灵活性是至关重要的。本文将深入探讨如何通过实施有效的API网关和设计合理的服务熔断机制来提升分布式系统的鲁棒性。我们将分析API网关的核心职责，包括请求路由、负载均衡、认证授权以及限流控制，并讨论如何利用熔断器模式防止故障传播，维护系统的整体稳定性。文章还将介绍一些实用的技术和工具，如Netflix Zuul、Spring Cloud Gateway以及Hystrix，以帮助开发者构建一个可靠且高效的微服务环境。
请看我回答~
26 2
1941623231718325
|
13天前
|
缓存 监控 JavaScript
Node.js中构建RESTful API的最佳实践
【4月更文挑战第30天】本文介绍了在Node.js中构建RESTful API的最佳实践：选择合适的框架（如Express、Koa）、设计清晰的API接口（遵循HTTP动词和资源路径）、实现认证授权（JWT、OAuth 2.0）、错误处理、限流缓存、编写文档和测试，以及监控性能优化。这些实践有助于创建健壮、可维护和易用的API。
1941623231718325
25 0
请看我回答~
|
14天前
|
机器学习/深度学习 算法 安全
深度学习在图像识别中的应用与挑战构建高效可扩展的RESTful API：后端开发的实战指南
【4月更文挑战第30天】 随着计算机视觉技术的飞速发展，深度学习在图像识别领域取得了显著的成果。本文将探讨深度学习技术在图像识别中的应用及其所面临的挑战。首先，我们将介绍深度学习的基本原理和关键技术，然后分析其在图像识别中的优势和应用案例。最后，我们将讨论当前深度学习在图像识别领域所面临的主要挑战和未来的发展趋势。
请看我回答~
27 2
1941623231718325
|
14天前
|
JavaScript API 开发者
深入了解Node.js的文件系统：Node.js文件系统API的使用与探索
【4月更文挑战第30天】本文深入探讨了Node.js的文件系统API，介绍了如何引入`fs`模块进行文件操作。内容包括异步读取和写入文件、删除文件、创建目录以及使用文件流进行高效操作。此外，还提到了文件系统的监视功能，帮助开发者全面掌握在Node.js中处理文件和目录的方法。
1941623231718325
22 0
皮牙子抓饭
|
14天前
|
缓存 监控 API
构建高性能的RESTful API：最佳实践与性能优化技巧
【4月更文挑战第28天】
皮牙子抓饭
22 0
cuicuicuic
|
15天前
|
弹性计算 运维 Serverless
Serverless 应用引擎产品使用之在阿里函数计算中，使用阿里云API或SDK从函数计算调用ECS实例的服务如何解决
阿里云Serverless 应用引擎（SAE）提供了完整的微服务应用生命周期管理能力，包括应用部署、服务治理、开发运维、资源管理等功能，并通过扩展功能支持多环境管理、API Gateway、事件驱动等高级应用场景，帮助企业快速构建、部署、运维和扩展微服务架构，实现Serverless化的应用部署与运维模式。以下是对SAE产品使用合集的概述，包括应用管理、服务治理、开发运维、资源管理等方面。
cuicuicuic
42 4
三分钟热度的鱼
|
15天前
|
机器学习/深度学习 人工智能 API
人工智能平台PAI产品使用合集之机器学习PAI-EAS部署好后，服务的公网API和URL怎么配置
阿里云人工智能平台PAI是一个功能强大、易于使用的AI开发平台，旨在降低AI开发门槛，加速创新，助力企业和开发者高效构建、部署和管理人工智能应用。其中包含了一系列相互协同的产品与服务，共同构成一个完整的人工智能开发与应用生态系统。以下是对PAI产品使用合集的概述，涵盖数据处理、模型开发、训练加速、模型部署及管理等多个环节。
三分钟热度的鱼
34 0
桃李春风一杯酒
|
16天前
|
缓存 前端开发 JavaScript
【专栏】GraphQL，Facebook 开发的API查询语言，正在前端开发中崭露头角
【4月更文挑战第27天】GraphQL，Facebook 开发的API查询语言，正在前端开发中崭露头角。它提供强类型系统、灵活查询和实时更新，改善数据获取效率和开发体验。掌握GraphQL涉及学习基础概念、搭建开发环境和实践应用。结合前端框架，利用缓存和批量请求优化性能，与后端协作设计高效API。尽管有挑战，但GraphQL为前端开发开辟新道路，引领未来趋势。一起探索GraphQL，解锁前端无限可能！
桃李春风一杯酒
23 2

热门文章

最新文章

  • 1
    node与npm版本对应关系以及使用nvm管理node版本
  • 2
    监控内网电脑软件设计与实现：基于Node.js的服务器端架构分析
  • 3
    如何在 Ubuntu 20.04 上安装 Node.js 和 npm
  • 4
    Node.js编写CLI的实践
  • 5
    如何在2016年成为一个更好的Node.js开发者
  • 6
    Node.js创建第一个应用
  • 7
    【nodejs】让nodejs像后端mvc框架（asp.net mvc ）一样处理请求--控制器的声明定义和发现篇（3/8）
  • 8
    nodejs下用es6编程babel和gulp的配合应用
  • 9
    nodeJS常用的定时执行任务的插件
  • 10
    Node 抓取非utf-8编码页面
  • 1
    常用JavaScript 数组 API大全
    37
  • 2
    JavaScript循环遍历常用的7种方法以及常用的数组 API
    37
  • 3
    解释如何在 Python 中实现 Web 服务（RESTful API）。
    31
  • 4
    Java 8新特性之Lambda表达式和Stream API
    25
  • 5
    视觉智能平台常见问题之抠人脸的api如何解决
    33
  • 6
    亚马逊API接口获取商品详情的全面指南
    106
  • 7
    从API到Agent：万字长文洞悉LangChain工程化设计
    123
  • 8
    如何在Linux使用docker部署Swagger Editor并实现无公网IP远程协同编辑API文档
    53
  • 9
    虾皮Shopee根据ID取商品详情API
    39
  • 10
    谷歌发布MediaPipe LLM Inference API，28亿参数模型本地跑
    99

    • 相关课程

    更多
  • 体验-K8S API 基础及Pod 基本应用
  • Node.js 入门与实战
  • Node.js 入门教程文档
  • Python Web 框架 Flask 快速入门
  • Python Web 框架 Django 快速入门

    • 相关电子书

    更多
  • CUDA MATH API
  • API PLAYBOOK
  • 传统企业的“+互联网”-API服务在京东方的实践

    • 相关实验场景

    更多
  • 快速体验智能体API应用
  • 前端开发基础6：Node.js和LESS预编译工具
  • Elasticsearch Java API Client 开发
  • Web Terminal环境使用指南
  • 搭建Node.js编程环境
    • 下一篇
    部署LAMP环境（Alibaba Cloud Linux 3）