在本文中，我們將討論已存在很長時間但尚未廣為人知的CUBA平臺的功能- 前端SDK生成器 ，并了解它如何與CUBA的REST API插件一起使用 。

Java + JavaScript –網絡婚姻

僅八年前，我們Java開發人員在我們的Web應用程序中使用JavaScript作為“第二等公民”語言。 那時，它的目的是通過JSF，Struts，Tapestry或Thymeleaf等框架向服務器端生成的網頁添加一些動態。 如今，我們見證了JavaScript的出現，它是使用React，Vue或Angular等框架進行客戶端開發的第一語言，而Node.js甚至可以將其引入服務器端。

實際上，我們開發的Web應用程序可能在不同的層上使用不同的語言：JavaScript用于客戶端UI，Java用于業務邏輯處理，SQL用于從數據庫中獲取數據，Python用于數據分析，等等。使用各種技術將所有這些語言組合到一個應用程序中。 最常見的示例– REST API。 基于與平臺無關的HTTP協議和簡單的JSON格式，現在它是拼接客戶端JS和服務器端Java的默認方法。

但是，即使是最好的針腳也不能無縫。 API定義始終存在一個問題：要調用的方法，數據模型是什么以及我們是否應該將街道地址作為結構化對象還是作為字符串傳遞。

我們如何才能幫助我們JavaScript伙伴更快地創建代碼并避免溝通不暢？

Swagger是最終答案嗎？

你說“ 招搖 ”，對。 Swagger實際上是用于設計，構建，記錄和使用REST API的工業標準。 有許多代碼生成器可幫助生成用于不同語言的客戶端SDK。

CUBA Framework支持Swagger，每個帶有REST API附加組件的應用程序都有一個端點，該端點允許下載.json或.yaml格式的Swagger文檔。 您可以使用這些文件來生成JS客戶端。

請考慮以下事實：Swagger只是一個API文檔工具。 但是前端開發人員希望在API中看到什么樣的信息？ “經典”方法是：將業務功能映射到服務并構建定義良好的API。 然后將其公開為一組REST服務，添加Swagger文檔并享受。

那么，為什么GraphQL趕上趨勢，在前端開發人員中引起轟動？ 并注意GraphQL在Web API世界中的份額正在增長。 到底是怎么回事？ 事實證明，有時為前端開發人員提供更多“通用” API會更容易，從而避免為可能經常更改的用例創建大量小型API。 例如，在Web UI中，對于您的購物籃，您只需要先訂購一個價格，然后再訂購總額的訂單，依此類推。GraphQL還是一個??很好的工具，可以避免過度獲取和獲取不足以及一次查詢多個API來獲取價格。復雜的數據結構。

好的，看起來應用程序不僅應該公開服務，還應該公開一些通用API。 這種方法使前端開發人員可以調用復雜的業務功能，并為它們提供一定程度的靈活性，因此，如果他們僅需要UI的不同數據表示形式，則他們不會請求更改API。

Swagger或GraphQL或OData都無法解決另一個問題-如果更改了某些內容，該如何處理生成的客戶端代碼。 直接的一次性代碼生成很簡單，但是支持卻是另一回事。 在刪除實體的屬性后，如何確保前端應用程序不會失敗？

因此，為了加速前端開發并簡化后端團隊與前端團隊之間的協作，我們需要：

公開特定于業務的API和通用API

根據后端數據模型和方法簽名生成前端代碼

以最小的努力和潛在的錯誤修改生成的代碼

我們在REST中使用REST API附加組件和前端SDK生成器來面對所有這些挑戰。

CUBA TypeScript SDK

在CUBA中，REST API附加組件提供以下功能：

• 數據模型上的CRUD操作
• 執行預定義的JPQL查詢
• 執行服務方法
• 獲取元數據（實體，視圖，枚舉，數據類型）
• 獲取當前用戶權限（訪問實體，屬性，特定權限）
• 獲取當前的用戶信息（名稱，語言，時區等）
• 處理文件

因此，我們擁有從任何前端客戶端使用該應用程序所需的一切。 所有這些API都在不拘一格的YAML或JSON文件中進行了描述，因此您可以立即開始實施應用程序。

為REST API用戶設置安全規則對于防止端點意外暴露給所有用戶非常重要。 首先，拒絕所有用戶的常規REST API訪問，然后為需要訪問所需功能的角色創建特殊權限。

但是CUBA不僅提供REST API。 您可以生成一個SDK ， 該SDK可以用作任何前端開發框架的基礎：React，Angular，Vue或其他。

使用生成器，您可以創建一組TypeScript類，該類允許您從客戶端應用程序調用CUBA API。

要生成SDK，您只需運行

npm install -g @cuba -platform/front-generator

然后

gen-cuba-front sdk:all

所有類都會為您創建。 您甚至可以基于ReactJS生成一個簡單的UI，因此您的客戶將能夠立即開始使用基于CUBA的應用程序。 用戶界面非常基本，但是使用CUBA，您將立即獲得所有功能，包括身份驗證，基于角色的數據訪問，實體圖檢索等。

讓我們仔細看一下SDK的功能。

資料模型

應用程序數據模型表示為TypeScript類的集合。 如果我們看一下QuickStart中使用的Session Planner應用程序，則那里有一個實體：

@NamePattern ( "%s %s|firstName,lastName" ) @Table (name = "SESSIONPLANNER_SPEAKER" ) @Entity (name = "sessionplanner_Speaker" ) public class Speaker extends StandardEntity { @NotNull @Column (name = "FIRST_NAME" , nullable = false ) protected String firstName; @Column (name = "LAST_NAME" ) protected String lastName; @Email @NotNull @Column (name = "EMAIL" , nullable = false , unique = true ) protected String email; //Setters and getters here }

在SDK中，我們將獲得一個類：

export class Speaker extends StandardEntity { static NAME = "sessionplanner_Speaker" ; firstName?: string | null ; lastName?: string | null ; email?: string | null ; }

所有關聯和組成都將保留，因此您將能夠獲取實體圖，而不必使用多個API調用來一一獲取實體。

不再需要DTO-您將獲得與后端所述完全相同的數據。

商業服務

通過CUBA中的REST公開的所有服務將在SDK中具有TypeScript表示形式。 例如，如果我們使用REST API公開會話服務 ，您將獲得一個如下所示的TypeScript代碼：

export var restServices = { sessionplanner_SessionService: { rescheduleSession: (cubaApp: CubaApp, fetchOpts?: FetchOptions) => (params: sessionplanner_SessionService_rescheduleSession_params) => { return cubaApp.invokeService( "sessionplanner_SessionService" , "rescheduleSession" , params, fetchOpts); } } };

因此，您只需編寫以下行就可以從UI調用它：

restServices.sessionplanner_SessionService.rescheduleSession(cubaREST)({session, newStartDate}).then( (result) => { //Result handling });

方便，不是嗎？ 所有常規工作都為您完成。

通用API

如果只需要為前端實現自定義邏輯，則始終可以使用在核心CUBA平臺REST庫中定義的一組功能，例如：

loadEntities<T>(entityName: string, options?: EntitiesLoadOptions, fetchOptions?: FetchOptions): Promise<Array<SerializedEntity<T>>>; deleteEntity(entityName: string, id: any, fetchOptions?: FetchOptions): Promise< void >;

這些功能使您可以使用應用程序中的實體對CRUD操作進行細粒度的訪問。 安全性仍然存在，CUBA在服務器端驗證所有非匿名調用，并防止獲取不符合用戶角色的實體或屬性。

cubaREST.loadEntities<Speaker>(Speaker.NAME).then( (result => { //Result handling }));

使用此通用API，開發人員可以使用在通用CRUD上創建的自定義API層創建JS應用程序，并將其部署到實現“ 后端前端 ”架構模式的node.js服務器。 而且，用這種方法實現的API層可能不止一個，我們可以為不同的客戶端實現一組不同的API：ReactJS，Native iOS等。實際上，生成的SDK是此用例的理想工具。

通用API的不好之處在于，當您獲取的屬性超出了所需的屬性或者API描述符中的屬性不足時，可能會導致數據獲取不足或獲取過多的風險。 CUBA的實體視圖在后端解決了這個問題，我們為前端開發人員提供了相同的選擇！ 對于每個生成的TypeScript類，我們創建反映視圖的類型：

export type SpeakerViewName = "_minimal" | "_local" | "_base" ; export type SpeakerView<V extends SpeakerViewName> = V extends "_minimal" ? Pick<Speaker, ? Pick<Speaker, "id" | "firstName" | "lastName" > : V extends "_local" ? Pick<Speaker, ? Pick<Speaker, "id" | "firstName" | "lastName" | "email" > : V extends "_base" ? Pick<Speaker, ? Pick<Speaker, "id" | "firstName" | "lastName" | "email" > : never;

因此，您可以從后端獲取實體，并且只會獲取指定的屬性。 因此，您無需猜測提取了哪些屬性。 IDE將幫助您自動完成代碼。

API更新

如前所述，代碼生成甚至不占開發工作的一半。 更改和支持代碼是大多數工作要做的地方。 CUBA的TypeScript SDK生成器在后續運行期間分析代碼，跟蹤更改并以增量方式對其進行更新。 如果您將TypeScript用作前端的主要開發語言，TypeScript編譯器將確保您不會忘記更新使用SDK的自定義代碼。

結論

除了通用UI之外，如果您還想為CUBA應用程序開發基于JS的客戶端UI（React / React Native，Angular或Vue），則可以使用REST API插件和TypeScript SDK。 無論您決定使用哪種技術，都可以專注于設計或性能以提供最佳的用戶體驗，而不必執行常規的編碼任務。 而且，您可以確定JS到Java的通信以及對不斷變化的API的支持將是您遇到的最小問題。

翻譯自: https://www.javacodegeeks.com/2019/11/cuba-platform-typescript-sdk-and-rest-api.html

總結

以上是生活随笔為你收集整理的CUBA平台：TypeScript SDK和REST API的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。