本發(fā)明涉及通信領(lǐng)域，具體涉及一種瀏覽器直播客戶(hù)端、瀏覽器直播系統(tǒng)及瀏覽器直播方法。

背景技術(shù)：

隨著直播的門(mén)檻不斷降低，越來(lái)越多的用戶(hù)開(kāi)始嘗試做播主。以往的攝像頭直播已經(jīng)不能滿足用戶(hù)對(duì)個(gè)性化的需求，于是將自己置于虛擬場(chǎng)景中直播成了用戶(hù)展示自己的個(gè)性化手段之一。

為了達(dá)到這個(gè)目的，通常選取人臉上較少出現(xiàn)的顏色作為底色，例如綠色?？梢詼?zhǔn)備一塊綠色的布作為背景置于人物之后，這樣在鏡頭中除了人物就只有綠色的背景。然后在軟件中，使綠色的部分變?yōu)橥该?，搭配預(yù)先選取的虛擬場(chǎng)景，就可以達(dá)到置身于虛擬場(chǎng)景中的效果。

不同于圖片的處理，視頻的處理對(duì)計(jì)算機(jī)的運(yùn)算性能提出了更高的挑戰(zhàn)。在30幀1280x960分辨率的畫(huà)面上，每秒鐘需要處理的像素點(diǎn)接近3700萬(wàn)個(gè)，有些攝像頭甚至達(dá)到了1920x1080的分辨率，則需要處理更多的像素點(diǎn)。同時(shí)用于直播的計(jì)算機(jī)或手機(jī)還要承擔(dān)視頻編碼的壓力，這對(duì)設(shè)備的運(yùn)算能力提出了一個(gè)挑戰(zhàn)。

技術(shù)實(shí)現(xiàn)要素：

本發(fā)明的目的在于提供一種瀏覽器直播客戶(hù)端、瀏覽器直播系統(tǒng)及瀏覽器直播方法，能夠滿足直播實(shí)時(shí)對(duì)畫(huà)面進(jìn)行處理的要求，甚至在手機(jī)上也能夠流暢運(yùn)行，耗費(fèi)資源少。

為了達(dá)到上述目的，本發(fā)明通過(guò)以下技術(shù)方案實(shí)現(xiàn)：一種瀏覽器直播客戶(hù)端，其特點(diǎn)是，包含：

攝像頭，用于采集視頻信息；

畫(huà)面獲取模塊，與所述攝像頭連接，用于實(shí)時(shí)截取攝像頭的畫(huà)面；

存儲(chǔ)模塊，與所述畫(huà)面獲取模塊連接，用于將畫(huà)面獲取模塊截取到的攝像頭畫(huà)面的每一幀，作為紋理對(duì)象進(jìn)行存儲(chǔ)；

渲染模塊，與所述存儲(chǔ)模塊連接，用于渲染存儲(chǔ)模塊中存儲(chǔ)的紋理對(duì)象，過(guò)濾紋理對(duì)象中像素的參考顏色；

場(chǎng)景貼合模塊，與所述渲染模塊連接，用于將渲染后的紋理對(duì)象與預(yù)設(shè)的虛擬背景進(jìn)行貼合，獲得貼合后的場(chǎng)景畫(huà)面信息；

編碼器，與所述場(chǎng)景貼合模塊連接，用于將貼合后的場(chǎng)景畫(huà)面信息進(jìn)行編碼，生成用于直播的視頻流；

數(shù)據(jù)傳輸模塊，與所述編碼器連接，傳輸用于直播的視頻流。

所述的畫(huà)面獲取模塊包含依次連接的截圖單元、數(shù)據(jù)格式判斷單元及數(shù)據(jù)格式轉(zhuǎn)換單元，所述的截圖單元與所述攝像頭連接，用于截取視頻信息的畫(huà)面，獲得攝像頭圖像，所述的數(shù)據(jù)格式判斷單元與所述存儲(chǔ)模塊連接，用于判斷截圖單元截取到的攝像頭畫(huà)面的數(shù)據(jù)格式，若為YUV格式，則直接將截取到的攝像頭畫(huà)面存儲(chǔ)至存儲(chǔ)模塊，若為RGB格式，則經(jīng)數(shù)據(jù)格式轉(zhuǎn)換單元將RGB格式的攝像頭畫(huà)面轉(zhuǎn)換成YUV格式后存儲(chǔ)至存儲(chǔ)模塊。

所述的渲染模塊包含一顏色過(guò)濾單元及分別與之連接的透明度參數(shù)設(shè)定單元、參考顏色指定單元，所述的顏色過(guò)濾單元分別與所述的存儲(chǔ)模塊及場(chǎng)景貼合模塊連接，所述的參考顏色指定單元用于將指定的關(guān)鍵顏色作為參考顏色，所述的透明度參數(shù)設(shè)定單元，用于設(shè)定像素的透明度參數(shù)，所述的顏色過(guò)濾單元用于過(guò)濾存儲(chǔ)模塊中存儲(chǔ)的紋理對(duì)象中像素的參考顏色，并設(shè)定紋理對(duì)象中像素的透明度參數(shù)。

一種瀏覽器直播系統(tǒng)，其特點(diǎn)是，包含瀏覽器直播客戶(hù)端及服務(wù)器，所述的瀏覽器直播客戶(hù)端用于生成直播的視頻流，所述的服務(wù)器接收瀏覽器直播客戶(hù)端推送的視頻流，用戶(hù)向服務(wù)器發(fā)送觀看直播請(qǐng)求，以查看視頻流；

所述的瀏覽器直播客戶(hù)端包含攝像頭，用于采集視頻信息；

畫(huà)面獲取模塊，與所述攝像頭連接，用于截取攝像頭的畫(huà)面；

存儲(chǔ)模塊，與所述畫(huà)面獲取模塊連接，用于將畫(huà)面獲取模塊截取到的攝像頭畫(huà)面的每一幀，作為紋理對(duì)象進(jìn)行存儲(chǔ)；

渲染模塊，與所述存儲(chǔ)模塊連接，用于渲染存儲(chǔ)模塊中存儲(chǔ)的紋理對(duì)象，過(guò)濾紋理對(duì)象中像素的參考顏色；

場(chǎng)景貼合模塊，與所述渲染模塊連接，用于將渲染后的紋理對(duì)象與預(yù)設(shè)的虛擬背景進(jìn)行貼合，獲得貼合后的場(chǎng)景畫(huà)面信息；

編碼器，與所述場(chǎng)景貼合模塊連接，用于將貼合后的場(chǎng)景畫(huà)面信息進(jìn)行編碼，生成用于直播的視頻流；

數(shù)據(jù)傳輸模塊，與所述編碼器連接，傳輸用于直播的視頻流至服務(wù)器。

所述的畫(huà)面獲取模塊包含依次連接的截圖單元、數(shù)據(jù)格式判斷單元及數(shù)據(jù)格式轉(zhuǎn)換單元，所述的截圖單元與所述攝像頭連接，用于截取視頻信息的畫(huà)面，獲得攝像頭圖像，所述的數(shù)據(jù)格式判斷單元與所述存儲(chǔ)模塊連接，用于判斷截圖單元截取到的攝像頭畫(huà)面的數(shù)據(jù)格式，若為YUV格式，則直接將截取到的攝像頭畫(huà)面存儲(chǔ)至存儲(chǔ)模塊，若為RGB格式，則經(jīng)數(shù)據(jù)格式轉(zhuǎn)換單元將RGB格式的攝像頭畫(huà)面轉(zhuǎn)換成YUV格式后存儲(chǔ)至存儲(chǔ)模塊。

所述的渲染模塊包含一顏色過(guò)濾單元及分別與之連接的透明度參數(shù)設(shè)定單元、參考顏色指定單元，所述的顏色過(guò)濾單元分別與所述的存儲(chǔ)模塊及場(chǎng)景貼合模塊連接，所述的參考顏色指定單元用于將指定的關(guān)鍵顏色作為參考顏色，所述的透明度參數(shù)設(shè)定單元，用于設(shè)定像素的透明度參數(shù)，所述的顏色過(guò)濾單元用于過(guò)濾存儲(chǔ)模塊中存儲(chǔ)的紋理對(duì)象中像素的參考顏色，并設(shè)定紋理對(duì)象中像素的透明度參數(shù)。

一種瀏覽器直播方法，其特點(diǎn)是，包含以下步驟：

S1、實(shí)時(shí)截取攝像頭采集的視頻信息，獲得攝像頭畫(huà)面；

S2、將攝像頭畫(huà)面的每一幀作為紋理對(duì)象進(jìn)行存儲(chǔ)；

S3、對(duì)紋理對(duì)象進(jìn)行渲染，過(guò)濾紋理對(duì)象中像素的參考顏色；

S4、將經(jīng)過(guò)渲染的紋理對(duì)象與預(yù)設(shè)的虛擬背景進(jìn)行貼合，獲得貼合后的場(chǎng)景畫(huà)面信息；

S5、將貼合后的場(chǎng)景畫(huà)面信息進(jìn)行編碼，生成用于直播的視頻流。

所述的步驟S1中，還包含，若截取到的攝像頭畫(huà)面為YUV格式，則直接進(jìn)行存儲(chǔ)，若截取到的攝像頭畫(huà)面為RGB格式，則將RGB格式的攝像頭畫(huà)面轉(zhuǎn)換成YUV格式后再進(jìn)行存儲(chǔ)。

所述的步驟S3中包含：

指定一關(guān)鍵顏色作為參考顏色；

對(duì)待渲染的像素的顏色與參考顏色求差值，并對(duì)該差值進(jìn)行歸一化處理；

將歸一化處理后的差值作為系數(shù)，與待渲染的像素的顏色值中的阿爾法通道值進(jìn)行相乘，作為輸出的像素的顏色的阿爾法通道值，完成對(duì)參考顏色的過(guò)濾。

所述的參考顏色為綠色。

本發(fā)明一種瀏覽器直播客戶(hù)端、瀏覽器直播系統(tǒng)及瀏覽器直播方法與現(xiàn)有技術(shù)相比具有以下優(yōu)點(diǎn)：能夠滿足直播實(shí)時(shí)對(duì)畫(huà)面進(jìn)行處理的要求，甚至在手機(jī)上也能夠流暢運(yùn)行，耗費(fèi)資源少。

附圖說(shuō)明

圖1為本發(fā)明一種瀏覽器直播系統(tǒng)的整體結(jié)構(gòu)示意圖；

圖2為本發(fā)明一種瀏覽器直播方法的流程圖。

具體實(shí)施方式

以下結(jié)合附圖，通過(guò)詳細(xì)說(shuō)明一個(gè)較佳的具體實(shí)施例，對(duì)本發(fā)明做進(jìn)一步闡述。

如圖1所示，一種瀏覽器直播系統(tǒng)，包含瀏覽器直播客戶(hù)端100及服務(wù)器200，所述的瀏覽器直播客戶(hù)端100用于生成直播的視頻流，所述的服務(wù)器200接收瀏覽器直播客戶(hù)端100推送的視頻流，用戶(hù)向服務(wù)器200發(fā)送觀看直播請(qǐng)求，以查看視頻流；所述的瀏覽器直播客戶(hù)端100包含攝像頭101，用于采集視頻信息；畫(huà)面獲取模塊102，與所述攝像頭101連接，用于截取攝像頭的畫(huà)面；存儲(chǔ)模塊103，與所述畫(huà)面獲取模塊102連接，用于將畫(huà)面獲取模塊102截取到的攝像頭畫(huà)面的每一幀，作為紋理對(duì)象進(jìn)行存儲(chǔ)；渲染模塊104，與所述存儲(chǔ)模塊103連接，用于渲染存儲(chǔ)模塊103中存儲(chǔ)的紋理對(duì)象，過(guò)濾紋理對(duì)象中像素的參考顏色；場(chǎng)景貼合模塊105，與所述渲染模塊104連接，用于將渲染后的紋理對(duì)象與預(yù)設(shè)的虛擬背景進(jìn)行貼合，獲得貼合后的場(chǎng)景畫(huà)面信息；編碼器106，與所述場(chǎng)景貼合模塊105連接，用于將貼合后的場(chǎng)景畫(huà)面信息進(jìn)行編碼，生成用于直播的視頻流；數(shù)據(jù)傳輸模塊107，與所述編碼器106連接，傳輸用于直播的視頻流至服務(wù)器200。

在本實(shí)施例中，所述的畫(huà)面獲取模塊102包含依次連接的截圖單元1021、數(shù)據(jù)格式判斷單元1022及數(shù)據(jù)格式轉(zhuǎn)換單元1023，所述的截圖單元1021與所述攝像頭101連接，用于截取視頻信息的畫(huà)面，獲得攝像頭圖像，所述的數(shù)據(jù)格式判斷單元1021與所述存儲(chǔ)模塊103連接，用于判斷截圖單元1021截取到的攝像頭畫(huà)面的數(shù)據(jù)格式，若為YUV格式，則直接將截取到的攝像頭畫(huà)面存儲(chǔ)至存儲(chǔ)模塊103，若為RGB格式，則經(jīng)數(shù)據(jù)格式轉(zhuǎn)換單元1023將RGB格式的攝像頭畫(huà)面轉(zhuǎn)換成YUV格式后存儲(chǔ)至存儲(chǔ)模塊103。

在本實(shí)施例中，所述的渲染模塊104包含一顏色過(guò)濾單元1041及分別與之連接的透明度參數(shù)設(shè)定單元1042、參考顏色指定單元1043，所述的顏色過(guò)濾單元1041分別與所述的存儲(chǔ)模塊103及場(chǎng)景貼合模塊105連接，所述的參考顏色指定單元1042用于將指定的關(guān)鍵顏色作為參考顏色，所述的透明度參數(shù)設(shè)定單元1043，用于設(shè)定像素的透明度參數(shù)，所述的顏色過(guò)濾單元1041用于過(guò)濾存儲(chǔ)模塊103中存儲(chǔ)的紋理對(duì)象中像素的參考顏色，并設(shè)定紋理對(duì)象中像素的透明度參數(shù)。

結(jié)合上述的瀏覽器直播系統(tǒng)，本發(fā)明還公開(kāi)了一種瀏覽器直播方法，包含以下步驟：

S1、實(shí)時(shí)截取攝像頭采集的視頻信息，獲得攝像頭畫(huà)面。

Windows電腦下可以使用DirectShow或者Video For Windows來(lái)獲取攝像頭的畫(huà)面，若為安卓或蘋(píng)果操作系統(tǒng)的手機(jī)上可以直接調(diào)用SDK里提供的功能來(lái)獲取攝像頭的畫(huà)面。

若截取到的攝像頭畫(huà)面為YUV格式，則直接進(jìn)行存儲(chǔ)，若截取到的攝像頭畫(huà)面為RGB格式，則將RGB格式的攝像頭畫(huà)面轉(zhuǎn)換成YUV格式后再進(jìn)行存儲(chǔ)。

S2、將攝像頭畫(huà)面的每一幀作為紋理對(duì)象(一張圖片)進(jìn)行存儲(chǔ)。

S3、對(duì)紋理對(duì)象進(jìn)行渲染，過(guò)濾紋理對(duì)象中像素的參考顏色。

指定一關(guān)鍵顏色作為參考顏色，比如綠色；

對(duì)待渲染的像素的顏色與參考顏色求差值，并對(duì)該差值進(jìn)行歸一化處理；

將歸一化處理后的差值作為系數(shù)，與待渲染的像素的顏色值中的阿爾法通道值進(jìn)行相乘，作為輸出的像素的顏色的阿爾法通道值，完成對(duì)參考顏色的過(guò)濾。

渲染紋理對(duì)象為本發(fā)明的關(guān)鍵點(diǎn)，在本發(fā)明中使用像素著色器(Pixel Shader)對(duì)每一個(gè)像素(Pixel)的透明度根據(jù)一定的規(guī)則，或者根據(jù)用戶(hù)指定的參數(shù)進(jìn)行調(diào)整。

用戶(hù)需要指定一個(gè)關(guān)鍵(Key)顏色作為參考顏色，在像素著色器中，對(duì)要渲染的像素的顏色和用戶(hù)指定的參考顏色求差值，該差值進(jìn)行歸一化處理之后，作為系數(shù)與要渲染的像素的顏色值中的阿爾法通道值進(jìn)行相乘，作為最終輸出的像素的顏色的阿爾法通道值。

處理之后的紋理對(duì)象在渲染到場(chǎng)景中的時(shí)候，與用戶(hù)指定的參考顏色越相近的顏色，阿爾法通道值會(huì)越接近于0，以此達(dá)到過(guò)濾掉用戶(hù)指定的參考顏色的目的，最終呈現(xiàn)效果背景為透明，只留下前景，即綠色被去掉，留下前景的人物。

現(xiàn)代的顯卡都支持“可編程渲染管線”，在渲染流程中可以送入自定義的程序?qū)︿秩静襟E進(jìn)行控制。其中在Windows上，通過(guò)Direct3D進(jìn)行渲染，可以在Pixel Shader里自定義渲染邏輯，將人物背后的綠幕設(shè)置為透明；在蘋(píng)果手機(jī)或者安卓系統(tǒng)的手機(jī)上，可以通過(guò)OpenGL ES里的Fragment Shader將背景的綠幕設(shè)置為透明。

具體的，可編程渲染管線是指顯卡在渲染場(chǎng)景的過(guò)程中，程序員可以對(duì)顯示運(yùn)算單元中的著色器進(jìn)行編程的方式，可以控制和管理顯卡的渲染效果。著色器分為頂點(diǎn)著色器和像素著色器。其中頂點(diǎn)著色器是在進(jìn)行坐標(biāo)變換和光照計(jì)算時(shí)工作，因?yàn)檫@里渲染攝像頭畫(huà)面的貼圖不涉及到3D變換，所以幾乎是對(duì)輸入的頂點(diǎn)不做任何處理就輸出了；而像素著色器是在光柵化環(huán)節(jié)工作，此時(shí)可以對(duì)每個(gè)渲染層面上的“像素”點(diǎn)進(jìn)行細(xì)微調(diào)整，此時(shí)可以利用顯卡運(yùn)算，將綠色去除。

像素著色器運(yùn)算的時(shí)候能夠參考的數(shù)據(jù)，可以在渲染一幀之前由程序指定。在像素著色器開(kāi)始工作之前，程序已經(jīng)將攝像頭畫(huà)面保存在一張專(zhuān)門(mén)的“紋理”中供像素著色器參考，也將需要過(guò)濾的顏色(例如這里是綠色)保存在屬性里，同時(shí)頂點(diǎn)著色器又傳遞參數(shù)過(guò)來(lái)指明現(xiàn)在渲染的是哪個(gè)像素。這樣像素著色器在工作過(guò)程中，可以從保存有攝像頭畫(huà)面的“紋理”中獲取這個(gè)要渲染的像素，如果攝像頭獲取的數(shù)據(jù)是RGB形式，那么可以利用顯卡強(qiáng)大的向量運(yùn)算能力，直接乘以一個(gè)變換矩陣轉(zhuǎn)成YUV格式。然后對(duì)表示這個(gè)像素點(diǎn)顏色的向量和作為參考的需要過(guò)濾的顏色的向量求距離：距離越近，那么這個(gè)像素點(diǎn)就要越透明；距離越遠(yuǎn)，那么這個(gè)像素點(diǎn)就越不透明，此舉通過(guò)修改像素的alpha通道分量來(lái)實(shí)現(xiàn)。

S4、將經(jīng)過(guò)渲染的紋理對(duì)象與預(yù)設(shè)的虛擬背景進(jìn)行貼合，獲得貼合后的場(chǎng)景畫(huà)面信息。

S5、將貼合后的場(chǎng)景畫(huà)面信息進(jìn)行編碼，生成用于直播的視頻流。

盡管本發(fā)明的內(nèi)容已經(jīng)通過(guò)上述優(yōu)選實(shí)施例作了詳細(xì)介紹，但應(yīng)當(dāng)認(rèn)識(shí)到上述的描述不應(yīng)被認(rèn)為是對(duì)本發(fā)明的限制。在本領(lǐng)域技術(shù)人員閱讀了上述內(nèi)容后，對(duì)于本發(fā)明的多種修改和替代都將是顯而易見(jiàn)的。因此，本發(fā)明的保護(hù)范圍應(yīng)由所附的權(quán)利要求來(lái)限定。