使用node.js和mongodb創建GraphQl Server-js教程-PHP中文網

鑰匙要點

對於GraphQl，要了解我們需要定義架構的請求。 GraphQL模式不過是一組查詢和突變。您可以將查詢視為從數據庫中檢索和突變的資源，作為對數據庫的任何更新。我們將創建一個示例博客文章和評論貓鼬模型，然後我們將為其創建一些查詢和突變。

>讓我們從創建貓鼬模型開始。在這裡不會詳細介紹，因為貓鼬不是本文的重點。您可以在型號/blog-post.js和Models/comment.js。

喜歡貓鼬，在GraphQl中，我們需要定義數據結構。不同之處在於，我們為每個查詢定義和突變，可以輸入哪種類型的數據以及響應中發送的內容。如果這些類型不匹配，則會出現錯誤。儘管它看起來似乎是多餘的，但由於我們已經定義了貓鼬的模式模型，但它具有很大的優勢，例如：

>使用Mongoose模型和創建的GraphQL類型，我們現在可以創建我們的GraphQl架構。

結論

>如何為我的GraphQl Server設置MongoDB數據庫？

>為您的GraphQl Server設置MongoDB數據庫涉及多個步驟。首先，您需要在本地計算機上安裝MongoDB，或使用MongoDB Atlas等基於雲的MongoDB服務。安裝後，您可以創建一個新的數據庫和集合。然後，您可以使用MongoDB client從node.js應用程序連接到此數據庫。 Mongoose允許您為您的集合定義模式，並提供查詢和操縱數據的方法。

>如何優化我的GraphQl Server以進行性能？ >有幾種方法可以優化GraphQl Server進行性能。一種方法是將批處理和緩存與諸如DataLoader之類的庫中。這可以減少對MongoDB數據庫的請求數量並改善響應時間。另一種方法是使用持久的查詢，該查詢可以減少發送到服務器的請求的大小。您還可以使用監視工具（例如Apollo Studio）來識別和修復性能瓶頸。

>如何保護我的GraphQl Server？

首頁

web前端

js教程

使用node.js和mongodb創建GraphQl Server

Christopher Nolan

Feb 18, 2025 am 10:37 AM

使用node.js和mongodb創建GraphQl Server

鑰匙要點

>使用node.js並Express來建立服務器並將MongoDB與Mongoose集成以進行數據管理，從而增強了服務器有效地處理查詢和突變的能力。
>使用Express-GraphQL中間件在服務器上實現GraphQl，該中間件簡化了HTTP請求的處理和JSON響應的輸出，重點是創建用戶友好的JSON格式。
>>>>>
>使用Postman之類的工具來測試GraphQL端點，以驗證查詢和突變的設置和功能，以確保服務器對各種數據請求正確響應。
>

>從客戶端請求服務器的數據不是一個新概念。它允許應用程序加載數據而無需刷新頁面。這是單頁應用程序中最常使用的，該應用程序不是從服務器中獲取渲染頁面，而僅請求將其渲染在客戶端端所需的數據。

> 在過去幾年中，整個網絡上最常見的方法是其餘的建築風格。但是，這種方法給高數據需求應用帶來了一些局限性。在一個恢復的系統中，我們需要提出多個HTTP請求，以獲取我們想要的所有數據，這具有重大的性能影響。如果有一種方法在單個HTTP請求中請求多個資源怎麼辦？ > 介紹GraphQl，一種查詢語言，可以統一客戶端和服務器端之間的通信。它允許客戶端在單個請求中準確地描述所需的數據。

> 在本文中，我們將使用GraphQl路由創建一個Node.js/Express Server，該路由將處理我們所有的查詢和突變。然後，我們將通過發送一些帖子請求並使用Postman分析結果來測試此路線。

>您可以在此處找到此應用程序的完整源代碼。我還製作了一個郵遞員，您可以在此處下載。

>在Express Server上設置GraphQl端點

第一件事是使用Express Framework創建我們的Node.js服務器。我們還將將MongoDB與Mongoose一起用於數據持久性，而Babel使用ES6。由於該代碼在運行時被轉移到ES5，因此無需構建過程。這是在index.js中完成的：

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

登入後複製

>在app.js中，我們將啟動服務器，使用mongo數據庫連接並創建GraphQl路由。

在本文上下文中，上面代碼中最相對的部分是我們定義GraphQl路由的位置。我們使用Facebook GraphQL團隊開發的Express中間件Express-GraphQL。這將通過GraphQL處理HTTP請求並返回JSON響應。為此，我們需要在下一節中討論的GraphQL模式的選項中通過。我們還將選項設置為真實。這使JSON的響應非常印刷，使其更易於閱讀。

<span>// app.js
</span><span>import express from 'express';
</span><span>import graphqlHTTP from 'express-graphql';
</span><span>import mongoose from 'mongoose';
</span>
<span>import schema from './graphql';
</span>
<span>var app = express();
</span>
<span>// GraphqQL server route
</span>app<span>.use('/graphql', graphqlHTTP(req => ({
</span>  schema<span>,
</span>  <span>pretty: true
</span><span>})));
</span>
<span>// Connect mongo database
</span>mongoose<span>.connect('mongodb://localhost/graphql');
</span>
<span>// start server
</span><span>var server = app.listen(8080, () => {
</span>  <span>console.log('Listening at port', server.address().port);
</span><span>});
</span>

登入後複製

graphQl架構

對於GraphQl，要了解我們需要定義架構的請求。 GraphQL模式不過是一組查詢和突變。您可以將查詢視為從數據庫中檢索和突變的資源，作為對數據庫的任何更新。我們將創建一個示例博客文章和評論貓鼬模型，然後我們將為其創建一些查詢和突變。

> mongoose模型

>讓我們從創建貓鼬模型開始。在這裡不會詳細介紹，因為貓鼬不是本文的重點。您可以在型號/blog-post.js和Models/comment.js。

中找到兩個模型

GraphQl types

喜歡貓鼬，在GraphQl中，我們需要定義數據結構。不同之處在於，我們為每個查詢定義和突變，可以輸入哪種類型的數據以及響應中發送的內容。如果這些類型不匹配，則會出現錯誤。儘管它看起來似乎是多餘的，但由於我們已經定義了貓鼬的模式模型，但它具有很大的優勢，例如：

您控制允許的內容，可以改善您的系統安全

>您控制允許的內容。這意味著您可以定義特定字段以永遠不會被檢索。例如：密碼或其他敏感數據
>它過濾了無效的請求，因此不採取進一步的處理，可以改善服務器的性能

>在這裡，我們正在定義博客輸出graphql類型，在創建查詢和突變時，我們將進一步使用。請注意，結構與貓鼬模型Blogpost有多相似。這似乎可以重複工作，但這些是分開的關注點。 Mongoose模型定義了數據庫的數據結構，GraphQL類型定義了服務器的查詢或突變中所接受的規則。

<span>// graphql/types/blog-post.js
</span><span>import <span>{
</span></span><span>  <span>GraphQLObjectType,
</span></span><span>  <span>GraphQLNonNull,
</span></span><span>  <span>GraphQLString,
</span></span><span>  <span>GraphQLID
</span></span><span><span>}</span> from 'graphql';
</span>
<span>export default new GraphQLObjectType({
</span>  <span>name: 'BlogPost',
</span>  <span>fields: {
</span>    <span>_id: {
</span>      <span>type: new GraphQLNonNull(GraphQLID)
</span>    <span>},
</span>    <span>title: {
</span>      <span>type: GraphQLString
</span>    <span>},
</span>    <span>description: {
</span>      <span>type: GraphQLString
</span>    <span>}
</span>  <span>}
</span><span>});
</span>

登入後複製

graphQl架構創建

>使用Mongoose模型和創建的GraphQL類型，我們現在可以創建我們的GraphQl架構。

在這裡，我們導出一個graphqlschema，在其中定義了兩個屬性：查詢和突變。 GraphQlobjectType是眾多GraphQL類型之一。特別是，您可以指定：

>名稱 - 應該是唯一的並標識對象;
>字段 - 接受對象的屬性比在這種情況下是我們的查詢和突變。

我們是從另一個位置導入查詢和突變，這僅用於結構目的。源代碼的構造方式使我們的項目能夠添加更多模型，查詢，突變等。

>我們傳遞到字段的查詢和突變變量是普通的JavaScript對象。鍵是突變或查詢名稱。這些值是帶有配置的普通JavaScript對象，該對象告訴GraphQl如何處理它們。讓我們以以下GraphQl查詢為例：

>要使GrahPQL了解該查詢的方法，我們需要定義Blogposts和評論查詢。因此，我們的查詢變量將是這樣的：

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

登入後複製

突變也是如此。這是為了解釋我們在查詢或突變中所擁有的鍵與我們在查詢中的名稱之間存在直接關係。現在讓我們看看這些查詢和突變中的每一個。

<span>// app.js
</span><span>import express from 'express';
</span><span>import graphqlHTTP from 'express-graphql';
</span><span>import mongoose from 'mongoose';
</span>
<span>import schema from './graphql';
</span>
<span>var app = express();
</span>
<span>// GraphqQL server route
</span>app<span>.use('/graphql', graphqlHTTP(req => ({
</span>  schema<span>,
</span>  <span>pretty: true
</span><span>})));
</span>
<span>// Connect mongo database
</span>mongoose<span>.connect('mongodb://localhost/graphql');
</span>
<span>// start server
</span><span>var server = app.listen(8080, () => {
</span>  <span>console.log('Listening at port', server.address().port);
</span><span>});
</span>

登入後複製

QUERIES

從查詢開始，讓我們從迄今為止創建的模型從一個示例中獲取。一個很好的例子是獲取博客文章及其所有評論。

> 在REST解決方案中，您必須為此提出兩個HTTP請求。一個可以獲取博客文章，另一個要獲得評論，這看起來像這樣：

在GraphQl中，我們只能在一個http請求中進行以下查詢：>

>我們可以在一個請求中獲取我們想要的所有數據，這單獨提高了性能。我們還可以要求我們要使用的確切屬性。在上面的示例中，響應只會帶來博客文章的標題和描述，評論只會帶來文字。

。

<span>// graphql/types/blog-post.js
</span><span>import <span>{
</span></span><span>  <span>GraphQLObjectType,
</span></span><span>  <span>GraphQLNonNull,
</span></span><span>  <span>GraphQLString,
</span></span><span>  <span>GraphQLID
</span></span><span><span>}</span> from 'graphql';
</span>
<span>export default new GraphQLObjectType({
</span>  <span>name: 'BlogPost',
</span>  <span>fields: {
</span>    <span>_id: {
</span>      <span>type: new GraphQLNonNull(GraphQLID)
</span>    <span>},
</span>    <span>title: {
</span>      <span>type: GraphQLString
</span>    <span>},
</span>    <span>description: {
</span>      <span>type: GraphQLString
</span>    <span>}
</span>  <span>}
</span><span>});
</span>

登入後複製

>僅從每個資源中檢索所需的字段，可以對網頁或應用程序的加載時間產生巨大影響。讓我們看一下評論，這些評論也具有_id和postid屬性。這些中的每一個都是小的，每個都確切的12個字節（不使用對象鍵計數）。當它是單個或幾個評論時，這幾乎沒有影響。當我們談論的是200條評論時，我們甚至都不會使用的4800個字節。這可以對應用程序加載時間產生重大影響。這對於資源有限的設備（例如移動設備）通常具有較慢的網絡連接。

為此，我們需要告訴GraphQl如何為每個特定查詢獲取數據。讓我們看看查詢定義的示例：

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

登入後複製

>在這裡，我們正在創建一個根據ID參數檢索單個博客文章的查詢。請注意，我們正在指定以前創建的類型，該類型驗證了查詢的輸出。我們還設置了一個ARGS對象，並具有此查詢所需的參數。最後，我們查詢數據庫並返回數據的解決方案函數。

> 為了進一步優化獲取數據的過程並利用了MongoDB上的投影功能，我們正在處理GraphQL為我們提供與Mongoose兼容的投影的AST。因此，如果我們進行以下查詢：

<span>// app.js
</span><span>import express from 'express';
</span><span>import graphqlHTTP from 'express-graphql';
</span><span>import mongoose from 'mongoose';
</span>
<span>import schema from './graphql';
</span>
<span>var app = express();
</span>
<span>// GraphqQL server route
</span>app<span>.use('/graphql', graphqlHTTP(req => ({
</span>  schema<span>,
</span>  <span>pretty: true
</span><span>})));
</span>
<span>// Connect mongo database
</span>mongoose<span>.connect('mongodb://localhost/graphql');
</span>
<span>// start server
</span><span>var server = app.listen(8080, () => {
</span>  <span>console.log('Listening at port', server.address().port);
</span><span>});
</span>

登入後複製

>由於我們只需要從數據庫中獲取標題和描述，因此getProcotion函數將生成一個有效的投影：

<span>// graphql/types/blog-post.js
</span><span>import <span>{
</span></span><span>  <span>GraphQLObjectType,
</span></span><span>  <span>GraphQLNonNull,
</span></span><span>  <span>GraphQLString,
</span></span><span>  <span>GraphQLID
</span></span><span><span>}</span> from 'graphql';
</span>
<span>export default new GraphQLObjectType({
</span>  <span>name: 'BlogPost',
</span>  <span>fields: {
</span>    <span>_id: {
</span>      <span>type: new GraphQLNonNull(GraphQLID)
</span>    <span>},
</span>    <span>title: {
</span>      <span>type: GraphQLString
</span>    <span>},
</span>    <span>description: {
</span>      <span>type: GraphQLString
</span>    <span>}
</span>  <span>}
</span><span>});
</span>

登入後複製

>您可以在源代碼中查看graphql/queries/*的其他查詢。我們不會經歷每個示例，因為它們都與上面的示例相似。

突變

突變是可以在數據庫中進行某種更改的操作。像查詢一樣，我們可以在單個HTTP請求中分組不同的突變。通常是孤立的，例如“添加評論”或“創建博客文章”。儘管隨著應用程序和數據收集的複雜性不斷增長，用於分析，用戶體驗測試或複雜操作，網站或應用程序上的用戶操作可以觸發大量突變，從而向數據庫的不同資源觸發。按照我們的示例，對我們的博客文章的新評論可能意味著新的評論，並對博客文章評論的更新進行了更新。在休息解決方案中，您將擁有類似以下內容：

<span>// graphql/index.js
</span><span>import <span>{
</span></span><span>  <span>GraphQLObjectType,
</span></span><span>  <span>GraphQLSchema
</span></span><span><span>}</span> from 'graphql';
</span>
<span>import mutations from './mutations';
</span><span>import queries from './queries';
</span>
<span>export default new GraphQLSchema({
</span>  <span>query: new GraphQLObjectType({
</span>    <span>name: 'Query',
</span>    <span>fields: queries
</span>  <span>}),
</span>  <span>mutation: new GraphQLObjectType({
</span>    <span>name: 'Mutation',
</span>    <span>fields: mutations
</span>  <span>})
</span><span>});
</span>

登入後複製

>使用GraphQl，您只能在一個http請求中使用以下內容進行操作：

query <span>{
</span>    blogPosts <span>{
</span>        _id<span>,
</span>        title
    <span>}
</span>    comments <span>{
</span>        text   
    <span>}
</span><span>}
</span>

登入後複製

請注意，查詢和突變的語法完全相同，只是將查詢更改為突變。我們可以從突變中詢問數據，就像我們從查詢中相同的方式。通過不指定片段，就像我們在上面的BlogPostCommentin中的查詢中一樣，我們只是在問一個真或錯誤的返回值，這通常足以確認操作。或者我們可以要求提供一些數據，例如對附加組件突變，這對於僅檢索服務器上生成的數據很有用。

> 然後，讓我們在服務器中定義我們的突變。突變是完全作為查詢創建的：

這個突變將添加新的博客文章，並在成功（如果成功）返回true。請注意，在類型中，我們指定將要返回的內容。在Args中，從突變中收到的論點。 and lesolve（）函數與查詢定義完全一樣。

<span>{
</span>    <span>blogPosts: {...},
</span>    <span>comments: {...}
</span><span>}
</span>

登入後複製

測試GraphQl端點

>現在我們已經使用GraphQL路由創建了Express Server，並進行了一些查詢和突變，讓我們通過向其發送一些請求來對其進行測試。

有很多方法可以將獲取請求發送或將請求發佈到一個位置，例如：>

瀏覽器 - 通過在瀏覽器中鍵入一個URL，您會發送get請求。這有無法發送發布請求
curl - 用於命令行風扇。它可以將任何類型的請求發送到服務器。雖然，這不是最好的界面，但您無法保存請求，並且需要在命令行中寫所有內容，從我的角度來看，這不是理想的
>

的解決方案比上述的解決方案更多。前兩個是最著名和最使用的。 GraphIQL是GraphQL團隊使用GraphQl簡化該過程的解決方案，因為查詢可以更複雜。

在這三個中，我建議GraphiQl，儘管我更喜歡並最重要的是郵遞員。該工具絕對是API測試的預付款。它提供了一個直觀的接口，您可以在其中創建並保存任何類型的請求的集合。您甚至可以為您的API創建測試，並單擊按鈕。它還具有協作功能，並使其能夠共享請求的集合。因此，我創建了一個可以在此處下載的，然後您可以將其導入到Postman。如果您沒有安裝郵遞員，我絕對建議您這樣做。

>讓我們從運行服務器開始。您應該安裝4個或更高的節點；如果您還沒有，我建議使用NVM安裝它。然後，我們可以在命令行中運行以下內容：

服務器現在可以接收請求，因此讓我們在Postman上創建一些。我們的GraphQL路由設置為/GraphQl，因此首先要做的就是將位置設置為我們要指導我們的請求的位置，即http：// localhost：8080/graphql。然後，我們需要指定它是GET還是郵政請求。儘管您可以使用其中的任何一個，但我更喜歡發布，因為它不會影響URL，從而使其更清潔。我們還需要配置隨請求隨附的標頭，在我們的情況下，我們只需要添加與應用程序/JSON等於的內容類型。這是Postman中的所有外觀：

<span>// index.js
</span><span>require('babel/register');
</span><span>require('./app');
</span>

登入後複製

使用node.js和mongodb創建GraphQl Server 我們現在可以創建將具有JSON格式所需的GraphQl查詢和變量的主體：

>假設您已經導入了我提供的集合，則應該已經有一些可以測試的查詢和突變請求。由於我使用了硬編碼的Mongo ID，因此按順序運行請求，它們都應該成功。分析我在每個人的身體中放置的東西，您會發現這只是本文討論的內容的應用。另外，如果您不止一次運行第一個請求，因為它將是重複的ID，您可以看到如何返回錯誤：

使用node.js和mongodb創建GraphQl Server