用Event機制實現(xiàn)web登錄后不刷新頁面

web app在登錄后不刷新頁面,僅局部刷新,這樣的做法似乎不是很主流。大概留意了一下幾個大網(wǎng)站,大多數(shù)網(wǎng)站的做法:

  • 登錄頁url跟首頁url不一樣。即登錄時跳到另一個url,登錄成功后再跳到首頁。如:taobao.com / jd.com。為何如此,未進行深入考察。
  • 登錄后刷新頁面。如:baidu.com / douban.com

登錄后不全頁面刷新(一下簡稱“不刷新”),似非主流做法。不過,若非要如此(比如登錄前后頁面變化不是很大,設計同學覺得硬生生刷新一次,用戶體驗不好),我們現(xiàn)在也嘗試了一下,也是可行的。

“不刷新”,對于前端開發(fā)的要求自然比“刷新”要高一些,高在兩點:

  1. 事件的通知機制。即,“用戶登錄”這個事情如何通知給相關模塊,而又盡量不增加太大的耦合性。
  2. 相關模塊內(nèi)部在收到事件時的狀態(tài)切換、數(shù)據(jù)清理等工作。這屬于精細活,如果初期未考慮“不刷新”,后期再加的話,會比較煩人。很容易漏掉一些老數(shù)據(jù)。

Event機制

如果整個web app不是基于模塊化開發(fā)的,欲達到“不刷新”,我覺得實現(xiàn)起來會更費勁。我們現(xiàn)在用了模塊化,就用了Event通知機制,原理見我另一篇文章前端模塊化之——模塊之間通信

基于該機制,實現(xiàn)起來也就不是什么理論上的難題了:執(zhí)行在“用戶登錄”這件事發(fā)生之后,給全局發(fā)一個Event,對此Event感興趣的模塊(即于身份相關)就可以在此時進行數(shù)據(jù)的重新獲取、渲染等工作了。

另,鑒于用戶身份數(shù)據(jù)這種全局可能都需要的,可在一個地方保存(而不是各個模塊自己去取、存)。故,可在“用戶登錄”并且“獲取用戶數(shù)據(jù)”這兩個動作都完成后,再通知全局。

實現(xiàn)現(xiàn)狀

“用戶退出”,與登錄是一樣的原理。不過,因為im模塊比較復雜,初始作者因忙于其他工作不能支援,清理工作要想做到比較徹底很得費一番周折。故,只實現(xiàn)了“登錄不刷新”,而“退出”,就刷新吧,一切回到干凈狀態(tài)。算是偷懶了吧。

最后編輯于
?著作權歸作者所有,轉載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務。

相關閱讀更多精彩內(nèi)容

  • Spring Cloud為開發(fā)人員提供了快速構建分布式系統(tǒng)中一些常見模式的工具(例如配置管理,服務發(fā)現(xiàn),斷路器,智...
    卡卡羅2017閱讀 136,502評論 19 139
  • Android 自定義View的各種姿勢1 Activity的顯示之ViewRootImpl詳解 Activity...
    passiontim閱讀 178,716評論 25 709
  • iOS網(wǎng)絡架構討論梳理整理中。。。 其實如果沒有APIManager這一層是沒法使用delegate的,畢竟多個單...
    yhtang閱讀 5,466評論 1 23
  • 22年12月更新:個人網(wǎng)站關停,如果仍舊對舊教程有興趣參考 Github 的markdown內(nèi)容[https://...
    tangyefei閱讀 35,388評論 22 257
  • 有時候會胡思亂想,自己現(xiàn)在過著怎樣的生活,為什么我把生活過得如此的糟糕。此時此刻的我變得特別煩惱,雖然很多東西我們...
    流口水的噠噠豬閱讀 381評論 0 0

友情鏈接更多精彩內(nèi)容