聯調的認知和感觸

認知（討論）

• 為什么要聯調？
• 聯調都干些什么？

聯調的問題

聯調就是后端不好好寫單元測試與集成測試，讓前端發請求調用以達到測試的目的；前端不好好寫Mock和測試，讓后端輸出數據以達到測試的目的。

更正確地認識

• 聯調是前后端一起見證靠譜的測試結果
• 給需求方提供一個正確的需求驗證環境
• 盡早暴露前后端實現的問題

聯調必備技能

DNS與HOSTS

• DNS（Domain Name System）的認識
• DNS提供將域名解析為IP
• 域名只是便于記憶，真正起作用的還是IP
• GFW作用，HOSTFQ
• 域名解析順序
• 瀏覽器緩存>瀏覽器代理>HOST文件>系統DNS緩存
• 本地DNS服務器>上級DNS>...>頂級DNS

HOST配置的姿勢

• 直接修改HOSTS文件
• 使用Chrome應用 HostAdmin App，也有Firefox插件HostAdmin
• 使用HOST管理工具 SwitchHosts
• 使用Charles/Fiddler HOST配置
• 使用FEKit/YKit 代理配置 Jerry Proxy

更改HOST不即時生效問題

原因

• 瀏覽器有HOST緩存
• 瀏覽器復用了原有HOST的Socket連接

解決辦法

• 重啟瀏覽器或者打開新的瀏覽器
• 使用Charles/Fiddler等代理，避免此問題
• 使用Chrome工具，強行重置Socket連接

代理服務配置

• Chrome瀏覽器代理SwitchySharp 或者 SwitchyOmega
• 系統代理使用Charles/Fiddler 抓取請求包

代理服務HTTPS抓包問題

• 打不開頁面？ 需要根據Charles Help菜單中規則添加Charles根證書
• 某些包解不開？需要在Charles代理設置里面配置具體的解包域名
• 線上證書不安全？解包后再封的包跟原來的有些區別，需要單獨打開對應頁面進行信任

特定場景的調試姿勢

PC/Touch頁面

• 配置前后端環境
• 配置HOST
• 直接使用瀏覽器及瀏覽器模擬器調試
• 如果只是前端更改，在不影響數據的情況下，可以使用線上頁面調試

App頁面

真機調試

• 手機上安裝Beta包，使用數據線連上電腦
• 允許調試或者開啟Inspect
• 通過chrome://inspect 或者Safari的開發者工具進行調試

模擬器調試

• Xcode模擬器
• 搞一個可以在模擬器里面跑的App
• 將App拖入模擬器，然后打開，用Safari開發者工具調試

微信調試

• TBS Studio Android系統下基于Webview的應用調試（騰訊家的）
• 微信開發者工具 微信jsAPI相關調試
• weinre 通用的調試工具

如何更有效地聯調

明確前后端的約定

• 根據需求一起約定交互的內容
• 包括但不限于如下內容
• 接口名稱、請求路徑、請求方式
  • 返回字段結構、對應字段名和字段類型以及字段邊界值
  • 異常情況數據約定
• 一份逼真的樣例數據
• 前端可以根據這個數據造出各種數據

后端對約定的履行

• 根據約定實現相應的需求
• 使用Postman 進行接口測試
• 使用瀏覽器進行接口jsonp功能測試

前端對約定的履行

• 根據約定實現相應的需求
• Mock數據
  • 使用FEKit Mock數據
  • 使用YKit Mock數據
  • 使用Charles/Fiddler 代理接口響應
  • 任意其他Mock，代理，轉發工具獲取Mock數據
• 通過變換Mock數據，進行功能測試

真正的聯調

• 前端完成自測
• 后端完成自測
• 一起驗證需求的實現

友情建議

• 遠離關鍵路徑，合理調配時間——別拖后腿
• 把握全局進度，提高整體效率——別浪費時間
• 積極溝通交流，主動推進聯調——別甩鍋

轉載于:https://www.cnblogs.com/rawbin/p/7266670.html

總結

以上是生活随笔為你收集整理的前后端联调实践总结的全部內容，希望文章能夠幫你解決所遇到的問題。

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