[發明專利]網頁生成方法、裝置及電子設備

在審

• 申請號: 201910960381.0
• 申請日: 2019-10-10
• 公開（公告）號: CN110781423A
• 公開（公告）日: 2020-02-11
• 發明（設計）人: 李大雙
• 申請（專利權）人: 騰訊科技(深圳)有限公司
• 主分類號: G06F16/957
• 分類號: G06F16/957;G06F16/958
• 代理公司: 44232 深圳市隆天聯鼎知識產權代理有限公司
• 代理人: 劉抗美

本公開提供一種網頁生成方法、裝置與電子設備，該方法包括：獲取目標內容組件的拖拽指令，根據所述拖拽指令在組件編輯區域內設置所述目標內容組件；獲取所述目標內容組件的屬性編輯指令，根據所述屬性編輯指令記錄所述目標內容組件的樣式源和數據源；響應編輯結束指令，根據所述組件編輯區域內的內容組件的排列順序信息、每個所述內容組件的樣式源和數據源生成網頁數據，以供瀏覽器加載所述網頁數據生成網頁。本公開提供的網頁生成方法可以生成能夠動態更新網頁樣式和數據的網頁，提高前端開發效率。

技術領域

本公開涉及計算機技術領域，具體而言，涉及能夠實現網頁樣式和內容動態更新的網頁生成方法、裝置及電子設備。

背景技術

網頁是構成網站的基本要素，瀏覽器通常通過加載記載網頁內容的HTML(HyperText Markup Language，超文本標記語言)文件來實現網頁的生成。在這些技術中，HTML文件通過多種標記對頁面上的文字、圖片、表格、聲音等元素進行描述(例如字體、顏色、大小)，而瀏覽器則對這些標記進行解釋并生成頁面。

在相關技術中，前端開發主要通過直接撰寫頁面代碼來描述頁面樣式和內容，在應用過程中，如果產生基于用戶體驗的頁面樣式修改等需求，往往需要對頁面代碼進行大量修改，帶來了大量的人力成本和時間成本。此外，由于修改過程費時費力，在大量頁面需要針對同一問題進行修改時，修改時間長、人工成本高，難以做到及時更新網頁樣式，也會極大降低前端開發效率。

需要說明的是，在上述背景技術部分公開的信息僅用于加強對本公開的背景的理解，因此可以包括不構成對本領域普通技術人員已知的現有技術的信息。

發明內容

本公開實施例提供一種網頁生成方法、裝置與電子設備，用于至少在一定程度上克服由于相關技術的限制和缺陷而導致的前端開發過程中開發效率低的問題。

根據本公開的一個方面，提供一種網頁生成方法，包括：獲取目標內容組件的拖拽指令，根據所述拖拽指令在組件編輯區域內設置所述目標內容組件；獲取所述目標內容組件的屬性編輯指令，根據所述屬性編輯指令記錄所述目標內容組件的樣式源和數據源；響應編輯結束指令，根據所述組件編輯區域內的內容組件的排列順序信息、每個所述內容組件的樣式源和數據源生成網頁數據，以供瀏覽器加載所述網頁數據生成網頁。

在本公開的一種示例性實施例中，還包括：獲取多個內容組件的使用頻率，所述使用頻率包括開發者使用頻率和用戶點擊頻率；按照使用頻率從大到小在所述組件庫中展示所述多個內容組件。

在本公開的一種示例性實施例中，還包括：將使用頻率小于預設值的內容組件設置為待清理狀態。

在本公開的一種示例性實施例中，所述供瀏覽器加載所述網頁數據生成網頁包括：響應頁面訪問請求對瀏覽器提供所述網頁數據；根據所述瀏覽器發送的數據源加載請求和樣式源加載請求，對所述瀏覽器返回至少一個內容組件對應的內容數據和樣式數據，以供所述瀏覽器根據所述樣式數據和所述內容數據確定所述內容組件的網頁展示代碼后，按照所述內容組件的排列順序信息和所述內容組件的網頁展示代碼生成網頁。

在本公開的一種示例性實施例中，所述數據源包括已配置接口和數據，所述已配置接口包括接口鏈接與接口參數，所述數據包括按鈕文案、文本、圖片鏈接中的一種或多種。

在本公開的一種示例性實施例中，根據所述屬性編輯指令記錄所述目標內容組件的樣式源和數據源包括：響應所述屬性編輯指令展示屬性編輯框，所述屬性編輯框包括尺寸數據欄、樣式選擇欄和數據源輸入欄，所述數據源輸入欄用于增加、修改和刪除數據源，其中，所述尺寸數據欄內的尺寸數據隨所述數據源數量的增加而增大，隨所述數據源數量的減少而減小。

在本公開的一種示例性實施例中，還包括：響應頁面預覽指令，根據所述組件編輯區域內每個內容組件的所述樣式源和所述數據源從服務器或緩存加載所述每個內容組件的樣式數據和內容數據，根據所述樣式數據和所述內容數據生成預覽頁面。