CSRF Token Security

1
votes

i have disabled the laravel CSRF Token security in my application, the reason for doing it is that i am using a javascript frontend framework instead of blade (angularjs) and i have a mobile app that uses the same routes as my web app so having it enabled caused me to get "Token mismatch" errors or "inavlid token".

My question is now that i have made my client side code completely independent of my server side code how do i implement this feature?

Also how would i make it work on my mobile app too since the APIs use the same routes as the web app.

1
javascriptangularjslaravel-5
I tagged this as angularjs and javascript because the solution will obviously be in javascript. – user3718908
you can even use CSRF token with you $http service that wont be the issue with laravel – Karthick Kumar
But how do inject the token unto the page when it loads? Also how will this work on my mobile app too? Do i need to send the CSRF token to the mobile app as well? – user3718908
laravel.com/docs/5.0/routing#csrf-protection – Karthick Kumar
How will that work with my mobile app? – user3718908

1 Answers

1
votes

The web part

As I understand with statement "i have made my client side code completely independent of my server side code", you mean that, your backend is on different host/port than angularJS app.

This makes troubles, beacuse of CORS: http://en.wikipedia.org/wiki/Cross-origin_resource_sharing

How CSRF work:

  1. backend app: send cookie to browser with CSRF token
  2. browser: save token from backend app
  3. browser: send token with next POST/PUT/DELETE request

Your app fails in step 2, beacuse browser will save cookie only when protocol, host and port match those from frontend app.

If you want to implement custom CSRF tokens, you have to make $http interceptor service which will deal with adding CSRF to requests and update current CSRF after request.

Doc: https://docs.angularjs.org/api/ng/service/$http (section interceptors)

To test if I am right, you can run browser with disabled web security. CSRF tokens will then be saved.

For chrome / chromium:

  1. Go to terminal
  2. cd to chrome folder
  3. Run chrome --disable-web-security

The mobile app

Everything depends on your HTTP client in the app. CSRF are actually cookies and they have to be sended in every request different than GET and updated after these requests. Please make sure, that your library is saving CSRF cookies and your web app sends CSRF cookies (not headers).