Instalacija WEBRTC-a. Kako organizirati WEBRTC Online Broadcast pomoću web-kamere i VPS poslužitelja. Povezivanje novog korisnika

WEBRTC (Web Real Time Communications) je standard koji opisuje prijenos streaming audio podataka, video podataka i sadržaja iz preglednika i na preglednik u realnom vremenu bez instaliranja dodataka ili drugih proširenja. Standard vam omogućuje da pretvorite preglednik u terminalni terminal video konferencije, samo otvorite web-stranicu za početak komuniciranja.

Što je WeBrrtc?

U ovom članku, mi ćemo razmotriti sve što trebate znati o WEBRTC tehnologiji za običnog korisnika. Razmotrite prednosti i nedostatke projekta, otkrivaju neke tajne, reći ćemo vam kako to radi, gdje i što se primjenjuje WebRTC.

Što trebate znati o WeBrTC-u?

Evolucija standarda i tehnologija Video Communications

Sergej Yutzaytis, Cisco, video + konferencija 2016

Kako WebTRTC radi

Na strani klijenta

  • Korisnik otvara stranicu koja sadrži HTML5 oznaku
  • Preglednik traži pristup web-kamere i korisničkog mikrofona.
  • JavaScript kod na stranici korisnika kontrolira parametre veze (IP adrese i WebTC poslužitelj ili drugi korisnici WebTC) za zaobilaženje NAT-a i vatrozida.
  • Prilikom primanja informacija o sugovorniku ili potoku s konferencijom, preglednik počinje odgovarati audio i video kodecima koji se koriste.
  • Počinje proces kodiranja i prijenosa streaming podataka između WEBRTC klijenata (u našem slučaju, između preglednika i poslužitelja).

Na strani WEBRTC poslužitelja

Za razmjenu podataka između dva sudionika, video poslužitelj nije potreban, ali ako trebate kombinirati nekoliko sudionika na jednoj konferenciji, poslužitelj je potrebno.



Video poslužitelj će dobiti medijski promet iz različitih izvora, pretvoriti ga i poslati ga korisnicima koji koriste WEBRTC kao terminal.

Također, WEBRTC poslužitelj će dobiti medijski promet iz WebTC Peters i transferirati na sudionike konferencije koji koriste aplikacije za stolna računala ili mobilne uređaje, ako ih ima.

Prednosti standarda

  • Nije potrebna instalacija.
  • Vrlo kvalitetna komunikacija zbog:
    • Korištenje modernog videozapisa (VP8, H.264) i audio kodeka (opus).
    • Automatsko podešavanje kvalitete potoka pod uvjetom priključka.
    • Ugrađeni ECHO i sustav smanjenja buke.
    • Automatsko podešavanje osjetljivosti mikrofona sudionika (ARU).
  • Visoka sigurnost: Svi priključci su zaštićeni i šifrirani prema TLS i SRTP protokolima.
  • Postoji ugrađeni mehanizam za hvatanje sadržaja, kao što je desktop.
  • Sposobnost implementacije bilo kojeg HTML5 i JavaScript upravljačkog sučelja.
  • Sposobnost integriranja sučelja s bilo kojim stražnjim sustavima pomoću web-mjesta.
  • Projekt otvorenog koda - može se implementirati u vašem proizvodu ili usluzi.
  • Real Cross-Platform: ista WebTC aplikacija će raditi jednako dobro na bilo kojem operativnom sustavu, radnoj površini ili mobilnom telefonu, pod uvjetom da preglednika podržava WebTC. To značajno štedi resurse za razvoj softvera.

Nedostaci standarda

  • Za organizaciju grupnog audio i video konferencije, potreban je VSK poslužitelj, koji bi pomiješao videozapis i zvuk od sudionika, jer Preglednik ne zna kako međusobno sinkronizirati nekoliko dolaznih tokova.
  • Sve WebTC rješenja su nespojive, jer Standardno opisuje samo metode prijenosa videozapisa i zvuka, ostavljajući implementaciju metoda adresiranja pretplatnika, praćenjem njihove dostupnosti, poruka i datoteka, planiranja i drugog dobavljača.
  • Drugim riječima, nećete moći pozvati iz WebTC primjene jednog developera u WebTC primjeni drugog programera.
  • Miješanje grupnih konferencija zahtijeva velike računalne resurse, tako da ova vrsta videopoziva zahtijeva kupnju plaćene pretplate ili ulaganja u njezinu infrastrukturu, gdje je za svaku konferenciju potrebna 1 fizička jezgra modernog procesora.

WebRTC Secrets: Kako dobavljači imaju koristi od proboja web tehnologije


Tsakhi Levi, Bloggeek.me, Video + konferencija 2015

WEBRTC za tržište VKS

Povećanje broja VSK terminala

WEBRTC tehnologija je imala snažan utjecaj na razvoj tržišta VKK-a. Nakon napuštanja prvih preglednika s podrškom za WEBRTC u 2013. godini, potencijalni broj terminala videokonferencija diljem svijeta odmah se povećao za 1 milijardu uređaja. U biti, svaki preglednik je postao CSM terminal, a ne inferiorniji od svojih hardverskih analoga s točke gledišta ponude.

Koristiti u specijaliziranim rješenjima

Koristeći razne JavaScript knjižnice i WebTC Cloud Service API omogućuje jednostavno dodavanje podrške za video veze na bilo koji web projekti. Prethodno, za prijenos podataka u programerima u stvarnom vremenu, bilo je potrebno proučiti načela protokola i koristiti razvoj drugih tvrtki koje su najčešće tražili dodatno licenciranje, što povećava troškove. Već, WebTC se aktivno koristi u "Poziv", "Online chat podrška", itd.

Ex-korisnici Skype za Linux

U 2014. Microsoft je najavio prestanak projekta Skype projekta Linux, koji je izazvao veliku iritaciju od IT stručnjaka. Tehnologija WebRTC-a nije vezana za operativni sustav i provodi se na razini preglednika, tj. Linux korisnici će moći vidjeti proizvode i usluge na temelju WEBRTC Full-Fundped Skype zamjena.

Natjecanje s bljeskalicom.

WEBRTC i HTML5 postali su fatalni udarac za flash tehnologiju, koji i tako zabrinuti za njihov daleko od najboljih godina. Od 2017. vodeći preglednici službeno su prestali podržavati bljesak i tehnologija je konačno nestala s tržišta. Ali morate dati bljeskalicu zbog svega što je onaj koji je stvorio web konferencijsko tržište i predložio tehničke mogućnosti za živu komunikaciju u preglednicima.

Video prezentacija WebTC.

Dmitry Odintsov, TrueConf, Video + konferencija Listopad 2017

Kodeci u Webrertcu.

Audio kodek

Za komprimiranje audio prometa u WEBRTC-u se koriste Opus i G.711 kodeci.

G.711. - Najstariji glasovni kodek s visokom brzinom prijenosa (64 kbps), koji se najčešće koristi u tradicionalnim telefonskim sustavima. Glavna prednost je minimalno računalno opterećenje zbog uporabe algoritmi kompresije svjetlosti. Kodek karakterizira niska razina kompresije glasovnih signala i ne čini dodatno kašnjenje zvuka tijekom komunikacije između korisnika.

G.711 je podržan velikim brojem uređaja. Sustavi u kojima se ovaj kodek koristi je lakše u uporabi od onih koji se temelje na drugim audio kodovima (G.723, G.726, G.728, itd.). U pogledu kvalitete G.711, procijenjeno je na 4.2 u MOS testiranju (procjena u rasponu od 4-5 je najviša i znači dobra kvaliteta, slična kvaliteti prijenosa glasovnog prometa u ISDN-u, pa čak i više).

Opus. - Ovo je kodek s niskim kašnjenjem kodiranja (2.5 MS do 60 ms), podršku za promjenjivu bitratu i visoku razinu kompresije, koja je idealna za prijenos streaming audio signala u mrežama s promjenjivom propusnošću. Opus je hibridno rješenje koje kombinira najbolje karakteristike svilenih kodeka (kompresija glasa, rješavanje izobličenja ljudskog govora) i kalena (kodiranje audio podataka). Kodek je u slobodnom pristupu, programeri koji ga koriste, ne moraju platiti odbitke u vlasnicima autorskih prava. U usporedbi s drugim audio kodovima, opus, nesumnjivo pobjeđuje u mnogim pokazateljima. Pomicao je prilično popularne kodeke s niskim bitratom, kao što je MP3, Vorbis, AAC LC. Opus vraća najviše blizu izvorne "slike" zvuka od Amr-WB i Speex. Iza tog kodeka - budućnosti, zbog čega su i WebTC tehnologije uključili u obveznu ponudu podržanih audiostandarts.

Video kodek

Odabir video kodek za WEBRTC je trajao nekoliko godina od programera, kao rezultat toga, odlučili smo koristiti H.264 i VP8. Gotovo svi moderni preglednici podržavaju i kodeke. Video konferencijski poslužitelji za rad s WEBRTC-om dovoljno podržavaju samo jedan.

VP8. - Besplatni video kodiran s otvorenom licencom, odlikuje se velikom brzinom dekodiranja video toka i povećane otpornosti na gubitak okvira. Kodek je univerzalan, lako je uvesti u hardverske platforme, tako da vrlo često programeri video konferencijskih sustava ga koriste u svojim proizvodima.

Plaćeni video kodek H.264. Postao je poznat mnogo ranije nego njegov kolega. Ovo je kodek s visokim stupnjem kompresije video stream uz održavanje visokokvalitetnog videa. Visoka prevalencija ovog kodeka među video konferencija hardverskih sustava uključuje njegovu uporabu u STREBTC standardu.

Google i Mozilla aktivno promoviraju VP8 kodek i Microsoft, Apple i Cisco - H.264 (kako bi se osigurala kompatibilnost s tradicionalnim video konferencijskim sustavima). I ovdje je vrlo veliki problem za programere Cloud WebTC rješenja, jer ako na konferenciji svi sudionici koriste jedan preglednik, konferencija je dovoljna za miješanje jednom s jednim kodekom, a ako postoje različiti preglednici i postoje safari / rub Preglednici, tada će konferencija morati biti kodirana dvostruko različita kodek, koja će udvostručiti zahtjeve sustava za medijskog poslužitelja i, kao rezultat toga, troškove pretplate na usluge WEBRTC-a.

WebRTC API.

WEBRTC tehnologija temelji se na tri glavna API-ja:

  • (Odgovoran za prihvaćanje audio i video signala web-preglednika s fotoaparata ili radne površine korisnika).
  • RTCPeerkonnection. (Odgovoran za povezivanje između preglednika za "razmjenu" primljene od fotoaparata, mikrofona i radne površine, multimedants. Također u "dužnosti" ovog API-ja ulazi u obradu signala (čišćenje izvana, podešavanje glasnoće mikrofona) i kontrolu nad kontrolom koristi se audio i video kodove).
  • RTCDATA kanal (Pruža bilateralni prijenos podataka putem uspostavljene veze).

Prije nego što pristupite mikrofon i korisničkom fotoaparatu, preglednika traži dopuštenje. U Google Chromeu možete unaprijed podesiti u odjeljku "Postavke", u Opera i Firefox, odabir uređaja se provodi izravno u trenutku pristupa, s padajućeg popisa. Zahtjev za rješavanje će se uvijek pojaviti prilikom korištenja HTTP protokola i jednom ako koristite HTTPS:


RTCPeerkonnection., Svaki preglednik koji sudjeluje u konferenciji WebTC-a mora imati pristup ovom objektu. Zahvaljujući korištenju RTCPeerkonnection, Mediaden iz jednog preglednika može se koristiti čak i putem NAT i mrežnih ekrana. Da biste uspješno prenijeli medijske dijelove, sudionici bi trebali razmjenjivati \u200b\u200bsljedeće podatke pomoću prijevoza, kao što su web utičnice:

  • sudionik inicijatora šalje drugi sudionik ponude-SDP-a (strukturu podataka, s karakteristikama protoka medija, koje će prenijeti);
  • drugi sudionik čini "odgovor" - Odgovor-SDP i proslijedi ga na inicijator;
  • tada je razmjena kandidata leda organizirana između sudionika, ako je bilo koji (ako sudionici iza NAT ili mrežnih ekrana).

Nakon uspješnog završetka ove razmjene između sudionika, prijenos medijskih izvedbi (audio i video) organizira se izravno.

RTCDATA kanal, Podrška protokola s podatkovnim kanalom pojavila se u preglednicima relativno nedavno, stoga se ovaj API može promatrati isključivo u slučajevima korištenja WEBRTC-a u Mozilla Firefox 22+ i Google Chrome 26+ preglednika. Uz to, sudionici mogu dijeliti tekstualne poruke u pregledniku.

Povezivanje webRTC-a.

Podržani desktop preglednici

  • Google Chrome (17+) i svi preglednici na temelju kromijevog motora;
  • Mozilla Firefox (18+);
  • Opera (12+);
  • Safari (11+);

Podržani mobilni preglednici za Android

  • Google Chrome (28+);
  • Mozilla Firefox (24+);
  • Operna mobilna (12+);
  • Safari (11+).

WEBRTC, Microsoft i Internet Explorer

Već dugo vremena Microsoft je čuo tišinu o WebTC podršci u programu Internet Explorer iu svom novom rubu preglednik. Dečki iz redmonda zapravo ne vole daju tehnologije korisnicima da ne kontroliraju, to je takva politika. Ali postupno se slučaj pomaknuo iz mrtve točke, jer WIBRTC je dalje bilo nemoguće ignorirati, a projekt ORTC izveden iz standarda WebTC-a je najavljen.

Prema programerima, ORTC je produžetak Standarda WIBRTC-a s poboljšanim skupom JavaScript-based API i HTML5, koji je preveden u normalan jezik znači da će sve biti isti, samo za kontrolu standarda i njegov će razvoj biti Microsoft , a ne Google. Skup kodeka proširuje se podrškom za H.264 i neke audio kodove serije G.7xx koji se koristi u telefonije i hardverskim VSK sustavima. Može se pojaviti ugrađena podrška za RDP (za prijenos sadržaja) i poruka. Usput, korisnici programa Internet Explorer nisu sretni, ORTC podrška će biti samo na rubu. Pa, naravno, takav se skup protokola i kodeka s niskom krvlju umetnut je s Skype za poslovanje, koji otvara još više poslovnih aplikacija za WEBRTC.

Svrha ovog članka je na demonstracijskom uzorku peer video chat (P2P video chat) kako bi se upoznali sa svojom strukturom i načelom rada. U tu svrhu koristimo višekorisnički demonstracijski uzorak webrtc.io-demo videa chat. Može se preuzeti referencom: https://githeb.com/webrtc/webrtc.io-demo/tree/master/site.

Treba napomenuti da je Github web stranica ili web usluga za zajednički razvoj web projekata. Na informacijskim programima mogu staviti kodove svojih događaja, raspraviti ih i komunicirati jedni s drugima. Osim toga, neke velike IT tvrtke stavljaju svoje službene spremišta na ovim stranicama. Usluga je besplatna za open source projekte. Github je spremište knjižnica knjižnica, besplatan izvor.

Dakle, preuzeto iz GitHub A demonstracijski uzorak vršnjačkog video chat, za postavljanje na disku s osobnim računalom u izrađenom direktoriju za našu aplikaciju "Webrtc_demo".


Sl. jedan

Kako slijedi iz strukture (sl. 1), vršnjački videochat se sastoji od klijentski skripte.js i Server Server.js skripte implementirane u JavaScript programskom jeziku. Skripta (knjižnica) WEBRTC.IO.js (klijent) - pruža u stvarnom vremenu komunikacije između preglednika peer-to-name: "klijent klijent" i webrertc.js (klijent) i webrertc.js (poslužitelj), Korištenje WebSocket Protocol, navedite obostranu vezu između preglednika i web poslužitelja klijenta-poslužitelja.

Skripta webrtc.io.js (poslužitelj) ulazi u knjižnicu webrtc.io i nalazi se u node_modules chebrtc.io. Sučelje index.html video chat se implementira na HTML5 i CSS3. Sadržaj datoteka aplikacije WebTC_DEMO može se vidjeti jedan od HTML urednika, kao što je "Notepad ++".

Princip video razgovora će se provjeriti u PC datotečnom sustavu. Za pokretanje poslužitelja (server.js) na računalu morate postaviti node.js Runtime. Node.js vam omogućuje da pokrenete JavaScript izvan preglednika. Možete preuzeti Node.js po referenci: http://nodejs.org/ (verzija v0.10,13 dana 07/15/13). Na glavnoj stranici web-lokacije Node.org kliknite na gumb Preuzmi i idite na http://nodejs.org/download/. Za Windows korisnike, prvo download win.installer (.msi), a zatim pokrenite Win.installer (.msi) na računalu i instalirajte nodejs i "NPM paket manager" u direktoriju programa.




Sl. 2.

Dakle, nede.js se sastoji od razvoja i izvršenja JavaScript koda, kao i iz skupa interne modula koji se mogu instalirati pomoću NPM paketa upravitelja ili upravitelja.

Da biste instalirali module, potrebno je izvršiti naredbu na naredbenoj liniji iz imenika aplikacije (na primjer, "webrtc_demo): nPM Instalirajte ime_module, Tijekom instalacije moduli NPM upravitelja stvaraju mapu Node_modules u direktoriju s kojeg je izvedena instalacija. U procesu rada, Nodejs automatski povezuje module iz imenika Node_modules.

Dakle, nakon instalacije node.js otvaramo naredbeni redak i ažuriramo Express modul u mape mape Node_modules WeBrrtc_demo pomoću upravitelja NPM paketa:

C: webrtc_demo\u003e NPM instalirati Express

Express Modul je web okvir za node.js ili web platformu za razvoj aplikacija. Da biste imali globalni pristup Express, možete ga postaviti na ovaj način: nPM Instalacija -G Express.

Tada ću ažurirati Webtc.io modul:

C: webrtc_demo\u003e NPM instalirati webrertc.io

Zatim u naredbenom retku pokrenite poslužitelj: Server.js:

C: webrtc_demo\u003e čvor poslužitelj.js


Sl. 3.

Sve, poslužitelj uspješno radi (slika 3). Sada, pomoću web-preglednika, možete kontaktirati poslužitelj preko IP adrese i preuzeti web stranicu index.html s kojom će web preglednik preuzeti kod klijenta skriptu - script.js i kod WebTC.io. JS kod skripti, i obavite ih. Za rad video chat (za ugradnju veze između dva preglednika), potrebno je iz dva preglednika koja podržavaju WEBRTC, kontaktirajte IP adresu na poslužitelj signala koji radi na node.js.

Kao rezultat toga, sučelje klijentskog dijela komunikacijske aplikacije (video chat) otvara se pomoću zahtjeva za rješavanje pristupa komori i mikrofon (slika 4).



Sl. četiri

Nakon što kliknete na gumb "Dopusti", kamera i mikrofon za multimedijsku komunikaciju su povezani. Osim toga, putem video chat sučelja može se priopćiti s tekstualnim podacima (sl. 5).



Sl. pet

Treba napomenuti da. Poslužitelj je alarm i uglavnom je dizajniran za postavljanje veze između korisničkih preglednika. Za Server Server.js Server skriptu, pružajući WEBRTC alarmi, koristi node.js.

Preambula. P2P video chat na bazi Webrertc. - Ovo je alternativa Skype i drugim sredstvima komunikacije. Osnovni elementi P2P video chat temeljen na WEBRTC je preglednika i kontaktirajte poslužitelja. P2P Video - to su vršnjački videozapisi u kojima poslužitelj ne sudjeluje u prijenosu tokova informacija. Informacije se prenose izravno između preglednika korisnika (Pirongs) bez dodatnih programa. Osim preglednika u P2P video uzorcima, služe kontaktirajte, koji su dizajnirani za registraciju korisnika, pohranjivanje podataka o njima i osiguravanju prebacivanja između korisnika. Preglednici koji podržavaju najnovije WebTC i HTML5 tehnologije pružaju prijenos trenutnih tekstualnih poruka i datoteka, kao i pružaju glasovnu i video komunikaciju u IP mrežama.

Dakle, chat sobe, web chate, glasovni i video chat u web sučelju, IMS, VoIP su usluge koje pružaju komunikaciju putem kompozitnih mreža s kompozitnim mrežama s prebacivanjem. U pravilu, komunikacijske usluge zahtijevaju ili instaliraju korisničke aplikacije na korisničke uređaje (računala, pametne telefone, itd.), Ili instaliranje dodataka i proširenja u preglednicima. Usluge imaju vlastite komunikacijske mreže, od kojih je većina izgrađena na arhitekturi klijent-poslužitelja.

Komunikacijske usluge su aplikacije, uz iznimku IMS-a, u kojima se ne integriraju glasovi, video, podaci i tekstualni kanali. U mrežama svake usluge primjenjuju se. Treba napomenuti da ove aplikacije ne mogu istovremeno raditi u nekoliko komunikacijskih mreža, tj. Aplikacije, u pravilu, ne mogu međusobno djelovati, kao rezultat kojih se mora instalirati zasebna prijava za svaku komunikacijsku mrežu.

Problem integriranja komunikacijskih usluga u stvarnom vremenu (chat, telefon, video konferencija), tj. Integriranje kanala za prijenos glasa, video, podatke i pristup njima koristeći jednu aplikaciju (preglednik) može se riješiti u peer-to-peer ili p2P videosfaty (Piring, točka - to - točka) na temelju webrertc protokol, U stvari, preglednik koji podržava WebTC postaje jedno sučelje za sve korisničke uređaje (PC, pametne telefone, iPads, IP telefoni, mobilni telefoni, itd.) Koji rade s komunikacijskim uslugama.

To je WEBRTC koji pruža implementacije u pregledniku svih tehnologija koje pružaju komunikaciju u stvarnom vremenu. Suština P2P video chatova je da se multimedijalni i tekstualni podaci prenose izravno između korisničkih preglednika (udaljenog peering) bez sudjelovanja poslužitelja i dodatnih programa. Dakle, preglednici ne samo da omogućuju pristup gotovo svim internetskim informacijskim resursima koji su pohranjeni na poslužiteljima, ali i postaju sredstvo za pristup svim komunikacijskim službama u stvarnom vremenu i poštanskim uslugama (glasovna pošta, e-mail, SMS, itd.)

Poslužitelji (Kontaktni poslužitelji) P2P video uzorci su namijenjeni samo za korisnike registracije, pohranjivanje korisničkih podataka i postavljanje veze (prebacivanje) između preglednika korisnika. Prvi P2P videaties su implementirani pomoću flash tehnologija. Flash P2P Video Sits primjenjuju, na primjer, na društvenim mrežama. Bljesak P2P Videosp ne pružaju visokokvalitetni multimedijski prijenos podataka. Osim toga, za izlaz glasa i video stream iz mikrofona i kamkordera u P2P Flash Video telefonima, potreban je Flash plug-in u web-preglednik.

Ali telekomunikacijske usluge nove generacije uključuju web komunikacijekoji se koriste samo za komunikaciju putem Interneta preglednici i kontaktni poslužiteljiPotporan webRTC protokoli i specifikacija Html5., Bilo koji korisnički uređaj (PC, iPad, pametni telefoni itd.), Opremljeni s takvim preglednikom, mogu pružiti visokokvalitetne glasovne i video pozive, kao i prijenos trenutnih tekstualnih poruka i datoteka.

Dakle, nova tehnologija web komunikacija (P2P chats, video chats) je WebTC protokol. WEBRTC u kombinaciji s HTML5, CSS3 i JavaScriptom omogućuju vam da stvorite razne web aplikacije. WebRT je dizajniran za organiziranje web komunikacija (vršnjačka mreža) u stvarnom vremenu od strane peer-to-peer arhitekture. P2P WEBRTC-based chat sobe pružaju prijenos datoteka, kao i tekstualne, glasovne i videozapise korisnike putem Interneta koristeći samo web-preglednike bez korištenja vanjskih dodataka i dodataka u pregledniku.

U P2P chatovima, poslužitelj se koristi samo za instaliranje P2P spojeva između dva preglednika. Za stvaranje klijentskog dijela P2P chat na Webs3 i JavaScript, CSS3 i JavaScript protokol. Aplikacija klijent komunicira s preglednicima kroz WIBRTC API.

WEBRTC provode tri JavaScript API:

  • Rtcpeerconnection;
  • MediaStream (GetuserMedia);
  • Rtcdatachannel.

Preglednici prenose multimedijske podatke na SRTP protokolu koji radi preko UDP-a. Budući da NAT stvara probleme za preglednike (klijente) koji se nalaze iza NAT usmjerivača koji koriste P2P veze putem Interneta, omamljivanje se koristi za puzanje nat. Stun je klijent-poslužitelj protokol koji radi preko UDP transportnog protokola. U P2P chatovima, u pravilu se primjenjuje javni Stun Server, a informacije primljene od njega koriste se za UDP veze između dva preglednika ako su za NAT.

Primjeri implementacije WEBRTC aplikacija (P2P chat sobe, glasovne i video web chate):
1. P2P video chat bistri (video chat s jednim klikom, P2P chat), izrađen na temelju WEBRTC-a, može se otvoriti na Bistri. Bistri radi u pregledniku bez postavljanja dodatnih programa i dodataka. Suština rada je sljedeća: Otvorite P2P video chat na određenoj vezi, nakon registracije u sučelju koje se otvara, pozvati partnere, a zatim s popisa Peer klijenta odaberite partnera koji je na mreži i kliknite na " Gumb za video pozive.

Kao rezultat toga, MediaStream (GetuserMedia) će uhvatiti mikrofon + web kamere, a poslužitelj će izvršiti razmjenu signalnih poruka s odabranim partnerom. Nakon razmjene poruka signala, API PeerkNection kreira kanale za prijenos glasovnih i video toka. Osim toga, bistri prenosi trenutne tekstualne poruke i datoteke. Na sl. 1 prikazuje bistri video chat p2p sučelje screenshot.


Sl. 1. P2P video chat bistri

2. Twelephone (P2P video chat, P2P Chat, SIP TWELEPHONE) - Ova klijentska aplikacija je izgrađena na HTML5 i WEBRTC bazi, što vam omogućuje da izvode glasovne i video pozive, kao i prenose trenutne tekstualne poruke, tj. Twilephone uključuje test P2P chat, video chat i gup twelephone. Treba napomenuti da Twelephone podržava SIP protokol i sada možete izraditi i primati glasovne i video pozive iz SIP telefona pomoću vašeg Twitter računa kao telefonskog broja. Osim toga, tekstualne poruke možete unijeti glasom kroz mikrofon, a program za prepoznavanje glasa ulazi u tekst u nizu "Pošalji poruku".

Twayphone je web-telefonija koja funkcionira na temelju Google Chrome preglednik, počevši od verzije 25, bez dodatnog softvera. Twayphone je razvio Chris Matthieu. Dio poslužitelja TWUEPHONE se temelji na node.js. Poslužitelj (Kontakt poslužitelj) koristi se samo za instaliranje P2P veza između dva preglednika ili WebTC klijenata. Aplikacija Twelephone nema vlastitih alata za autorizaciju i fokusiran na povezivanje s računom (račun) u Twitteru.

Na sl. 2 je screenshot Twelephone video chat P2P sučelja.



Sl. 2. P2P TWELEPHONE

3. Grupa P2P video chat razgovor.IO se temelji na najnovijim WebTC i HTML5 tehnologijama. Razgovor s video chat temelji se na Simplewebrtc knjižnici i dizajniran je za komunikaciju do 6 klijenata od peer u jednoj prostoriji (za komunikaciju, navedite naziv zajedničke prostorije za vršnjačke klijente u "Nazivi razgovora" redak). P2P Video chat razgovor pruža komunikacijske usluge korisnicima bez registracije na kontakt poslužitelju. Na sl. 3 je predstavljen od strane konversat video chat p2p sučelje screenshot.



Sl. 3. Grupa P2P video chat razgovor.io

Da biste sudjelovali u P2P video uzorcima na temelju WEBRTC-a, morate imati preglednik koji podržava WIBRTC protokol i HTML5 specifikacija. Trenutno, Google Chrome preglednici, počevši od verzije 25, i Mozilla Firefox Noćne podršku WebTC Protocol i HTML5 specifikacija. HBRTC kvaliteta aplikacije i aplikacije za prijenos zvuka premašuju Flash aplikacije.

Europske korisnike mreže podijeljeni su u dva dijela: Prema istraživanju Instituta za javnu analizu javnog mnijenja u Allenbachu (Njemačka), Skype, chat i instant memorijski sustavi postali su sastavni dio svakodnevnog života za 16,5 milijuna odraslih i djece, 9 Milijun koristi ove usluge iz slučaja prigode, a 28 milijuna ih nije dotaklo.

Situacija se može promijeniti, jer je sada u Firefoxu integriranoj tehnologija komunikacije u stvarnom vremenu (Webrertc.), kao i samog klijenta. Pokrenite audio i video chat sada ne teže nego otvaranje stranice. Usluge kao što su Facebook i Skype klađenje na rješenja koristeći zasebni klijent i stvaranje računa.

WebTC se razlikuje ne samo jednostavnost. Ova metoda vam omogućuje da se uključite izravna veza između dva preglednika, Dakle, audio i video podaci ne prolaze kroz poslužitelj gdje se preopterećenje može dogoditi ili administrator koji nije posebno skrupulozan u odnosu na privatni sektor ili zaštitu podataka. Zahvaljujući izravnoj vezi za WEBRTC, niti registracija ili račun u bilo kojoj usluzi nije potrebna.

Da biste započeli razgovor, trebate samo proći kroz link. Komunikacija ostaje privatnaBudući da je tok podataka šifriran. Komunikacija u stvarnom vremenu putem preglednika, Google je počeo aktivno sudjelovati u 2011. godini, kada i objavio izvorni kod za njegovu provedbu WEBRTC.

Ubrzo nakon toga, Chrome i Firefox dobili su vlastite WebTC motore. Trenutno su njihove mobilne opcije opremljene i ovom tehnologijom i instaliranim s Android 5.0 pomoću WebView 3,6 motora, koji se koriste pomoću aplikacija.

Za komunikacije u stvarnom vremenu odgovarajuće JavaScript sučelja moraju se provoditi u web pregledniku. Uz pomoć Getusermedije, softver aktivira snimanje iz audio izvora, to jest, s web-kamere i mikrofona. RTCPeerconnection je odgovoran za uspostavljanje veze, kao i za samu komunikaciju.

Paralelno s integracijom u preglednik, radna skupina World Wide Web konzorcija (W3C) prisilila je proces standardizacije WebRTC-a. On mora biti dovršen 2015. godine.

WEBRTC je zadovoljan s malim

Da biste koristili uslugu WEBRTC-a, mnogi resursi nisu potrebni, budući da poslužitelj povezuje samo interlokutore. Instaliranje spoja također ne predstavlja posebnu složenost. Prvo, preglednik poslužuje signal WEBRTC signalu koji planira započeti poziv. S poslužitelja dobiva HTTPS link - veza se provodi u šifriranom obliku. Ovaj korisnik veze šalje njegov sugovornika. Nakon toga, preglednik traži od korisnika za pristup web-kameru i mikrofonu.

Da biste postavili izravno streaming s sugovornikom, preglednik prima svoju IP adresu i konfiguracijske podatke iz usluge WebTC-a. Web preglednik sugovornika ulazi na isti način.

Za streamiranje funkcije veze bez kvarova i kvalitetno, tri motora rade u pregledniku. Dvije od njih optimiziraju i komprimiraju audio video podatke, treći je odgovoran za njihov prijevoz. On prosljeđuje podatke sRTP protokol (Osigurajte protokol u realnom vremenu), koji vam omogućuje da obavite šifrirani streaming u stvarnom vremenu.

Ako se ne može instalirati izravna veza, WEBRTC traži drugi put. Na primjer, to se događa kada mrežne postavke sprečavaju Stun poslužitelj da dostavi IP adresu. Standard WebRTC-a predviđa da će se u ovom slučaju razgovor održati, ali s posrednim okretanjem na poslužitelju za skretanje (traversal pomoću releja oko NAT). Dakle, na web stranici NESCAN.CO možete provjeriti je li WEBRTC implementiran na vašem računalu i s mrežnim pristupom.

Kako se povezati

Prvo morate registrirati razgovor (1). WEBRTC usluga daje vezu koju treba poslati ugovornik. Preglednik koji koristi stenner sazna svoju IP adresu (2), šalje ga uslugama i prima IP partnera za instalaciju izravnog spoja (3). Ako ne možete koristiti omamljivanje, razgovor je preusmjeren pomoću poslužitelja rada (4).

Komunikacija na WEBRTC tehnologiji u pregledniku pokreće se pomoću JavaScript koda. Nakon toga, tri motora su odgovorni za komunikaciju: glasovni i video diskovi prikupljaju multimedijske podatke s web-kamere i mikrofona, a transportni motor kombinira informacije i prosljeđuje struju u šifriranom obliku pomoću SRTP protokola (siguran protokol u stvarnom vremenu).

Koji preglednici rade s WebTC

Chrome i Firefox opremljeni su WEBRTC motorom koji koristi takve usluge kao što su talky.io. Mozilla preglednik može raditi izravno s vlastitim klijentom.

Google i Mozilla Nastavljaju razvijati komunikacijsku ideju u stvarnom vremenu: Chrome može održati WIBRTC konferenciju s nekoliko sudionika, a novi Hello klijent u Firefoxu je dizajniran s podružnicom Telefonica telekomunikacijskog diva. Apple je još ostao u stranu, u Safari Webrtc još ne očekuje. Međutim, postoje mnoge alternativne aplikacije za iOS i dodatke za safari.

Microsoft je donekle drugačiji. Kao vlasnik Skype natjecateljske usluge, ova tvrtka neće biti tako lako kapitulirati prije WebTC-a. Umjesto toga, Microsoft razvija tehnologiju koja se zove ORTC (objekt u stvarnom vremenu) za Internet Explorer.

Takve razlike od WEBRTC-a, kao i drugih kodeka i protokola za uspostavljanje kontakta s poslužiteljem, su beznačajne i tijekom vremena, najvjerojatnije se pretvara u dodatak standardu WebTC-a, koji će uključivati \u200b\u200bte razlike. Tako ostaje samo jabuka samo kao i obično.

FOTO:proizvođači; GoodLuz / Fotolia.com.

Već dugi niz godina za pozive iz preglednika za mnogo godina: Java, ActiveX, Adobe Flash ... U posljednjih nekoliko godina postalo je jasno da dodaci i lijevi virtualni strojevi ne sjaji praktičnost (zašto bih trebao instalirati nešto?) I, što je najvažnije, sigurnost. Što učiniti? Postoji izlaz!

Donedavno, nekoliko protokola za IP telefoniju ili videozapise korištene su u IP mrežama: SIP, najčešći protokol koji dolazi iz H.323 i MGCP, Jabber / Jingle scena (koristi se u GTalk), poluotvorenom Adobe RTMP * i, od Tečaj, zatvoren Skype. WebRTC projekt, koji je pokrenuo Google, pokušava pretvoriti stanje stvari u svijetu i web-telefonije, čineći nepotrebne sve softverske telefone, uključujući Skype. WEBRTC ne primjenjuje samo sve komunikacijske mogućnosti izravno unutar preglednika instaliranog sada praktički na svakom uređaju, ali pokušava istovremeno riješiti opći zadatak komunikacija između korisnika preglednika (razmjena različitih podataka, ekrana, suradnje s dokumentima i još mnogo toga).

WebTr Web Developer

Sa stajališta WebTr Web Developer sastoji se od dva glavna dijela:

  • upravljanje medijskim dijelovima iz lokalnih resursa (fotoaparat, mikrofon ili lokalni zaslon računala) provodi se pomoću Navigator.GetUserMedia metoda koja vraća objekt s medijima;
  • komunikacija između uređaja između uređaja koji generiraju medijski promet, uključujući definiciju komunikacijskih metoda i izravno ih prenose - RTCPeerconnection objekte (za slanje i primanje audio i video streamove) i RTCdatachanil (za slanje i primanje podataka iz preglednika).

Što nam je činiti?

Mi ćemo se baviti kako organizirati najjednostavniji višeplayer video chat između WebTC-based preglednika pomoću web utičnica. Eksperiment će početi u Chrome / Chromium, kao najnapredniji u smislu WEBRTC preglednika, iako je objavljen 24. lipnja Firefox 22 ih je gotovo uhvatio. Mora se reći da standard još nije prihvaćen, a od verzije na API verziju može promijeniti. Svi primjeri su provjereni u kromu 28. Za jednostavnost, nećemo slijediti čistoću koda i preglednika.

Mediastream

Prva i jednostavna komponenta WeBrrtc - MediaStream. Pruža pristup pregledniku na cirkulaciju medija s fotoaparata i lokalnog računalnog mikrofona. U Chromeu, potrebno je nazvati funkciju Navigator.WebkitgetuuserMedia () (jer standard još nije dovršen, sve funkcije idu s prefiksom, a u Firefoxu je ista funkcija nazvana navigator.mozgetuusermedia ()). Kada ga zove, korisnik će biti prikazan zahtjev za pristup fotoaparatu i mikrofon. Možete nastaviti poziv tek nakon što korisnik daje njegov pristanak. Parametri ove funkcije prenosi parametre tražene medijske sklopke i dvije funkcije povratnog poziva: prvi će biti uzrokovan u slučaju uspješnog pristupa fotoaparatu / mikrofon, drugi - u slučaju pogreške. Za početak, stvoriti html datoteku RttCest1.html s gumbom i elementom

WEBRTC - Prvi poznanik

Microsoft Cu-RTC-Web

Microsoft ne bi bio Microsoft ako je odgovor na Google inicijativu nije odmah objavio vlastitu nekompatibilnu nestandardnu \u200b\u200bopciju koja se zove CU-RTC-Web (HTML5Labs.roperSidbridbridbrids.com/cu-rtc-wareb/cu-rtc-web.htm ). Iako je udio IE, i tako mali, nastavlja se smanjiti, broj korisnika Skype daje Microsoftovu nadu da će pritisnuti Google, a može se pretpostaviti da će se ovaj standard koristiti u verziji skype preglednika. Google standard je prvenstveno orijentiran na komunikacije između preglednika; U isto vrijeme, glavni dio glasovnog prometa i dalje ostaje u uobičajenoj telefonskoj mreži, a pristupnici između IT i IP mreža su potrebni ne samo za jednostavnost korištenja ili brže distribucije, nego i kao sredstvo za monetiranje, što će Dopustite da ih razvije veliki broj igrača. Pojava drugog standarda ne može samo dovesti do neugodnih potreba za podršku dvije nespojive tehnologije odjednom, ali u budućnosti da korisniku daju širi odabir mogućih funkcionalnosti i pristupačnih tehničkih rješenja. Čekaj i vidi.

Uključivanje lokalnog toka

Unutar oznake Naša HTML datoteka izjavila će globalnu varijablu za prekidač medija:

Var lokalstream \u003d null;

Prvi parametar metode GetUserMedia mora odrediti parametre tražene medijske sklopke - na primjer, jednostavno uključuju audio ili videozapis:

Var StreamConstraints \u003d ("Audio": TRUE, "VIDEO": TRUE); // Zahtjev za pristup i audio i videozapis

Ili navedite dodatne parametre:

Var StreamConstraints \u003d ("audio": TRUE, "VIDEO": ("Obvezno": ("Maxwidth": "320", "Maxheight": "240": "MaxFramerate": "5"), "Izborno" :) );

Drugi parametar metode GetuserMedia mora se prenijeti na funkciju povratnog poziva, koja će biti uzrokovana ako je uspješno izvršena:

Funkcija GetuserMedia_success ("GetUserMedia_Suxss ():", potok); LocalVideo1.Src \u003d URL.CreateBectUrl (potok); // Spojite medijske prebacivanje na HTML element

Treći parametar - Handler o pogrešci funkcije povratnog poziva koji će biti pozvan u slučaju pogreške

Funkcija GetuserMedia_error (pogreška) (console.log ("GetuserMedia_error ():", greška);)

Zapravo pozivam metodu GetuserMedia - zahtjev za pristup mikrofon i fotoaparat kada kliknete na prvi gumb

Funkcija GetuserMedia_click () (console.log ("GetuserMedia_click ()"); Navigator.Webkitgetuusermedia (StreatrightConstraints, GetUserMedia_success, GetUserMedia_error);)

Dobijte pristup medijskoj datoteci iz datoteke otvorene lokalno, to je nemoguće. Ako pokušate to učiniti, pogriješite:

NAVIGATORESERMEDIAERR (kod: 1, Permission_devenied: 1) "

Postavljamo rezultirajuću datoteku na poslužitelj, otvoren u pregledniku i kao odgovor na zahtjev koji se pojavio dopuštajući pristup fotoaparatu i mikrofonu.

Odaberite uređaje na koje će Chrome primiti, možete postavke ("Postavke"), prikazati napredne postavke ("Prikaži napredne postavke"), Privatnost odjeljka ("Osobni podaci"), gumb sadržaja ("postavke sadržaja"). U preglednicima Firefox i Opera, odabir uređaja izrađen je od padajućeg popisa izravno kada se pristup riješi.

Kada koristite HTTP protokol, dopuštenje će se tražiti svaki put kada primite pristup medijskom putovanju nakon učitavanja stranice. Prijelaz na HTTPS omogućit će vam da jednom prikažite upit, samo s prvim pristupom medijskom prekidaču.

Obratite pozornost na pulsirajući krug u ikonu na kartici i ikonu fotoaparata na desnoj strani adresne trake:

RTCMadiacowlection.

RTCMediconowlection je objekt dizajniran za uspostavljanje i prijenos medija preko mreža između sudionika. Osim toga, ovaj objekt je odgovoran za formiranje opisa Mediassia (SDP), dobivanje informacija o kandidatima leda za prolazak kroz NAT ili mrežne ekrane (lokalne i korištenje omamljenja) i interakciju s poslužiteljem za skretanje. Svaki sudionik mora imati jedan RTCMaiconnection za svaku vezu. Medijski snimci se prenose preko šifriranog SRTP protokola.

Skrenuti poslužitelji

Kandidati za led su tri vrste: domaćin, srflx i relej. Host sadrži informacije dobivene na lokalnoj razini, srflx - kako čvor traži vanjski poslužitelj (otunj) i relej - informacije za prometni promet putem poslužitelja za skretanje. Ako je naš čvor iza NAT-a, onda će domaćin kandidata sadržavati lokalne adrese i biti će beskoristan, kandidati će pomoći samo s određenim vrstama NAT-a i relej će biti posljednja nada da će preskočiti promet kroz srednji poslužitelj.

Primjer leda kandidata vrste domaćina, s adresom 192.168.1.37 i priključkom UDP / 34022:

A \u003d kandidat: 337499441 2 UDP 2113937151 192.168.1.37 34022 Typ Host Generation 0

Opći format za podešavanje Stun / skretanje poslužitelja:

VAR Servers \u003d ("OSCESERS": [("URL": "Stun: Stun.Stunprotocol.org: 3478"), ("URL": "Okreni: [Zaštićeno e-poštom]: port "," vjerodajnica ":" lozinka ")]);

Public Stun poslužitelji na internetu puno. Veliki popis, na primjer, je. Nažalost, oni rješavaju previše problema. Javno skretanje poslužitelja, za razliku od omamljenja, praktički ne. To je zbog činjenice da server za skretanje prolazi kroz sebe medijske snimke koji mogu značajno preuzeti i mrežni kanal i sam poslužitelj. Dakle, najlakši način povezivanja s poslužiteljima je da ga postavite sami (jasno je da će biti potrebna javna IP). Od svih poslužitelja, po mom mišljenju, najbolji RFC5766-poslužitelj. Pod njemu postoji čak i gotova slika za Amazon EC2.

S druge strane dok sve nije tako dobro kao što želim, ali postoji aktivan razvoj, i želim se nadati, nakon nekog vremena webrertc, ako se ne usporedi s Skype na kvalitetu prolaska kroz emitiranje adresa (NAT) i mrežni ekrani, zatim barem primjetni pristup.

Za RTCMadiacowlection, potreban je dodatni mehanizam za razmjenu kontrolnih informacija kako bi se uspostavila veza - iako to čini ove podatke, ali ih ne prenosi, a prijenos na druge sudionike treba provoditi odvojeno.


Izbor metode prijenosa dodijeljen je programeru - iako ručno. Čim će se održati razmjena potrebnih podataka, RTCMadiacowlection će se automatski uspostaviti medijske izvedbe (ako se ispostavi, naravno).

Model odgovora

Da biste uspostavili i promijenili prikazi medija, koristi se model ponude / odgovora. Opisano u RFC3264) i SDP protokolu (protokol opisa sesije). Koriste se i SIP protokol. Ovaj model razlikuje dva agenta: ponuđač - onaj koji generira SDP opis sesije kako bi stvorio novu ili modifikaciju postojećih (ponuda SDP-a), a odgovor je onaj koji prima SDP-opis sjednice od drugog agenta i susreće ga svoj opis sesije (odgovor SDP). U isto vrijeme, specifikacija zahtijeva više razine protokola (na primjer, gutljaj ili vlastiti na vrhu web utičnice, kao u našem slučaju) odgovoran za prijenos SDP između agenata.

Koji podaci moraju biti preneseni između dva RTCMaicowlection tako da mogu uspješno instalirati medijski promet:

  • Prvi sudionik koji pokreće priključak generira ponudu u kojoj se prenosi SDP strukturu podataka (isti protokol za istu svrhu koristi se u SIP), koji opisuje moguće karakteristike medija prekidača, koje će početi prijenos. Ovaj blok podataka mora se prenijeti na drugi sudionik. Drugi sudionik obrazuje odgovor, sa svojim SDP-om i prosljeđuje ga prvom.
  • A prvi i drugi sudionici obavljaju postupak određivanja mogućih kandidata za led, uz pomoć koji će drugi sudionik moći prenijeti na njih. Kao što su kandidati definirani, informacije o njima treba prenijeti drugom sudioniku.

Ponuda formacije.

Za formiranje ponude trebat ćemo dvije funkcije. Prvi će biti pozvan u slučaju uspješne formacije. Drugi parametar Forteoffer () metoda je funkcija povratnog poziva nazvana ako se pojavi pogreška (pod uvjetom da je lokalni tok već dostupan).

Dodatno će vam trebati dvojici rukovatelj događaja: onceCadidate prilikom određivanja novog kandidata za led i oNadstream pri spajanju prebacivanja medija s suprotne strane. Vratimo se u našu dosje. Dodajte u HTML nakon reda s elementima

I nakon niza s elementom


Također na početku JavaScript koda proglasit će globalnu varijablu za RTCPeerkonnection:

Var PC1;

Prilikom pozivanja RTCPeerconnection dizajnera morate odrediti Stun / skretanje poslužitelja. Pročitajte više o njima, pogledajte umetak; Dok su svi sudionici na istoj mreži, nisu potrebni.

Var poslužitelji \u003d null;

Opcije za pripremu ponude SDP

Var offERCoRonstraints \u003d ();

Prvi parametar Forteoffer () metoda je funkcija povratnog poziva nazvana kada je uspješna

Funkcija PC1_Createoffer_success ("PC1_createoffer_success (): ndesc.sdp: n" + esc.sdp + "opis:", desc); PC1.setlocaldescription (desc); // postavite RTCPeerconnection, formiran ponudom SDP pomoću metode setlocaldescription . // Kada se duga okrugla strana šalje na njegov odgovor SDP-a, morat će biti postavljen od strane setRemoteDescription // sve dok druga strana ne provodi, nemojte učiniti ništa // pc2_receveOffer (desc);)

Drugi parametar je funkcija povratnog poziva koja će biti pozvana u slučaju pogreške

Funkcija PC1_Createoffer_error (console.log ("PC1_createoffer_success_error (): Pogreška:", greška);)

I izjaviti funkciju povratnog poziva da će se kandidati za led prenositi kao što su utvrđeni:

Funkcija PC1_OneCadidate (događaj) (console.log ("PC1_OneCadidat (): n" + event.candidad.candidad.replace ("r", ""), događaj.candidate); // dok je druga strana je Nije implementiran, ne činiti ništa // pc2.addiceCandidatida (novi RTciceCadidat (događaj.candidatida);))))

Kao i funkcija povratnog poziva za dodavanje medija prekidača s suprotne strane (za budućnost, jer dok imamo samo jedan RTCPeerconnection):

Funkcija PC1_ONAddstream (console.log ("PC_ONAddstream ()"); remotevideo1.src \u003d url.createobkurl (događaj.stream);)

Kada kliknete na gumb FREEOFFER, stvorit ćete RTCPeerkNowlection, postaviti metode oznaka ionadstreada i zahtijevati formiranje ponude SDP pozivanjem metode FREEOFFER ():

Funkcija FREECHERFER_CLICK () (console.log (crosheffer_click () "); PC1 \u003d novi WebkitrtcPeerconnection (poslužitelji); // Stvaranje RTCPeerconnection PC1..OneCandidad \u003d PC1_OneCadidadaj; // obrada povratnog poziva za led kandidate PC1.onaddstream \u003d PC1_onadddstream; // funkcija povrata uzrokovana izgledom medija s druge strane. Do sada nema PC1.addstream (lokalstream); // dajemo lokalne medijske dijelove (pretpostavljamo da je već primljena) PC1.Createoffer (// i zapravo tražeći formiranje ponude PC1_createoffer_success, PC1_createoffer_error, offERCoRonstraints););)

Spremite datoteku kao Rtcttest2.html, postavite ga na poslužitelju, otvorite ga u pregledniku i pogledajte u konzolu, koji se podaci formiraju tijekom njegovog rada. Drugi videozapis još se neće pojaviti, jer je sudionik samo jedan. Podsjetimo, SDP - opis parametara Mediassia, dostupnih kodeka, medijskih performansi i kandidata za led su mogući opcije za povezivanje s ovim sudionikom.

Formiranje odgovora SDP-a i kandidata za led

I ponuda SDP-a, i svaki od ledenih kandidata mora se prenijeti na drugu stranu i tamo nakon što je primio RTCPeerkonnection kako bi nazvao metode setremotedscription za ponudu SDP-a i dodatka za svaki ledeni kandidat koji je izveden s suprotne strane; Slično tome, u suprotnom smjeru za odgovaranje s SDP-a i udaljenim ledenim kandidatima. Odgovor SDP-a se formira slično za ponudu; Razlika je u tome što se metoda FREEOFFER poziva, ali metoda kreacije i prije ovog RTCPeerconnection metoda prenosi s postupkom setRemoteDedscription SDP primio od pozivatelja.

Dodajte još jedan video element u HTML:

I globalnu varijablu za drugi RTCPeerkonnection pod objavom prvog:

Var PC2;

Ponuda za obradu i odgovor SDP-a

Odgovor SDP formacije je vrlo sličan ponudi. U funkciji povratnog poziva uzrokovana uspješnim formiranjem odgovora, slično ponudi, dajte lokalni opis i dajte prvi sudionik primljen od strane odgovora SDP-a:

Funkcija PC2_Createdsher_successRiption (desc); console.log ("PC2_cracteanswer_success ()", desc.sdp); pc1.setremotedstrion (desc);)

Pozivna funkcija koja se zove u slučaju pogreške u formiranju odgovora je potpuno sličan ponudi:

Funkcija PC2_Createdsher_error (Error) (console.log ("PC2_cracteanswer_error ():", greška);)

Odgovorite na opcije formiranja SDP-a:

Var angaslations \u003d ("obavezno": ("offertoreceevediodio": istinito, "offertorevevideo": istina);

Po primitku ponude, mi ćemo stvoriti RTCPeerkonnection i formatirati odgovor na sličan način ponuditi:

Funkcija PC2_receSevoffer (desc) (conselofeor (), opis); Kada se događaj pojavi na ledenom kandidatu PC2.onaddstream \u003d pc_onaddstream; // kada je tok to poveže s HTML-om

Da bi u našem primjeru prenijeli ponudu SDP-a od prvog sudionika na drugi, mi se odjavljujemo u funkciji PC1 fREEOFFER.uspjeh () String poziva:

PC2_Receivoffer (desc);

Za provedbu obrade kandidata za led, mi nesumnjivo događaje spremnosti ledenih kandidata prvog sudionika PC1_OneCandidata () na prijenos na drugi:

PC2.addiceCadidadati (novi RTCECceCadidat (događaj.candidatida));

Događaj Handler spremnosti drugog sudionika Ice kandidata je prvo:

Funkcija PC2_OneCadidate (događaj) (console.log ("PC2_OneCadidat ():", događaj.candidad.candidate); PC1.addiceCadidadate (novi RTCiceCandidat (događaj.candidate));))))

Značajka povrata za dodavanje prebacivanja medija iz prvog sudionika:

Funkcija PC2_ONAddstream (console.log ("PC_onaddstream ()"); remotevideo2.src \u003d url.createBectll (događaj.stream);)

Završetak veze

Dodajte još jedan gumb na HTML

I funkcija za dovršetak veze

Funkcija BTNHANGUPCLICK () (// isključite lokalni video iz HTML elemenata

Spremite kao Rtcttest3.html, postavite na poslužitelju i otvorite u pregledniku. Ovaj primjer implementira bilateralni prijenos medijskih performansi između dva RTCPeerconnection unutar jednog preglednika oznake. Kako bi organizirali razmjenu ponude i odgovora SDP-a putem mreže, kandidati za led između sudionika i drugih informacija bit će potrebni umjesto izravnih postupaka izazova za provedbu razmjene između sudionika s bilo kojim prijevozom, u našem slučaju - web utičnice.

Ekrana

GetUserMedia značajka Možete snimiti i zaslon i emitirati kao mediaStream, navodeći sljedeće parametre:

VAR MediaStreamConstraints \u003d (Audio: FALSE, VIDEO: (Obvezni: (Chromemediasource: "Zaslon"), opcionalno :));

Da biste uspješno pristupili zaslonu, potrebno je izvršiti nekoliko uvjeta:

  • omogućite zastavu screenshot u Getuusermedia () u Chrome: // zastave /, Chrome: // zastavice /;
  • izvorna datoteka mora preuzeti HTTPS (SSL podrijetlo);
  • protok zvuka ne smije se tražiti;
  • ne bi trebalo biti nekoliko zahtjeva u jednom kartici preglednika.

Knjižnice za WEBRTC.

Iako WebTC također nije dovršen, već postoji nekoliko knjižnica na temelju njega. JSSIP je dizajniran za stvaranje soft splas preglednika koji radi s SIP prekidačima, kao što su zvjezdica i camalio. Peerjs će pojednostaviti stvaranje P2P mreža za razmjenu podataka, a Holla će smanjiti opseg razvoja potrebne za P2P komunikaciju iz preglednika.

Node.js i socket.io.

Kako bi se organizirala razmjena SDP-a i ledenih kandidata između dva RTCPeerkonnection putem mreže, koristite node.js s modulom socket.io.

Instaliranje najnovije stabilne verzije node.js (za Debian / Ubuntu) opisan

$ sudo apt-get instalira Python-Software-svojstva Python G ++ Napravite $ Sudo Add-apt-Repozitorij PPA: Chris-Lea / nede.js $ sudo apt-get ažurirati $ sudo apt-dobiti instalirati nodejs

Opisana je instalacija za ostale operativne sustave

Ček:

$ Echo "sys \u003d zahtijevaju" Sys.Puts ("Test poruka"); " \u003e Nodetest1.js $ Nodejs Nodetest1.js

Korištenje NPM (upravitelj paketa čvorova), instalirajte socket.io i dodatni express modul:

$ NPM Instalacija socket.io Express

Provjerite stvaranjem nodteest2.js datoteku za poslužitelj dio:

$ Nano Nodetest2.js VAR App \u003d Zahtijevati ("Express") (), poslužitelj \u003d zahtijevaju ("http"). Createweerver (app), io \u003d zahtijevaju ("socket.io"). Slušajte (poslužitelj); Poslužitelj.Listen (80); // Ako je priključak 80 je besplatan za app.get ("/", funkcija (REQ, OIE) (// prilikom pristupa res.Sendfile korijenskoj stranici (__ Dirname + "/nodetest2.html"); // odustati od HTML datoteka)); i.sockets.on ("veza", funkcija (utičnica) (// pri spajanju Socket.EMIT ("događaj poslužitelja", (Hello: "World"); // Pošalji poruku Socket.on (događaj klijenta ") , Funkcija (podaci) (// i proglasite rukovatelj događaja po primitku poruke iz klijentske console.log (podaci);));));

I nodetest2.html za klijenta:

$ Nano Nodetest2.html

Pokrenite poslužitelj:

$ sudo nodejs nodetest2.js

i otvoriti http: // localhost: 80 stranicu (ako se radi na lokalnoj razini na 80. portu) u pregledniku. Ako je sve uspješno, u JavaScript konzoli preglednika ćemo vidjeti razmjenu događaja između preglednika i poslužitelja kada je spojen.

Razmjena informacija između RTCPeerkonnection kroz web utičnice

Dio klijenta

Spremite naš glavni primjer (RTCDEM3.HTML) pod novim imenom RTCDEMA4.HTML. Spojite socket.IO knjižnica u stavci:

I na početku JavaScript skripte - Povežite se na web utičnice:

VAR Socket \u003d iO.Connect ("http: // localhost");

Zamijenit ću izravni poziv funkcija drugog sudionika za slanje putem web utičnice:

Funkcija freeoffer_success (desc) (opis); socket.emit ("ponuda", desc); ...) Funkcija PC2_createanswer_success (desc) (... // PC1.setremotededesription (desc); utičnica. Desc);) funkcija PC1_OneCacacaland (događaj) (... // PC2.addiceCandidatida (novi RTCECceCandidat (događaj.candidatidate); socket.emit ("ICE1", Event.candidatida); ... // PC1.addiceCandiced (novi RTCiceCandidat (događaj.candidate); socket.emit ("ICE2", Event.candidatida); ...) ...)

U funkciji hangup (), umjesto izravnog poziva za funkcije drugog sudionika, neka nam dati poruku putem web utičnice:

Funkcija BTNHANGUPCLICK () (... // Remotevideo2.src \u003d ""; PC2.close (); PC2 \u003d Null; Socket.emit ("Handup", ());)

I dodajte rukovatelje poruka za poruke:

Socket.on ("ponuda", funkcija (podaci) ("Socket.on (" ponuda "):", podaci); PC2_receveoffer (podaci);)); Socket.on ("odgovor", funkcija (podaci) (e console.log ("socket.on": ", podaci); pc1.setremoteDedcrt (podaci);)); Socket.on ("Ice1", funkcija ("Socket.on" ("ICE1"): ", podaci); PC2.addiceCandidat (novi RTciceCandidat (podaci));)); Socket.on ("ICE2", funkcija ("Socket.on" ("ICE2"): ", podaci); PC1.addiceCadidadate (novi RTciceCandidat (podaci));)); Socket.on ("hangup", funkcija ("console.log" ("socket.on (" Handup "):", podaci); Remotevideo2.Src \u003d ""; PC2.close (); PC2 \u003d null;)) ;

Dio poslužitelja

Na strani poslužitelja, spremite Nodteest2 datoteku pod novim imenom RTCEST4.JS i unutar funkcije iO.Sockets.On ("veza", funkcija (utičnice) (...) Dodaj recepciju i slanje korisničkih poruka:

Socket.on ("ponuda", funkcija (po primitku poruke "ponuda", // budući da je klijentska veza u ovom primjeru samo jedan, // pošaljite poruku natrag kroz istu socket socket.emit ("Ponuda", podaci); // ako je bilo potrebno poslati poruku na sve veze, // pored pošiljatelja: // soket.froascast.emit ("ponuda", podaci);)); socket.on ("odgovor", funkcija (podaci) (Socket.emit ("odgovor", podaci);)); socket.on ("ICE1", funkcija (podaci) (socket.emit ("ICE1", podaci);)); socket.on ("ICE2", funkcija (podaci) (Socket.emit ("Ice2", podaci);)); socket.on ("hangup", funkcija (podaci) (socket.emit ("hangup", podaci);));

Osim toga, promijenit ćete naziv HTML datoteke:

// res.sendfile (__ dirname + "/nodetest2.html"); // dati html datoteku res.sendfile (__ dirname + "/rtcttcest4.html");

Početni poslužitelj:

$ sudo nodejs nodetest2.js

Unatoč činjenici da se kod oba klijenata obavlja unutar iste oznake preglednika, sva interakcija između sudionika u našem primjeru u potpunosti se provodi putem mreže i "širenje" više ne zahtijevaju posebne poteškoće. Međutim, ono što smo učinili bilo je vrlo jednostavno - te tehnologije i dobre su za njihovu jednostavnost korištenja. Neka ponekad obmanjuju. Konkretno, nećemo zaboraviti da bez Stun / skretanje poslužitelja, naš primjer neće moći raditi u prisutnosti prijevoda i mrežnih ekrana.

Zaključak

Rezultirajući primjer je vrlo uvjetno, ali ako imate malo univerzalize rukovatelja događaja, tako da se ne razlikuju od poziva i nazvane zabave, umjesto dva objekta PC1 i PC2 kako bi se RTCPEERKonnection polja i implementira dinamičko stvaranje i uklanjanje elemenata

Može se pretpostaviti da je vrlo brzo zahvaljujući WebTC-u bit će udar ne samo u našem podnošenju glasovnih i video veza, već i kako doživljavamo internet u cjelini. WEBRTC se nalazi ne samo kao tehnologija za pozive iz preglednika u preglednik, već i kao komunikacijska tehnologija u stvarnom vremenu. Video poziv, koji smo rastavili, samo mali dio mogućih opcija za uporabu. Već postoje primjeri ekrana (zaslovanje) i suradnju, pa čak i P2P mreže isporuke sadržaja na temelju preglednika koji koriste RTCdatachannel.