{"id":32314,"date":"2019-10-31T21:46:17","date_gmt":"2019-10-31T18:46:17","guid":{"rendered":"https:\/\/prohoster.info\/blog\/webrtc-i-videonablyudenie-kak-my-pobedili-zaderzhku-video-s-kamer\/"},"modified":"2019-10-31T21:46:17","modified_gmt":"2019-10-31T18:46:17","slug":"webrtc-i-videonablyudenie-kak-my-pobedili-zaderzhku-video-s-kamer","status":"publish","type":"post","link":"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/webrtc-i-videonablyudenie-kak-my-pobedili-zaderzhku-video-s-kamer","title":{"rendered":"WebRTC a video surveillance: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer","gt_translate_keys":[{"key":"rendered","format":"text"}]},"content":{"rendered":"<p><img decoding=\"async\" alt=\"WebRTC a video surveillance: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer\" src=\"\/wp-content\/uploads\/2019\/04\/d185b546f5fc4c15021481c0cc2fedbd.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nOd prvn\u00edch dn\u016f pr\u00e1ce na syst\u00e9mu cloudov\u00e9ho video dohledu jsme se setkali s probl\u00e9mem, bez jeho\u017e vy\u0159e\u0161en\u00ed by bylo mo\u017en\u00e9 na Ivideon zapomenout \u2013 byl to n\u00e1\u0161 Everest, jeho\u017e zdol\u00e1n\u00ed n\u00e1s st\u00e1lo spoustu sil, ale nyn\u00ed jsme kone\u010dn\u011b zasunuli cep\u00edn do vrcholu tohoto multiplatformn\u00edho r\u00e9busu.<\/p>\n<p>Syst\u00e9m p\u0159enosu zvuku a videa p\u0159es Internet nesm\u00ed z\u00e1viset na hardwaru, webov\u00fdch klientech a podpo\u0159en\u00fdch standardech a mus\u00ed spr\u00e1vn\u011b fungovat p\u0159i p\u0159\u00edtomnosti Network Address Translators a firewall\u016f. U\u017eivatel cloudov\u00e9ho video dohledu chce m\u00edt p\u0159\u00edstup k slu\u017eb\u011b, i kdy\u017e pou\u017e\u00edv\u00e1 analogov\u00e9 kamery, a preferuje sledov\u00e1n\u00ed \u017eiv\u00e9ho videa na nejmodern\u011bj\u0161\u00edm za\u0159\u00edzen\u00ed. <\/p>\n<p>Je velmi d\u016fle\u017eit\u00e9, \u017ee u\u017eivatel chce sledovat video s minim\u00e1ln\u00edm zpo\u017ed\u011bn\u00edm. Prakticky jedinou mo\u017enost\u00ed, jak zobrazit video s n\u00edzk\u00fdm zpo\u017ed\u011bn\u00edm v prohl\u00ed\u017ee\u010di, je vyu\u017e\u00edt WebRTC (web real-time communications). WebRTC p\u0159edstavuje soubor technologi\u00ed pro peer-to-peer p\u0159enos videa a zvuku v prohl\u00ed\u017ee\u010d\u00edch, p\u016fvodn\u011b navr\u017een\u00fd pro p\u0159enos a p\u0159ehr\u00e1v\u00e1n\u00ed videostreamu s n\u00edzk\u00fdm zpo\u017ed\u011bn\u00edm. K tomu se mimo jin\u00e9 pou\u017e\u00edv\u00e1 protokol UDP.<\/p>\n<p>Ne\u017e v\u00e1m pov\u00edme, co nov\u00e1 technologie u\u017eivateli p\u0159in\u00e1\u0161\u00ed, p\u0159ipomeneme si, pro\u010d a kv\u016fli \u010demu podporujeme HLS technologie a pro\u010d jsme se rozhodli j\u00edt d\u00e1l.<br \/>\n<noindex><a rel=\"nofollow\" name=\"habracut\"><\/a><\/noindex><\/p>\n<h2>HLS engine: v\u00fdhody a nev\u00fdhody<\/h2>\n<p>\n<img decoding=\"async\" alt=\"WebRTC a video surveillance: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer\" src=\"\/wp-content\/uploads\/2019\/04\/f025d08eb22f7785090b8bc60194643c.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n(<noindex><a rel=\"nofollow\" href=\"https:\/\/www.encoding.com\/http-live-streaming-hls\/\">s<\/a><\/noindex>)<\/p>\n<p>Technologie HLS (HTTP Live Streaming) byla vyvinuta spole\u010dnost\u00ed Apple, proto nen\u00ed p\u0159ekvapen\u00edm, \u017ee jej\u00ed podpora se poprv\u00e9 objevila na za\u0159\u00edzen\u00edch t\u00e9to zna\u010dky. Dnes prakticky v\u0161echny televizn\u00ed set-top boxy a mnoh\u00e1 za\u0159\u00edzen\u00ed s opera\u010dn\u00edm syst\u00e9mem Android um\u011bj\u00ed p\u0159ehr\u00e1vat videa v HLS form\u00e1tu.<\/p>\n<p>HLS engine pou\u017e\u00edv\u00e1 pro streamov\u00e1n\u00ed video dat dob\u0159e zn\u00e1m\u00fd video kodek H264 v kombinaci s AAC nebo MP3 audio streamy. \u00dapln\u00fd tok audio a video dat je zabalen do transportn\u00edho kontejneru MPEG-TS. Pro p\u0159enos p\u0159es protokol HTTP je obsah v toku rozd\u011blen na segmenty popsan\u00e9 v m3u8 playlistu. Teprve pot\u00e9 jsou tyto segmenty spolu s playlisty p\u0159en\u00e1\u0161eny p\u0159es HTTP. Rozd\u011blen\u00ed na segmenty automaticky znamen\u00e1 zpo\u017ed\u011bn\u00ed v sekund\u00e1ch. Tento rys kontejneru MPEG-TS. <\/p>\n<p>HLS engine tak\u00e9 podporuje multi-bit rate streamy, Live\/VOD. <\/p>\n<p><b>Hlavn\u00ed v\u00fdhody HLS:<\/b><\/p>\n<ul>\n<li>Vestav\u011bn\u00e1 podpora ve v\u0161ech hlavn\u00edch prohl\u00ed\u017ee\u010d\u00edch;<\/li>\n<li>Jednoduchost implementace (ve srovn\u00e1n\u00ed s WebRTC);<\/li>\n<li>Je velmi pohodln\u00e9 a efektivn\u00ed organizovat r\u016fzn\u00e1 vys\u00edl\u00e1n\u00ed pro velk\u00e9 publikum d\u00edky tomu, \u017ee m\u016f\u017eete segmenty jednou nahr\u00e1t na CDN.<\/li>\n<\/ul>\n<p>\nP\u0159esto\u017ee je engine velmi jednoduch\u00fd, nen\u00ed to tak hladk\u00e9, jak se zd\u00e1. Hlavn\u00edm probl\u00e9mem je, \u017ee v\u00fdvoj\u00e1\u0159i t\u0159et\u00edch stran odch\u00e1zeli od doporu\u010den\u00ed Apple, nap\u0159\u00edklad pokud jde o podporovan\u00e9 audio form\u00e1ty. Konkr\u00e9tn\u011b mnoho v\u00fdvoj\u00e1\u0159\u016f za\u010dalo p\u0159id\u00e1vat mo\u017enost pr\u00e1ce s popul\u00e1rn\u00edmi audiostreamy: mpeg2 video, mpeg2 audio a podobn\u011b. V d\u016fsledku toho bylo nutn\u00e9 vytvo\u0159it r\u016fzn\u00e9 form\u00e1ty playlist\u016f pro r\u016fzn\u00e9 p\u0159ehr\u00e1va\u010de.<\/p>\n<p>Jedn\u00edm z nejv\u011bt\u0161\u00edch probl\u00e9m\u016f motoru HLS je vysok\u00e1 latence p\u0159enosu dat.<\/p>\n<h2>P\u016fvody \"zpo\u017ed\u011bn\u00ed\"<\/h2>\n<p>\nHlavn\u00ed p\u0159\u00ed\u010dina vysok\u00e9 latence u HLS spo\u010d\u00edv\u00e1 v tom, \u017ee program\u00e1to\u0159i vytv\u00e1\u0159eli engine pro z\u00edsk\u00e1n\u00ed maxim\u00e1ln\u011b kvalitn\u00edho obrazu. Proto parametry pou\u017eit\u00e9ho intervalu sn\u00edmk\u016f a objem vyrovn\u00e1vac\u00ed pam\u011bti pro p\u0159ehr\u00e1v\u00e1n\u00ed jednodu\u0161e nevyhovuj\u00ed pro p\u0159\u00edm\u00e9 video p\u0159enosy. Z toho d\u016fvodu vznik\u00e1 pom\u011brn\u011b vysok\u00e1 latence p\u0159enosu videa, kter\u00e1 m\u016f\u017ee \u010dinit 5-7 sekund.<\/p>\n<p>Na jedn\u00e9 stran\u011b je to m\u00e1lo, nap\u0159\u00edklad pro ty, kdo sleduj\u00ed film ze serveru video hostingu. Ale pro syst\u00e9my video dohledu m\u016f\u017ee m\u00edt latence p\u0159enosu videa velmi velk\u00fd v\u00fdznam.<\/p>\n<p>Pokud sledujete kancel\u00e1\u0159, kde se zam\u011bstnanci jednou za hodinu odtrh\u00e1vaj\u00ed od monitor\u016f, pak p\u011btisekundov\u00e1 latence nen\u00ed v\u016fbec d\u016fle\u017eit\u00e1. Ale lid\u00e9 si za\u010dali st\u011b\u017eovat, \u017ee nap\u0159\u00edklad b\u011bhem vys\u00edl\u00e1n\u00ed fotbalov\u00e9ho z\u00e1pasu u\u017e v chatu napsali G\u00d3\u00d3\u00d3L, ale na videu to je\u0161t\u011b nen\u00ed :). U\u017e m\u00e1me \u0159adu u\u017eivatelsk\u00fdch p\u0159\u00edpad\u016f, kde Ivideon mus\u00ed prakticky nahradit Skype.<\/p>\n<p>Lze p\u0159ekonat latenci v HLS? Odpov\u011b\u010f na tuto ot\u00e1zku zn\u00ed jako vystoupen\u00ed zku\u0161en\u00e9ho vym\u00edta\u010de krys na p\u0159edn\u00e1\u0161ce p\u0159ed za\u010d\u00ednaj\u00edc\u00edmi deratiz\u00e1tory: \"Krysy nelze vyhladit, ale jejich populace m\u016f\u017ee b\u00fdt sn\u00ed\u017eena na rozumn\u00e9 minimum.\" Tak i s latenc\u00ed u HLS, odstranit ji na nulu nen\u00ed mo\u017en\u00e9, ale na trhu existuj\u00ed \u0159e\u0161en\u00ed, kter\u00e1 umo\u017e\u0148uj\u00ed latenci v\u00fdrazn\u011b sn\u00ed\u017eit.<\/p>\n<h2>Mal\u00e9 segmenty<\/h2>\n<p>\nDal\u0161\u00edm nedostatkem motoru je pou\u017eit\u00ed mal\u00fdch soubor\u016f pro p\u0159enos dat. Zd\u00e1lo by se, co na tom m\u016f\u017ee b\u00fdt \u0161patn\u00e9ho?<\/p>\n<p>Ka\u017ed\u00fd, kdo se pokusil zkop\u00edrovat velk\u00e9 mno\u017estv\u00ed mal\u00fdch soubor\u016f z jednoho m\u00e9dia na druh\u00e9, si jist\u011b v\u0161iml, \u017ee rychlost z\u00e1pisu takov\u00e9ho souboru je mnohem ni\u017e\u0161\u00ed ne\u017e to, co by bylo p\u0159i kop\u00edrov\u00e1n\u00ed jednoho velk\u00e9ho souboru stejn\u00e9ho objemu. Intenzita p\u0159\u00edstup\u016f na pevn\u00fd disk se tak\u00e9 v\u00fdrazn\u011b zvy\u0161uje, co\u017e celkov\u011b negativn\u011b ovliv\u0148uje v\u00fdkon cel\u00e9ho po\u010d\u00edta\u010de. P\u0159enos video dat ve form\u011b mal\u00fdch 10sekundov\u00fdch fragment\u016f rovn\u011b\u017e p\u0159isp\u00edv\u00e1 k vy\u0161\u0161\u00ed latenci motoru.<\/p>\n<p>Stru\u010dn\u011b shrneme v\u0161echny v\u00fdhody a nev\u00fdhody technologie HLS.<\/p>\n<p><b>V\u00fdhody HLS:<\/b><\/p>\n<ol>\n<li>Mo\u017enost pr\u00e1ce s jak\u00fdmikoli za\u0159\u00edzen\u00edmi. M\u016f\u017eete sledovat video na jak\u00e9mkoli modern\u00edm za\u0159\u00edzen\u00ed, a\u0165 u\u017e jde o smartphone, tablet, notebook nebo desktopov\u00fd po\u010d\u00edta\u010d. Hlavn\u00ed je, aby byl webov\u00fd prohl\u00ed\u017ee\u010d modern\u00ed verze a kompatibiln\u00ed s HTML5 a Media Source Extensions.<\/li>\n<li>Vynikaj\u00edc\u00ed kvalita obrazu. Pou\u017e\u00edvan\u00e1 funkce adaptivn\u00edho streamov\u00e1n\u00ed umo\u017e\u0148uje dynamicky m\u011bnit kvalitu p\u0159en\u00e1\u0161en\u00e9ho videa v z\u00e1vislosti na \u0161\u00ed\u0159ce p\u00e1sma internetov\u00e9ho p\u0159ipojen\u00ed, p\u0159i\u010dem\u017e algoritmus se sna\u017e\u00ed udr\u017eet kvalitu co nejvy\u0161\u0161\u00ed.<\/li>\n<li>Nen\u00ed nutn\u00e1 slo\u017eit\u00e1 konfigurace u\u017eivatelsk\u00e9ho za\u0159\u00edzen\u00ed.<\/li>\n<\/ol>\n<p>\n<b>Nev\u00fdhody:<\/b><\/p>\n<ol>\n<li>Omezen\u00e1 podpora pr\u00e1ce s motoru na n\u011bkter\u00fdch za\u0159\u00edzen\u00edch.<\/li>\n<li>Vysok\u00e9 zpo\u017ed\u011bn\u00ed p\u0159i p\u0159enosu obrazu.<\/li>\n<li>Siln\u00e9 zv\u00fd\u0161en\u00ed re\u017eijn\u00edch n\u00e1klad\u016f a slo\u017eitost optimalizace kv\u016fli pou\u017eit\u00ed soubor\u016f mal\u00e9ho form\u00e1tu. Kv\u016fli charakteristik\u00e1m kontejneru nikdy nedos\u00e1hneme zpo\u017ed\u011bn\u00ed men\u0161\u00edho ne\u017e velikost segmentu.<\/li>\n<\/ol>\n<p>\nNev\u00fdhody HLS p\u0159ev\u00e1\u017eily jeho v\u00fdhody a donutily n\u00e1s hledat alternativn\u00ed mo\u017enosti.<\/p>\n<h2>Co je to WebRTC<\/h2>\n<p>\n<img decoding=\"async\" alt=\"WebRTC a video surveillance: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer\" src=\"\/wp-content\/uploads\/2019\/04\/0cf3c13dba71f6b268113af77841e521.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n(<noindex>s<\/noindex>)<\/p>\n<p>Platforma WebRTC byla vyvinuta Googlem v roce 2011 pro p\u0159enos streamovan\u00e9ho video- a audio dat mezi prohl\u00ed\u017ee\u010di a mobiln\u00edmi aplikacemi s minim\u00e1ln\u00ed latenc\u00ed. K tomu se pou\u017e\u00edv\u00e1 standardn\u00ed protokol UDP a speci\u00e1ln\u00ed algoritmy pro \u0159\u00edzen\u00ed toku. Dnes je to projekt s otev\u0159en\u00fdm zdrojov\u00fdm k\u00f3dem, kter\u00fd je aktivn\u011b podporov\u00e1n Googlem a vyv\u00edjen.<\/p>\n<p>WebRTC je soubor technologi\u00ed pro peer-to-peer p\u0159enos video a zvuku. To znamen\u00e1, \u017ee nap\u0159\u00edklad prohl\u00ed\u017ee\u010de u\u017eivatel\u016f mohou pomoc\u00ed WebRTC p\u0159en\u00e1\u0161et data p\u0159\u00edmo mezi sebou, ani\u017e by pou\u017e\u00edvaly vzd\u00e1len\u00e9 servery pro ukl\u00e1d\u00e1n\u00ed a zpracov\u00e1n\u00ed dat. V\u0161echny informace jsou tak\u00e9 zpracov\u00e1v\u00e1ny prohl\u00ed\u017ee\u010di a mobiln\u00edmi aplikacemi koncov\u00fdch u\u017eivatel\u016f.<\/p>\n<p>Pohodl\u00ed a \u0161irok\u00e9 mo\u017enosti t\u00e9to technologie byly ocen\u011bny v\u00fdvoj\u00e1\u0159i v\u0161ech popul\u00e1rn\u00edch prohl\u00ed\u017ee\u010d\u016f. Dnes je podpora WebRTC realizov\u00e1na v Mozilla Firefox, Opera, Google Chrome (a ve v\u0161ech prohl\u00ed\u017ee\u010d\u00edch zalo\u017een\u00fdch na Chromiu), stejn\u011b jako v mobiln\u00edch aplikac\u00edch pro Android a iOS.<\/p>\n<p>Navzdory sv\u00fdm nesporn\u00fdm v\u00fdhod\u00e1m m\u00e1 WebRTC n\u011bkolik v\u00fdznamn\u00fdch nev\u00fdhod. <\/p>\n<h2>Obt\u00ed\u017enosti v\u00fdb\u011bru<\/h2>\n<p>\nTechnologie WebRTC je mnohem slo\u017eit\u011bj\u0161\u00ed na s\u00ed\u0165ov\u00e9 interakce, proto\u017ee se jedn\u00e1 o P2P. Je obt\u00ed\u017en\u00e9 ji ladit, testovat, m\u016f\u017ee se chovat nep\u0159edv\u00eddateln\u011b. Mus\u00edme p\u0159itom p\u0159ekon\u00e1vat NAT a firewall a zajistit fungov\u00e1n\u00ed v s\u00edt\u00edch, kde je blokov\u00e1n UDP.<\/p>\n<p>Implementaci WebRTC od Googlu je velmi obt\u00ed\u017en\u00e9 pou\u017e\u00edt. Existuje dokonce cel\u00e1 spole\u010dnost, kter\u00e1 poskytuje slu\u017eby v oblasti sestaven\u00ed SDK. Nav\u00edc bylo velmi obt\u00ed\u017en\u00e9 integrovat \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e od Googlu do na\u0161eho syst\u00e9mu tak, aby nedoch\u00e1zelo k p\u0159e kodov\u00e1n\u00ed ve\u0161ker\u00e9ho videa.<\/p>\n<p>Nicm\u00e9n\u011b jsme u\u017e dlouho cht\u011bli poskytnout u\u017eivatel\u016fm mo\u017enost pracovat s plnohodnotn\u00fdm \"\u017eiv\u00fdm\" videem a minimalizovat prodlevu obrazu na obrazovce od skute\u010dn\u00fdch ud\u00e1lost\u00ed. K tomu jsme m\u011bli tak\u00e9 p\u0159\u00e1n\u00ed u\u010dinit pou\u017e\u00edv\u00e1n\u00ed PTZ kamer pohodln\u011bj\u0161\u00edm, kde jsou zpo\u017ed\u011bn\u00ed kriticky d\u016fle\u017eit\u00e1.<\/p>\n<p>Vzhledem k tomu, \u017ee jin\u00e9 implementace boje proti zpo\u017ed\u011bn\u00edm zat\u00edm maj\u00ed omezenou funk\u010dnost a funguj\u00ed znateln\u011b h\u016f\u0159e, rozhodli jsme se pou\u017e\u00edt WebRTC. <\/p>\n<h2>Co jsme ud\u011blali<\/h2>\n<p>\n<img decoding=\"async\" alt=\"WebRTC a video surveillance: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer\" src=\"\/wp-content\/uploads\/2019\/04\/714f94de43114e552e4d818e9ec927ae.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nSpr\u00e1vn\u011b implementovat platformu WebRTC je nelehk\u00fd \u00fakol. Jak\u00fdkoli v\u00fdpo\u010det nebo nep\u0159esnost mohou v\u00e9st k tomu, \u017ee zpo\u017ed\u011bn\u00ed v p\u0159enosu videa se nejen\u017ee nesn\u00ed\u017e\u00ed ve srovn\u00e1n\u00ed s jin\u00fdmi platformami, ale mohou dokonce vzr\u016fst.<\/p>\n<p>Pro spr\u00e1vnou funkci WebRTC je v prvn\u00ed \u0159ad\u011b nutn\u00e9 prov\u00e9st technologickou modernizaci stacku pro pr\u00e1ci s webov\u00fdm videem. Co\u017e jsme tak\u00e9 ud\u011blali.<\/p>\n<p>Nejprve jsme implementovali sign\u00e1ln\u00ed protokol WebRTC p\u0159es Websocket a tak\u00e9 nasadili WebRTC peer-server v cloudu na z\u00e1klad\u011b SDK webrtc.org. Jeho \u00fakolem je distribuovat video streamy klientsk\u00fdm WebRTC peer\u016fm ve form\u00e1tu H.264 + Opus\/G.711 bez p\u0159ek\u00f3dov\u00e1n\u00ed videa.<\/p>\n<p>Vybrali jsme Websocket jako sign\u00e1ln\u00ed protokol, proto\u017ee ji\u017e m\u00e1 kvalitn\u00ed podporu ve v\u0161ech popul\u00e1rn\u00edch webov\u00fdch prohl\u00ed\u017ee\u010d\u00edch. D\u00edky tomu lze v\u00fdrazn\u011b sn\u00ed\u017eit nejen v\u00fdvojov\u00e9 n\u00e1klady, ale tak\u00e9 u\u0161et\u0159it \u010das a zdroje na opakovan\u00e9 TCP a TLS handshake oproti AJAXu.<\/p>\n<p>Zaj\u00edmav\u00e9 je, \u017ee WebRTC standardn\u011b neposkytuje sign\u00e1ln\u00ed protokol pot\u0159ebn\u00fd pro spr\u00e1vn\u00e9 nastaven\u00ed, podporu a ukon\u010den\u00ed videokomunikace v re\u00e1ln\u00e9m \u010dase mezi zdrojov\u00fdmi a klientsk\u00fdmi aplikacemi.<\/p>\n<p>Abychom mohli implementovat signaliza\u010dn\u00ed technologii, bylo t\u0159eba vyvinout vlastn\u00ed sign\u00e1ln\u00ed server s podporou n\u011bkolika webov\u00fdch protokol\u016f (Websocet, WebRTC). Tak\u00e9 s mo\u017enost\u00ed bezpe\u010dn\u00e9ho \u0159\u00edzen\u00ed relac\u00ed a notifikac\u00ed v re\u00e1ln\u00e9m \u010dase, spr\u00e1vy videa a mnoha dal\u0161\u00edch parametr\u016f.<\/p>\n<p>Omezen\u00ed P2P jsme p\u0159ekonali sn\u00ed\u017een\u00edm latence nikoli pomoc\u00ed P2P, ale pomoc\u00ed UDP a \u0159\u00edzen\u00ed toku zam\u011b\u0159en\u00e9ho na sn\u00ed\u017een\u00ed latence. To je tak\u00e9 zakotveno v WebRTC, proto\u017ee hlavn\u00edm p\u0159\u00edpadem pou\u017eit\u00ed jsou p2p hovory p\u0159es prohl\u00ed\u017ee\u010d.<\/p>\n<p>V mobiln\u00edm klientovi jsme implementovali p\u0159ehr\u00e1va\u010d s pou\u017eit\u00edm SDK webrtc.org, proto\u017ee pouze v tomto je spr\u00e1vn\u011b implementov\u00e1no \u0159\u00edzen\u00ed toku, existuj\u00ed v\u0161echny zn\u00e1m\u00e9 sch\u00e9mata Forward Error Correction (FEC) a spr\u00e1vn\u011b je implementov\u00e1n mechanismus op\u011btovn\u00e9ho odes\u00edl\u00e1n\u00ed paket\u016f pro v\u0161echny prohl\u00ed\u017ee\u010de. Nem\u00e9n\u011b d\u016fle\u017eit\u00e9 je, \u017ee SDK webrtc.org aktivn\u011b vyv\u00edj\u00ed Google.<\/p>\n<h2>Jak\u00fd je v\u00fdsledek implementace WebRTC?<\/h2>\n<p>\n<center><iframe loading=\"lazy\" width=\"560\" height=\"315\" src=\"https:\/\/vk.com\/video_ext.php\" frameborder=\"0\" allowfullscreen><\/iframe><\/center><br \/>\nPro sledov\u00e1n\u00ed \u017eiv\u00e9ho videa z kamer jsme do u\u017eivatelsk\u00e9ho rozhran\u00ed p\u0159idali nov\u00fd optimalizovan\u00fd p\u0159ehr\u00e1va\u010d zalo\u017een\u00fd na WebRTC. Zaji\u0161\u0165uje vysokou rychlost na\u010d\u00edt\u00e1n\u00ed videostreamu a zcela eliminuje probl\u00e9m s akumulac\u00ed latence s rostouc\u00edm \u010dasem sledov\u00e1n\u00ed.<\/p>\n<p>Po zaveden\u00ed podpory WebRTC v cloudov\u00e9 slu\u017eb\u011b Ivideon m\u016f\u017eeme s plnou d\u016fv\u011brou \u0159\u00edci, \u017ee nyn\u00ed maj\u00ed na\u0161i klienti k dispozici plnohodnotn\u00e9 \u017eiv\u00e9 video. Moment\u00e1ln\u011b zpo\u017ed\u011bn\u00ed p\u0159i p\u0159enosu videa nep\u0159esahuje jednu sekundu! Pro srovn\u00e1n\u00ed, p\u0159edchoz\u00ed HLS engine zaji\u0161\u0165oval dod\u00e1vku videa se zpo\u017ed\u011bn\u00edm 5-7 sekund. Rozd\u00edl ve rychlosti zobrazen\u00ed videa je velmi v\u00fdznamn\u00fd a u\u017eivatel si jej v\u0161imne ihned po zah\u00e1jen\u00ed pr\u00e1ce s na\u0161\u00edm videoservisem.<\/p>\n<p>Jak jsme p\u0159edpokl\u00e1dali, implementace nov\u00e9ho p\u0159ehr\u00e1va\u010de umo\u017enila zv\u00fd\u0161it responzivitu PTZ a hlasov\u00e9ho spojen\u00ed s kamerou.<\/p>\n<p><img decoding=\"async\" alt=\"WebRTC a video surveillance: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer\" src=\"\/wp-content\/uploads\/2019\/04\/b6775b11fbc6d97a7cede32cccc471ab.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nExistuje pouze jeden drobn\u00fd detail, na kter\u00fd se chceme zam\u011b\u0159it. Nov\u00fd WebRTC p\u0159ehr\u00e1va\u010d zat\u00edm funguje v testovac\u00edm re\u017eimu. A pr\u00e1v\u011b proto ho standardn\u011b nep\u0159ipojujeme v\u0161em na\u0161im klient\u016fm. M\u016f\u017eete si ho v\u0161ak aktivovat sami aktivac\u00ed odpov\u00eddaj\u00edc\u00edho bodu v nastaven\u00ed kamery (k tomu je nutn\u00e9 p\u0159ej\u00edt do <noindex><a rel=\"nofollow\" href=\"https:\/\/ru.ivideon.com\/my\/\">u\u017eivatelsk\u00e9ho rozhran\u00ed<\/a><\/noindex>).<\/p>\n<h2>Vlastnosti implementace WebRTC ve slu\u017eb\u011b Ivideon<\/h2>\n<p>\n<img decoding=\"async\" alt=\"WebRTC a video surveillance: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer\" src=\"\/wp-content\/uploads\/2019\/04\/247e640fa9334a0c144cc6b4296dc23b.jpeg\" style=\"display:block;margin: 0 auto;\" \/><br \/>\n<br \/>\nWebRTC je v sou\u010dasn\u00e9 dob\u011b st\u00e1le experiment\u00e1ln\u00ed technologie. Jej\u00ed podpora je\u0161t\u011b nen\u00ed spr\u00e1vn\u011b implementov\u00e1na ve v\u0161ech prohl\u00ed\u017ee\u010d\u00edch a u\u017eivatelsk\u00fdch za\u0159\u00edzen\u00edch, a tak\u00e9 ne ve v\u0161ech kamer\u00e1ch.<\/p>\n<p>T\u00edm p\u0159esn\u011b vysv\u011btlujeme, pro\u010d jsme zat\u00edm neu\u010dinili WebRTC p\u0159ehr\u00e1va\u010d hlavn\u00edm standardn\u00edm \u0159e\u0161en\u00edm pro v\u0161echny u\u017eivatele.<\/p>\n<p>Zat\u00edm doporu\u010dujeme pou\u017e\u00edvat WebRTC pouze v prohl\u00ed\u017ee\u010d\u00edch Google Chrome. Posledn\u00ed verze Firefoxu a Safari tak\u00e9 tuto technologii podporuj\u00ed, ale bohu\u017eel zat\u00edm nestabiln\u011b. <\/p>\n<p>Zat\u00edm jsme nezavedli podporu WebRTC pro prohl\u00ed\u017ee\u010de na mobiln\u00edch za\u0159\u00edzen\u00edch. Pokud nyn\u00ed vstoup\u00edte z mobiln\u00edho za\u0159\u00edzen\u00ed a aktivujete WebRTC, tento re\u017eim nebude fungovat. Nicm\u00e9n\u011b, WebRTC je sou\u010d\u00e1st\u00ed na\u0161ich mobiln\u00edch aplikac\u00ed pro <noindex><a rel=\"nofollow\" href=\"https:\/\/play.google.com\/store\/apps\/details?id=com.ivideon.client&amp;hl=ru\">Android<\/a><\/noindex> a <noindex><a rel=\"nofollow\" href=\"https:\/\/itunes.apple.com\/ru\/app\/%D0%B2%D0%B8%D0%B4%D0%B5%D0%BE%D0%BD%D0%B0%D0%B1%D0%BB%D1%8E%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5-ivideon\/id464234175?mt=8\">iOS<\/a><\/noindex>.<\/p>\n<p>A zavr\u0161uj\u00edc\u00edm bod\u011b na\u0161eho vypr\u00e1v\u011bn\u00ed o vlastnostech implementace WebRTC v na\u0161\u00ed slu\u017eb\u011b si je\u0161t\u011b zm\u00edn\u00edme dva drobn\u00e9 detaily.<\/p>\n<p>Za prv\u00e9, technologie je zam\u011b\u0159ena na p\u0159enos pr\u00e1v\u011b \u017eiv\u00e9ho videa v re\u00e1ln\u00e9m \u010dase. Pokud tedy nebude \u0161\u00ed\u0159ka p\u00e1sma va\u0161eho kan\u00e1lu dostate\u010dn\u00e1 pro p\u0159enos videa, v\u0161imnete si ztr\u00e1ty sn\u00edmk\u016f (s HLS si v\u0161imnete zamrznut\u00ed videa a zv\u00fd\u0161en\u00ed zpo\u017ed\u011bn\u00ed, av\u0161ak sn\u00edmky se neztrat\u00ed), video v\u0161ak bude st\u00e1le p\u0159en\u00e1\u0161eno v re\u00e1ln\u00e9m \u010dase.<\/p>\n<p>Za druh\u00e9, vzhledem k tomu, \u017ee technologie je ur\u010dena pro pr\u00e1ci s \u017eiv\u00fdm videem v re\u00e1ln\u00e9m \u010dase, nepou\u017e\u00edv\u00e1me ji pro pr\u00e1ci s archivn\u00edmi videodaty.<\/p>\n<h2>Dal\u0161\u00ed zm\u011bny v slu\u017eb\u011b<\/h2>\n<p>\nV sou\u010dasnosti Flash ji\u017e nen\u00ed sou\u010d\u00e1st\u00ed mechanismu automatick\u00e9ho v\u00fdb\u011bru enginu. Je mo\u017en\u00e9 jej st\u00e1le pou\u017e\u00edt, ale je nutn\u00e9 jej vybrat ru\u010dn\u011b v nastaven\u00ed \u00fa\u010dtu nebo kamery. Nen\u00ed to v m\u00f3d\u011b, ale podle statistik na\u0161eho servisu t\u00e9m\u011b\u0159 nez\u016fstali u\u017eivatel\u00e9, kte\u0159\u00ed by pracovali s Flashem. A pokus o ur\u010den\u00ed, zda jeho prohl\u00ed\u017ee\u010d podporuje, n\u00e1m zabere asi 2 sekundy cenn\u00e9ho \u010dasu. <\/p>\n<p>Zde je kr\u00e1tce o t\u011bch zm\u011bn\u00e1ch, kter\u00e9 v\u00e1s \u010dekaj\u00ed v na\u0161em cloudov\u00e9m syst\u00e9mu videodohledu a osobn\u00edm \u00fa\u010dtu. Z\u016fsta\u0148te s n\u00e1mi a sledujte novinky!<br \/>\n<br \/>Zdroj: <a content=\"nofollow\" rel=\"nofollow\" href=\"https:\/\/habr.com\/ru\/company\/ivideon\/blog\/449326\/\">habr.com<\/a><\/p>","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"excerpt":{"rendered":"<p>\u0421 \u043f\u0435\u0440\u0432\u044b\u0445 \u0434\u043d\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0430\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043e\u0439 \u043e\u0431\u043b\u0430\u0447\u043d\u043e\u0433\u043e \u0432\u0438\u0434\u0435\u043e\u043d\u0430\u0431\u043b\u044e\u0434\u0435\u043d\u0438\u044f \u043c\u044b \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439, \u0431\u0435\u0437 \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043d\u0430 Ivideon \u043c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0441\u0442\u0430\u0432\u0438\u0442\u044c \u043a\u0440\u0435\u0441\u0442 \u2013 \u044d\u0442\u043e \u0431\u044b\u043b \u043d\u0430\u0448 \u042d\u0432\u0435\u0440\u0435\u0441\u0442, \u0432\u043e\u0441\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u0435 \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u0442\u043d\u044f\u043b\u043e \u0443\u0439\u043c\u0443 \u0441\u0438\u043b, \u043d\u043e \u0441\u0435\u0439\u0447\u0430\u0441 \u043c\u044b, \u043d\u0430\u043a\u043e\u043d\u0435\u0446-\u0442\u043e, \u0432\u043e\u0442\u043a\u043d\u0443\u043b\u0438 \u043b\u0435\u0434\u043e\u0440\u0443\u0431 \u0432 \u043c\u0430\u043a\u0443\u0448\u043a\u0443 \u043a\u0440\u043e\u0441\u0441\u043f\u043b\u0430\u0442\u0444\u043e\u0440\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0440\u0435\u0431\u0443\u0441\u0430. \u0421\u0438\u0441\u0442\u0435\u043c\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0438 \u0437\u0432\u0443\u043a\u0430 \u0438 \u0432\u0438\u0434\u0435\u043e \u0447\u0435\u0440\u0435\u0437 \u0418\u043d\u0442\u0435\u0440\u043d\u0435\u0442 \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u0430 \u0437\u0430\u0432\u0438\u0441\u0435\u0442\u044c \u043e\u0442 \u043e\u0431\u043e\u0440\u0443\u0434\u043e\u0432\u0430\u043d\u0438\u044f, Web-\u043a\u043b\u0438\u0435\u043d\u0442\u043e\u0432 [&hellip;]<\/p>\n","protected":false,"gt_translate_keys":[{"key":"rendered","format":"html"}]},"author":1,"featured_media":24131,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[688],"tags":[],"class_list":["post-32314","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-administrirovanie"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.3 - aioseo.com -->\n\t<meta name=\"description\" content=\"\u0421 \u043f\u0435\u0440\u0432\u044b\u0445 \u0434\u043d\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0430\u0434.\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Yuri Gagarin\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/webrtc-i-videonablyudenie-kak-my-pobedili-zaderzhku-video-s-kamer\" \/>\n\t\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.3\" \/>\n\t\t<meta property=\"og:locale\" content=\"cs_CZ\" \/>\n\t\t<meta property=\"og:site_name\" content=\"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"\ud83e\udd47WebRTC \u0438 \u0432\u0438\u0434\u0435\u043e\u043d\u0430\u0431\u043b\u044e\u0434\u0435\u043d\u0438\u0435: \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u0431\u0435\u0434\u0438\u043b\u0438 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u0443 \u0432\u0438\u0434\u0435\u043e \u0441 \u043a\u0430\u043c\u0435\u0440 | ProHoster\" \/>\n\t\t<meta property=\"og:description\" content=\"\u0421 \u043f\u0435\u0440\u0432\u044b\u0445 \u0434\u043d\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0430\u0434.\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/webrtc-i-videonablyudenie-kak-my-pobedili-zaderzhku-video-s-kamer\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg\" \/>\n\t\t<meta property=\"og:image:width\" content=\"350\" \/>\n\t\t<meta property=\"og:image:height\" content=\"350\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2019-10-31T18:46:17+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2019-10-31T18:46:17+00:00\" \/>\n\t\t<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<meta property=\"article:author\" content=\"https:\/\/www.facebook.com\/prohoster\" \/>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"\ud83e\udd47WebRTC a videodohled: jak jsme p\u0159ekonali zpo\u017ed\u011bn\u00ed videa z kamer | ProHoster","description":"Od prvn\u00edch dn\u016f pr\u00e1ce nad.","canonical_url":"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/webrtc-i-videonablyudenie-kak-my-pobedili-zaderzhku-video-s-kamer","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":null,"og:locale":"cs_CZ","og:site_name":"ProHoster | \u041a\u0443\u043f\u0438\u0442\u044c \u043d\u0430\u0434\u0435\u0436\u043d\u044b\u0439 \u0445\u043e\u0441\u0442\u0438\u043d\u0433 \u0434\u043b\u044f \u0441\u0430\u0439\u0442\u043e\u0432 \u0441 \u0437\u0430\u0449\u0438\u0442\u043e\u0439 \u043e\u0442 DDoS, VPS VDS \u0441\u0435\u0440\u0432\u0435\u0440\u044b","og:type":"article","og:title":"\ud83e\udd47WebRTC \u0438 \u0432\u0438\u0434\u0435\u043e\u043d\u0430\u0431\u043b\u044e\u0434\u0435\u043d\u0438\u0435: \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u0431\u0435\u0434\u0438\u043b\u0438 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u0443 \u0432\u0438\u0434\u0435\u043e \u0441 \u043a\u0430\u043c\u0435\u0440 | ProHoster","og:description":"\u0421 \u043f\u0435\u0440\u0432\u044b\u0445 \u0434\u043d\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b \u043d\u0430\u0434.","og:url":"https:\/\/prohoster.info\/cs\/blog\/administrirovanie\/webrtc-i-videonablyudenie-kak-my-pobedili-zaderzhku-video-s-kamer","og:image":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:secure_url":"https:\/\/prohoster.info\/wp-content\/uploads\/2021\/11\/logo-350.jpg","og:image:width":350,"og:image:height":350,"article:published_time":"2019-10-31T18:46:17+00:00","article:modified_time":"2019-10-31T18:46:17+00:00","article:publisher":"https:\/\/www.facebook.com\/prohoster","article:author":"https:\/\/www.facebook.com\/prohoster"},"aioseo_meta_data":{"post_id":"32314","title":null,"description":null,"keywords":null,"keyphrases":null,"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":null,"og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"","isEnabled":true},"graphs":[]},"schema_type":null,"schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":null,"robots_max_videopreview":null,"robots_max_imagepreview":"large","priority":null,"frequency":null,"local_seo":null,"seo_analyzer_scan_date":"2026-01-21 10:17:20","breadcrumb_settings":null,"limit_modified_date":false,"reviewed_by":null,"ai":null,"created":"2021-02-28 17:17:44","updated":"2026-01-21 10:17:20","focus_keyword":null,"additional_keywords":null,"truseo_locale":null},"gt_translate_keys":[{"key":"link","format":"url"}],"_links":{"self":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts\/32314","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/comments?post=32314"}],"version-history":[{"count":0,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/posts\/32314\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/media\/24131"}],"wp:attachment":[{"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/media?parent=32314"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/categories?post=32314"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/prohoster.info\/cs\/wp-json\/wp\/v2\/tags?post=32314"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}