[發(fā)明專利]基于web端壓縮切圖的方法、裝置、系統(tǒng)及存儲(chǔ)介質(zhì)

在審

• 申請(qǐng)?zhí)枺?/td>: 201910699358.0
• 申請(qǐng)日: 2019-07-31
• 公開（公告）號(hào): CN110471593A
• 公開（公告）日: 2019-11-19
• 發(fā)明（設(shè)計(jì)）人: 劉松;楊思柏;孟小江
• 申請(qǐng)（專利權(quán)）人: 成都摹客科技有限公司
• 主分類號(hào): G06F3/0483
• 分類號(hào): G06F3/0483;G06F16/958
• 代理公司: 11212 北京輕創(chuàng)知識(shí)產(chǎn)權(quán)代理有限公司
• 代理人: 陳熙<國(guó)際申請(qǐng)>=<國(guó)際公布>=<進(jìn)入國(guó)

本發(fā)明公開了一種基于web端壓縮切圖的方法、裝置、系統(tǒng)及存儲(chǔ)介質(zhì)，本發(fā)明提供的基于web端壓縮切圖的方法，通過(guò)獲取具有多個(gè)切圖的設(shè)計(jì)界面；響應(yīng)用戶選擇至少一個(gè)切圖的請(qǐng)求，并根據(jù)所述請(qǐng)求確定待壓縮切圖；當(dāng)獲取到用戶確定下載所述待壓縮切圖的請(qǐng)求時(shí)，基于web端的圖片壓縮庫(kù)對(duì)所述待壓縮切圖進(jìn)行壓縮；將壓縮后的切圖下載以進(jìn)行存儲(chǔ)。從而可以直接在web端進(jìn)行壓縮圖片，不需要依賴于進(jìn)行服務(wù)器處理，有效降低服務(wù)器的壓力，并且能夠降低開發(fā)人員使用的圖片資源大小，使開發(fā)的網(wǎng)頁(yè)加載速度更快。

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

本發(fā)明涉及圖片處理技術(shù)領(lǐng)域，具體涉及基于web端壓縮切圖的方法、裝置、系統(tǒng)及存儲(chǔ)介質(zhì)。

背景技術(shù)

網(wǎng)頁(yè)中的圖片的數(shù)量一直在呈滾雪球式的增長(zhǎng)，每天會(huì)增加幾億張圖片，在日常使用網(wǎng)頁(yè)中需要圖片被快速的加載，快速的打開，快速的瀏覽。對(duì)于內(nèi)容編輯，設(shè)計(jì)師，前端工程師，圖片壓縮幾乎已經(jīng)成為了他們必備的工具。幫助他們平衡高分辨率和圖片體積之間的沖突，最終給用戶無(wú)感知的圖片加載體驗(yàn)。現(xiàn)有技術(shù)中通常利用即服務(wù)器上的圖片處理程序進(jìn)行壓縮，而且其占用服務(wù)器資源，且需要網(wǎng)絡(luò)。

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

本發(fā)明的主要目的是提供一種基于web端壓縮切圖的方法、裝置、系統(tǒng)及存儲(chǔ)介質(zhì)，以解決相關(guān)技術(shù)中服務(wù)器上的圖片處理程序容易占用服務(wù)器資源并需要網(wǎng)絡(luò)，而且不能在web端壓縮圖片的問(wèn)題。

為實(shí)現(xiàn)上述目的，本發(fā)明提供了一種基于web端壓縮切圖的方法，包括：

獲取具有多個(gè)切圖的設(shè)計(jì)界面；

響應(yīng)用戶選擇至少一個(gè)切圖的請(qǐng)求，并根據(jù)所述請(qǐng)求確定待壓縮切圖；

當(dāng)獲取到用戶確定下載所述待壓縮切圖的請(qǐng)求時(shí)，基于web端的圖片壓縮庫(kù)對(duì)所述待壓縮切圖進(jìn)行壓縮；

將壓縮后的切圖下載以進(jìn)行存儲(chǔ)。

優(yōu)選地，所述設(shè)計(jì)界面中具有選擇切圖的控件；所述響應(yīng)用戶選擇至少一個(gè)切圖的指令，并根據(jù)所述指令確定待壓縮切圖包括：

獲取所述用戶移動(dòng)所述控件的請(qǐng)求；

確定所述控件在所述設(shè)計(jì)界面中移動(dòng)的至少一個(gè)軌跡范圍；

根據(jù)所述控件移動(dòng)的軌跡范圍確定為所述待壓縮切圖。

優(yōu)選地，所述軌跡范圍包括軌跡線條及軌跡坐標(biāo)，所述軌跡線條為所述待壓縮切圖的尺寸，所述軌跡坐標(biāo)為所述待壓縮切圖在所述設(shè)計(jì)界面中的位置。

優(yōu)選地，所述根據(jù)所述控件移動(dòng)的軌跡范圍確定為所述待壓縮切圖之后包括：

根據(jù)確定的所述待壓縮切圖，判斷是否獲取到選擇壓縮切圖的請(qǐng)求；

當(dāng)獲取到選擇壓縮切圖的請(qǐng)求時(shí)，生成下載請(qǐng)求界面以供用戶確定壓縮切圖并進(jìn)行下載；

當(dāng)沒有獲取到選擇壓縮切圖的請(qǐng)求時(shí)，生成下載請(qǐng)求界面以供用戶下載未壓縮的切圖。

優(yōu)選地，所述web端配置有webworker及JavaScript；所述當(dāng)獲取到用戶確定下載所述待壓縮切圖的請(qǐng)求時(shí)，基于web端的圖片壓縮庫(kù)對(duì)所述待壓縮切圖進(jìn)行壓縮包括：

響應(yīng)用戶下載所述待壓縮切圖的請(qǐng)求；

根據(jù)所述下載所述待壓縮切圖的請(qǐng)求，基于web端的webworker為JavaScript創(chuàng)建多個(gè)線程環(huán)境；

根據(jù)所述多個(gè)線程環(huán)境，在每一所述線程環(huán)境中通過(guò)所述圖片壓縮庫(kù)對(duì)所述待壓縮切圖進(jìn)行壓縮以生成壓縮后的切圖。

優(yōu)選地，所述圖片壓縮庫(kù)為pngquant庫(kù)；所述根據(jù)所述多個(gè)線程環(huán)境，在每一所述線程環(huán)境中通過(guò)所述圖片壓縮庫(kù)所述待壓縮切圖進(jìn)行壓縮以生成壓縮后的切圖包括：