[發明專利]一種在瀏覽器中進行圖片加載的方法、裝置和瀏覽器

在審

• 申請號: 201310418781.1
• 申請日: 2013-09-13
• 公開（公告）號: CN103500186A
• 公開（公告）日: 2014-01-08
• 發明（設計）人: 杭程;歐勝;任寰
• 申請（專利權）人: 北京奇虎科技有限公司;奇智軟件（北京）有限公司
• 主分類號: G06F17/30
• 分類號: G06F17/30
• 代理公司: 北京潤澤恒知識產權代理有限公司 11319
• 代理人: 趙娟

技術領域

本發明涉及計算機的技術領域，具體涉及一種在瀏覽器中進行圖片加載的方法、一種在瀏覽器中進行圖片加載的裝置，以及，一種瀏覽器。

背景技術

隨著互聯網應用的日趨普及，互聯網應用正在從單一的訪問和瀏覽網頁轉變得更為豐富，在此過程中，用戶對圖片進行編輯美化的個性化需求越來越普遍，但是很多應用無法支持用戶對圖片進行編輯美化的個性化需求。

例如瀏覽器加載渲染HTML（HyperText?Markup?Language，超文本標記語言）網頁。瀏覽器是指可以顯示網頁服務器或者文件系統的HTML（HyperText?Markup?Language，超文本標記語言）文件內容，并讓用戶與這些文件交互的一種軟件。網頁瀏覽器主要通過HTTP（HTTP-Hypertext?transfer?protocol，超文本傳輸協議）協議與網頁服務器交互并獲取網頁，這些網頁由URL（UniformResourceLocator，統一資源定位符）指定，文件格式通常為HTML，并由MIME（Multipurpose?Internet?Mail?Extensions，多用途互聯網郵件擴展）在HTTP協議中指明。一個網頁中可以包括多個文檔，每個文檔都是分別從服務器獲取的。

大部分的瀏覽器本身支持除了HTML之外的廣泛的格式，例如JPEG、PNG、GIF等圖像格式，并且能夠擴展支持眾多的插件（plug-ins）。另外，許多瀏覽器還支持其他的URL類型及其相應的協議，如FTP、Gopher、HTTPS（HTTP協議的加密版本）。

HTTP內容類型和URL協議規范允許網頁設計者在網頁中嵌入圖像、動畫、視頻、聲音、流媒體等。

以下是瀏覽器加載渲染HTML網頁中加載圖片的過程：

1.用戶輸入網址（假設是個html頁面，并且是第一次訪問），瀏覽器向服務器發出請求，服務器返回html文件；

2.瀏覽器開始載入html代碼，發現＜head＞標簽內有一個＜link＞標簽引用外部CSS文件；

3.瀏覽器又發出CSS文件的請求，服務器返回這個CSS文件；

4.瀏覽器繼續載入html中＜body＞部分的代碼，并且已經接收到CSS文件，可以開始渲染頁面；

5.瀏覽器在代碼中發現一個＜img＞標簽引用了一張圖片，向服務器發出請求。此時瀏覽器不會等到圖片下載完，而是繼續渲染后面的代碼。

瀏覽器對于圖片元素的加載和渲染是在正常的網頁元素進行加載的，瀏覽器渲染引擎在圖片元素識別后，按照HTML語言的圖片元素的標簽的格式進行識別，然后向對應的服務器下載對應的圖片。

按照HTML的標準進行圖片元素的識別和渲染，瀏覽器引擎就是簡單地完成一張圖片的加載，圖片本身的內容決定了圖片加載后顯示的內容，瀏覽器一般不會對圖片進行非圖片內容的其它渲染工作，即僅僅是靜態的圖片加載，并不支持用戶對圖片進行編輯美化的個性化需求。

在瀏覽器中加載的圖片的動態效果，例如加載配套的聲音或者動畫效果，都是由圖片內容來提供的。可以使用JS（JavaScript，腳本語言）實現一些動態的效果——加載多張圖片用以進行切換、播放對應的背景或者在后臺播放聲音，即可以通過JS動態地加載聲音文件、動畫圖片等。

但是JS的編寫操作復雜，一般用戶不具備JS的編寫能力，占用系統資源多，此外服務器一般不支持客戶端對網頁的JS進行再次編寫，即不支持用戶對圖片進行編輯美化的個性化需求。由于JS的編寫習慣不一樣，各種JS的運行和瀏覽器不一定匹配，可能會出現JS運行不兼容的問題。

發明內容

鑒于上述問題，提出了本發明以便提供一種克服上述問題或者至少部分地解決上述問題的一種基于網頁渲染的圖片渲染方法和相應的一種基于網頁渲染的圖片渲染裝置以及一種瀏覽器。

依據本發明的一個方面，提供了一種在瀏覽器中進行圖片加載的方法，包括：

當瀏覽器監測到觸發事件時，獲取當前頁面中符合預設條件的特征圖片；

提取所述特征圖片中的特征碼圖像數據；其中，所述特征碼圖像數據標記出與所述特征圖片一處加載的富媒體資源；

依據所述特征碼圖像數據獲取對應的富媒體資源，并將獲取的富媒體資源與所述特征圖片一處進行加載。

可選地，所述觸發事件包括網頁加載完成事件，和/或，圖片的鼠標懸停hover事件。

可選地，所述獲取當前頁面符合預設條件的特征圖片的步驟包括：

從內存中提取符合預設顯示區域和/或預設尺寸大小的圖片；并