[發(fā)明專利]一種網(wǎng)頁輸出方法、裝置、設(shè)備及存儲介質(zhì)

在審

• 申請?zhí)枺?/td>: 202110767065.9
• 申請日: 2021-07-07
• 公開（公告）號: CN113434142A
• 公開（公告）日: 2021-09-24
• 發(fā)明（設(shè)計）人: 戴錦輝;徐永強
• 申請（專利權(quán)）人: 深圳市鄰友通科技發(fā)展有限公司
• 主分類號: G06F8/38
• 分類號: G06F8/38;G06F16/958
• 代理公司: 北京品源專利代理有限公司 11332
• 代理人: 潘登

本發(fā)明實施例公開了一種網(wǎng)頁輸出方法、裝置、設(shè)備及存儲介質(zhì)。該方法包括：向服務(wù)端發(fā)送網(wǎng)頁加載請求；獲取服務(wù)端根據(jù)網(wǎng)頁加載請求返回的完整網(wǎng)頁文件，完整網(wǎng)頁文件由服務(wù)端根據(jù)網(wǎng)頁加載請求渲染生成；根據(jù)完整網(wǎng)頁文件顯示網(wǎng)頁頁面；基于網(wǎng)頁頁面進行頁面渲染得到客戶端渲染文件；根據(jù)客戶端渲染文件和完整網(wǎng)頁文件基于網(wǎng)頁頁面進行頁面交互事件綁定。本發(fā)明實施例將完整網(wǎng)頁文件的渲染生成由服務(wù)端進行，以使客戶端可以直接顯示網(wǎng)頁頁面，提高首屏響應(yīng)速度，并且在客戶端單獨再進行頁面渲染以進行頁面交互事件綁定，避免自服務(wù)端得到的完整網(wǎng)頁文件有誤導(dǎo)致網(wǎng)頁輸出錯誤。

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

本發(fā)明實施例涉及互聯(lián)網(wǎng)技術(shù)領(lǐng)域，尤其涉及一種網(wǎng)頁輸出方法、裝置、設(shè)備及存儲介質(zhì)。

背景技術(shù)

目前主流的前端開發(fā)都是使用客戶端進行MVVM框架的渲染，即用戶向服務(wù)端發(fā)送請求，獲取HTML(超文本標記語言)等資源，然后在客戶端本地進行構(gòu)建應(yīng)用從而生成完整的HTML文檔，進而在客戶端瀏覽器渲染出HTML字符串模板進行頁面渲染實現(xiàn)網(wǎng)頁輸出，但是這種方式需要等待客戶端進行請求數(shù)據(jù)構(gòu)建應(yīng)用，首屏?xí)r間較長。而隨著互聯(lián)網(wǎng)技術(shù)的發(fā)展，服務(wù)器端渲染也逐漸成為一種常見的技術(shù)手段，即在服務(wù)器端進行構(gòu)建應(yīng)用從而生成完整的HTML文檔，這樣客戶端用于直接接受經(jīng)過服務(wù)器渲染后的完整HTML文檔，并對HTML文檔進行解析以通過客戶端瀏覽器展示對應(yīng)的網(wǎng)頁，這種方式提高了首屏顯示速度，但是服務(wù)器和客戶端畢竟不同，服務(wù)端渲染得到的完整HTML文檔在渲染過程、傳輸過程都有可能出現(xiàn)問題，這就導(dǎo)致客戶端在根據(jù)完整HTML文檔輸出網(wǎng)頁時出錯的可能更高。因此，如何兼顧首屏?xí)r間和網(wǎng)頁顯示準確成為問題。

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

有鑒于此，本發(fā)明提供一種網(wǎng)頁輸出方法、裝置、電子設(shè)備及存儲介質(zhì)，通過服務(wù)端渲染得到完整網(wǎng)頁文件縮短了客戶端的首屏?xí)r間，在客戶端再次進行頁面渲染保證了最終輸出網(wǎng)頁的準確性。

第一方面，本發(fā)明實施例提供了一種網(wǎng)頁輸出方法，包括：

向服務(wù)端發(fā)送網(wǎng)頁加載請求；

獲取服務(wù)端根據(jù)所述網(wǎng)頁加載請求返回的完整網(wǎng)頁文件，所述完整網(wǎng)頁文件由服務(wù)端根據(jù)所述網(wǎng)頁加載請求渲染生成；

根據(jù)所述完整網(wǎng)頁文件顯示網(wǎng)頁頁面；

基于所述網(wǎng)頁頁面進行頁面渲染得到客戶端渲染文件；

根據(jù)所述客戶端渲染文件和所述完整網(wǎng)頁文件基于所述網(wǎng)頁頁面進行頁面交互事件綁定。

第二方面，本發(fā)明實施例提供了一種網(wǎng)頁輸出方法，應(yīng)用于服務(wù)端，包括：

接收客戶端發(fā)送的網(wǎng)頁加載請求；

根據(jù)所述網(wǎng)頁加載請求構(gòu)建網(wǎng)頁頁面，并對所述網(wǎng)頁頁面進行渲染得到完整網(wǎng)頁文件；

將所述完整網(wǎng)頁文件發(fā)送至客戶端。

第三方面，本發(fā)明實施例還提供了一種網(wǎng)頁輸出裝置，包括：

發(fā)送模塊，向服務(wù)端發(fā)送網(wǎng)頁加載請求；

接收模塊，用于獲取服務(wù)端根據(jù)所述網(wǎng)頁加載請求返回的完整網(wǎng)頁文件，所述完整網(wǎng)頁文件為服務(wù)端根據(jù)所述網(wǎng)頁加載請求渲染生成；

頁面顯示模塊，用于根據(jù)所述完整網(wǎng)頁文件顯示網(wǎng)頁頁面；

渲染模塊，用于基于所述網(wǎng)頁頁面進行頁面渲染得到客戶端渲染文件；

交互綁定模塊，用于根據(jù)所述客戶端渲染文件和所述完整網(wǎng)頁文件基于所述網(wǎng)頁頁面進行頁面交互事件綁定。

第四方面，本發(fā)明實施例還提供了一種電子設(shè)備，包括：

一個或多個處理器；

存儲裝置，用于存儲一個或多個程序，