前後端聯調福音——RAP

Redis 腳本語言 MySQL 文章 58招聘技術 2017-04-16

原創作者:政宇@招聘技術 58招聘技術團隊

一、概述

RAP是一個可視化接口管理工具 通過分析接口結構,動態生成模擬數據,校驗真實接口正確性, 圍繞接口定義,通過一系列自動化工具,對前後端接口交互開發進行解耦,以提升協作效率。

二、RAP的基本安裝與使用

首先,我們將簡單介紹一下RAP的安裝與使用。

1、RAP的部署。

部署方式有兩種:

①、使用編譯好的war包部署

適合僅想部署RAP服務,不需開發定製功能的同學

②、使用源碼自行編譯、開發後部署

需配置J2EE開發環境, 適合想要研究RAP源代碼,開發定製功能的同學

Rap的github上提供了war包以及源碼的下載:https://github.com/thx/RAP/releases

2、配置環境。

①、JDK1.8+

②、MySQL 5.6.12+

③、Tomcat 8.*+

④、Redis 3.0+ 部署在本機,默認端口即可。

3、初始化數據庫。

需要執行release分支下的SQL腳本: /src/main/resources/database/initialize.sql,該腳本中包含數據庫創建、表&結構創建、必要的初始數據創建的全部內容。

4、配置數據庫、Redis

修改src/config.properties 中的配置內容,將其改為正確的數據庫以及Redis配置。下圖是config.properties的配置內容。

前後端聯調福音——RAP

我們在自己的服務器上部署了自己的rap服務,具體的更詳細部署步驟可以參照RAP項目wiki:https://github.com/thx/RAP/wiki/deploy_manual_cn(部門內部的rap地址是:http://10.48.184.39:3478/)

5、RAP的基本使用

RAP服務搭建完成之後,我們就可以開始RAP的使用了。

前後端聯調福音——RAP

上圖是進入到rap的首頁面,點擊註冊登錄之後將進入到我的主頁。進入到我的主頁之後可以開始查看或者創建我們的項目:

前後端聯調福音——RAP

創建完項目之後,就進入到我們的接口定義的界面了。

點擊添加接口後,我們定義了一個接口:api/helloworld。返回的對象是一個json的字符串

前後端聯調福音——RAP

接下來我們將定義我們的請求參數和返回參數:

前後端聯調福音——RAP

這裡我們的請求URL為api/helloworld?name=劉備.返回的數據格式為:

前後端聯調福音——RAP

在編輯相應參數列表的時候,我們可以手動的添加參數,也可以直接點擊導入json將上圖中json直接導入生成相應的參數。參數列表定義完了之後就可以開始來訪問我們的接口了。

前後端聯調福音——RAP

點擊上圖中的模塊頁面按鈕,將進入到頁面的控制檯,我們輸入請求的參數將會獲取到該接口返回的數據。如下圖的右邊所示,這就是我們的請求URL。http://10.48.184.39:3478/mockjs/1/api/helloworld?name=%E5%88%98%E5%A4%87

該URL返回的是mock數據的模板,我們需要將上面的URL中mockjs改為mockjsdata就可以將模板數據渲染成我們要的接口數據。http://10.48.184.39:3478/mockjsdata/1/api/helloworld?name=%E5%88%98%E5%A4%87

前後端聯調福音——RAP

前臺就可以根據上面的URL來進行發起請求。另外,也可以通過配置mock插件,使用相對路徑來訪問請求接口。

前後端聯調福音——RAP

在模塊頁面中點擊配置選項,會打開一個FE工具箱頁面,將其中的插件代碼拷貝到我們需要進行調用接口的頁面。

下圖是一個簡單的頁面,通過jquery請求接口數據。只需要在jquery.js引用的後面加上插件代碼,我們就可以按照相對路徑的請求方式來獲取到我們接口的數據了。當我們的前端需要與後端進行接口對接時,只需要註釋掉該mock插件代碼即可。

前後端聯調福音——RAP

另外如果我們需要跨域來使用mock接口,那麼我們就需要使用jsonp的方式來發起請求,下圖示例是jsonp的一個接口rap設置。

前後端聯調福音——RAP

在上圖中,我們可以看到,只需要設置請求參數為[callback],[callback]表示的是傳過來的請求參數是一個函數名。在我們前端請求時按照正常的jsonp的請求方式即可。

三、高級功能案例介紹

接下來我們以一個實際業務場景來介紹RAP的一些高級功能。

業務場景:通過傳入商品類型、城市ID、排期類別來查詢在一年之內的排期時間。

下圖是我們定義的接口格式,該接口以數組的形式返回排期時間。

前後端聯調福音——RAP

接下來將定義傳入參數和返回參數,該定義如下圖所示:

前後端聯調福音——RAP

在模擬數據的時候RAP會使用到Mock.js的語法,這裡我們簡單的介紹一下相關語法。在接口返回的數據中,我們需要返回下圖所示的一個數組:

前後端聯調福音——RAP

參數begin和end需要表示的是該排期一個時間段的開始時間和結束時間,備註後面的@mock=@date(yyyy年MM月dd)表示的是隨機的一個時間。

timeState表示的是該時間段是否被佔用,1代表被佔用,0代表不被佔用。語法是:timeState|1 ,@mock=[1,0];這裡表示的意思是timeState會從後面的集合[1,0]中隨機選取一個數來表示。

week 則表示當前時間段是屬於該年的第幾周;由於一年有52周,這裡用到隨機數來表示:week|1-52,表示的week的取值是從1到52之間隨機選取。

year 年份我們這裡選取了一個固定值 :@mock=2017。

點擊接口詳情旁邊的Mock數據,就可以看到模擬後的數據了,接著按照前面的介紹使用該接口即可。下圖是模擬後的數據:

前後端聯調福音——RAP

更多詳細Mock.js的介紹可以參考Mock.js的官網:http://mockjs.com/.

四、api接口導出

敏捷宣言中:可以工作的軟件勝過面面俱到的文檔。RAP 提供了api接口導出以及項目配置導出、導入功能。極大降低了接口維護成本,可以說RAP的接口配置就是接口設計文檔。

前後端聯調福音——RAP

前後端聯調福音——RAP

五、相關資料

通過以上的介紹,想必大家對Rap會有一個基本的瞭解,下面是Rap相關的一些學習的資料鏈接,如果想更深入的瞭解 Rap,可以參考這些資料來學習。

參考文章

[Mock.js 官網]:http://mockjs.com/.

[RAP wiki ] : https://github.com/thx/RAP/wiki

[RAP 學習視頻] : http://thx.github.io/RAP/study.htm

文章選自微信公眾號:zhaopinteam_58

如果您有什麼意見想法或者想看到更多幹貨,歡迎關注公眾號:zhaopinteam_58

相關推薦

推薦中...