0
  • 聊天消息
  • 系統(tǒng)消息
  • 評論與回復(fù)
登錄后你可以
  • 下載海量資料
  • 學(xué)習(xí)在線課程
  • 觀看技術(shù)視頻
  • 寫文章/發(fā)帖/加入社區(qū)
會員中心
創(chuàng)作中心

完善資料讓更多小伙伴認(rèn)識你,還能領(lǐng)取20積分哦,立即完善>

3天內(nèi)不再提示

前后端數(shù)據(jù)接口協(xié)作提效實(shí)踐

倩倩 ? 來源:OSC開源社區(qū) ? 作者:OSC開源社區(qū) ? 2022-08-31 16:44 ? 次閱讀

導(dǎo)讀

introduction

在大部分場景中,前后端可以在開發(fā)前約定好數(shù)據(jù)接口,雙方能夠圍繞約定并行地完成開發(fā)和自測。然而在大型系統(tǒng)中一些后端模塊有時并非直連前端,在它們之間可能包含一些其它模塊的處理過程,為了保證數(shù)據(jù)真實(shí)有效,前端需要搭建整套環(huán)境來調(diào)試渲染效果,導(dǎo)致效率和研發(fā)體驗不斷劣化。本文主要介紹百度商業(yè)前端團(tuán)隊結(jié)合接口平臺和數(shù)據(jù)直達(dá)能力優(yōu)化前后端協(xié)作效率的嘗試,有效的提升了團(tuán)隊協(xié)作效能。

一、實(shí)踐方案

GEEK TALK 我們的實(shí)踐主要分為兩大階段:

1. 協(xié)作提效;

2. 質(zhì)量保障&體驗優(yōu)化。

其中協(xié)作提效包括基礎(chǔ)能力建設(shè)和協(xié)作模式升級落地;質(zhì)量保障&研發(fā)體驗是在協(xié)作提效的基礎(chǔ)上,對業(yè)務(wù)質(zhì)量保障和極端場景所遇到的問題提出的一些解決方案。

45c2a93e-2862-11ed-ba43-dac502259ad0.png

二、數(shù)據(jù)直達(dá)能力

GEEK TALK 我們團(tuán)隊所維護(hù)的后端模塊是一個BFF層,負(fù)責(zé)適配上游和前端模塊的數(shù)據(jù),和前端業(yè)務(wù)聯(lián)系非常緊密。然而由于該層和前端之間還包含了一些策略和聚合的處理邏輯,大家在開發(fā)自測過程中沒辦法直接使用樁數(shù)據(jù)來預(yù)覽效果,前端為了調(diào)試功能只能維護(hù)多套環(huán)境,除去環(huán)境搭建本身需要消耗大把時間之外,模塊連通性排查、資源協(xié)調(diào),環(huán)境更新都會影響前端的工作效率。 為了減少維護(hù)環(huán)境帶來的精力消耗,我們在實(shí)踐初期嘗試過多次環(huán)境管理優(yōu)化,效果都不是很理想,一方面有限的環(huán)境資源始終沒辦法很好地滿足頻繁迭代的需要,另一方面環(huán)境提供方也疲于應(yīng)對各種各樣的問題,所以我們就想能不能不再維護(hù)線下環(huán)境,而是將開發(fā)測試的工作轉(zhuǎn)移到線上環(huán)境上去進(jìn)行,也就是讓后端能夠同時處理線上和線下數(shù)據(jù)請求,使前端在連接線上環(huán)境時看到線下數(shù)據(jù)的渲染結(jié)果。 基于這個思路,我們在后端隔離出一套旁支邏輯定時地從Redis拉取線下物料數(shù)據(jù)和對應(yīng)的設(shè)備信息,其中設(shè)備信息是某臺手機(jī)或者某個瀏覽器唯一id,當(dāng)這些設(shè)備所對應(yīng)的請求到達(dá)時,后端就把它當(dāng)作一個特殊請求替換原有請求成線下數(shù)據(jù),接著繼續(xù)之后的處理過程,前端只需要將數(shù)據(jù)和設(shè)備信息寫入到Redis就能接收到線下數(shù)據(jù)的處理結(jié)果,這樣前端就像在使用一套始終保持最新版本的常駐環(huán)境,不會再被各種各樣的環(huán)境維護(hù)問題消耗精力,雙方都能在協(xié)作過程中更關(guān)注業(yè)務(wù)邏輯本身。

45f641c2-2862-11ed-ba43-dac502259ad0.png

三、升級協(xié)作模式

GEEK TALK 借助數(shù)據(jù)直達(dá)能力,我們成功解決了環(huán)境維護(hù)困難的問題,大幅地提升了聯(lián)調(diào)階段的效率,但其實(shí)我們在開發(fā)階段的協(xié)作仍然存在著一些問題。在能力建設(shè)初期我們只支持了請求數(shù)據(jù)的替換,前端沒辦法在后端代碼上線之前開始開發(fā),這樣串行的協(xié)作模式顯然是有問題的,所以我們就想能不能基于數(shù)據(jù)直達(dá)能力擴(kuò)展出一套常規(guī)的樁服務(wù)。 為了實(shí)現(xiàn)樁服務(wù),我們在需要作為樁輸出給前端的數(shù)據(jù)上添加了特殊標(biāo)識,當(dāng)后端識別到攜帶特殊標(biāo)識的數(shù)據(jù)請求時就會跳過后續(xù)的處理邏輯,直接返回結(jié)果給下游模塊。這種替換返回的模式能夠讓后端在開發(fā)前就將線下樁數(shù)據(jù)交付給前端使用,使前后端能夠并行協(xié)作。

4614474e-2862-11ed-ba43-dac502259ad0.png

為了減少學(xué)習(xí)和操作成本,我們將以上所介紹的能力封裝成平臺提供給團(tuán)隊使用,后端可以按照項目為維度編輯和交付數(shù)據(jù),前端可以拿這些數(shù)據(jù)去和設(shè)備做連接,然后直接在app上刷新就可以看到效果。

4623cf0c-2862-11ed-ba43-dac502259ad0.png

四、數(shù)據(jù)分級

GEEK TALK 為了改造前后端協(xié)作模式,我們在開發(fā)過程中使用的其實(shí)都是樁數(shù)據(jù),這樣可能會導(dǎo)致數(shù)據(jù)和最后真實(shí)邏輯所輸出的結(jié)果存在差異,這些差異可能會暴露到線上影響業(yè)務(wù)功能,所以如果缺少有效的措施去約束數(shù)據(jù)使用的話,那么質(zhì)量風(fēng)險會變得難以控制。 為此,我們將數(shù)據(jù)的使用根據(jù)規(guī)則和應(yīng)用場景劃分成三種類型:手動生成、線下后端生成、線上后端生成。

46456ac2-2862-11ed-ba43-dac502259ad0.png

可以看到,數(shù)據(jù)的約束規(guī)則隨著項目的推進(jìn)是逐步收緊的。在開發(fā)前期后端能使用編輯生成出的樁數(shù)據(jù)快速交付給前端,讓前端完成單模塊開發(fā)自測;在聯(lián)調(diào)階段,我們的數(shù)據(jù)是由后端所開發(fā)完成的代碼邏輯生成而來的,由于這部分?jǐn)?shù)據(jù)需要保證一定真實(shí)性,所以不再支持編輯,這樣數(shù)據(jù)就能夠匹配上后端即將上線的邏輯;而在后端上線完成之后,前端能夠從線上檢索系統(tǒng)采集到真實(shí)物料數(shù)據(jù),通過掃碼等方式進(jìn)行效果預(yù)覽,這樣同時從數(shù)據(jù)和代碼邏輯兩方面保證了真實(shí)性。 通過上述對數(shù)據(jù)分級的規(guī)劃,我們保證了協(xié)作過程在高效并行運(yùn)轉(zhuǎn)的同時,始終遵循一套流程標(biāo)準(zhǔn),能夠有效地保障了業(yè)務(wù)的交付質(zhì)量。

46626ea6-2862-11ed-ba43-dac502259ad0.png

五、優(yōu)化平臺體驗

GEEK TALK 經(jīng)過前面三個步驟的優(yōu)化,我們在大部分的項目中已經(jīng)能讓前后端解耦協(xié)作,然而在一些復(fù)雜項目中這套流程反而會降低工作效率,這是因為復(fù)雜項目往往需要覆蓋的功能點(diǎn)更多,數(shù)據(jù)組合也相應(yīng)的更多,我們發(fā)現(xiàn)部分項目所需要的數(shù)據(jù)條數(shù)甚至超過兩百條,這樣后端就要花費(fèi)大量的時間和精力去錄入和編輯數(shù)據(jù),在這種極端需求下數(shù)據(jù)準(zhǔn)備時間就成為了效率瓶頸,使得研發(fā)體驗急劇下降。 為了解決這個問題,我們圍繞“片段”概念支持了對數(shù)據(jù)批量編輯的功能,可以讓后端在編輯數(shù)據(jù)的過程中,將編輯的操作以“片段”的形式保存下來,每一個“片段”包含編輯的位置和值,這些“片段”可以繼續(xù)應(yīng)用到多個數(shù)據(jù)上,這樣編輯工作就從多次變成一次,大大減少了重復(fù)工作量。

4688b4a8-2862-11ed-ba43-dac502259ad0.png

同時,由于前端需要頻繁對同一個功能進(jìn)行例如版本兼容、標(biāo)題長度兼容等細(xì)分情況的驗證,為了更好的支持這種需求,我們支持了“片段”的版本的功能,也就是在保持“片段”操作位置不變的前提下,為“片段”賦予不同的值,前端可以通過切換“片段”的不同版本,快速拿到同個功能下攜帶不同細(xì)節(jié)的數(shù)據(jù)去快速地驗證一些兼容效果。

46b089a6-2862-11ed-ba43-dac502259ad0.png

六、總結(jié)

GEEK TALK 前后端數(shù)據(jù)接口協(xié)作升級使我們的團(tuán)隊能夠更穩(wěn)定高效地完成產(chǎn)品迭代,團(tuán)隊的項目的平均交付時間減少了50%以上,目前已經(jīng)有上千次的業(yè)務(wù)項目基于這套方案完成了開發(fā)測試和線上回歸工作。我們也在持續(xù)不斷地探索在如產(chǎn)品視覺驗收、銷售問題驗證等其它方面落地的可能性,希望能在更多的場景下提升團(tuán)隊的協(xié)作效能。

END

審核編輯 :李倩

聲明:本文內(nèi)容及配圖由入駐作者撰寫或者入駐合作網(wǎng)站授權(quán)轉(zhuǎn)載。文章觀點(diǎn)僅代表作者本人,不代表電子發(fā)燒友網(wǎng)立場。文章及其配圖僅供工程師學(xué)習(xí)之用,如有內(nèi)容侵權(quán)或者其他違規(guī)問題,請聯(lián)系本站處理。 舉報投訴
  • 模塊
    +關(guān)注

    關(guān)注

    7

    文章

    2626

    瀏覽量

    47211
  • 數(shù)據(jù)接口
    +關(guān)注

    關(guān)注

    1

    文章

    78

    瀏覽量

    17815

原文標(biāo)題:前后端數(shù)據(jù)接口協(xié)作提效實(shí)踐

文章出處:【微信號:OSC開源社區(qū),微信公眾號:OSC開源社區(qū)】歡迎添加關(guān)注!文章轉(zhuǎn)載請注明出處。

收藏 人收藏

    評論

    相關(guān)推薦

    SOLIDWORKS 2025:更有效的協(xié)作和數(shù)據(jù)管理

    在當(dāng)今快速變化的商業(yè)環(huán)境中,有效的協(xié)作和數(shù)據(jù)管理已成為企業(yè)成功的關(guān)鍵。作為CAD領(lǐng)域的領(lǐng)軍者,SOLIDWORKS始終致力于為用戶提供優(yōu)越的三維設(shè)計與工程解決方案。隨著SOLIDWORKS?2025的發(fā)布,這款旗艦軟件在協(xié)作和數(shù)據(jù)管理方面實(shí)現(xiàn)了重大突破,為用戶帶來了良好體
    的頭像 發(fā)表于 10-08 16:52 ?133次閱讀

    前后端數(shù)據(jù)傳輸約定探討

    1 目的 穩(wěn)定可靠,降本增效 ? 前后端數(shù)據(jù)傳輸約定旨在提升系統(tǒng)穩(wěn)定性、可靠性,降低線上線下bug率;并提升研發(fā)效率、降低溝通成本、降低延期率。是確保項目前端和后端開發(fā)順利進(jìn)行的重要規(guī)約之一,定義了
    的頭像 發(fā)表于 07-08 19:10 ?172次閱讀
    <b class='flag-5'>前后端</b><b class='flag-5'>數(shù)據(jù)</b>傳輸約定探討

    重磅!英特爾發(fā)布intel3制程至強(qiáng)6能核處理器,賦能數(shù)據(jù)中心能升級

    、橫向擴(kuò)展工作負(fù)載帶來性能與能的雙重提升,同時攜手金山云、浪潮信息、南大通用,以及記憶科技等多家生態(tài)合作伙伴,分享基于該處理器的端到端創(chuàng)新解決方案,及其在諸多領(lǐng)域的實(shí)踐成果與應(yīng)用價值。
    的頭像 發(fā)表于 06-07 10:38 ?4246次閱讀
    重磅!英特爾發(fā)布intel3制程至強(qiáng)6能<b class='flag-5'>效</b>核處理器,賦能<b class='flag-5'>數(shù)據(jù)</b>中心能<b class='flag-5'>效</b>升級

    什么是模擬前端和模擬后端 模擬前端與模擬后端的區(qū)別

    模擬前端和模擬后端是電子系統(tǒng)設(shè)計中的兩個關(guān)鍵部分,它們在信號處理過程中扮演著不同的角色,各自具有獨(dú)特的功能和重要性。
    的頭像 發(fā)表于 03-16 15:21 ?1999次閱讀

    模擬前端和后端的區(qū)別

    模擬前端和模擬后端在電子系統(tǒng)設(shè)計中各自扮演著重要的角色,它們之間有著明顯的區(qū)別。
    的頭像 發(fā)表于 03-15 15:59 ?826次閱讀

    模擬后端是什么意思

    模擬后端,在軟件開發(fā)和測試領(lǐng)域,通常是指使用工具或技術(shù)來模擬實(shí)際后端服務(wù)的行為。這樣做的主要目的是在項目開發(fā)過程中,當(dāng)后端服務(wù)還未就緒或暫時無法訪問時,前端或其他依賴后端的系統(tǒng)能夠繼續(xù)
    的頭像 發(fā)表于 03-15 15:58 ?572次閱讀

    什么是接口測試?如何開展接口測試

    接口其實(shí)就是前端頁面或APP等調(diào)用與后端做交互用的,有朋友會問,我的功能測試都測好了,為什么還要測接口呢?
    發(fā)表于 03-14 14:15 ?462次閱讀
    什么是<b class='flag-5'>接口</b>測試?如何開展<b class='flag-5'>接口</b>測試

    TOPCon電池降本思路解析

    由于TOPCon電池效率超預(yù)期追趕HJT電池,2022年~2023年市場選擇了TOPCon,且預(yù)計未來TOPCon的生命周期會依然維持5~6年。雖然TOPCon工藝技術(shù)已經(jīng)趨于成熟,但是仍有降本
    的頭像 發(fā)表于 02-19 13:11 ?1045次閱讀
    TOPCon電池降本<b class='flag-5'>提</b><b class='flag-5'>效</b>思路解析

    詳解PyTorch在MPS后端的新特性

    大家好,我叫Kulinseth,我在蘋果的MPS團(tuán)隊工作,今天我將討論P(yáng)yTorch中MPS后端的改進(jìn)。接下來,我將介紹MPS后端進(jìn)入Beta Stage的新功能。我們添加了一些新功能,如支持分析器、自定義內(nèi)核和MPS開發(fā)者API,這些都是MPS
    的頭像 發(fā)表于 12-15 10:57 ?2091次閱讀
    詳解PyTorch在MPS<b class='flag-5'>后端</b>的新特性

    芯片設(shè)計分為哪些步驟?為什么要分前端后端?前端后端是什么意思

    芯片設(shè)計分為哪些步驟?為什么要分為前端后端?前端后端分別是什么意思? 芯片設(shè)計分為前端和后端兩個主要步驟。前端設(shè)計由邏輯設(shè)計和驗證組成,后端設(shè)計則包括物理設(shè)計與驗證。這樣的分工有利于更
    的頭像 發(fā)表于 12-07 14:31 ?3327次閱讀

    基于springboot和vue框架的Java

    和Vue項目的環(huán)境,并展示從前端到后端的完整開發(fā)流程。接著,將重點(diǎn)關(guān)注前后端分離的開發(fā)模式,并介紹如何通過RESTful API進(jìn)行數(shù)據(jù)交互。最后,將分享一些實(shí)踐中的經(jīng)驗和技巧,以及對
    的頭像 發(fā)表于 12-03 15:15 ?881次閱讀

    springboot前后端交互流程

    Boot 進(jìn)行開發(fā)時,前后端交互是一個非常重要的部分,本文將詳細(xì)介紹 Spring Boot 前后端交互的流程。 前后端交互的基本原理 在前后端交互的過程中,前端負(fù)責(zé)向
    的頭像 發(fā)表于 11-22 16:00 ?1880次閱讀

    安科瑞數(shù)據(jù)中心能管理系統(tǒng):提升能,降低運(yùn)營成本

    數(shù)據(jù)中心能管理系統(tǒng)是一套功能強(qiáng)大、應(yīng)用廣泛、優(yōu)勢明顯的能管理解決方案。通過該系統(tǒng),數(shù)據(jù)中心可以實(shí)現(xiàn)對能源的精細(xì)化、智能化管理,提高能源利用效率,降低運(yùn)營成本。隨著技術(shù)的不斷進(jìn)步和應(yīng)
    的頭像 發(fā)表于 11-07 15:57 ?499次閱讀
    安科瑞<b class='flag-5'>數(shù)據(jù)</b>中心能<b class='flag-5'>效</b>管理系統(tǒng):提升能<b class='flag-5'>效</b>,降低運(yùn)營成本

    基于Django+Vue的前后端分離開發(fā)教程

    難受的,那就是使用Django自帶的模版,這種通常需要自己利用HTML+CSS+Jquery的方式總感覺是上一個時代的做法,前后端分離無論對于開發(fā)效率、多端支持等等都是很有好處的。 所以,本文希望通過一個簡單的demo,講一講基于Django+Vue的前后端分離開發(fā),將
    的頭像 發(fā)表于 11-01 09:22 ?940次閱讀
    基于Django+Vue的<b class='flag-5'>前后端</b>分離開發(fā)教程

    后端JWT接口認(rèn)證的操作流程

    為了反爬或限流節(jié)流,后端編寫接口時,大部分 API 都會進(jìn)行權(quán)限認(rèn)證,只有認(rèn)證通過,即:數(shù)據(jù)正常及未過期才會返回數(shù)據(jù),否則直接報錯 本篇文章以 Django 為例,聊聊
    的頭像 發(fā)表于 10-31 11:20 ?611次閱讀