[發明專利]一種前端頁面組件化的方法、裝置及計算機可讀存儲介質在審
| 申請號: | 202011026438.9 | 申請日: | 2020-09-25 |
| 公開(公告)號: | CN112162747A | 公開(公告)日: | 2021-01-01 |
| 發明(設計)人: | 張鈺峰;祝君;張俊;肖昆 | 申請(專利權)人: | 同程網絡科技股份有限公司 |
| 主分類號: | G06F8/36 | 分類號: | G06F8/36;G06F8/38;G06F8/76 |
| 代理公司: | 暫無信息 | 代理人: | 暫無信息 |
| 地址: | 215000 江蘇省蘇州市工業*** | 國省代碼: | 江蘇;32 |
| 權利要求書: | 查看更多 | 說明書: | 查看更多 |
| 摘要: | |||
| 搜索關鍵詞: | 一種 前端 頁面 組件 方法 裝置 計算機 可讀 存儲 介質 | ||
1.一種前端頁面組件化的方法,其特征在于,包括;
將渠道側頁面需要使用的通用模板進行抽離,生成獨立站點并進行發布;
在獨立站點發布前對代碼進行編譯生成符合不同平臺的頁面文件,并將頁面文件進行分類存儲;
渠道側頁面通過iframe嵌套獨立站點對應頁面文件的URL;
站點的頁面文件完成數據操作后將操作數據回傳至渠道側頁面完成信息通信和交互。
2.根據權利要求1所述的一種前端頁面組件化的方法,其特征在于:所述獨立站點發布前對代碼進行編譯生成符合不同平臺的頁面文件具體包括:
開發人員根據需求以px為單位撰寫用戶界面布局代碼;
獨立站點通過預設值的配置文件讀取渠道配置,將代碼的px值轉換為rem;
輸出不同渠道的頁面文件至獨立站點根目錄的不同子目錄,子目錄按照渠道進行劃分。
3.根據權利要求2所述的一種前端頁面組件化的方法,其特征在于:所述獨立站點通過預設值的配置文件讀取渠道配置,根據配置文件在獨立站點內儲存有不同渠道的調用腳本,多個調用腳本與多個頁面文件一一對應。
4.根據權利要求1所述的一種前端頁面組件化的方法,其特征在于:所述渠道側頁面對嵌套的頁面文件的URL進行預讀取。
5.根據權利要求1所述的一種前端頁面組件化的方法,其特征在于:所述站點的頁面文件完成數據操作后通過postmessage方法將操作數據回傳至渠道側頁面完成信息通信和交互。
6.根據權利要求5所述的一種前端頁面組件化的方法,其特征在于:所述站點的頁面文件完成數據操作后將操作數據回傳至渠道側頁面完成信息通信和交互具體包括:
渠道側根據用戶的操作請求打開新頁面,并在渠道側頁面中通過iframe嵌套獨立站點的頁面文件,獨立站點的頁面文件在iframe中打開并呈現數據;
渠道側通過window.onmessage = someFunction監聽message事件;
用戶在獨立站點的頁面上完成操作,獨立站點的頁面通過targetWindow.postMessage方法向渠道側頁面傳遞操作數據;
渠道側頁面接收并處理數據,展示用戶界面,完成通信交互。
7.根據權利要求6所述的一種前端頁面組件化的方法,其特征在于:所述渠道側頁面接收到頁面文件的操作數據后對頁面文件進行隱藏,完成界面的跳轉。
8.一種前端頁面化的裝置,其特征在于:包括存儲器和處理器,所述存儲器上存儲有能夠被處理器加載并執行如權利要求1至7中任一種方法的計算機程序。
9.一種計算機可讀存儲介質,其特征在于:存儲有能夠被處理器加載并執行如權利要求1至7中任一種方法的計算機程序。
該專利技術資料僅供研究查看技術是否侵權等信息,商用須獲得專利權人授權。該專利全部權利屬于同程網絡科技股份有限公司,未經同程網絡科技股份有限公司許可,擅自商用是侵權行為。如果您想購買此專利、獲得商業授權和技術合作,請聯系【客服】
本文鏈接:http://www.szxzyx.cn/pat/books/202011026438.9/1.html,轉載請聲明來源鉆瓜專利網。





