[發明專利]一種前后端分離架構下的頁面靜態化方法與系統

有效

• 申請號: 202110556912.7
• 申請日: 2021-05-21
• 公開（公告）號: CN113315822B
• 公開（公告）日: 2023-06-20
• 發明（設計）人: 劉德建;王杰光;陳宏
• 申請（專利權）人: 福建天泉教育科技有限公司
• 主分類號: H04L67/02
• 分類號: H04L67/02;H04L47/10;G06F16/955;G06F16/957;G06F16/958
• 代理公司: 福州市博深專利事務所(普通合伙) 35214
• 代理人: 張明

1.一種前后端分離架構下的頁面靜態化方法，其特征在于，包括：

S1、客戶端訪問目標頁面時接入最近的CDN接入點并發送頁面獲取請求至所述CDN接入點，所述CDN接入點與所述目標頁面的域名綁定；

S2、CDN接入點接收所述頁面獲取請求，并返回目標頁面靜態化數據，所述目標頁面靜態化數據包括注入了請求攔截SDK的HTML文件以及頁面數據包；

S3、客戶端接收所述目標頁面靜態化數據，在瀏覽器執行所述HTML文件中的JS代碼從而向后端服務器發起數據獲取請求時，所述請求攔截SDK攔截所述數據獲取請求，并調用所述頁面數據包中對應的數據作為所述數據獲取請求的返回數據；

S4、客戶端根據所述返回數據對所述目標頁面進行渲染；

S5、CDN接入點以預設時間間隔后臺異步掃描每個所述目標頁面靜態化數據的生成時間，計算與當前時間的時間差值，并與所述目標頁面所聲明的有效時長進行比較，若所述時間差值超過所述有效時長則刪除所述目標頁面靜態化數據；

所述步驟S5中所述若所述時間差值超過所述有效時長則刪除所述目標頁面靜態化數據具體為：

若所述時間差值超過所述有效時長，則啟動靜態化服務，獲取并保存所述目標頁面新的所述頁面靜態化數據，并在獲取到所述目標頁面新的所述目標頁面靜態化數據后刪除當前的所述目標頁面靜態化數據；

所述啟動靜態化服務，獲取并保存所述目標頁面新的所述頁面靜態化數據具體為：

CDN接入點啟動所述靜態化服務，所述靜態化服務打開一個無頭瀏覽器加載所述目標頁面，并在頁面中注入靜態化攔截SDK，所述無頭瀏覽器執行頁面內的JS代碼，向所述后端服務器發送數據獲取請求；

所述靜態化攔截SDK攔截所述后端服務器返回的所有請求數據，按請求的URL為KEY和所述請求數據為Value，對所有所述請求數據進行打包和存儲，得到所述頁面數據包；

獲取目標頁面的所述HTML文件，根據所述頁面數據包修改所述HTML文件的數據引用源碼，同時注入請求攔截SDK，保存所述HTML文件。

2.根據權利要求1所述的一種前后端分離架構下的頁面靜態化方法，其特征在于，所述步驟S2具體為：

CDN接入點接收所述頁面獲取請求，判斷是否存儲有未過期的所述目標頁面的所述頁面靜態化數據，若存在則返回所述頁面靜態化數據，否則向所述后端服務器發起回源請求，接收所述后端服務器返回的所述目標頁面的動態頁面內容，并向客戶端返回所述動態頁面內容，同時執行步驟S21；

S21、CDN接入點啟動靜態化服務，獲取并保存所述目標頁面新的所述頁面靜態化數據。