資訊專欄INFORMATION COLUMN
摘要：樣例前端傳入字段和結構。后臺按照前端的需求返回數據。則將前后臺通信直接分為兩大類和。顧名思義，是默認的操作符，代表查詢，是不會給服務端帶來副作用的請求。文檔文檔部分文檔就是前端向后臺描述所需的字段。降低前后端溝通成本。
簡介
GraphQL是基于「類型系統」來執行查詢的查詢語言。
Facebook 2012 年開始使用 GraphQL，15年開源。
graph定義了一套標準，用于描述服務端和客戶端的通信。可以使用任意語言來實現graph所描述的功能。就和ECMAScript標準之于JavaScript一樣。
樣例前端傳入字段和結構。后臺按照前端的需求返回數據。
一個GraphQL請求由兩部分組成。 操作符 和 文檔。
操作符GraphQL作為前后臺交互的中間層，不能只有查詢功能，在REST中，有GET、POST、DELETE等類型的請求。
GraphQL則將前后臺通信直接分為兩大類 query和mutation。
query顧名思義，query是默認的操作符，代表查詢，是不會給服務端帶來副作用的請求。沒有操作符的話會默認是query操作符，上面的動圖就是省略了query操作符。 完整的請求其實是這樣的。
query {
hero {
name
}
}
mutation
mutation代表一個動作，會給服務器帶來修改。比如增刪改。例如：
mutation addMessage($input: MessageType!) {
addMessage(input: $input) {
id
text
}
}
返回結果
{
"addMessage": {
"label": "測試的一個message",
"id": "0RaqSeOL0"
}
}
對($input: MessageType!) 可能會一頭霧水，這寫只是定義傳參的一些語法，過過文檔就可以學會。
subscriptionsubscription， 訂閱操作符還未納入標準，但是已經被實現應用了。訂閱操作符的功能是像服務端監聽一個操作。就像VUE里面的watch一樣。只是我們watch的是服務端。一旦服務端發生了我們訂閱的改變，服務端就會主動把變化推送給我們。自己的業務代碼里面再也不要維護什么輪詢，定時器啦。
文檔文檔部分：
{
hero {
name
height
}
}
文檔就是前端向后臺描述所需的字段。也是前端覺得最爽的地方，數據結構清晰明了。發送什么樣的請求，拿到什么樣的數據。
觀察文檔，文檔是由 類型 和 字段 構成的。GraphQL是強類型語言。如果使用過typescript就很好理解。
可以認為，我們規定了一種對象，它們一定有定義的屬性。
hero就是一個類型。name 和 height就是字段。
特點獲取多類資源，只用一個請求。
前端控制：是客戶端指定的查詢，端從被動為主動，想要什么拿什么。
層次結構化： 操作粒度為字段級別，可讀性好，查詢的結構和結果非常相似。
開發友好：得益于強類型，GraphQL可以在編寫代碼時就檢查語句是否錯誤，也能智能提示類型下的字段。可以自動生成文檔，提供豐富的體驗。
降低前后端溝通成本。
和REST對比隨著系統發展，REST的接口持續平面增長，GraphQL 只需增加類型，更加利于維護。
如果是復雜的客戶端，一個頁面往往需要調用多個接口，GraphQL 只需調用一次即可，一次請求到所有數據。
REST 所操作的資源相對是離散的（接口接口接口），GraphQL的數據更有整體性(因為是類型構成)。
社區框架目前前端客戶端主要有Apollo和Relay，他們的作用就和axios一樣，方便我們構造請求。因為業務中主要用到vue，有vue-apollo所以我選擇的是Apollo。
vue-apollo自帶了store層，方便進行數據緩存，vuex也可以去掉了。
資料我用vue-cli生成了一個簡單的增刪改查的項目。 可以對照著文檔自己敲代碼。 GraphQL_demo
文章阻礙你使用 GraphQL 的十個問題
30分鐘理解GraphQL核心概念
RPC vs REST vs GraphQL
文檔graphql官方文檔
vue-apollo文檔
apollo文檔
github的graph樣例接口（在線把玩）
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/100729.html
摘要：異步剪貼板操作過去的數年中，各瀏覽器基本上都在使用來進行剪貼板交互。而提供了新的，則為我們提供了另一種異步式的剪貼板操作方式，本文即是對該機制與接口規范的詳細介紹。 showImg(https://segmentfault.com/img/remote/1460000013854167); 前端每周清單第 55 期: MobX 4 特性概覽，iOS Hacks 分享, 分布式事務詳解 ...
摘要：我們知道是一種從服務器公開數據的流行方式。描述所有的可能類型系統基于類型和字段的方式進行組織，而非入口端點。因此，需要對后端進行調整，以滿足新的數據需求，這會降低生產力并顯著降低將用戶反饋集成到產品中的能力。 showImg(https://segmentfault.com/img/remote/1460000017875905?w=2234&h=974); 在前幾天的《StateOf...
摘要：我們知道是一種從服務器公開數據的流行方式。描述所有的可能類型系統基于類型和字段的方式進行組織，而非入口端點。因此，需要對后端進行調整，以滿足新的數據需求，這會降低生產力并顯著降低將用戶反饋集成到產品中的能力。 showImg(https://segmentfault.com/img/remote/1460000017875905?w=2234&h=974); 在前幾天的《StateOf...
摘要：我們知道是一種從服務器公開數據的流行方式。描述所有的可能類型系統基于類型和字段的方式進行組織，而非入口端點。因此，需要對后端進行調整，以滿足新的數據需求，這會降低生產力并顯著降低將用戶反饋集成到產品中的能力。 showImg(https://segmentfault.com/img/remote/1460000017875905?w=2234&h=974); 在前幾天的《StateOf...
摘要：我們知道是一種從服務器公開數據的流行方式。描述所有的可能類型系統基于類型和字段的方式進行組織，而非入口端點。因此，需要對后端進行調整，以滿足新的數據需求，這會降低生產力并顯著降低將用戶反饋集成到產品中的能力。 showImg(https://segmentfault.com/img/remote/1460000017875905?w=2234&h=974); 在前幾天的《StateOf...
閱讀 1268·2021-09-02 13:36
閱讀 2723·2019-08-30 15:44
閱讀 2979·2019-08-29 15:04
閱讀 3199·2019-08-26 13:40
閱讀 3648·2019-08-26 13:37
閱讀 1180·2019-08-26 12:22
閱讀 1017·2019-08-26 11:36
閱讀 1222·2019-08-26 10:41
