基于HTML5實(shí)現(xiàn)Web終端與IMS終端互通*

衛(wèi)亞兵

(中國電子科技集團(tuán)公司第三十研究所,四川成都610041)

基于HTML5實(shí)現(xiàn)Web終端與IMS終端互通*

衛(wèi)亞兵

(中國電子科技集團(tuán)公司第三十研究所,四川成都610041)

HTML5(Hyper TextMarkup Language 5)技術(shù)是新一代Web應(yīng)用程序構(gòu)建的基準(zhǔn),它包括了全新更加豐富的標(biāo)簽格式、高效的雙向通信機(jī)制以及Web化多媒體特性。利用HTML5的這些新特性,可以構(gòu)建出Web化的智能多媒體終端,實(shí)現(xiàn)基于瀏覽器的多媒體音視頻實(shí)時通信?；贖TML5技術(shù)實(shí)現(xiàn)Web化智能多媒體終端具備跨操作系統(tǒng)平臺、免安裝等優(yōu)點(diǎn)。通過WebRTC2SIP服務(wù)器網(wǎng)關(guān),能夠?qū)崿F(xiàn)基于HTML5的Web智能多媒體終端與傳統(tǒng)IMS/LTE多媒體終端之間實(shí)時音視頻通信。

第五代超文本標(biāo)記語言 雙向通信機(jī)制 智能多媒體終端 WebRTC2SIP服務(wù)器 實(shí)時通信

0 引 言

HTML5(Edition Five,Hyper Text Markup Language)是超文本標(biāo)記語言的最新版本,與以前版本不同,HTML5并非僅僅用來表示W(wǎng)eb內(nèi)容,而是將Web帶入一個成熟的應(yīng)用平臺。HTML5技術(shù)顯著增強(qiáng)了終端瀏覽器的功能,能夠在跨平臺環(huán)境下具備富Web應(yīng)用的交互能力,將音頻、視頻、圖像、動畫以及一些交互特性標(biāo)準(zhǔn)化,為構(gòu)建下一代Web應(yīng)用程序提供了基準(zhǔn)性規(guī)范。

傳統(tǒng)的IMS/LTE智能多媒體終端[1],采用C/S通信模式,具有很強(qiáng)的系統(tǒng)平臺相關(guān)性,用戶須事先在指定的系統(tǒng)平臺上安裝相應(yīng)的客戶端程序才能使用其業(yè)務(wù)。而基于HTML5技術(shù)的Web多媒體終端,無需用戶任何安裝,無論用戶處于何種系統(tǒng)平臺,只需使用支持HTML5的瀏覽器即可加載Web多媒體終端,進(jìn)而實(shí)現(xiàn)音視頻多媒體通信業(yè)務(wù)。

基于HTML5技術(shù)的Web多媒體終端不僅具有傳統(tǒng)多媒體終端的富媒體交互能力,同時具有系統(tǒng)平臺無關(guān)性,方便用戶跨平臺使用,必將是未來的發(fā)展方向之一?？紤]到目前大規(guī)模的IMS/LTE傳統(tǒng)智能終端的應(yīng)用,如果能夠?qū)eb智能終端與IMS/LTE終端互通,將會加快其發(fā)展和應(yīng)用推進(jìn)。

1 Web多媒體終端簡介

Web多媒體終端首先需要具備雙向的通信能力,能夠作為主叫主動呼叫對端,也可以作為被叫,接收對端的呼叫。其次需要具備Web化的音視頻多媒體處理引擎,實(shí)現(xiàn)音視頻的采集、編碼和傳輸?shù)裙δ堋Ｔ趯?shí)現(xiàn)Web化的多媒體終端涉及到兩個新技術(shù),一是WebSocket瀏覽器式雙向通信機(jī)制,二是WebRTC瀏覽器式音視頻處理引擎技術(shù)。

1.1 WebSocket技術(shù)

在HTML5標(biāo)準(zhǔn)體系中,WebSocket[2]技術(shù)是一個非常重要的新特性,它定義了一個全雙工通信信道,即瀏覽器可以利用WebSocket協(xié)議與對端主機(jī)雙向通信,比XMLHTTPRequest更加強(qiáng)大、高效而且有效減少流量和降低網(wǎng)絡(luò)帶寬的占用。

通常瀏覽器訪問Web頁面都會向服務(wù)器發(fā)送一個HTTP請求,Web服務(wù)器識別請求后返回響應(yīng)。大多數(shù)情況下實(shí)時性要求較高的Web應(yīng)用都是圍繞輪詢和服務(wù)器推送技術(shù)展開,都會涉及HTTP請求和響應(yīng)報(bào)頭,包含了大量不必要的報(bào)頭數(shù)據(jù),效率低下且?guī)捹Y源占用較大。對于WebSocket通信,客戶端和服務(wù)器在初始握手時就將HTTP升級為WebSocket協(xié)議,一旦連接成功,即以全雙工模式在客戶端和服務(wù)器之間傳送WebSocket文本消息,相比傳統(tǒng)的輪詢技術(shù),WebSocket帶來了高效和節(jié)流等新特性。

基于WebSocket協(xié)議的全雙工、高效節(jié)流的新特性,為開發(fā)Web化的智能多媒體終端提供了支撐。目前主流的瀏覽器已從不同的版本開始支持WebSocket協(xié)議了。具體如表1所示[3]。

表1 WebSocket瀏覽器支持情況Table1 Browsers support forWebSocket

1.2 WebRTC技術(shù)

在HTML5技術(shù)標(biāo)準(zhǔn)中,WebRTC[4](Web Real-Time Communication)技術(shù)是另一個非常重要的新特性,它是一種基于瀏覽器的多媒體實(shí)時通信技術(shù),包括語音、視頻、數(shù)據(jù)等。WebRTC將多媒體處理能力直接嵌入到瀏覽器中,不需要安裝任何擴(kuò)展和插件即可實(shí)現(xiàn)傳統(tǒng)的多媒體實(shí)時通信。在此之前,基于瀏覽器的實(shí)時通信都需要通過安裝插件的方式實(shí)現(xiàn),如flash,而且采用私有協(xié)議,互通性較差。

WebRTC技術(shù)定義了一系列標(biāo)準(zhǔn)化的JavaScript接口和網(wǎng)絡(luò)協(xié)議,并將多媒體處理能力向Web應(yīng)用開發(fā)者開放。WebRTC的技術(shù)框架如圖1所示[5]。

圖1 WebRTC體系框架Fig.1 Architecture ofWebRTC

Web應(yīng)用層是Web開發(fā)者基于支持WebRTC瀏覽器開發(fā)的類似于網(wǎng)絡(luò)視頻聊天的Web應(yīng)用, Web API層是面向Web開發(fā)者的WebRTC標(biāo)準(zhǔn)API。音頻引擎包含了一系列音頻處理技術(shù),包括Opus編解碼、語音NetEQ技術(shù)、回聲消除/噪聲抑制技術(shù)等。視頻引擎包括了VPX/H264編解碼、視頻抖動緩沖、圖像增強(qiáng)模塊等。在傳輸層,WebRTC采用RTP/SRTP傳輸媒體流,采用ICE技術(shù)在STUN或TURN服務(wù)器的支持下實(shí)現(xiàn)媒體流的私網(wǎng)穿透。WebRTC技術(shù)向?yàn)g覽器引入了音視頻引擎、網(wǎng)絡(luò)傳輸功能,提供開源編碼格式,為實(shí)現(xiàn)Web智能多媒體終端提供了另一必不可少的支撐。

1.3 HTML5與Flash技術(shù)的比較

在Web化智能多媒體通信領(lǐng)域,不得不提到Adobe Flash技術(shù),通過安裝flash player插件即可以實(shí)現(xiàn)功能強(qiáng)勁的Web化富客戶端,包括音頻、視頻等多媒體實(shí)時通信。例如著名的基于Flash技術(shù)的BigBlueButton開源Web多媒體通信系統(tǒng),該系統(tǒng)首

先需要用戶在Web瀏覽器前端安裝flash player插件,用于完成音視頻多媒體數(shù)據(jù)的處理;另外基于RTMP協(xié)議在前后端之間傳輸控制和媒體數(shù)據(jù)。

相對HTML5技術(shù)來說,Flash技術(shù)一是需要安裝插件支持,二是控制與媒體數(shù)據(jù)融合在同一個協(xié)議通道中傳輸,與NGN/IMS網(wǎng)絡(luò)控制與業(yè)務(wù)分離的思想背離,三是技術(shù)標(biāo)準(zhǔn)封閉且需要收費(fèi)。誠然通過Flash技術(shù)也可以實(shí)現(xiàn)Web富客戶端與傳統(tǒng)SIP終端的互通,但必須在后端服務(wù)器處對控制和媒體數(shù)據(jù)進(jìn)行分離、轉(zhuǎn)換。這樣一來,對于實(shí)時多媒體通信來說,延時和處理性能都可能存在瓶頸。而HTML5技術(shù)則無需額外安裝插件,技術(shù)標(biāo)準(zhǔn)開放、免費(fèi),實(shí)現(xiàn)了呼叫控制和媒體處理分離,更適合用來實(shí)現(xiàn)與傳統(tǒng)SIP終端的互通。

1.4 SIPML5瀏覽器終端

SIPML5[6]是一款基于HTML5技術(shù)開發(fā)的Web智能多媒體終端,由Doubango通信公司開發(fā)并開放源碼。該Web智能多媒體終端使用SIP協(xié)議作為呼叫控制信令,基于WebSocket技術(shù)實(shí)現(xiàn)SIP協(xié)議消息的雙向傳輸。使用瀏覽器內(nèi)嵌的WebRTC功能模塊實(shí)現(xiàn)音視頻多媒體處理和傳輸。搭配支持WebSocket雙向傳輸協(xié)議的SIP服務(wù)器即可實(shí)現(xiàn)SIPML5瀏覽器終端的SIP注冊、呼叫和多媒體通信業(yè)務(wù)。

SIPML5瀏覽器終端與支持WebSocket傳輸協(xié)議的SIP服務(wù)器通信框架如圖2所示。

圖2 SIPML5瀏覽器終端通信框架Fig.2 Communication architecture of SIPML5

目前Asterisk開源服務(wù)器自版本11之后支持基于WebSocket傳輸協(xié)議的SIP通信,Tomcat服務(wù)器自版本7之后也開始提供基于WebSocket協(xié)議的SIP Servlet。SIPML5瀏覽器終端使用JavaScript語言實(shí)現(xiàn)SIP/SDP協(xié)議棧,向支持WebSocket的SIP服務(wù)器注冊、發(fā)起呼叫,呼叫建立后,使用WebRTC模塊采集音視頻多媒體數(shù)據(jù)、編碼和傳輸,實(shí)現(xiàn)瀏覽器智能終端之間的音視頻通信。但要實(shí)現(xiàn)SIPML5瀏覽器終端與傳統(tǒng)IMS智能終端之間的互通,還需要借助轉(zhuǎn)換網(wǎng)關(guān)的支撐,如下面將要介紹的WebRTC2SIP互通網(wǎng)關(guān)[6]。

2 WebRTC2SIP網(wǎng)關(guān)簡介

基于HTML5技術(shù)的Web智能終端目前正剛剛興起,具有較多的優(yōu)點(diǎn),將是未來智能終端的發(fā)展趨勢之一。但相對于傳統(tǒng)的IMS/LTE智能終端來說,應(yīng)用規(guī)模還很小,如果能夠?qū)崿F(xiàn)與IMS/LTE智能終端的互通,必將能夠加快其自身的發(fā)展應(yīng)用進(jìn)程。

WebRTC2SIP[6]網(wǎng)關(guān)就是為了解決HTML5終端與IMS/LTE終端互通而出現(xiàn)的,由Doubango通信公司開發(fā)并開放源碼。WebRTC2SIP網(wǎng)關(guān)的技術(shù)框架如圖3所示。

圖3 WebRTC2SIP網(wǎng)關(guān)框架Fig.3Architecture ofWebRTC2SIP

WebRTC2SIP網(wǎng)關(guān)主要由SIP Proxy模塊、WebRTC Breaker模塊、Media Coder模塊以及Clickto-call模塊組成。其中SIP Proxy模塊完成HTML5瀏覽器終端側(cè)WebSocket傳輸?shù)腟IP協(xié)議到傳統(tǒng)UDP/TCP傳輸?shù)腟IP協(xié)議之間的轉(zhuǎn)換,實(shí)現(xiàn)SIP呼叫控制消息的互通。WebRTC Breaker模塊主要完成HTML5瀏覽器終端側(cè)音視頻媒體流與傳統(tǒng)IMS網(wǎng)絡(luò)側(cè)RTP/RTCP媒體流之間的轉(zhuǎn)換。Media Coder模塊主要是完成HTML5瀏覽器終端側(cè)音視頻編碼格式與IMS網(wǎng)絡(luò)側(cè)音視頻編碼格式之間的轉(zhuǎn)碼。WebRTC Breaker與Media Coder模塊結(jié)合起來共同完成HTML5瀏覽器終端側(cè)與IMS網(wǎng)絡(luò)側(cè)之間的媒體互通。Click-to-call是WebRTC2SIP網(wǎng)關(guān)另外提供的一個點(diǎn)擊呼叫業(yè)務(wù)模塊,它與HTML5瀏覽器終端與IMS終端互通相關(guān)性不大,此處不做深入介紹。

3 HTM L5終端與IMS終端互通方案

HTML5瀏覽器終端由于采用的技術(shù)體制與IMS/LTE傳統(tǒng)的智能終端之間存在差異,導(dǎo)致他們

之間需要借助一個轉(zhuǎn)換網(wǎng)關(guān)的幫助,才能實(shí)現(xiàn)SIP呼叫控制和音視頻媒體流兩個層面的轉(zhuǎn)換互通[6]。

從圖4互通框架中可以看到,WebRTC2SIP網(wǎng)關(guān)在其中扮演了橋梁轉(zhuǎn)換的角色。下面分別對其中三個轉(zhuǎn)換模塊進(jìn)行較詳細(xì)的描述。

圖4 HTML5瀏覽器終端與IMS/LTE終端互通框架Fig.4 Inter-communication architecture of between HTML5 browers terminals and IMS/LTE terminals

3.1 SIPProxy模塊

SIP Proxy[6]模塊主要作用就是將基于Web-Socket協(xié)議傳輸?shù)腟IP消息與傳統(tǒng)SIP網(wǎng)絡(luò)中基于UDP、TCP或TLS協(xié)議傳輸?shù)腟IP消息進(jìn)行互轉(zhuǎn),實(shí)現(xiàn)不同傳輸協(xié)議制式中的SIP消息代理轉(zhuǎn)換功能。

下面以注冊流程為例敘述SIP代理模塊的轉(zhuǎn)換處理。代理模塊注冊流程如圖5所示。

圖5 SIP代理模塊注冊流程Fig.5 Registration flow of SIP proxymodule

(1)HTML5瀏覽器側(cè)SIP注冊消息

F1 REGISTER Web瀏覽器-＞W(wǎng)ebRTC2SIP (WS)

REGISTER sip:proxy.example.com SIP/2.0

Via:SIP/2.0/WS df7 jal23 ls0d.invalid;

branch=z9hG4b5

From:sip:browser@example.com;tag=abc

To:sip:browser@example.com

Call-ID:abcdefghijklmnopqrstuvwxyz

CSeq:1 REGISTER

Max-Forwards:70

Contact:＜sip:browser@df7jal23ls0d.invalid;

transport=ws＞

由于Web瀏覽器無法直接獲取到本機(jī)的地址和端口,導(dǎo)致SIP注冊請求消息中使用了無效的地址,分別在Contact和Via消息頭字段中。這樣的SIP消息如果直接發(fā)送到傳統(tǒng)的SIP服務(wù)器中將無法處理,同時由于基于WebSocket協(xié)議傳輸,也不可能正確的傳到傳統(tǒng)的SIP服務(wù)器中。

(2)WebRTC2SIP網(wǎng)關(guān)轉(zhuǎn)換后的SIP注冊消息

F2 REGISTERWebRTC2SIP-＞SIP Network (UDP)

REGISTER sip:proxy.example.com SIP/2.0

Via:SIP/2.0/UDP 66.66.66.66:5060;

branch=z9hG4b5;rport

Via:SIP/2.0/TCP 192.168.0.9:55210;rport;

branch=z9hG4b6;ws-hacked=WS

From:sip:browser@example.com;tag=abc

To:sip:browser@example.com

Call-ID:abcdefghijklmnopqrstuvwxyz

CSeq:1 REGISTER

Max-Forwards:70

Contact:＜sip:browser@66.66.66.66:5060;

transport=udp＞

經(jīng)過轉(zhuǎn)換后的SIP注冊消息替換了Contact和Via消息頭字段中的地址信息,再將轉(zhuǎn)換后的SIP注冊請求轉(zhuǎn)發(fā)到SIP網(wǎng)絡(luò)中,才能被正確的接收和處理。

3.2 WebRTCBreaker模塊

HTML5標(biāo)準(zhǔn)中的WebRTC規(guī)范強(qiáng)制要求支持ICE、DTLS和SRTP媒體傳輸,而大多數(shù)的SIP網(wǎng)絡(luò)設(shè)備并不支持這些技術(shù)。因此使用WebRTC Breaker模塊來協(xié)商、轉(zhuǎn)換這兩種完全不同媒體流制式并且使他們互通。

WebRTC Breaker[6]模塊的啟用可以通過HTML5瀏覽器終端進(jìn)行設(shè)置,但必須在注冊之前就選擇啟用該模塊。啟用WebRTC Breaker模塊后,從HTML5瀏覽器終端發(fā)出的SIP消息的Uri記錄地址中都包含有“rtcweb-breaker=yes”參數(shù),整個媒體流轉(zhuǎn)換過程類似B2BUA模式,銜接了兩段不同模式的媒體流。

具體流程如圖6所示。

圖6 WebRTC Breaker模塊媒體流轉(zhuǎn)換Fig.6 Media flow transform ofWebRTCbreakermodule

3.3 MediaCoder模塊

WebRTC標(biāo)準(zhǔn)在音頻編碼方面強(qiáng)制定義了兩種格式,分別是opus和g711。而視頻編碼格式暫時還處在討論階段,目前的選擇主要在VPX和H.264之間。VPX視頻編碼格式主要優(yōu)點(diǎn)是免費(fèi),但缺點(diǎn)是應(yīng)用范圍不廣;H.264視頻編碼格式應(yīng)用范圍很廣,但不是免費(fèi)使用的。

當(dāng)前各大瀏覽器廠商結(jié)合自己的情況,都有著不同的視頻編碼選擇傾向。其中Google、Mozilla和Opera廠商傾向使用免費(fèi)的VPX視頻編碼格式,而微軟、愛立信則傾向選擇H.264視頻編碼格式。

針對WebRTC側(cè)的媒體流編碼格式標(biāo)準(zhǔn)與傳統(tǒng)IMS/LTE網(wǎng)絡(luò)側(cè)的不同,為了使兩者互通,必須借助媒體轉(zhuǎn)碼模塊的支撐。

下面是媒體轉(zhuǎn)碼模塊的框架圖,如圖7所示[6]。

圖7 Media Coder媒體轉(zhuǎn)碼Fig.7 Media Coder architecture

4 結(jié) 語

HTML5是一項(xiàng)新興的技術(shù)標(biāo)準(zhǔn),增添了多種標(biāo)簽,可以實(shí)現(xiàn)更加豐富多彩的Web應(yīng)用。尤其是加入了WebRTC多媒體處理和WebSocket雙向傳輸這兩個技術(shù)標(biāo)準(zhǔn),使得基于HTML5實(shí)現(xiàn)Web版多媒體智能SIP終端成為了可能。結(jié)合Web瀏覽器的平臺無關(guān)性,Web應(yīng)用免安裝等特點(diǎn),Web化的智能多媒體終端給用戶帶來了不一樣的體驗(yàn),將會是未來的主流趨勢之一。實(shí)現(xiàn)Web化的智能多媒體終端與傳統(tǒng)IMS/LTE智能終端的互通,必將極大的推進(jìn)Web化智能終端的應(yīng)用和發(fā)展。

[1] 柯衛(wèi),沈雷,趙化明.基于IMS的CDMA視頻通信業(yè)務(wù)關(guān)鍵技術(shù)研究[J].通信技術(shù),2011,44(09):65-67.

KEWei,SHEN Lei,ZHAO Hua-ming.Study on Key Technologies of CDMA Network Video Telephony Services based on IMS[J].Communications Technology,2011,44 (09):65-67.

[2] 李代立,陳榕.WebSocket在Web實(shí)時通信領(lǐng)域的研究[J].電腦知識與技術(shù),2010(06):7923-7925,7935.

LI Dai-li,CHEN Rong.The Research of WebSocket based on Web Real-time Communication[J].Computer Knowledge and Technology,2010,6:7923-7925,7935.

[3] 張志明,柯衛(wèi).基于HTML5的視頻通信云服務(wù)應(yīng)用技術(shù)研究[J].電信科學(xué),2012(01):31-34.

ZHANG Zhi-ming,KEWei.Research on Techniques of Cloud Service Applications in HTML5-Based Video Communication[J].Telecommunications Science,2012 (01).31-34.

[4] 屈振華,李慧云,張海濤,等.WebRTC技術(shù)初探[J].電信科學(xué),2012(01):106-110.

QU Zheng-hua,LI Hui-yun,ZHANG Hai-tao etc.A Preliminary Exploration of Arising WebRTC Technology [J].Telecommunications Science,2012(01):106-110.

[5] 梁艷.基于HTML5的WebRTC技術(shù)淺析[J].信息通信技術(shù),2014(02):52-56.

LIANG Yan.Analysis of webRTC Technology Based on HTML5[J].Information and CommunicationTechnologies,2014(02):52-56.

[6] Mamadou DIOP.webrtc2sip-Smart SIP and Media Gateway for WebRTC endpoints Technical Guide[EB/OL]. (2013)[2014-07-28].http://www.doubango.org.

衛(wèi)亞兵(1979—),男,工程師,碩士,主要研究方向?yàn)橄乱淮W(wǎng)絡(luò)和多媒體通信。

WEIYa-bing(1979-),male,engineer, M.Sci.,mainly engaged in NGN and multimedia communication.

HTM L5-based Interflows of Web Terminals with IMS Terminals

WEI Ya-bing
(No.30 Instituteof CETC,Chengdu Sichuan 610041,China)

HTML5(Hyper Text Markup Language 5)technology is a new-generation standard for establishing Web applications,includingmany new characteristics,such as completely-new andmore abundant label format, high-efficiency and bi-directional communication mechanisms and multimedia capability of Web.By using these new charateristics of HTML5 technology,Web′s intelligentmultimedia terminals could be established and real-time communication ofmultimedia audio/video alsobased on browsersbe realized.These Web′s intelligent multimedia terminals based on HTML5 technology enjoys the supriorities of cross-os and installation-free. Meanwhile,Web′s intelligentmu ltimedia terminals based on HTML5 could achieve real-time communication with the traditional IMS/LTE legacy intelligent terminals through WebRTC2SIP server′s gateway.

HTML5;bi-directional communication mechanism;intelligent multimedia terminals; WebRTC2SIP server;real-time communication

TN915.41

A

002-0802(2014)12-1459-05

10.3969/j.issn.1002-0802.2014.12.023

2014-09-18;

2014-11-09 Received date：2014-09-18;Revised date：2014-11-09