- 小白實戰大前端:移動端與前端的互通之路
- 陳辰
- 606字
- 2022-06-28 16:19:30
1.3 為什么要成為大前端技術人員
在我們平時工作中有很多地方都需要大前端技術人員。舉一個簡單的例子,有一些前端和移動端的邊界不太清楚且工作量又不是很多的工作,找誰處理呢?如果團隊中既有前端工程師又有移動端工程師,那還好。但是只有前端工程師或者移動端工程師怎么辦?我們總不能為了這一個小的技術需求就招聘一個專業人員吧。這勢必讓團隊領導為難。
我認為上面所說的需要大前端的理由只是其中一點,還有一點是在開發中經常會涉及各種各樣的技術方案,這些技術方案如果基于單一端的經驗就會少了非常多的可能性。其實這對于項目架構層面是非常嚴重的損失,甚至有時候會直接導致一個方案流產。
我還是拿一個真實案例來進行說明。我在之前工作的一家公司做移動端的監控,其中有一個需求是在監控App中嵌入H5的Ajax數據。做監控的移動端工程師冥思苦想也沒找到辦法,因為翻遍移動端API也沒有找到監控WebView數據請求的API。
后來他們找到了我,我當初給的方案是,移動端向前端注入一段JavaScript代碼,這段代碼會綁定WebView默認的XMLHttpRequest對象,然后獲取H5頁面中的接口返回數據,最后通過調用移動端掛載到WebView中window上的原生函數,把返回結果傳遞給原生App就可以了,具體方案如圖1-1所示。

圖1-1 攔截H5請求的App上報方案
從圖1-1中可以看到,方案本身并不復雜,僅僅需要一點想象力,還要同時具備前端和移動端的知識。而平時工作中由于不知道大前端的相關知識,估計都不清楚自己錯過了多少優秀方案。這也是為什么要成為大前端工程師的另一個原因。
推薦閱讀
- Dreamweaver CS5網頁設計與制作教程
- jQuery+Bootstrap Web開發案例教程(在線實訓版)
- 園區網互聯及網站建設
- 眾妙之門:自由網站設計師成功之道
- Div+CSS網頁制作實戰教程
- UI動效大爆炸:After Effects移動UI動效制作學習手冊
- 網頁設計與制作(Dreamweaver CS6)
- HTML+CSS+JavaScript網頁設計與布局:從新手到高手
- 速學速通:快學Flash動畫制作
- jQuery Web開發案例教程(在線實訓版)
- Photoshop網頁設計從入門到精通
- CSS圖鑒
- 淘寶店鋪頁面設計與裝修實戰教程
- Photoshop熱門手機APP與網頁游戲界面設計從入門到精通
- 在實戰中成長:JSP開發之路