PDA

View Full Version : [HTML 5] scambiare dati tra client per chat video


rab
18-08-2013, 19:16
Salve a tutti :D

mi servirebbe sapere come fare a connettere un browser ad un altro per realizzare una chat video, specificando l'indirizzo IP per il momento.

ho trovato questa (http://www.html5rocks.com/en/tutorials/webrtc/basics/) guida e ho capito la parte in cui cattura il video e lo riproduce ma non ho capito come fare a collegare i browser e trasmettere gli stream

qualcuno può aiutarmi? :D

OoZic
18-08-2013, 21:58
io guarderei qui al punto 5, ho l'impressione che ti manchi questo "tassello" :D il webserver
https://bitbucket.org/webrtc/codelab

;)

rab
18-08-2013, 22:36
non capisco come fare, non ho mai usato Node.js, potresti illuminarmi? :D

OoZic
19-08-2013, 07:53
che sistema operativo usi?

rab
19-08-2013, 11:44
windows 7, però ho anche ubuntu installato

OoZic
19-08-2013, 14:34
ubuntu:
https://github.com/joyent/node/wiki/Installing-Node.js-via-package-manager#ubuntu-mint

windows7:
http://dailyjs.com/2012/05/03/windows-and-node-1/

easy, una volta installato segui la guida che ti ho linkato prima e vedi se ti blocchi da qualche parte o se funziona

rab
20-08-2013, 17:06
installato Node e i componenti necessari, copiato i sorgenti da BitBucket (punto 6), avvio il server, carico la pagina web e non succede niente :(
eppure nel log di Node non risulta nessun errore :eek:
proveresti a farlo anche tu e dopo mi dici se ti funziona? :help:

OoZic
20-08-2013, 18:50
domani provo e t faccio sapere ;)

OoZic
21-08-2013, 10:42
hai un web server installato?

se digiti "localhost" nel browser cosa ti esce?

allo step2.html riesci a far partire la tua webcam e visualizzarti?

rab
21-08-2013, 13:41
faccio partire il server dando dal prompt il comando "node server.js"
il server si mette in ascolto sulla porta 2013 quindi punto il browser su localhost:2013, quello che mi restituisce è una pagina web con nessun contenuto, nel senso che non c'è alcun elemento visualizzabile perchè l'HTML ci sarebbe.
lo step 2 funziona :O

OoZic
21-08-2013, 14:03
la pagina è vuota di default allo step5.

dovrebbe solo chiederti il nome della stanza e nella console dovresti leggere che ha effettuato l'accesso.

fammi uno screen di quello che ti esce sulla shell dopo che hai lanciato node e anche della console, cosi ti posso aiutare

es: http://cl.ly/image/0z023g1k0O1s

rab
23-08-2013, 17:28
allora questo è lo screen con il codice del punto 5
http://imageshack.us/photo/my-images/855/st0j.png/

mentre questo è con il codice del punto 6
http://imageshack.us/photo/my-images/853/y6ow.png/

OoZic
23-08-2013, 19:44
allora questo è lo screen con il codice del punto 5
http://imageshack.us/photo/my-images/855/st0j.png/

mentre questo è con il codice del punto 6
http://imageshack.us/photo/my-images/853/y6ow.png/

okay qui si vede la shell (prompt con nodejs)
ma non si vede la console (console javascript del browser)

è questa per intenderci (io uso chrome ma c'è anche in firefox -> strumenti, console web)
http://cl.ly/image/1K1x3s3H161G

rab
23-08-2013, 20:00
ecco http://imageshack.us/photo/my-images/854/c1ot.png/

OoZic
23-08-2013, 20:18
avevo il dubbio che fosse necessario chrome e rileggendo effettivamente danno come requisito anche chrome.

suppongo che firefox non sia ancora compatibile.

usa chrome, che imho è anche meglio se vuoi diventare sviluppatore ;)

rab
23-08-2013, 20:50
con chrome mi da questo
http://imageshack.us/photo/my-images/41/ul24.png/

OoZic
24-08-2013, 00:54
step6
cartella js

main.js

modifica la riga 112, al posto di:
navigator.GetUserMedia
sostituisci:
navigator.webkitGetUserMedia

devi fare lo stesso allo step7.
chrome non interpreta ancora quel metodo "universale" ma ha bisogno del prefisso specifico di webkit.
in futuro quando la specifica sarà approvata dovrebbe sparire questo problema.

;)

rab
25-08-2013, 15:21
funziona! perlomeno in due schede diverse di Chrome, ti ringrazio ;)
ora vorrei aprire le porte per consentire ad altri utenti di collegarsi al server, come faccio?

OoZic
25-08-2013, 15:33
non è una cosa semplicissima.

la cosa più semplice da fare è mettere la tua macchina in dmz ma solo per fare un test, dopo di che toglila perchè non va bene.

vai nelle impostazioni del tuo router e metti l'indirizzo ip della tua macchina in DMZ, così facendo è come se avessi aperto tutte le porte da internet verso il tuo ip locale.

a questo punto se hai un firewall apri la porta xxxx (quella che usi nel programma non ricordo il numero)

fatto questo vai su http://whatismyipaddress.com/

segnati il tuo indirizzo ip (esempio 80.40.20.10)

digli a un tuo amico (o se hai un cellulare usa il cellulare) e vai alla pagina
http://80.40.20.10:xxxx dove xxxx è la porta in ascolto del server node che hai creato.

dovrebbe andare poi nel caso aprirai solo una porta e toglierai dalla DMZ la tua macchina.

rab
29-08-2013, 20:03
me la sono cavata attivando il port forwarding nel router verso il mio pc, adesso mi piacerebbe aggiungere l'audio e una chat testuale (che non sono spiegati nella guida), e poi fare in modo che il server interagisca con i client, ad esempio se due utenti vogliono parlare dello stesso argomento il server li mette in comunicazione.
è possibile usare anche codice PHP? ad esempio vorrei dare la possibilità ad un utente di selezionare una chat room da una lista salvata in un database MySQL, oppure posso fare il tutto con Node.js? ribadisco che non sono pratico di quest'ultimo :confused:

OoZic
30-08-2013, 00:31
ricordati che cmq webrtc è p2p , il server non interviene nello scambio dei dati dello stream audio/video ma serve solo a mettere in contatto i client.

nodejs è la via più immediata, non è semplicissimo ma nemmeno impossibile.
con il vantaggio che hai già tutto quel che ti serve integrato e ben funzionante a partire da socket.io

in php credo tu finisca per fare molta più fatica.

mysql per tenere i log di una chat non credo sia la soluzione più adatta.

molto meglio un database nosql come redis credo, anche se una soluzione di chat c'è già bella e funzionante ed è http://xmpp.org/ (jabber), usata da facebook e google tanto per citare due nomi

rab
01-09-2013, 20:22
guarda per quanto riguarda la programmazione lato server conosco solo php, e mysql come database, non avrei problemi a studiare altri linguaggi/piattaforme, la questione è poi trovare servizi di hosting compatibili :)

OoZic
01-09-2013, 22:30
https://www.digitalocean.com/?refcode=2113119bb892

5$ al mese per una VPS = un server tutto tuo dove ci gira , ovviamente, quel che vuoi.

se poi hai bisogno ti aiuto nei ritagli di tempo , posso configurarti l'ambiente e tu ti concentri sullo sviluppo.

rab
02-09-2013, 11:20
sbav :O_____
ok userò quel servizio :)
quali sono i vantaggi nell'usare Node.js rispetto a PHP o altri e un database non relazionale rispetto a MySQL?

OoZic
02-09-2013, 14:38
Come ti dicevo node.js ha già la libreria soket.io perfettamente integrata che è una gran cosa per gestire app in tempo reale. (Websocket)

Sui database non c'è il meglio o il peggio in senso assoluto dipende veramente cosa vuoi farci con la tua app.

Questo comunque è un discorso generale se ci fosse un linguaggio che in assoluto è migliore di un altro non avremmo così tanti linguaggi.

Dipende sempre cosa si deve fare: tempo, soldi,prestazioni richieste, scalabilità, ri-usabilità,ecc