一種在瀏覽器中進(jìn)行圖片加載的方法、裝置和瀏覽器的制造方法
【專利摘要】本發(fā)明公開(kāi)了一種在瀏覽器中進(jìn)行圖片加載的方法，包括：當(dāng)瀏覽器監(jiān)測(cè)到觸發(fā)事件時(shí)，獲取當(dāng)前頁(yè)面中符合預(yù)設(shè)條件的特征圖片；提取所述特征圖片中的特征碼圖像數(shù)據(jù)；其中，所述特征碼圖像數(shù)據(jù)標(biāo)記出與所述特征圖片一處加載的富媒體資源；依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源，并將獲取的富媒體資源與所述特征圖片一處進(jìn)行加載。本發(fā)明可以解決客戶端不支持用戶個(gè)性化定義圖片加載時(shí)的渲染操作的問(wèn)題，取得了基于瀏覽器實(shí)現(xiàn)對(duì)于圖片的渲染，豐富的網(wǎng)頁(yè)渲染方式，減少服務(wù)器存儲(chǔ)資源占用，降低服務(wù)器運(yùn)行資源占用，提高了瀏覽器渲染網(wǎng)頁(yè)效率的有益效果。
【專利說(shuō)明】一種在瀏覽器中進(jìn)行圖片加載的方法、裝置和瀏覽器
【技術(shù)領(lǐng)域】
[0001]本發(fā)明涉及計(jì)算機(jī)的【技術(shù)領(lǐng)域】，具體涉及一種在瀏覽器中進(jìn)行圖片加載的方法、一種在瀏覽器中進(jìn)行圖片加載的裝置，以及，一種瀏覽器。
【背景技術(shù)】
[0002]隨著互聯(lián)網(wǎng)應(yīng)用的日趨普及，互聯(lián)網(wǎng)應(yīng)用正在從單一的訪問(wèn)和瀏覽網(wǎng)頁(yè)轉(zhuǎn)變得更為豐富，在此過(guò)程中，用戶對(duì)圖片進(jìn)行編輯美化的個(gè)性化需求越來(lái)越普遍，但是很多應(yīng)用無(wú)法支持用戶對(duì)圖片進(jìn)行編輯美化的個(gè)性化需求。
[0003]例如瀏覽器加載渲染HTML(HyperText Markup Language,超文本標(biāo)記語(yǔ)言)網(wǎng)頁(yè)。瀏覽器是指可以顯示網(wǎng)頁(yè)服務(wù)器或者文件系統(tǒng)的HTMUHyperText Markup Language,超文本標(biāo)記語(yǔ)言)文件內(nèi)容，并讓用戶與這些文件交互的一種軟件。網(wǎng)頁(yè)瀏覽器主要通過(guò)HTTP(HTTP-Hypertext transfer protocol,超文本傳輸協(xié)議)協(xié)議與網(wǎng)頁(yè)服務(wù)器交互并獲取網(wǎng)頁(yè)，這些網(wǎng)頁(yè)由URL (UniformResourceLocator,統(tǒng)一資源定位符)指定，文件格式通常為HTML,并由 MIME (Multipurpose Internet Mail Extensions,多用途互聯(lián)網(wǎng)郵件擴(kuò)展)在HTTP協(xié)議中指明。一個(gè)網(wǎng)頁(yè)中可以包括多個(gè)文檔，每個(gè)文檔都是分別從服務(wù)器獲取的。
[0004]大部分的瀏覽器本身支持除了 HTML之外的廣泛的格式，例如JPEG、PNG、GIF等圖像格式，并且能夠擴(kuò)展支持眾多的插件(Plug-1ns)。另外，許多瀏覽器還支持其他的URL類型及其相應(yīng)的協(xié)議，如FTP、Gopher、HTTPS (HTTP協(xié)議的加密版本)。
[0005]HTTP內(nèi)容類型和URL協(xié)議規(guī)范允許網(wǎng)頁(yè)設(shè)計(jì)者在網(wǎng)頁(yè)中嵌入圖像、動(dòng)畫(huà)、視頻、聲音、流媒體等。
[0006]以下是瀏覽器加載渲染HTML網(wǎng)頁(yè)中加載圖片的過(guò)程:
[0007]1.用戶輸入網(wǎng)址(假設(shè)是個(gè)html頁(yè)面，并且是第一次訪問(wèn))，瀏覽器向服務(wù)器發(fā)出請(qǐng)求，服務(wù)器返回html文件；
[0008]2.瀏覽器開(kāi)始載入html代碼，發(fā)現(xiàn)< head >標(biāo)簽內(nèi)有一個(gè)< link >標(biāo)簽引用外部CSS文件；
[0009]3.瀏覽器又發(fā)出CSS文件的請(qǐng)求，服務(wù)器返回這個(gè)CSS文件；
[0010]4.瀏覽器繼續(xù)載入html中< body >部分的代碼，并且已經(jīng)接收到CSS文件，可以開(kāi)始渲染頁(yè)面；
[0011]5.瀏覽器在代碼中發(fā)現(xiàn)一個(gè)< img>標(biāo)簽引用了一張圖片，向服務(wù)器發(fā)出請(qǐng)求。此時(shí)瀏覽器不會(huì)等到圖片下載完，而是繼續(xù)渲染后面的代碼。
[0012]瀏覽器對(duì)于圖片元素的加載和渲染是在正常的網(wǎng)頁(yè)元素進(jìn)行加載的，瀏覽器渲染引擎在圖片元素識(shí)別后，按照HTML語(yǔ)言的圖片元素的標(biāo)簽的格式進(jìn)行識(shí)別，然后向?qū)?yīng)的服務(wù)器下載對(duì)應(yīng)的圖片。
[0013]按照HTML的標(biāo)準(zhǔn)進(jìn)行圖片元素的識(shí)別和渲染，瀏覽器引擎就是簡(jiǎn)單地完成一張圖片的加載，圖片本身的內(nèi)容決定了圖片加載后顯示的內(nèi)容，瀏覽器一般不會(huì)對(duì)圖片進(jìn)行非圖片內(nèi)容的其它渲染工作，即僅僅是靜態(tài)的圖片加載，并不支持用戶對(duì)圖片進(jìn)行編輯美化的個(gè)性化需求。
[0014]在瀏覽器中加載的圖片的動(dòng)態(tài)效果，例如加載配套的聲音或者動(dòng)畫(huà)效果，都是由圖片內(nèi)容來(lái)提供的?？梢允褂肑S (JavaScript，腳本語(yǔ)言)實(shí)現(xiàn)一些動(dòng)態(tài)的效果——加載多張圖片用以進(jìn)行切換、播放對(duì)應(yīng)的背景或者在后臺(tái)播放聲音，即可以通過(guò)JS動(dòng)態(tài)地加載聲音文件、動(dòng)畫(huà)圖片等。
[0015]但是JS的編寫操作復(fù)雜，一般用戶不具備JS的編寫能力，占用系統(tǒng)資源多，此外服務(wù)器一般不支持客戶端對(duì)網(wǎng)頁(yè)的JS進(jìn)行再次編寫，即不支持用戶對(duì)圖片進(jìn)行編輯美化的個(gè)性化需求。由于JS的編寫習(xí)慣不一樣，各種JS的運(yùn)行和瀏覽器不一定匹配，可能會(huì)出現(xiàn)JS運(yùn)行不兼容的問(wèn)題。

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

[0016]鑒于上述問(wèn)題，提出了本發(fā)明以便提供一種克服上述問(wèn)題或者至少部分地解決上述問(wèn)題的一種基于網(wǎng)頁(yè)渲染的圖片渲染方法和相應(yīng)的一種基于網(wǎng)頁(yè)渲染的圖片渲染裝置以及一種瀏覽器。
[0017]依據(jù)本發(fā)明的一個(gè)方面，提供了一種在瀏覽器中進(jìn)行圖片加載的方法，包括:
[0018]當(dāng)瀏覽器監(jiān)測(cè)到觸發(fā)事件時(shí)，獲取當(dāng)前頁(yè)面中符合預(yù)設(shè)條件的特征圖片；
[0019]提取所述特征圖片中的特征碼圖像數(shù)據(jù)；其中，所述特征碼圖像數(shù)據(jù)標(biāo)記出與所述特征圖片一處加載的富媒體資源；
[0020]依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源，并將獲取的富媒體資源與所述特征圖片一處進(jìn)行加載。
[0021]可選地，所述觸發(fā)事件包括網(wǎng)頁(yè)加載完成事件，和/或，圖片的鼠標(biāo)懸停hover事件。
[0022]可選地，所述獲取當(dāng)前頁(yè)面符合預(yù)設(shè)條件的特征圖片的步驟包括:
[0023]從內(nèi)存中提取符合預(yù)設(shè)顯示區(qū)域和/或預(yù)設(shè)尺寸大小的圖片；并
[0024]判斷所提取圖片的指定位置的數(shù)據(jù)是否為特征碼圖像數(shù)據(jù)；
[0025]如果是，將所提取圖片作為特征圖片。
[0026]可選地，所述判斷所提取圖片的指定位置的數(shù)據(jù)是否為特征碼圖像數(shù)據(jù)的步驟包括:
[0027]將所述指定位置的數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼，獲取其對(duì)應(yīng)的字符串信息；
[0028]匹配所述字符串消息，如果所述字符串信息符合預(yù)定的數(shù)據(jù)格式，則判斷所述指定位置的數(shù)據(jù)為特征碼圖像數(shù)據(jù)。
[0029]可選地，所述提取所述特征圖片中的特征碼圖像數(shù)據(jù)的步驟包括:
[0030]將所述特征碼圖像數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼后，獲取其對(duì)應(yīng)的字符串信息；
[0031]解析所述字符串信息，獲得與所述特征圖片一處加載的富媒體資源的內(nèi)容碼和操作碼；
[0032]其中，所述內(nèi)容碼為音頻數(shù)據(jù)和/或特效數(shù)據(jù)的標(biāo)識(shí)；
[0033]所述操作碼為所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的標(biāo)識(shí)。[0034]可選地，所述音頻數(shù)據(jù)包括音頻文件或錄音文件；所述特效數(shù)據(jù)包括GIF圖片文件或FLASH文件。
[0035]可選地，所述解析的字符串信息進(jìn)一步包括:對(duì)應(yīng)于所述操作碼的操作參數(shù)，其標(biāo)記針對(duì)所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的預(yù)置執(zhí)行參數(shù)。
[0036]可選地，所述特征碼圖像數(shù)據(jù)中還包括標(biāo)識(shí)出生成方的標(biāo)識(shí)圖片。
[0037]可選地，所述依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源的步驟包括:
[0038]發(fā)送富媒體數(shù)據(jù)獲取請(qǐng)求至瀏覽器對(duì)應(yīng)的服務(wù)器；所述富媒體數(shù)據(jù)獲取請(qǐng)求中包括所述音頻數(shù)據(jù)和/或述特效數(shù)據(jù)的標(biāo)識(shí)；
[0039]接收所述服務(wù)器返回的音頻數(shù)據(jù)和/或特效數(shù)據(jù)；
[0040]或者，
[0041]解析所述音頻數(shù)據(jù)的標(biāo)識(shí)，獲得所述音頻數(shù)據(jù)的網(wǎng)絡(luò)地址；
[0042]訪問(wèn)所述音頻數(shù)據(jù)的網(wǎng)絡(luò)地址，獲取所述音頻數(shù)據(jù)；
[0043]或者，
[0044]在本地提取所述特效數(shù)據(jù)的標(biāo)識(shí)對(duì)應(yīng)的特效數(shù)據(jù)。
[0045]可選地，在所述提取所述特征圖片中的特征碼圖像數(shù)據(jù)的步驟之前，所述方法還包括:
[0046]對(duì)所述特征碼圖像數(shù)據(jù)進(jìn)行自校驗(yàn)。
[0047]可選地，所述將獲取的富媒體資源與所述特征圖片于一處進(jìn)行加載的步驟包括:
[0048]在所述特征圖片的顯示區(qū)域上的預(yù)置區(qū)域生成一窗口加載所述獲取的富媒體資源，其中所述生成的窗口為一瀏覽器窗口或者一網(wǎng)頁(yè)浮層元素；
[0049]在所述窗口中加載瀏覽器側(cè)的插件或者調(diào)用系統(tǒng)API進(jìn)行所述富媒體資源的加載和使用。
[0050]可選地，其中所述的操作方式包括:
[0051]單次播放音樂(lè)、循環(huán)播放音樂(lè)、播放動(dòng)畫(huà)、播放Flash視頻、漸變加入元素、漸變淡出元素、播放錄音中的至少一種。
[0052]可選地，其中所述的操作參數(shù)包括:
[0053]圖像或視頻的顯示位置、播放音樂(lè)或視頻的時(shí)間、音樂(lè)或視頻的播放次數(shù)、圖像特效的顯示時(shí)間中的至少一種。
[0054]根據(jù)本發(fā)明的另一方面，提供了一種在瀏覽器中進(jìn)行圖片加載的裝置，包括:
[0055]特征圖片獲取模塊，適于當(dāng)瀏覽器監(jiān)測(cè)到觸發(fā)事件時(shí)，獲取當(dāng)前頁(yè)面中符合預(yù)設(shè)條件的特征圖片；
[0056]特征碼圖像數(shù)據(jù)提取模塊，適于提取所述特征圖片中的特征碼圖像數(shù)據(jù)；其中，所述特征碼圖像數(shù)據(jù)標(biāo)記出與所述特征圖片一處加載的富媒體資源；
[0057]富媒體資源獲取模塊，適于依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源；
[0058]加載模塊，適于將獲取的富媒體資源與所述特征圖片一處進(jìn)行加載。
[0059]可選地，所述觸發(fā)事件包括網(wǎng)頁(yè)加載完成事件，和/或，圖片的鼠標(biāo)懸停hover事件。
[0060]可選地，所述特征圖片獲取模塊還適于:
[0061]從內(nèi)存中提取符合預(yù)設(shè)顯示區(qū)域和/或預(yù)設(shè)尺寸大小的圖片；并[0062]判斷所提取圖片的指定位置的數(shù)據(jù)是否為特征碼圖像數(shù)據(jù)；
[0063]如果是，將所提取圖片作為特征圖片。
[0064]可選地，所述特征圖片獲取模塊還適于:
[0065]將所述指定位置的數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼，獲取其對(duì)應(yīng)的字符串信息；
[0066]匹配所述字符串消息，如果所述字符串信息符合預(yù)定的數(shù)據(jù)格式，則判斷所述指定位置的數(shù)據(jù)為特征碼圖像數(shù)據(jù)。
[0067]可選地，所述特征碼圖像數(shù)據(jù)提取模塊還適于:
[0068]將所述特征碼圖像數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼后，獲取其對(duì)應(yīng)的字符串信息；
[0069]解析所述字符串信息，獲得與所述特征圖片一處加載的富媒體資源的內(nèi)容碼和操作碼；
[0070]其中，所述內(nèi)容碼為音頻數(shù)據(jù)和/或特效數(shù)據(jù)的標(biāo)識(shí)；
[0071]所述操作碼為所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的標(biāo)識(shí)。
[0072]可選地，所述音頻數(shù)據(jù)包括音頻文件或錄音文件；所述特效數(shù)據(jù)包括GIF圖片文件或FLASH文件。
[0073]可選地，所述解析的字符串信息進(jìn)一步包括:對(duì)應(yīng)于所述操作碼的操作參數(shù)，其標(biāo)記針對(duì)所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的預(yù)置執(zhí)行參數(shù)。
[0074]可選地，所述特征碼圖像數(shù)據(jù)中還包括標(biāo)識(shí)出生成方的標(biāo)識(shí)圖片。
[0075]可選地，所述富媒體資源獲取模塊還適于:
[0076]發(fā)送富媒體數(shù)據(jù)獲取請(qǐng)求至瀏覽器對(duì)應(yīng)的服務(wù)器；所述富媒體數(shù)據(jù)獲取請(qǐng)求中包括所述音頻數(shù)據(jù)和/或述特效數(shù)據(jù)的標(biāo)識(shí)；
[0077]接收所述服務(wù)器返回的音頻數(shù)據(jù)和/或特效數(shù)據(jù)；
[0078]或者，
[0079]解析所述音頻數(shù)據(jù)的標(biāo)識(shí)，獲得所述音頻數(shù)據(jù)的網(wǎng)絡(luò)地址；
[0080]訪問(wèn)所述音頻數(shù)據(jù)的網(wǎng)絡(luò)地址，獲取所述音頻數(shù)據(jù)；
[0081]或者，
[0082]在本地提取所述特效數(shù)據(jù)的標(biāo)識(shí)對(duì)應(yīng)的特效數(shù)據(jù)。
[0083]可選地，所述裝置還包括:
[0084]自校驗(yàn)?zāi)K，適于對(duì)所述特征碼圖像數(shù)據(jù)進(jìn)行自校驗(yàn)。
[0085]可選地，所述加載模塊還適于:
[0086]在所述特征圖片的顯示區(qū)域上的預(yù)置區(qū)域生成一窗口加載所述獲取的富媒體資源，其中所述生成的窗口為一瀏覽器窗口或者一網(wǎng)頁(yè)浮層元素；
[0087]在所述窗口中加載瀏覽器側(cè)的插件或者調(diào)用系統(tǒng)API進(jìn)行所述富媒體資源的加載和使用。
[0088]可選地，其中所述的操作方式包括:
[0089]單次播放音樂(lè)、循環(huán)播放音樂(lè)、播放動(dòng)畫(huà)、播放Flash視頻、漸變加入元素、漸變淡出元素、播放錄音中的至少一種。
[0090]可選地，其中所述的操作參數(shù)包括:[0091]圖像或視頻的顯示位置、播放音樂(lè)或視頻的時(shí)間、音樂(lè)或視頻的播放次數(shù)、圖像特效的顯示時(shí)間中的至少一種。
[0092]根據(jù)本發(fā)明的另一方面，提供了一種瀏覽器，包括:
[0093]特征圖片獲取模塊，適于當(dāng)瀏覽器監(jiān)測(cè)到觸發(fā)事件時(shí)，獲取當(dāng)前頁(yè)面中符合預(yù)設(shè)條件的特征圖片；
[0094]特征碼圖像數(shù)據(jù)提取模塊，適于提取所述特征圖片中的特征碼圖像數(shù)據(jù)；其中，所述特征碼圖像數(shù)據(jù)標(biāo)記出與所述特征圖片一處加載的富媒體資源；
[0095]富媒體資源獲取模塊，適于依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源；
[0096]加載模塊，適于將獲取的富媒體資源與所述特征圖片一處進(jìn)行加載。
[0097]可選地，所述觸發(fā)事件包括網(wǎng)頁(yè)加載完成事件，和/或，圖片的鼠標(biāo)懸停hover事件。
[0098]可選地，所述特征圖片獲取模塊還適于:
[0099]從內(nèi)存中提取符合預(yù)設(shè)顯示區(qū)域和/或預(yù)設(shè)尺寸大小的圖片；并
[0100]判斷所提取圖片的指定位置的數(shù)據(jù)是否為特征碼圖像數(shù)據(jù)；
[0101]如果是，將所提取圖片作為特征圖片。
[0102]可選地，所述特征圖片獲取模塊還適于:
[0103]將所述指定位置的數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼，獲取其對(duì)應(yīng)的字符串信息；
[0104]匹配所述字符串消息，如果所述字符串信息符合預(yù)定的數(shù)據(jù)格式，則判斷所述指定位置的數(shù)據(jù)為特征碼圖像數(shù)據(jù)。
[0105]可選地，所述特征碼圖像數(shù)據(jù)提取模塊還適于:
[0106]將所述特征碼圖像數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼后，獲取其對(duì)應(yīng)的字符串信息；
[0107]解析所述字符串信息，獲得與所述特征圖片一處加載的富媒體資源的內(nèi)容碼和操作碼；
[0108]其中，所述內(nèi)容碼為音頻數(shù)據(jù)和/或特效數(shù)據(jù)的標(biāo)識(shí)；
[0109]所述操作碼為所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的標(biāo)識(shí)。
[0110]可選地，所述音頻數(shù)據(jù)包括音頻文件或錄音文件；所述特效數(shù)據(jù)包括GIF圖片文件或FLASH文件。
[0111]可選地，所述解析的字符串信息進(jìn)一步包括:對(duì)應(yīng)于所述操作碼的操作參數(shù)，其標(biāo)記針對(duì)所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的預(yù)置執(zhí)行參數(shù)。
[0112]可選地，所述特征碼圖像數(shù)據(jù)中還包括標(biāo)識(shí)出生成方的標(biāo)識(shí)圖片。
[0113]可選地，所述富媒體資源獲取模塊還適于:
[0114]發(fā)送富媒體數(shù)據(jù)獲取請(qǐng)求至瀏覽器對(duì)應(yīng)的服務(wù)器；所述富媒體數(shù)據(jù)獲取請(qǐng)求中包括所述音頻數(shù)據(jù)和/或述特效數(shù)據(jù)的標(biāo)識(shí)；
[0115]接收所述服務(wù)器返回的音頻數(shù)據(jù)和/或特效數(shù)據(jù)；
[0116]或者，
[0117]解析所述音頻數(shù)據(jù)的標(biāo)識(shí)，獲得所述音頻數(shù)據(jù)的網(wǎng)絡(luò)地址；
[0118]訪問(wèn)所述音頻數(shù)據(jù)的網(wǎng)絡(luò)地址，獲取所述音頻數(shù)據(jù)；[0119]或者，
[0120]在本地提取所述特效數(shù)據(jù)的標(biāo)識(shí)對(duì)應(yīng)的特效數(shù)據(jù)。
[0121]可選地，所述瀏覽器還包括:
[0122]自校驗(yàn)?zāi)K，適于對(duì)所述特征碼圖像數(shù)據(jù)進(jìn)行自校驗(yàn)。
[0123]可選地，所述加載模塊還適于:
[0124]在所述特征圖片的顯示區(qū)域上的預(yù)置區(qū)域生成一窗口加載所述獲取的富媒體資源，其中所述生成的窗口為一瀏覽器窗口或者一網(wǎng)頁(yè)浮層元素；
[0125]在所述窗口中加載瀏覽器側(cè)的插件或者調(diào)用系統(tǒng)API進(jìn)行所述富媒體資源的加載和使用。
[0126]可選地，其中所述的操作方式包括:
[0127]單次播放音樂(lè)、循環(huán)播放音樂(lè)、播放動(dòng)畫(huà)、播放Flash視頻、漸變加入元素、漸變淡出元素、播放錄音中的至少一種。
[0128]可選地，其中所述的操作參數(shù)包括:
[0129]圖像或視頻的顯示位置、播放音樂(lè)或視頻的時(shí)間、音樂(lè)或視頻的播放次數(shù)、圖像特效的顯示時(shí)間中的至少一種。
[0130]根據(jù)本發(fā)明的一種在瀏覽器中進(jìn)行圖片加載的方法、裝置以及瀏覽器，可以解析特征圖片中的特征碼圖像數(shù)據(jù)，獲取其記載的用戶對(duì)在加載圖片時(shí)的采用音頻數(shù)據(jù)、特效數(shù)據(jù)等的渲染操作，進(jìn)而進(jìn)行對(duì)應(yīng)的動(dòng)態(tài)渲染處理，由此解決了客戶端不支持用戶個(gè)性化定義圖片加載時(shí)的渲染操作的問(wèn)題，取得了基于瀏覽器實(shí)現(xiàn)對(duì)于圖片的渲染，豐富的網(wǎng)頁(yè)渲染方式，減少服務(wù)器存儲(chǔ)資源占用，降低服務(wù)器運(yùn)行資源占用，提高了瀏覽器渲染網(wǎng)頁(yè)效率的有益效果。
[0131]上述說(shuō)明僅是本發(fā)明技術(shù)方案的概述，為了能夠更清楚了解本發(fā)明的技術(shù)手段，而可依照說(shuō)明書(shū)的內(nèi)容予以實(shí)施，并且為了讓本發(fā)明的上述和其它目的、特征和優(yōu)點(diǎn)能夠更明顯易懂，以下特舉本發(fā)明的【具體實(shí)施方式】。
【專利附圖】

【附圖說(shuō)明】
[0132]通過(guò)閱讀下文優(yōu)選實(shí)施方式的詳細(xì)描述，各種其他的優(yōu)點(diǎn)和益處對(duì)于本領(lǐng)域普通技術(shù)人員將變得清楚明了。附圖僅用于示出優(yōu)選實(shí)施方式的目的，而并不認(rèn)為是對(duì)本發(fā)明的限制。而且在整個(gè)附圖中，用相同的參考符號(hào)表示相同的部件。在附圖中:
[0133]圖1示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片處理的方法實(shí)施例I的步驟流程圖；
[0134]圖2示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片處理的方法實(shí)施例2的步驟流程圖；
[0135]圖3a示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種原始圖片示例圖；
[0136]圖3b示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種條形碼示例圖；
[0137]圖3c示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種標(biāo)識(shí)圖片示例圖；
[0138]圖4示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種特征碼圖像數(shù)據(jù)示例圖；
[0139]圖5示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種特征圖片示例圖；
[0140]圖6示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片處理的方法實(shí)施例3的步驟流程圖；
[0141]圖7a_圖7i示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種特征圖片制作示例流程圖；
[0142]圖8示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片處理的裝置實(shí)施例的結(jié)構(gòu)框圖；
[0143]圖9示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片加載的方法實(shí)施例的步驟流程圖；
[0144]圖1Oa和圖1Ob示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種特征圖片的解析示例圖；
[0145]圖11示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片加載的裝置實(shí)施例的結(jié)構(gòu)框圖。
【具體實(shí)施方式】
[0146]下面將參照附圖更詳細(xì)地描述本公開(kāi)的示例性實(shí)施例。雖然附圖中顯示了本公開(kāi)的示例性實(shí)施例，然而應(yīng)當(dāng)理解，可以以各種形式實(shí)現(xiàn)本公開(kāi)而不應(yīng)被這里闡述的實(shí)施例所限制。相反，提供這些實(shí)施例是為了能夠更透徹地理解本公開(kāi)，并且能夠?qū)⒈竟_(kāi)的范圍完整的傳達(dá)給本領(lǐng)域的技術(shù)人員。
[0147]參照?qǐng)D1，示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片處理的方法實(shí)施例1的步驟流程圖，具體可以包括以下步驟:
[0148]步驟101，在瀏覽器側(cè)獲取原始圖像數(shù)據(jù)；
[0149]步驟102，獲取音頻數(shù)據(jù)和/或特效數(shù)據(jù)；
[0150]步驟103，依據(jù)所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)，生成特征碼圖像數(shù)據(jù)；
[0151]步驟104，在所述原始圖像數(shù)據(jù)上添加所述特征碼圖像數(shù)據(jù)生成特征圖片。
[0152]在本發(fā)明實(shí)施例中，可以通過(guò)特征碼圖像數(shù)據(jù)記載用戶對(duì)在加載圖片時(shí)的采用音頻數(shù)據(jù)、特效數(shù)據(jù)等的自定義渲染操作，由此解決了客戶端不支持用戶個(gè)性化定義圖片加載時(shí)的渲染操作的問(wèn)題，取得了基于瀏覽器實(shí)現(xiàn)對(duì)于圖片的渲染，豐富的網(wǎng)頁(yè)渲染方式，減少服務(wù)器存儲(chǔ)資源占用，降低服務(wù)器運(yùn)行資源占用，提高了瀏覽器渲染網(wǎng)頁(yè)效率的有益效果。
[0153]參照?qǐng)D2，示出了根據(jù)本發(fā)明一個(gè)實(shí)施例的一種在瀏覽器中進(jìn)行圖片處理的方法實(shí)施例2的步驟流程圖，具體可以包括以下步驟:
[0154]步驟201，獲得瀏覽器用戶賬號(hào)的登錄信息，進(jìn)行瀏覽器用戶的登錄；則并將所述形成的特征圖片保存為該瀏覽器用戶對(duì)應(yīng)的圖片。
[0155]在互聯(lián)網(wǎng)資源分享的時(shí)代，用戶很容易出現(xiàn)非自律行為，為了加強(qiáng)管理，用戶對(duì)于加載圖片時(shí)的自定義渲染操作，可以是基于用戶賬號(hào)進(jìn)行的，防止出現(xiàn)用戶傳播非法圖片、音頻數(shù)據(jù)和特效數(shù)據(jù)等非法行為。
[0156]此外，登陸瀏覽器用戶賬號(hào)還可以將其自定義渲染操作中涉及數(shù)據(jù)保存在其賬號(hào)數(shù)據(jù)中，以方便用戶在登陸不同的瀏覽器還可以繼續(xù)沿用其自定義的渲染操作。
[0157]步驟202，在瀏覽器側(cè)獲取原始圖像數(shù)據(jù)；
[0158]在具體實(shí)現(xiàn)中，所述瀏覽器中進(jìn)行圖片處理是實(shí)現(xiàn)為瀏覽器側(cè)的一個(gè)瀏覽器插件或者為一個(gè)瀏覽器應(yīng)用或者為瀏覽器可調(diào)用的一個(gè)獨(dú)立應(yīng)用程序。
[0159]需要說(shuō)明的是，原始圖像數(shù)據(jù)是相對(duì)于形成特征圖片而言，其可以為網(wǎng)頁(yè)渲染時(shí)加載的圖片，為用戶選取，可以是本地的，也可以是網(wǎng)上的。
[0160]在本發(fā)明的一種優(yōu)選實(shí)施例中，所述步驟202具體可以包括如下子步驟:
[0161]子步驟S11，確定所述原始圖像數(shù)據(jù)的地址，所述地址包括本地地址或網(wǎng)絡(luò)地址；
[0162]子步驟S12，從所述地址提取所述原始圖像數(shù)據(jù)。
[0163]獲得原始圖像數(shù)據(jù)之后，用戶的自定義動(dòng)態(tài)渲染操作可以是基于該原始圖像數(shù)據(jù)進(jìn)行的。
[0164]步驟203，獲取音頻數(shù)據(jù)；
[0165]在具體實(shí)現(xiàn)中，音頻數(shù)據(jù)包括音頻文件或錄音文件。音頻數(shù)據(jù)可以是本地的，可以是瀏覽器對(duì)應(yīng)的服務(wù)器所存儲(chǔ)的，還可以是網(wǎng)上其他平臺(tái)所存儲(chǔ)的，本發(fā)明對(duì)此不加以限制。
[0166]在本發(fā)明的一種優(yōu)選實(shí)施例中，所述步驟203具體可以包括如下子步驟:
[0167]子步驟S21，獲取音頻文件或錄音文件的本地地址或網(wǎng)絡(luò)地址；
[0168]子步驟S22，從所述本地地址或網(wǎng)絡(luò)地址提取所述音頻文件或錄音文件；
[0169]音頻文件，可以是歌曲、影音音頻等等，錄音文件，可以是錄制的歌曲、祝福語(yǔ)等
坐寸o
[0170]步驟204，依據(jù)所述音頻數(shù)據(jù)生成特征碼圖像數(shù)據(jù)；
[0171]在實(shí)際應(yīng)用中，所述特征碼圖像數(shù)據(jù)可以為二維碼(2-dimensional bar code)圖像數(shù)據(jù)或條形碼圖像數(shù)據(jù)(barcode)。
[0172]當(dāng)然，特征碼圖像數(shù)據(jù)還可以是其他圖像數(shù)據(jù)，只要能記錄用戶的自定義渲染操作即可。
[0173]在本發(fā)明的一種優(yōu)選實(shí)施例中，所述特征碼圖像數(shù)據(jù)包括內(nèi)容碼、操作碼和操作參數(shù)，所述步驟204可以包括如下子步驟:
[0174]子步驟S31，為所述音頻數(shù)據(jù)配置對(duì)應(yīng)的操作碼；；
[0175]操作碼中可以包括用戶對(duì)音頻數(shù)據(jù)自定義的操作行為。例如，播放音頻數(shù)據(jù)可以是漸強(qiáng)播放、漸弱播放等等；當(dāng)播放一個(gè)音頻數(shù)據(jù)時(shí)，操作信息可以為正常播放，當(dāng)播放兩個(gè)或兩個(gè)以上的音頻數(shù)據(jù)時(shí)，操作信息可以包括循環(huán)播放、隨機(jī)播放等等。
[0176]在實(shí)際應(yīng)用中，音頻數(shù)據(jù)的操作信息可以有對(duì)應(yīng)字符串代碼進(jìn)行標(biāo)識(shí)。例如，正常播放為I，循環(huán)播放為2，隨機(jī)播放為3等等。
[0177]子步驟S32，為所述音頻數(shù)據(jù)的操作碼配置對(duì)應(yīng)的操作參數(shù)；
[0178]操作參數(shù)可以為執(zhí)行操作碼的具體實(shí)施參數(shù)。例如，音頻數(shù)據(jù)播放可以是在何時(shí)播放、播放時(shí)長(zhǎng)、播放次數(shù)、當(dāng)存在兩個(gè)或兩個(gè)音頻數(shù)據(jù)時(shí)的播放順序等等。
[0179]在實(shí)際應(yīng)用中，音頻數(shù)據(jù)的操作參數(shù)可以有對(duì)應(yīng)字符串代碼進(jìn)行標(biāo)識(shí)。例如，播放次數(shù)可以用字符串代碼IX表示，其中I代表選擇播放次數(shù)，X代表具體播放的次數(shù)。
[0180]需要說(shuō)明的是，操作參數(shù)在某些情況下可以為空。例如，自定義播放音頻數(shù)據(jù)，操作碼為正常播放，操作參數(shù)為空時(shí)，可以指示正常播放該音頻數(shù)據(jù)，即在進(jìn)行渲染開(kāi)始時(shí)播放該音頻數(shù)據(jù)，不控制何時(shí)播放、播放時(shí)長(zhǎng)、播放次數(shù)等。
[0181]子步驟S33，獲取所述音頻數(shù)據(jù)的標(biāo)識(shí)；
[0182]音頻數(shù)據(jù)的標(biāo)識(shí)可以用于標(biāo)記音頻數(shù)據(jù),可以是該音頻數(shù)據(jù)的固有標(biāo)識(shí),例如MD5(Message Digest Algorithm,消息摘要算法第五版)值,ID號(hào)等等。為了便于統(tǒng)一管理,提高管理效率，可以根據(jù)預(yù)設(shè)規(guī)則生成新的標(biāo)識(shí)。
[0183]在本發(fā)明實(shí)施例的一種優(yōu)選示例中，所述子步驟S33進(jìn)一步可以包括如下子步驟:
[0184]子步驟S331，將所述音頻數(shù)據(jù)上傳至瀏覽器對(duì)應(yīng)的服務(wù)器側(cè)；所述服務(wù)器用于依據(jù)所述音頻數(shù)據(jù)的地址生成所述音頻數(shù)據(jù)的標(biāo)識(shí)；
[0185]子步驟S332，接收所述服務(wù)器返回的所述音頻數(shù)據(jù)的標(biāo)識(shí)；；
[0186]或者，
[0187]子步驟S333，提取所述音頻數(shù)據(jù)的預(yù)置標(biāo)識(shí)。
[0188]音頻數(shù)據(jù)的地址可以是本地地址，也可以是網(wǎng)絡(luò)地址。
[0189]當(dāng)音頻數(shù)據(jù)的地址為本地地址時(shí)，為了提高服務(wù)的穩(wěn)定性，可以上傳該音頻文件至服務(wù)器存儲(chǔ)。服務(wù)器繼而可以按照預(yù)設(shè)規(guī)則生成對(duì)應(yīng)的新的標(biāo)識(shí)。
[0190]當(dāng)音頻數(shù)據(jù)的地址為網(wǎng)絡(luò)地址時(shí)，為了提高服務(wù)的穩(wěn)定性，服務(wù)器可以訪問(wèn)所述地址，將該音頻數(shù)據(jù)存儲(chǔ)在服務(wù)器本地；為了減少存儲(chǔ)資源占用和降低運(yùn)行資源占用，服務(wù)器也可以直接采用該地址生成對(duì)應(yīng)的標(biāo)識(shí)。
[0191]在實(shí)際應(yīng)用中，為方便生成特征碼圖像數(shù)據(jù)，生成的標(biāo)識(shí)可以是字符串。
[0192]需要說(shuō)明的是，音頻數(shù)據(jù)的預(yù)置標(biāo)識(shí)可以為該音頻數(shù)據(jù)的固有標(biāo)識(shí)，也可以是存儲(chǔ)在服務(wù)器的音頻數(shù)據(jù)對(duì)應(yīng)的標(biāo)識(shí)。
[0193]子步驟S34，采用所述音頻數(shù)據(jù)的標(biāo)識(shí)生成內(nèi)容碼；
[0194]在實(shí)際應(yīng)用中，內(nèi)容碼可以是標(biāo)識(shí)本身，也可以按照預(yù)設(shè)規(guī)則生成。例如，用戶同時(shí)選擇了音頻數(shù)據(jù)AAA和特效數(shù)據(jù)BBB，其中AAA和BBB為標(biāo)識(shí)，可以生成內(nèi)容碼為1AAA2BBB，其中，I代表AAA為音頻數(shù)據(jù)，2代表BBB為特效數(shù)據(jù)。
[0195]子步驟S35，由所述內(nèi)容碼、操作碼和操作參數(shù)組成特征碼圖像數(shù)據(jù)。
[0196]在具體實(shí)現(xiàn)中，可以采用條形碼制作應(yīng)用程序或二維碼制作應(yīng)用程序等進(jìn)行條形碼或二維碼的編碼制作。
[0197]在本發(fā)明的一種優(yōu)選實(shí)施例中，所述特征碼圖像數(shù)據(jù)中還包括標(biāo)識(shí)出圖片生成方的標(biāo)識(shí)圖片。
[0198]標(biāo)識(shí)圖片(Logo)可以不參與條形碼或二維碼的轉(zhuǎn)換，直接添加到已生成的條形碼圖像數(shù)據(jù)或二維碼圖像數(shù)據(jù)中。
[0199]需要說(shuō)明的是，內(nèi)容碼、操作碼和操作參數(shù)可以按照預(yù)設(shè)規(guī)則進(jìn)行組織后轉(zhuǎn)碼生成條形碼或二維碼。例如，內(nèi)容碼占十位字符串，排在第一位；內(nèi)容碼占四位字符串，排在第二位；操作參數(shù)碼占六位字符串，排在第三位。標(biāo)識(shí)圖片(Logo)可以添加到生成的條形碼或二維碼的左邊，生成特征圖像數(shù)據(jù)。
[0200]步驟205，在所述原始圖像數(shù)據(jù)上添加所述特征碼圖像數(shù)據(jù)生成特征圖片；
[0201]在實(shí)際應(yīng)用中，可以原始圖像數(shù)據(jù)的下方、左方、右方、上方等位置添加特征圖像數(shù)據(jù)，本發(fā)明對(duì)此不加以限制。
[0202]步驟206，將所述生成的特征圖片上傳至所述瀏覽器對(duì)應(yīng)的服務(wù)器中。
[0203]該服務(wù)器可以存儲(chǔ)該特征圖片，該特征圖片可以在網(wǎng)頁(yè)渲染時(shí)加載。
[0204]為了方便本領(lǐng)域技術(shù)人員更好地理解本發(fā)明，以下通過(guò)一個(gè)完整示例更進(jìn)一步說(shuō)明本發(fā)明:[0205]1、用戶登陸用戶賬號(hào)；
[0206]2、獲得原始圖片，如圖3a所示；
[0207]3、用戶選擇了網(wǎng)絡(luò)上的歌曲“青藏高原”和服務(wù)器存儲(chǔ)的歌曲“天堂”作為渲染時(shí)播放的音頻數(shù)據(jù)。其中，“天堂”具有預(yù)置的標(biāo)識(shí)7517，“青藏高原”的網(wǎng)絡(luò)地址為http://music.XXX.com/12345678, mp3,將該地址上傳至服務(wù)器，服務(wù)器針對(duì)該地址生成了音頻數(shù)據(jù)“青藏高原”的標(biāo)識(shí)，為5903 ；
[0208]4、針對(duì)音頻數(shù)據(jù)“青藏高原”的標(biāo)識(shí)5903和“天堂”的標(biāo)識(shí)7517生成內(nèi)容碼1590317517，其中，15903指示播放音頻數(shù)據(jù)5903，17517指示播放音頻數(shù)據(jù)7517 ；
[0209]5、用戶自定義播放“青藏高原”的操作碼為正常播放，字符串代碼為2 ;播放“天堂”的操作碼為漸強(qiáng)播放，字符串代碼為5 ;即操作碼為1225，其中12指示播放第一個(gè)音頻數(shù)據(jù)“青藏高原”的操作碼為2，25指示播放第二個(gè)音頻數(shù)據(jù)“天堂”的操作碼為5 ；
[0210]6、操作參數(shù)設(shè)定為順序播放，代碼為21 ;而操作參數(shù)預(yù)定義可以容納6位代表操作參數(shù)的代碼，即操作參數(shù)的代碼可以為210000 ；
[0211]7、組織內(nèi)容碼、操作碼和操作參數(shù)生成條形碼，其預(yù)定義格式可以如下表所示:
[0212]
【權(quán)利要求】
1.一種在瀏覽器中進(jìn)行圖片加載的方法，包括: 當(dāng)瀏覽器監(jiān)測(cè)到觸發(fā)事件時(shí)，獲取當(dāng)前頁(yè)面中符合預(yù)設(shè)條件的特征圖片； 提取所述特征圖片中的特征碼圖像數(shù)據(jù)；其中，所述特征碼圖像數(shù)據(jù)標(biāo)記出與所述特征圖片一處加載的富媒體資源； 依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源，并將獲取的富媒體資源與所述特征圖片一處進(jìn)行加載。
2.如權(quán)利要求1所述的方法，所述觸發(fā)事件包括網(wǎng)頁(yè)加載完成事件，和/或，圖片的鼠標(biāo)懸停hover事件。
3.如權(quán)利要求1所述的方法，所述獲取當(dāng)前頁(yè)面符合預(yù)設(shè)條件的特征圖片的步驟包括: 從內(nèi)存中提取符合預(yù)設(shè)顯示區(qū)域和/或預(yù)設(shè)尺寸大小的圖片；并 判斷所提取圖片的指定位置的數(shù)據(jù)是否為特征碼圖像數(shù)據(jù)； 如果是，將所提取圖片作為特征圖片。
4.如權(quán)利要求3所述的方法，所述判斷所提取圖片的指定位置的數(shù)據(jù)是否為特征碼圖像數(shù)據(jù)的步驟包括: 將所述指定位置的數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼，獲取其對(duì)應(yīng)的字符串信息；匹配所述字符串消息，如果所述字符串信息符合預(yù)定的數(shù)據(jù)格式，則判斷所述指定位置的數(shù)據(jù)為特征碼圖像數(shù)據(jù)。
5.如權(quán)利要求1所述的方法`，所述提取所述特征圖片中的特征碼圖像數(shù)據(jù)的步驟包括: 將所述特征碼圖像數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼后，獲取其對(duì)應(yīng)的字符串信息； 解析所述字符串信息，獲得與所述特征圖片一處加載的富媒體資源的內(nèi)容碼和操作碼； 其中，所述內(nèi)容碼為音頻數(shù)據(jù)和/或特效數(shù)據(jù)的標(biāo)識(shí)； 所述操作碼為所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的標(biāo)識(shí)。
6.一種在瀏覽器中進(jìn)行圖片加載的裝置，包括: 特征圖片獲取模塊，適于當(dāng)瀏覽器監(jiān)測(cè)到觸發(fā)事件時(shí)，獲取當(dāng)前頁(yè)面中符合預(yù)設(shè)條件的特征圖片； 特征碼圖像數(shù)據(jù)提取模塊，適于提取所述特征圖片中的特征碼圖像數(shù)據(jù)；其中，所述特征碼圖像數(shù)據(jù)標(biāo)記出與所述特征圖片一處加載的富媒體資源； 富媒體資源獲取模塊，適于依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源； 加載模塊，適于將獲取的富媒體資源與所述特征圖片一處進(jìn)行加載。
7.如權(quán)利要求6所述的裝置，所述觸發(fā)事件包括網(wǎng)頁(yè)加載完成事件，和/或，圖片的鼠標(biāo)懸停hover事件。
8.如權(quán)利要求6所述的裝置，所述特征碼圖像數(shù)據(jù)提取模塊還適于: 將所述特征碼圖像數(shù)據(jù)進(jìn)行二維碼或者條形碼的解碼后，獲取其對(duì)應(yīng)的字符串信息； 解析所述字符串信息，獲得與所述特征圖片一處加載的富媒體資源的內(nèi)容碼和操作碼； 其中，所述內(nèi)容碼為所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的標(biāo)識(shí)；所述操作碼為所述音頻數(shù)據(jù)和/或特效數(shù)據(jù)的操作方式的標(biāo)識(shí)。
9.如權(quán)利要求8所述的裝置，所述音頻數(shù)據(jù)包括音頻文件或錄音文件；所述特效數(shù)據(jù)包括GIF圖片文件或FLASH文件。
10.一種瀏覽器，包括: 特征圖片獲取模塊，適于當(dāng)瀏覽器監(jiān)測(cè)到觸發(fā)事件時(shí)，獲取當(dāng)前頁(yè)面中符合預(yù)設(shè)條件的特征圖片； 特征碼圖像數(shù)據(jù)提取模塊，適于提取所述特征圖片中的特征碼圖像數(shù)據(jù)；其中，所述特征碼圖像數(shù)據(jù)標(biāo)記出與所述特征圖片一處加載的富媒體資源； 富媒體資源獲取模塊，適于依據(jù)所述特征碼圖像數(shù)據(jù)獲取對(duì)應(yīng)的富媒體資源； 加載模塊，適于將獲取 的富媒體資源與所述特征圖片一處進(jìn)行加載。
【文檔編號(hào)】G06F17/30GK103500186SQ201310418781
【公開(kāi)日】2014年1月8日 申請(qǐng)日期:2013年9月13日 優(yōu)先權(quán)日:2013年9月13日
【發(fā)明者】杭程, 歐勝, 任寰 申請(qǐng)人:北京奇虎科技有限公司, 奇智軟件（北京）有限公司