[發(fā)明專利]微前端架構(gòu)的實現(xiàn)方法、裝置、計算機設備和存儲介質(zhì)

在審

• 申請?zhí)枺?/td>: 202211068659.1
• 申請日: 2022-09-02
• 公開（公告）號: CN115421693A
• 公開（公告）日: 2022-12-02
• 發(fā)明（設計）人: 陳功;李星;陳洲
• 申請（專利權(quán)）人: 金蝶征信有限公司
• 主分類號: G06F8/20
• 分類號: G06F8/20;G06F8/30;G06F9/448
• 代理公司: 華進聯(lián)合專利商標代理有限公司 44224
• 代理人: 胡淑梅

本申請涉及一種微前端架構(gòu)的實現(xiàn)方法、裝置、計算機設備和存儲介質(zhì)。所述方法包括：響應于子應用開啟請求，將子應用掛載于主應用文檔中的掛載位置上；在所述子應用完成掛載后，依據(jù)加載關(guān)鍵數(shù)據(jù)獲取所述子應用對應的資源；所述資源包括樣式數(shù)據(jù)和JS腳本；在所述掛載位置上創(chuàng)建與所述樣式數(shù)據(jù)對應的隔離環(huán)境，以及在所述隔離環(huán)境中創(chuàng)建所述JS腳本對應的代理沙箱；將所述樣式數(shù)據(jù)加載于所述隔離環(huán)境得到第一層疊樣式表對象模型樹；將所述JS腳本運行于所述代理沙箱得到文檔對象模型樹，基于所述第一層疊樣式表對象模型樹和所述文檔對象模型樹顯示所述子應用。采用本方法能夠提高應用的兼容性。

技術(shù)領(lǐng)域

本申請涉及計算機技術(shù)領(lǐng)域，特別是涉及一種微前端架構(gòu)的實現(xiàn)方法、裝置、計算機設備和存儲介質(zhì)。

背景技術(shù)

隨著web(World Wide Web，萬維網(wǎng))應用前端系統(tǒng)的日益龐大復雜，系統(tǒng)的開發(fā)人員不斷增多，很多項目容易出現(xiàn)難以維護的問題，因此很多開發(fā)人員在找尋一種高效管理復雜應用的方案，如何實現(xiàn)這種架構(gòu)是項目開發(fā)人員面臨的一個重要課題。

傳統(tǒng)對多應用的管理方案中，主要有iframe、npm依賴包、微前端框架通常iframe只適合簡單的應用場景。npm依賴包是將子應用封裝成npm包，通過組件的方式引入。流行的微前端框架有single-spa和qiankun，但它們都有比較強的協(xié)議規(guī)定，對原有應用需要做大量改動才能適配，故而存在對應用的兼容性差的問題。

發(fā)明內(nèi)容

基于此，有必要針對上述技術(shù)問題，提供一種能夠提升應用的兼容性的微前端架構(gòu)的實現(xiàn)方法、裝置、計算機設備和計算機可讀存儲介質(zhì)。

第一方面，本申請?zhí)峁┝艘环N微前端架構(gòu)的實現(xiàn)方法。所述方法包括：

響應于子應用開啟請求，將子應用掛載于主應用文檔中的掛載位置上；

在所述子應用完成掛載后，依據(jù)加載關(guān)鍵數(shù)據(jù)獲取所述子應用對應的資源；所述資源包括樣式數(shù)據(jù)和JS腳本；

在所述掛載位置上創(chuàng)建與所述樣式數(shù)據(jù)對應的隔離環(huán)境，以及在所述隔離環(huán)境中創(chuàng)建所述JS腳本對應的代理沙箱；

將所述樣式數(shù)據(jù)加載于所述隔離環(huán)境得到第一層疊樣式表對象模型樹；

將所述JS腳本運行于所述代理沙箱得到文檔對象模型樹，基于所述第一層疊樣式表對象模型樹和所述文檔對象模型樹顯示所述子應用。

在其中一個實施例中，所述將子應用掛載于主應用文檔中的掛載位置上之前，所述方法還包括：

確定所述子應用的子應用名稱；

獲取掛載標簽，并依據(jù)所述掛載標簽確定所述子應用的掛載位置；

調(diào)用注冊函數(shù)，通過所述注冊函數(shù)配置所述子應用的相關(guān)參數(shù)。

在其中一個實施例中，所述響應于子應用開啟請求，將子應用掛載于主應用文檔中的掛載位置上，包括：

響應于子應用開啟請求，當所述子應用未配置路由參數(shù)時，將子應用掛載于主應用文檔中的掛載位置上；

當所述子應用已配置路由參數(shù)時，確定所述子應用名稱對應的子應用地址；將所述子應用地址與主應用地址進行路由匹配，得到匹配結(jié)果；當所述匹配結(jié)果為匹配成功時，將子應用掛載于主應用文檔中的掛載位置上。

在其中一個實施例中，所述方法還包括：

當所述匹配結(jié)果為匹配成功時，對所述子應用地址進行映射處理；

當所述匹配結(jié)果為匹配不成功時，不對所述子應用進行掛載處理，或?qū)λ鲎討眯遁d處理。

在其中一個實施例中，所述加載關(guān)鍵數(shù)據(jù)包括第一標簽和第二標簽；所述樣式數(shù)據(jù)包括層疊樣式表和樣式文件；所述依據(jù)加載關(guān)鍵數(shù)據(jù)獲取所述子應用對應的資源包括：