2015-01-06 14 views
10

Ho due app Web, una per l'interfaccia utente Web in AngularJS e una per i servizi web REST in Java. Entrambi sono distribuiti su domini separati.come implementare la protezione CSRF per le richieste cross domain

Le applicazioni utilizzano cookie per l'autenticazione. Ogni volta che l'utente immette un nome utente e una password validi, il server restituisce un cookie solo http contenente il token e tale cookie viene trasmesso attraverso tutte le richieste. Ho abilitato CORS su entrambe le app, ecco perché il cookie di sessione funziona correttamente.

Ora, sto cercando di aggiungere la protezione CSRF per questo. Stavo cercando di utilizzare il cookie csrf in cui nel server invieremo il cookie csrf (non httponly) come parte della risposta REST e l'interfaccia utente leggerà il valore dal cookie e lo passerà in un'intestazione del token csrf per le altre chiamate REST.

Il problema con questo approccio che sto affrontando è che poiché il server è in un dominio diverso, non posso leggere il cookie utilizzando $ cookies in AngularJs. C'è un modo per leggere un valore di quel cookie? In caso contrario, posso implementare CSRF in qualche altro modo?

Ho anche provato a implementare la creazione del cookie csrf sull'interfaccia utente Web stessa nel browser, ma il browser non invia il cookie al servizio web come nel suo diverso dominio.

Quindi, la mia domanda è come implementare la protezione CSRF per questo tipo di situazione?

risposta

1

Angularjs ha il supporto integrato per CSRF, ma sfortunatamente non funziona su più domini, quindi è necessario crearne uno proprio.

Sono riuscito a farlo funzionare restituendo prima un token casuale nelle intestazioni e cookie sulla prima richiesta. Per leggere l'intestazione è necessario aggiungerla a Access-Control-Expose-Headers. Questo viene poi aggiunta a tutti i messaggi

$http.get('url'). 
    success(function(data, status, headers) { 
     $http.defaults.headers.post['X-XSRF-TOKEN'] = headers('XSRF-TOKEN'); 
    }); 

Poi sul server è possibile confrontare il valore del cookie con il valore nell'intestazione per assicurare che siano gli stessi.

+0

Ho provato questo e dal momento che server è di dominio diverso, non penso che AngularJs sia stato in grado di leggere quel cookie. Ho provato manualmente e controllato, non c'era nessun cookie nell'oggetto $ cookies. Come posso risolvere questo? Inoltre ho controllato il link per AngularJS CSRF, è menzionato lì che l'intestazione non sarà impostata per richieste cross domain – user3565529

+0

Ho aggiornato la mia risposta. Per favore fatemi sapere se questo non risolve il vostro problema? –

11

Tu eri sulla strada giusta con questo:

Ho anche cercato di implementare la creazione del cookie CSRF nell'interfaccia utente Web stesso nel browser ma il browser non invia il cookie al servizio web come nel suo diverso dominio.

Il cookie CSRF non deve essere "inviato" al server, è inteso per essere letto dal client e quindi fornito in un'intestazione di richiesta HTTP personalizzata. Le richieste GET forgiate (attivate da tag HTML come <img src="">) da altri domini non possono impostare intestazioni personalizzate, quindi questo è il modo in cui asserisci che la richiesta proviene da un client javascript sul tuo dominio.

Ecco come è possibile implementare l'idea su cui stavi lavorando, immaginate di avere api.domain.com e ui.domain.com:

1) L'utente carica il cliente angolare da ui.domain.com

informazioni 2) i messaggi per l'utente l'autenticazione dal client angolare a api.domain.com

2) Sever risponde con un cookie di autenticazione HttpOnly, chiamato authCookie, e un'intestazione personalizzata ad esempio X-Auth-Cookie, dove il valore di questa intestazione è un valore univoco che è collegato alla sessione che viene identificato dal authCookie

3) Il cliente angolare legge il valore e memorizza X-Auth-Cookie intestazione che valore in un XSRF-TOKEN cookie sul suo dominio, ui.domain.com

  • Così ora avete:

    • XSRF-TOKEN cookie sul ui.domain.com
    • authCookie cookie sul api.domain.com

4) l'utente effettua una richiesta di una risorsa protetta su api.domain.com. Il browser fornirà automaticamente il valore authCookie, e angolare invierà automaticamente l'intestazione X-XSRF-TOKEN, e invierà il valore che si legge dal XSRF-TOKEN biscotto

5) Il server afferma che il valore di X-XSRF-TOKEN è legata alla stessa sessione identificato dal valore di authCookie

Spero che questo aiuti! Ho anche scritto sull'autenticazione token per Angular, Token Based Authentication for Single Page Apps (SPAs) (Dichiarazione di non responsabilità: lavoro a Stormpath)

+1

passaggio 3, come può essere letto il cookie inviato da 'api.domain.com' da 'ui.dominio.com', sono su domini diversi. – 11thdimension

Problemi correlati