Documente Academic
Documente Profesional
Documente Cultură
Ce vom învăța?
Bibliografie
Dezvoltarea aplicațiilor Web
• Server: NodeJS
– Acces la date cu ORM;
– API REST cu ExpressJS.
• Client: ReactJS
– Componente;
– Rutare pe client;
– Flux de date / evenimente;
– Validare formulare;
– Gestiunea erorilor;
– Internaționalizare.
Protocolul HTTP
Descriere generală
• Nu neapărat fișiere;
• Nu neapărat text (deși resursele binare sunt
encodate ca text);
• Tipul resursei este definit prin tipuri MIME;
• Două perspective asupra resursei:
– La distanță;
– Locală.
Scheme de localizare
• URI (Uniform Resource Identifier)
– Identificatorul unic al unei resurse;
– Există două tipuri de URI: URL și URN.
• URL (Uniform Resource Locator):
– Locația unică unei resurse de forma:
• Contextul cererii:
– Host: numele sau adresa mașinii căreia îi este adresată cererea;
– Referer: pagina anterioară care a declanșat navigarea la resursa
curent solicitată;
– User-Agent: descrie aplicația și mediul de execuție care a trimis
cererea;
• Autentificare:
– WWW-Authenticate: definește modul de autentificare pentru
accesul la resurse;
– Authorization: precizează credențialele de acces;
– Proxy-Autehnticate: definește modul de autentificare cerut de proxy;
– Proxy-Authorization: credențialele pentru acces prin proxy.
Antete HTTP
• Negocierea conținutului:
– Accept: tipul de resursă acceptată ca răspuns;
– Accept-Charset: setul de caractere în care se așteaptă
conținutul răspunsului;
– Accept-Encoding: tipul de condificare a răspunsului;
– Accept-Language: limba răspunsului.
• Gestiunea conexiunii:
– Connection: permite păstrarea conexiunii după
încheierea transacției curente;
– Keep-Alive: controlează durata cât va rămane deschisă
conexiunea.
Antete HTTP
301 Permanent redirect – Conținutul a fost mutat definitive la o nouă adresă astfel încât cererile
viitoare trebuiesc adresate către această locație.
302 Temporary Redirect – Cererile vor fi adresate în continuare către locația inițială.
303 See Other – Acest cod a fost introdus pentru a converti o cerere de tip POST la una de tip
GET, cu toate acestea multe browser-e tratează 302 ca 303.
304 Not Modified – Folosit ca răspuns la un antet If-Modified pentru a redirecta răspunsul către
cache-ul browser-ului.
Amount=10&B2=Submit
Trimiterea de cereri HTTP
utilizând Postman
Cookie-uri
Serverul setează cookie-uri pe client
trimițând țn răspuns antetul set-cookie:
Set-Cookie: name=value
<script type="text/javascript">
function GetShoppingList()
{
// Create an instance of the HTTP request object
var xmlHttp = new XMLHttpRequest();
// Specify HTTP GET by default and supply the relative url
xmlHttp.open("GET", "getlist.aspx", false);
// Start a synchronous AJAX request and wait for the response
xmlHttp.send(null);
var targetNode = document.getElementById("divShoppingList");
// Use the HTML returned from server to create list
targetNode.innerHTML = xmlHttp.responseText;
}
</script>
CORS
Cross-origin Resource Sharing
HTTP/1.1 200 OK
Date: Mon, 01 Dec 2008 01:15:39 GMT
Access-Control-Allow-Origin: http://foo.example
Access-Control-Allow-Methods: POST, GET, OPTIONS
Access-Control-Allow-Headers: X-PINGOTHER
Access-Control-Max-Age: 1728000
RĂSPUNS
RĂSPUNS
CHI M BAT
NES
Probleme cu HTTP-ul
• Timpul de răspuns devine mai lent atunci
când numărul resursele solicitate crește.
Resurse multiple
Resursă unică +
Resurse multiple Bi-directional
SPDY în HTTP 2.0
Interogare
Date
Server
Client
Interogare
Interogare
Date
Răspuns fără date
Interogare Server
Client
Conectare
Răspuns fără date
Interogare Date
Date
Server
Client
Răspuns conținând date Date
Date
Închiderea conexiunii
Web Sockets
Cerere Răspuns
GET /mychat HTTP/1.1 HTTP/1.1 101 Switching Protocols
Host: server.example.com Upgrade: websocket
Upgrade: websocket Connection: Upgrade
Connection: Upgrade Sec-WebSocket-Accept:
Sec-WebSocket-Key: HSmrc0sMlYUkAGmm5OPpG2HaGWk=
x3JJHMbDL1EzLkh9GBhXDw== Sec-WebSocket-Protocol: chat
Sec-WebSocket-Protocol: chat
Sec-WebSocket-Version: 13
Origin: http://example.com
HTTPS