来源：https://medium.com/wesionary-team/create-graphql-server-with-node-js-express-apollo-server-cfe1dab9571a
https://github.com/UjjwolKayastha/graphQL-express-api
本教程将指导您创建一个可以同时为graphQL和rest服务器服务的简单服务器。首先，让我们来了解一下这些术语的官方定义。
GraphQL
GraphQL是一种api的查询语言，也是一种使用现有数据实现这些查询的运行时。GraphQL为API中的数据提供了一个完整的、可理解的描述，为客户端提供了精确地要求他们所需要的东西的能力，使API随着时间的推移更容易发展，并支持强大的开发人员工具。
Apollo GraphQL
通过将api、数据库和微服务组合成可以用GraphQL查询的单个数据图，简化了应用程序开发。
为此，我们使用“apollo-server-express”，这样我们就可以同时托管express和graphQL服务器。然而，为了创建单独的GraphQL服务器，我们将使用“apollo-server”。
Express
快速、无约束、极简的Node.js web框架。
让我们开始构建服务器。
选择您选择的目录来创建项目目录。
mkdir GraphQL-Express
使用terminal打开文件夹目录。输入“npm init -y”命令初始化nodejs项目。这将在当前目录中生成package.json文件。
让我们安装所需的依赖项:
你可以使用yarn或npm来安装依赖项。在本教程中，我将使用yarn。
yarn add nodemon graphql express apollo-server dotenv apollo-server-express
包装说明:
nodemon:帮助开发基于node.js的应用程序的工具，当检测到目录中的文件发生变化时，它会自动重启节点应用程序。
graphql: graphql模块导出graphql功能的核心子集，用于创建graphql类型的系统和服务器。
express:最小且灵活的Node.js web应用框架，为web和移动应用程序提供了一组健壮的特性。
apollo-server:创建简单的GraphQL服务器
apollo-server-express: community-maintained开源GraphQL服务器使用许多Node.js HTTP服务器框架。
dotenv: zero-dependency模块将环境变量从.env文件加载到process.env。
在本教程中，我将创建一个单独的express服务器和GraphQL服务器，然后将它们集成到一个服务于rest端点和GraphQL的服务器中。
让我们创建express服务器:
在那之前，让我们用“start”脚本更新我们的package.json:
package.json文件应该是这样的:
{
"name":"graphQL",
"version":"1.0.0",
"description":"",
"main":"index.js",
"scripts": {
"start":"nodemon server.js",
"test":"echo\"Error: no test specified\"&& exit 1"
},
"keywords": [],
"author":"",
"license":"ISC",
"dependencies": {
"apollo-server-express":"^2.19.1",
"dotenv":"^8.2.0",
"express":"^4.17.1",
"graphql":"^15.4.0",
"nodemon":"^2.0.6"
}
}
1、在根目录下创建server.js和.env文件，并输入以下代码。
touch server.js .env
在.env文件中添加以下代码:PORT=8000并保存文件。
const express = require("express");
require("dotenv").config();
//express server
const app = express();
app.get("/rest", (req, res) => {
res.json({
data: "API is working...",
});
});
app.listen(process.env.PORT, () => {
console.log(`🚀 Server is running at http://localhost:${process.env.PORT}`);
});
现在我们的服务器准备好了。
输入yarn start启动我们的express服务器。登录http://localhost:8000/rest，响应如下:
现在，让我们创建graphQL服务器。
在根目录下创建gql-server.js文件，并输入以下代码。
touch gql-server.js
const { ApolloServer } = require("apollo-server");
require("dotenv").config();
//graphql server
//types query/mutation/subscription
const typeDefs = `
type Query {
totalPosts: Int!
}
`;
//resolvers
const resolvers = {
Query: {
totalPosts: () => 42,
},
};
const apolloServer = new ApolloServer({
typeDefs,
resolvers,
});
apolloServer.listen(process.env.PORT, () => {
console.log(`🚀 GRAPHQL Server is running at http://localhost:${process.env.PORT}`);
});
不要忘记更改package.json启动脚本以运行“gql-server.js”文件。
"scripts": {
"start": "nodemon server.js",
"test": "echo \"Error: no test specified\" && exit 1"
}
我们的Graphql默认托管在http://localhost:8000/graphql中
yarn开始启动GraphQL服务器，该服务器响应Playground如下:在查询时，我们得到以下响应。
（注意：库中调用的远端的js文件，可能不能正常显示）
最后，是时候将这些服务器集成到一起了。
我们将处理我们的server.js文件。
注意:不要忘记撤销package.json文件中的更改以运行server.js文件。
更新你的server.js文件，使它看起来像这样:
const { ApolloServer } = require("apollo-server-express");
const express = require("express");
require("dotenv").config();
//graphql server
//types query/mutation/subscription
const typeDefs = `
type Query {
totalPosts: Int!
}
`;
//resolvers
const resolvers = {
Query: {
totalPosts: () => 42,
},
};
const apolloServer = new ApolloServer({
typeDefs,
resolvers,
});
//express server
const app = express();
apolloServer.applyMiddleware({ app });
app.get("/rest", (req, res) => {
res.json({
data: "API is working...",
});
});
app.listen(process.env.PORT, () => {
console.log(`🚀 Server is running at http://localhost:${process.env.PORT}`);
});
在这里,变化是:
1、导入的apollo-server-express包:与现有的express服务器集成。
2、为了实现集成，我们使用了express server作为aploserver的中间件。
apolloServer.applyMiddleware({app});
完成所有更改后，yarn开始启动为rest端点和graphQL服务的集成服务器。
现在我们可以检查我们的浏览器
1. http://localhost:8000/rest
2. 如上述截图所示，请访问http://localhost:8000/graphql。
其它：https://blog.appsignal.com/2020/06/03/building-apis-with-graphql-in-your-node-application.html
https://getstream.io/blog/tutorial-create-a-graphql-api-with-node-mongoose-and-express/
https://dev.to/givehug/next-js-apollo-client-and-server-on-a-single-express-app-55l6
https://sysgears.com/articles/how-to-create-an-apollo-react-express-application/
https://www.freecodecamp.org/news/apollo-graphql-how-to-build-a-full-stack-app-with-react-and-node-js/
网友评论