Same-origin policy, AJAX, CORS e sicurezza
HTML-код
- Опубликовано: 11 сен 2024
- Ovvero: perché il browser non ti lascia fare chiamate AJAX dove cavolo ti pare.
Piccolo bonus a fine video: attacco CSRF usando una form e come evitarlo.
0:17 Definizione di same-origin policy (per le chiamate AJAX)
1:08 È il browser che blocca la chiamata!
1:49 Plugin che disabilitano la same-origin policy
2:52 Dettagli sul sito di esempio (A-Social)
3:29 Semantica dei metodi HTTP
4:17 Descrizione esempio endpoint /echo
5:11 GET /echo
6:19 PUT /echo (diventa OPTIONS - preflight request)
7:10 Impostazione header CORS sul server
8:29 Il comportamento cambia anche a seconda del Content-Type
9:55 Ripasso su come funzionano le sessioni
10:39 Di default nelle CORS non viene usato il cookie di sessione
11:18 Come usare i cookie di sessione con le CORS
12:28 Access-Control-Allow-Origin con domini multipli, regex e casini vari
14:55 Le form sono persone orribili
17:07 Prevenzione attacco CSRF con i token
Buona panoramica sulle CORS (in inglese):
developer.mozi...
Access-Control-Allow-Origin per domini multipli:
stackoverflow....
Codice usato in questo video:
bitbucket.org/...
![06 - Gestire conflitti tra dipendenze con Maven - [Tutorial su Maven in italiano]](http://i.ytimg.com/vi/szr50gY3jTY/mqdefault.jpg)
![05 - Ereditarietà tra progetti Maven - [Tutorial su Maven in italiano]](/img/1.gif)
Cari followers,
perdonate l'assenza. So che state aspettando altri tutorial su Java/Jakarta EE, ma ho dovuto dare la priorità a questo video ;)
Infatti, l'idea di trattare questo argomento è nata in seguito ad un irritante scambio di mail con un "collega", assiduo utilizzatore di Internet Explorer con le impostazioni di sicurezza disabilitate, il quale sostiene che le problematiche trattate in questo video non esistono. Mi auguro che gli rubino presto il conto in banca. :-*
Grazie di esistere ! Stavo impazzendo
Come hai fatto a uscire da vim!!!!! :) Ottimo video
Ottima sintesi! Grazie!
Come sempre, ottimo video! :)
ciao innanzitutto ti faccio i complimenti per i tutorial sono fatti bene!!! Volevo chiederti se farne uno su framework Spring
Ciao, grazie! Diverse persone mi hanno chiesto tutorial su Spring. È un framework molto vasto col quale non ho esperienza lavorativa diretta, ma lo sto approfondendo. Penso che proverò a fare dei tutorial ma non subitissimo.
Ciao xonya, grazie ottimo tutorial illustrativo! Mi hai fatto un po' di chiarezza, grande! Potresti mettere l'esempio su github? Soprattutto la parte del server col token? Grazie
Ciao! Trovi il link al codice in fondo alla descrizione. Come dicevo, è un'implementazione "grezza", da non usare in produzione. In particolare, memorizzare solo 1 token (quello dell'ultima richiesta) può creare casini quando usi il tasto back del browser o apri l'applicazione su più tab (perché solo l'ultimo token generato è ancora valido). Tipicamente i framework memorizzano un insieme di più token. Se usi JSF c'è il ViewState (generato in automatico) che, anche se è nato per altri scopi, a partire da JSF 2.2 è considerato equiparabile a un token anti-CSRF. Essendo un video incentrato su AJAX e CORS non ho approfondito gli aspetti riguardo ai token anti-CSRF, che è un argomento correlato ma comunque diverso.
xonya grazie, non l'avevo visto. Uso spring principalmente
Prego! Spring Security dovrebbe permetterti di configurare questi token.
Ciao grazie del video.
Una cosa che min è oscura sono le reflex.
Hai qualche link o video in merito a tale argomento?
Prego! Morrolinux è bravo con le regex: ruclips.net/video/fPii79dBQqY/видео.html
Ti ringrazio
Ciao, grazie mille per il tutorial!
Una domanda riguardo alle richieste GET senza l'header "Access-Control-Allow-Origin".
Nel video fai vedere che comunque la risposta di una GET è visibile nel tab network (5:43, "ECHO: richiesta GET").
Se provo a fare una richiesta GET cross-origin con "fetch" come hai fatto tu nel mio browser, vedo l'errore rosso CORS dovuto all'header "Access-Control-Allow-Origin" mancante con in più anche un warning giallo "Cross-Origin Read Blocking (CORB) blocked cross-origin response ... with MIME type application/json. See www.chromestatus.com/feature/5629709824032768 for more details.".
Questo warning giallo non compare nel tuo video. In più nel tab network, non vedo il contenuto della risposta GET (vedo "Nothing to preview" nel tab "Preview"), come invece avviene nel tuo video.
È possibile che Chrome abbia cambiato qualcosa da quando hai pubblicato questo video? Se riprovi a fare la stessa richiesta ora, vedi anche tu il warning giallo senza vedere il contenuto della response GET?
Ciao Anton, grazie per il commento! Ho provato oggi con Chrome 74 e non mi mostra il warning, però nel tab preview mi compare "Failed to load response data", quindi qualcosa è cambiato nelle nuove versioni e leggendo la documentazione sulle CORB mi sembra un comportamento in linea con la strategia che viene descritta nel documento. È una feature nuova che hanno introdotto dopo il caso Spectre/Meltdown. Se riesco ad approfondire faccio un video, sembra interessante!
@@zonia3000 Grazie per il feedback! Anche io ho Chrome 74, ho riprovato oggi e non vedo più il warning nemmeno io. Credo che abbiano cambiato di nuovo con un aggiornamento a questo punto. Tu le chiamate AJAX nelle tue prove le facevi con jQuery .ajax() o tramite fetch()?
@@zonia3000 Ho riprovato e il warning lo vedo solo quando solo uso jQuery .ajax() ("Nothing to preview"), mentre con fetch() vedo l'errore "Failed to load response data". Penso che il warning compaia solo quando viene usato l'oggetto XMLHttpRequest, che jQuery utilizza sotto il cofano.
Però confermo che in entrambi i casi (jQuery e fetch), non vedo il contenuto della risposta nel tab network.
@@antonbagdatyev3699 Le chiamate le facevo con fetch (trovi il link al codice usato nella descrizione del video). Ho fatto un paio di prove ora e per far apparire il warning devo usare jQuery ma anche aggiungere questo header nella configurazione del server: "X-Content-Type-Options: nosniff" (file .htaccess). Io sto usando Apache 2.4.33, ma magari altri server (o versioni più recenti di Apache) includono questo header di default.
Piccola curisoità, cosa hai studiato all'università?
Scusami, questo commento mi era sfuggito! Ti rispondo lo stesso con un leggero lag di 4 mesi :-P Ho una laurea triennale in Tecnologie Web e Multimediali ma gran parte di quello che mostro in questi video è frutto di studio personale.
Hai la voce bassa... Migliora l audio.. Sui mezzi in strada non si sente :)
Internet Explorer??... cos'e' ??? ah ah ah poveretto!!!
Nel mio primo lavoro mi chiedevano di garantire la compatibilità delle web app con IE 8. Era sempre un incubo! Mi viene l'ansia solo a sentirlo nominare :D