comunicarea in as3
TRANSCRIPT
Flash InteropFlex Camp / Iași / 2009
Cosmin VârlanFacultatea de Informatică
Iași
http://www.info.uaic.ro/~flash 2
• Comunicarea între Flash și JavaScript• Comunicarea cu un server Web• Comunicarea între două aplicații Flash de pe
calculatoare diferite
Cuprins…
http://www.info.uaic.ro/~flash 3
Living in a strange situation of
Too many words and…
NO COMMUNICATION ?!?!
http://www.info.uaic.ro/~flash 4
• Aplicațiile Flash pot comunica cu aplicațiile realizate în alte tehnologii dar care rulează local prin intermediul obiectelor de tip ExternalInterface (flash.external.ExternalInterface;)
• ExternalInterface este utilizată pentru a face posibilă comunicarea între ActionScript și containerul playerului Flash (de obicei AS3 și JSul dintr-un HTML)
Flash & JS
http://www.info.uaic.ro/~flash 5
JS
http://www.info.uaic.ro/~flash 6
JS
Funcție JS pentru a primi mesajul din AS (va fi apelată din AS)
http://www.info.uaic.ro/~flash 7
JS
Funcție JS ce va trimite mesajul către aplicația Flash cu ID-ul “main”
http://www.info.uaic.ro/~flash 8
JS
Formular de unde vom prelua datele pentru a le
trimite către AS3
http://www.info.uaic.ro/~flash 9
JS
Sau unde vom scrie datele recepționate din
AS3
http://www.info.uaic.ro/~flash 10
Flash
http://www.info.uaic.ro/~flash 11
Flash
Crearea unui câmp textual și al unui buton
http://www.info.uaic.ro/~flash 12
Flash
…. pe care vă descurcați voi să le faceți vizibile.
http://www.info.uaic.ro/~flash 13
Flash
Vom apela metoda ce trimite date la apăsarea
butonului
http://www.info.uaic.ro/~flash 14
Flash
Pentru a transmite informații către JS se
utilizează o metodă statică a interfeței externe
http://www.info.uaic.ro/~flash 15
FlashExternalInterface este mereu existent în orice aplicație Flash dar rareori utilizat. Putem să-i adăugăm o metodă care să o
apeleze atunci când recepționează date de la această funcție JS
http://www.info.uaic.ro/~flash 16
Flash
Funcția ce o va apela
http://www.info.uaic.ro/~flash
Flash
17
Funcția va apela va modifica TextField-ul
http://www.info.uaic.ro/~flash 18
• Când două aplicații Flash se întâlnesc pe aceeași calculator, ele pot comunica prin intermediul LocalConnection
• Aplicațiile Flash pot scrie diverse informații în obiecte de tip SharedObject ce le salvează pe calculatorul clientului și pe care le poate reîncărca ulterior.
• Aplicațiile Flash ce rulează în paginile WEB pot avea o serie de variabile pre-inițializate direct în HTML.
Alte tipuri de comunicări (locale)
http://www.info.uaic.ro/~flash 19
• Când două aplicații Flash se întâlnesc pe aceeași calculator, ele pot comunica prin intermediul LocalConnection
• Aplicațiile Flash pot scrie diverse informații în obiecte de tip SharedObject ce le salvează pe calculatorul clientului și pe care le poate reîncărca ulterior.
• Aplicațiile Flash ce rulează în paginile WEB pot avea o serie de variabile pre-inițializate direct în HTML.
Alte tipuri de comunicări (locale)
http://www.info.uaic.ro/~flash 20
• De multe ori pentru a indica aplicației Flash o anumită stare în care trebuie să se afle în momentul pornirii, se utilizează o astfel de inițializare (de ex. YouTube). Cam așa se face:
Alte tipuri de comunicări (locale)
Variabila de trimis
Variabila de trimis
http://www.info.uaic.ro/~flash 21
• Valorile variabilelor transmis prin intermediul parametrului FlashVars pot fi “recuperate” în AS3 din obiectul loaderinfo:
Alte tipuri de comunicări (locale)
Va afișa “patrat”
http://www.info.uaic.ro/~flash 22
• Deși această metodă poate fi utilă programatorilor care vor să-și inițializeze anumiți parametri în aplicația Flash și este utilizată de mulți programatori PHP pentru a seta o valoare încă din primii pași ai execuției, ea nu este efectiv un mod de comunicare.
Alte tipuri de comunicări (locale)
http://www.info.uaic.ro/~flash 23
• Din aplicația Flash se poate face o cerere către server atunci când are nevoie de o anumită resursă (imagine, XML, o valoare, un MP3 etc.)
• Serverul poate construi chiar atunci resursa (de exemplu dacă aplicația Flash întreabă cât este ora, serverul poate să-i returneze o valoare generată în acel moment).
• Odată cu cererea, aplicația Flash poate trimite (POST/GET) o serie de valori.
Flash & Server Web (PHP)
http://www.info.uaic.ro/~flash 24
• Vom considera următorul cod PHP (care adună 5 la valoarea variabilei “variabilaPrimita” recepționată prin GET și generează un output de tipul “returnVal=7” – spre exemplu când valoarea primită este 2):
Flash & Server Web (PHP)
http://www.info.uaic.ro/~flash 25
• Vom considera următorul cod PHP (care adună 5 la valoarea variabilei “variabilaPrimita” recepționată prin GET și generează un output de tipul “returnVal=7” – spre exemplu când valoarea primită este 2):
Flash & Server Web (PHP)
http://www.info.uaic.ro/~flash 26
Flash & Server Web (PHP)
http://www.info.uaic.ro/~flash 27
Flash & Server Web (PHP)Un obiect prin care vom face o cerere
http://www.info.uaic.ro/~flash 28
Flash & Server Web (PHP)Setăm metoda de
transmitere a datelor
http://www.info.uaic.ro/~flash 29
Flash & Server Web (PHP)În acest obiect vom adăuga
variabilele ce le vom transmite către PHP
Aici adăugam efectiv valoarea variabilei și asociem cererii
obiectul conținând variabilele
http://www.info.uaic.ro/~flash 30
Flash & Server Web (PHP)
Funcția ce va fi apelată când se va întoarce răspunsul…
http://www.info.uaic.ro/~flash 31
Flash & Server Web (PHP)
Ce va afișa valoarea 10.
http://www.info.uaic.ro/~flash 32
• Putem transmite și recepționa date de la server chiar în timpul rulării aplicației Flash [aveți grijă ce date introduceți în aplicația Flash pentru că aceasta ar putea face submit chiar dacă nu ați apăsat butonul :>) ].
Flash & server Web
http://www.info.uaic.ro/~flash 33
• Uneori am întâlnit persoane care vor sa facă jocuri… în care participanții să comunice în timp real… șiiiii de foarte multe ori, am auzit drept soluție textul: “simplu: trimitem informațiile la un server PHP care le scrie undeva (o bază de date de exemplu), colegul care joacă cu mine le preia de acolo”.
……RĂU !
Flash & server Web
http://www.info.uaic.ro/~flash 34
• Soluția nu este corectă deoarece comunicarea prin intermediul protocolului HTTP este asincronă.
• Pentru comunicarea în timp real se utilizează socketuri [în AS3 de obicei se utilizează protocolul TCP].
• (acum să nu credeți că în comunicarea HTTP nu se utilizează porturi… doar că alea sunt utilizate de browser, nu de aplicația Flash și așa a fost conceput el să lucreze asincron)
Flash & comunicarea prin sockets
http://www.info.uaic.ro/~flash 35
Flash & comunicarea prin sockets
http://www.info.uaic.ro/~flash 36
Flash & comunicarea prin sockets
http://www.info.uaic.ro/~flash 37
Flash & comunicarea prin sockets
http://www.info.uaic.ro/~flash 38
Flash & Java sockets
Serverul va permite conexiuni la portul 4444
Aceasta este o instrucțiune blocantă (nu se trece la
următoarea linie decât după acceptarea unei conexiuni)
Sunt create două streamuri de intrare/ieșire
Într-o buclă infinită preia o linie transmisă de Aplicația Flash și o
retransmite tot către acasta
http://www.info.uaic.ro/~flash 39
• În FMS se utilizează Real-Time Messaging Protocol (RTMP) – bazate pe TCP
• FMS poate reda și fișiere FLV de exemplu… dar poate fi utilizat pentru a transmite datele preluate de la webcamul unui client către o altă aplicație Flash.
• Ideea cu transmiterea este următoarea: X trimite fluxul de imagini/sunet, FMS îl codifică superrapid într-un FLV pe care Y poate să îl vadă.
Flash & Flash [Flash Media Server]
http://www.info.uaic.ro/~flash 40
Flash & Flash [Flash Media Server]
http://www.info.uaic.ro/~flash 41
Flash & Flash [Flash Media Server]
http://www.info.uaic.ro/~flash 42
• Insert Movie Here…
Flash & Flash [Flash Media Server]
http://www.info.uaic.ro/~flash 43
• Comunicarea prin intermediul unui server Java sau a FMS presupun:
- serverele să aibă bandă destul de mare (mai mulți utilizatori simultan)
- serverul să fie pornit non-stop - serverele de multe ori sunt “neoficiale”
Dar… de cele mai multe ori comunicarea este p2p• Putem elimina serverul care stă între cele două
aplicații ce utilizează conexiunea în stil p2p ?
Flash & Flash
http://www.info.uaic.ro/~flash 44
• Stratus• Implementat în Flash Player 10 / AIR 1.5• Real-Time Media Flow Protocol (RTMFP) • RTMP utilizează TCP; RTMFP utilizează UDP [latență mică, nu face abuz de banda vreunui server,
permite prioritatea unor tipuri de date față de alte tipuri (de ex sunet prioritar față de imagine)]
• Permite conectarea p2p … … cum se accesează clienții ?!
Flash & Flash [Stratus]
http://www.info.uaic.ro/~flash 45
• Pot fi ambele calculatoare in spatele unui firewall [NAT = Network Adress Translation]
• TURN = Traversal Using Relays around NAT
Flash & Flash [Stratus]
http://www.info.uaic.ro/~flash 46
• TURN:
Flash & Flash [Stratus]
Internet
http://www.info.uaic.ro/~flash 47
• TURN:
Flash & Flash [Stratus]
Internet
http://www.info.uaic.ro/~flash 48
• TURN:
????
Flash & Flash [Stratus]
Internet
http://www.info.uaic.ro/~flash 49
• TURN:
Flash & Flash [Stratus]
Server
http://www.info.uaic.ro/~flash 50
= rtmfp://stratus.adobe.com
• Sunt mai multe aplicații care vor să fie puse în legătură. Pentru a nu le “încurca”, acest server trebuie să primească de la aplicațiile ce doresc să se interconecteze o aceeași cheie [generată de Adobe pentru fiecare programator interesat].
• Poate sunt mai mulți utilizatori ce utilizează aceeași aplicație simultan ? Pe cine cu cine conectăm ?
Flash & Flash [Stratus]
Server
http://www.info.uaic.ro/~flash 51
• După conectare, utilizatorul va primi un ID (NetConnection.nearID) pe care trebuie să-l transmită celui cu care dorește să se conecteze (de exemplu printr-un serviciu web)
• Urmează transmiterea de date [imagini & sunet]• Flash Player transmite datele numai de la
camera și microfonul propriu și nu retransmite date primite de la altcineva.
Flash & Flash [Stratus]
http://www.info.uaic.ro/~flash 52
Flash & Flash [Stratus]
http://www.info.uaic.ro/~flash 53
Flash & Flash [Stratus]
http://www.info.uaic.ro/~flash 54
Flash & Flash [Stratus]
http://www.info.uaic.ro/~flash 55
Too many words and…
…Flash Communication