REST API 和 Apollo GraphQL Server的比較

更新於 發佈於 閱讀時間約 10 分鐘

※ REST API 和 Apollo GraphQL Server 的區別:

  1. 資料獲取方式
    • REST API:每個資源都有一個固定的 URL,並且通過 HTTP 方法(如 GET、POST、PUT、DELETE)來操作這些資源。伺服器決定返回的資料結構。
    • GraphQL:使用單一的端點(通常是 /graphql),客戶端可以根據需求查詢具體的資料。客戶端決定需要哪些資料,伺服器根據查詢返回相應的資料。
  2. 資料結構
    • REST API:資料結構是由伺服器定義的,客戶端只能接受伺服器返回的資料格式。
    • GraphQL:資料結構是由客戶端定義的,客戶端可以指定需要的資料欄位,避免過多或過少的資料傳輸。
  3. 效能與快取
    • REST API:可以利用 HTTP 快取機制來提高效能,特別是對於 GET 請求。
    • GraphQL:由於使用單一端點,無法直接利用 HTTP 快取,但可以使用客戶端快取工具(如 Apollo Client)來實現快取。

※ 何時使用 REST API:

  1. 簡單且固定的資料結構如果資料結構相對簡單且不會頻繁變動,REST API 是一個不錯的選擇。
  2. 傳統應用許多現有的應用和工具已經與 REST API 集成,這使得它在某些情況下更容易實施。
  3. HTTP 快取REST API 可以利用 HTTP 的內建快取機制來提高效能,特別是對於靜態資源。

※ 何時使用 Apollo GraphQL Server:

  1. 複雜且動態的資料需求當應用需要從多個資源中獲取資料,並且這些資料的結構可能會頻繁變動時,GraphQL 提供了更大的靈活性。
  2. 減少資料傳輸量客戶端可以根據需求查詢具體的資料欄位,避免過多或過少的資料傳輸。
  3. 客戶端快取雖然 GraphQL 無法直接利用 HTTP 的內建快取機制,但可以使用 Apollo Client 這樣具有查詢快取、快取更新、快取策略的工具來實現客戶端快取。

※ 整合 REST API 和 GraphQL常見的方法:

使用 GraphQL 作為中介層

你可以使用 GraphQL 作為中介層,將多個 REST API 整合到一個 GraphQL 端點。這樣,客戶端只需發送一個 GraphQL 查詢,就能獲取來自多個 REST API 的資料。這種方法可以減少 API 請求數量,提升效能。

2. 在 GraphQL 中調用 REST API

在 GraphQL 解析器中,你可以調用 REST API 來獲取資料。這樣,GraphQL 查詢會觸發對 REST API 的請求,並將結果返回給客戶端。這種方法適合需要從現有 REST API 獲取資料的情況。

3. 混合使用 REST API 和 GraphQL

在同一個應用中,你可以同時使用 REST API 和 GraphQL。比如,對於簡單的資料操作(如 CRUD 操作),可以使用 REST API;而對於複雜的資料查詢,則使用 GraphQL。這樣可以根據具體需求選擇最合適的技術。

Express 伺服器Apollo GraphQL 伺服器區別:

Express 伺服器

app.listen(3000, () => {
console.log('express app listen on port 3000')
})

這段代碼使用 Express 框架來啟動一個 HTTP 伺服器,並將其綁定到端口 3000。Express 是一個用於構建 Web 應用程式和 API 的 Node.js 框架。

Apollo GraphQL 伺服器

server.listen(8891, () => {
console.log('Apollo GraphQL Server run on port 8891')
});

這段代碼使用 Apollo Server 來啟動一個 GraphQL 伺服器,並將其綁定到端口 8891。Apollo Server 是一個專門用於構建 GraphQL API 的伺服器框架。

Express Apollo GraphQL 在同一個伺服器上運行

const express = require('express');
const { ApolloServer, gql } = require('apollo-server-express');

const app = express(); // 這裡創建了 Express 應用實例

// 定義 REST API 路由
app.get('/api', (req, res) => {
res.send('Hello from REST API!');
});

// 定義 GraphQL Schema
const typeDefs = gql`
type Query {
hello: String
}
`;

// 定義 Resolvers
const resolvers = {
Query: {
hello: () => 'Hello from GraphQL!',
},
};

// 創建 Apollo Server 實例
const server = new ApolloServer({ typeDefs, resolvers });

// 將 Apollo Server 中間件應用於 Express 應用
server.start().then(() => {
server.applyMiddleware({ app }); // 這裡的 { app } 就是指上面創建的 Express 應用實例

// 啟動伺服器
app.listen(3000, () => {
console.log('Server is running on http://localhost:3000');
console.log(`GraphQL endpoint: http://localhost:3000${server.graphqlPath}`);
});
});

※ 同時啟動Express Apollo GraphQL 伺服器功用:

  1. 即時更新效果:如果想在瀏覽器中即時看到網頁的變化,通常會啟動一個 HTTP 伺服器(例如使用 Express)。就可以在本地開發環境中測試和查看網頁應用程式。
  2. 內部開發和維護 API:如果想開發和維護 GraphQL API,則需要啟動一個 GraphQL 伺服器(例如使用 Apollo Server)。就可以使用工具如 Apollo Studio 來查看和管理 GraphQL Schema、查詢性能、錯誤追蹤等。

這兩者並不是互斥的。可以在同一個應用中同時啟動 HTTP 伺服器和 GraphQL 伺服器,這樣既可以即時查看網頁變化,也可以開發和維護你的 API。


※ GraphQL 特別適合處理以下幾種類型的複雜資料查詢:

  1. 多層次關聯數據:當需要查詢多個相關數據時,GraphQL 可以在一次請求中獲取所有需要的數據。例如,查詢一個用戶及其所有文章和每篇文章的評論。
  2. 客製化數據需求:當不同的客戶端需要不同的數據時,GraphQL 可以讓客戶端指定他們需要的數據,避免過多或過少的數據傳輸。例如,移動應用和桌面應用可能需要不同的數據格式。
  3. 多數據源整合:當需要從多個數據源獲取數據時,GraphQL 可以將這些數據源整合在一起,提供統一的查詢接口。例如,從資料庫、第三方 API 和內部服務中獲取數據。
  4. 動態查詢:當查詢需求經常變化時,GraphQL 可以讓開發者靈活地定義和修改查詢,而不需要改變後端代碼。例如,根據用戶的不同需求動態生成查詢。
  5. 減少多次請求:當需要多次請求才能獲取所有需要的數據時,GraphQL 可以在一次請求中獲取所有數據,減少網絡延遲和資源消耗。例如,查詢一個產品及其相關的評論和評分。

※ REST API 的常見應用:

  1. 數據檢索和操作:這是最基本的功能,包括使用 GET、POST、PUT 和 DELETE 方法來檢索和操作數據。
  2. 身份驗證和授權:REST API 可以用來實現用戶身份驗證和授權,確保只有授權用戶才能訪問特定資源。
  3. 文件上傳和下載:REST API 可以用來處理文件的上傳和下載,這在許多應用中非常常見。
  4. 通知和消息推送:REST API 可以用來實現即時通知和消息推播,這對於即時通訊應用和通知系統非常有用。
  5. 數據同步:REST API 可以用來在不同系統之間同步數據,確保數據的一致性和最新性。
  6. 第三方整合:REST API 可以用來與第三方服務進行整合,例如支付平台、地圖服務和社群媒體平台。

※ 專業後端工程師需具備的技能:

  1. REST API 
  2. Apollo GraphQL Server 

原因:

有時候一個項目可能需要同時使用 REST API 和 GraphQL,掌握這兩種技術可以更好地整合和實現。


留言
avatar-img
留言分享你的想法!
avatar-img
奧莉薇走在成為後端工程師之路上
21會員
145內容數
全端網頁開發專業知識分享
2025/04/26
※ 場景: 即時聊天應用: 設計一個支持多房間功能的即時聊天平台,像 WhatsApp、LINE或Facebook Messenger,提供文字、語音、視訊聊天功能,方便管理群組聊天。 功能亮點:加入特別功能,例如可加入多房間功能、使用者名單、表情符號支持、文件分享或訊息已讀未讀狀態。 展示
2025/04/26
※ 場景: 即時聊天應用: 設計一個支持多房間功能的即時聊天平台,像 WhatsApp、LINE或Facebook Messenger,提供文字、語音、視訊聊天功能,方便管理群組聊天。 功能亮點:加入特別功能,例如可加入多房間功能、使用者名單、表情符號支持、文件分享或訊息已讀未讀狀態。 展示
2025/04/26
※ 先建立基本的express後端服務: 1.建立新資料夾:Socket mkdir socket 2.進入資料夾:Socket cd ​bsocket 3. 安裝 Experss 到專案中 npm init -y //初始化專案,建立 package.json 檔 npm insta
Thumbnail
2025/04/26
※ 先建立基本的express後端服務: 1.建立新資料夾:Socket mkdir socket 2.進入資料夾:Socket cd ​bsocket 3. 安裝 Experss 到專案中 npm init -y //初始化專案,建立 package.json 檔 npm insta
Thumbnail
2025/04/10
※ 什麼是 Socket.io:一個基於傳統 WebSocket API 之上的框架。 ※ Socket.io常用功能: Custom Events:在 Socket.io 中,開發者可以創建自己的事件來處理特定的功能或需求。 Rooms:分組的功能。每個連接的用戶(或稱為 socket)可
Thumbnail
2025/04/10
※ 什麼是 Socket.io:一個基於傳統 WebSocket API 之上的框架。 ※ Socket.io常用功能: Custom Events:在 Socket.io 中,開發者可以創建自己的事件來處理特定的功能或需求。 Rooms:分組的功能。每個連接的用戶(或稱為 socket)可
Thumbnail
看更多
你可能也想看
Thumbnail
家中修繕或裝潢想要找各種小零件時,直接上網採買可以省去不少煩惱~看看Sylvia這回為了工地買了些什麼吧~
Thumbnail
家中修繕或裝潢想要找各種小零件時,直接上網採買可以省去不少煩惱~看看Sylvia這回為了工地買了些什麼吧~
Thumbnail
👜簡單生活,從整理包包開始!我的三款愛用包+隨身小物清單開箱,一起來看看我每天都帶些什麼吧🌿✨
Thumbnail
👜簡單生活,從整理包包開始!我的三款愛用包+隨身小物清單開箱,一起來看看我每天都帶些什麼吧🌿✨
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
創作者營運專員/經理(Operations Specialist/Manager)將負責對平台成長及收入至關重要的 Partnership 夥伴創作者開發及營運。你將發揮對知識與內容變現、影響力變現的精準判斷力,找到你心中的潛力新星或有聲量的中大型創作者加入 vocus。
Thumbnail
本文深入探討 Web API 與 HTTP 協議,解釋 HTTP 請求方法 (GET, POST, PUT, PATCH, DELETE)、HTTP 結構 (Headers, Body, 狀態碼),。透過說明各種 HTTP 狀態碼,讀者可以更深入理解 Web API 的設計與應用。
Thumbnail
本文深入探討 Web API 與 HTTP 協議,解釋 HTTP 請求方法 (GET, POST, PUT, PATCH, DELETE)、HTTP 結構 (Headers, Body, 狀態碼),。透過說明各種 HTTP 狀態碼,讀者可以更深入理解 Web API 的設計與應用。
Thumbnail
※ 什麼是Apollo GraphQL Server? Apollo GraphQL Server 是一個將GraphQL的標準轉化為實際可用的工具和框架,可以在Node.js 常用的中介軟體像是 Express 或 Fastify 所建立的伺服器中,輕鬆加入和設定 Apollo GraphQL
Thumbnail
※ 什麼是Apollo GraphQL Server? Apollo GraphQL Server 是一個將GraphQL的標準轉化為實際可用的工具和框架,可以在Node.js 常用的中介軟體像是 Express 或 Fastify 所建立的伺服器中,輕鬆加入和設定 Apollo GraphQL
Thumbnail
※ 什麼是GraphQL? GraphQL 是由 Facebook 於 2015 年開發的一種 API 查詢語言。客戶端(前端)只會接收到所需的數據,減少了不必要的數據傳輸和多次請求的需要,提高了應用程序的性能和效率。GraphQL 支持查詢、變更和即時更新操作,解決了傳統 REST API 中的
Thumbnail
※ 什麼是GraphQL? GraphQL 是由 Facebook 於 2015 年開發的一種 API 查詢語言。客戶端(前端)只會接收到所需的數據,減少了不必要的數據傳輸和多次請求的需要,提高了應用程序的性能和效率。GraphQL 支持查詢、變更和即時更新操作,解決了傳統 REST API 中的
Thumbnail
REST(REpresentational State Transfer)是一種WWW的Web架構,常被使用於JSON或XML的Web服務,而符合REST原則的系統就稱為RESTful。REST API(RESTful API)是一種符合REST的API應用。 方法說明 GET:向伺服器取得
Thumbnail
REST(REpresentational State Transfer)是一種WWW的Web架構,常被使用於JSON或XML的Web服務,而符合REST原則的系統就稱為RESTful。REST API(RESTful API)是一種符合REST的API應用。 方法說明 GET:向伺服器取得
Thumbnail
隨著Web應用的發展,前端和後端的需求也在變得越來越複雜。RESTful APIs已經不再滿足當前的需求,而GraphQL作為一個新興的數據查詢語言,提供了更靈活的查詢能力。在這篇文章中,我們將探討如何在Gin中實現GraphQL API,為你的應用帶來現代化的數據查詢。
Thumbnail
隨著Web應用的發展,前端和後端的需求也在變得越來越複雜。RESTful APIs已經不再滿足當前的需求,而GraphQL作為一個新興的數據查詢語言,提供了更靈活的查詢能力。在這篇文章中,我們將探討如何在Gin中實現GraphQL API,為你的應用帶來現代化的數據查詢。
Thumbnail
不論是 GraphQL 與 RESTful API 都需要生態系的支撐,才會好用與完整 這篇會先介紹 GraphQL 的生態系工具。
Thumbnail
不論是 GraphQL 與 RESTful API 都需要生態系的支撐,才會好用與完整 這篇會先介紹 GraphQL 的生態系工具。
Thumbnail
這裡會針 GraphQL 與 RESTful API 這兩者介面所需要做的事情來比較其應用的場景。
Thumbnail
這裡會針 GraphQL 與 RESTful API 這兩者介面所需要做的事情來比較其應用的場景。
Thumbnail
講完 get 來講 post,那這兩個 call api 的方法有什麼差別呢?先記得一個原則,要傳遞機密的資料用 post,如果要傳遞的參數被別人知道也無所謂就用 get post 是傳遞資料到後台,資料不會顯示在 url 上,get 是傳遞參數到後台,參數會直接顯示在 url 上和後端的終端上,像
Thumbnail
講完 get 來講 post,那這兩個 call api 的方法有什麼差別呢?先記得一個原則,要傳遞機密的資料用 post,如果要傳遞的參數被別人知道也無所謂就用 get post 是傳遞資料到後台,資料不會顯示在 url 上,get 是傳遞參數到後台,參數會直接顯示在 url 上和後端的終端上,像
Thumbnail
前端和後端溝通,最常用就是 get 和 post 後端 先在 django 專案這邊的 views.py 內建立一個讓前端以 get 方法呼叫的 api function1 內的第一個參數是前端的 request,之後第二個參數第三個參數可以隨便你設,這倒是沒有限制 用 request.GET 這個
Thumbnail
前端和後端溝通,最常用就是 get 和 post 後端 先在 django 專案這邊的 views.py 內建立一個讓前端以 get 方法呼叫的 api function1 內的第一個參數是前端的 request,之後第二個參數第三個參數可以隨便你設,這倒是沒有限制 用 request.GET 這個
追蹤感興趣的內容從 Google News 追蹤更多 vocus 的最新精選內容追蹤 Google News