Error: CSRF token missing

[anjali-chadha]

Hi, I am trying to integrate lusca in my application using Angular,Express and Node. Please help me with the following issue Error: CSRF token missing

Angular: Included a hidden input in a form to generate content="b4XIZqlfDLlHQbfbk381gO0UupiLY8WYFAYw0="

node: Included session and cookie

var session = require('express-session'); 
app.use(session({
  resave: true,
  saveUninitialized: true,
  secret: secrets.sessionSecret,
  store: new MongoStore({ url: secrets.db, autoReconnect: true })
}));

var cookieParser = require('cookie-parser');
app.use(cookieParser());

app.use(lusca({
    csrf: true,
    csp: { /* ... */},
    xframe: 'SAMEORIGIN',
    p3p: 'ABCDEF',
    hsts: {maxAge: 31536000, includeSubDomains: true, preload: true},
    xssProtection: true
}));

Please help me debug why I get Error CSRF token missing on my node server.

Let me know if you need more details.

Thank You

[anjali-chadha]

It is as following

head
    meta(name='csrf-token', content=_csrf)
body
   form
         input(type='hidden', name='_csrf', value=_csrf)

(Generated as expected)

[thefourtheye]

Sorry, my bad. I was wrong.

[anjali-chadha]

No problem. It looks like lusca does not support angular and there is already an open issue https://github.com/krakenjs/lusca/issues/27

[aredridel]

Correct -- you can make it work but it'll be manually, not using Angular's support for this. You'll need to propagate the _csrf value from the res.locals to the frontend and back.

[anjali-chadha]

@aredridel Please provide an example to do this in frontend and back. That would be really helpful for me!

[aredridel]

I've created a sample project at https://github.com/aredridel/luscangular that uses lusca and angular with a trivial middleware to relay the res.locals._csrf into the cookie that Angular expects.

The commit history should provide a reasonable how-to.

[jeveloper]

First of all i appreciate the good work you do @aredridel .

Just curious if latest lusca 1.3 has any issues related to csrf mismatch, i have had a lot of trouble with it, i did do whats required:

1. angular passes header with token $http.defaults.headers.post['XSRF-TOKEN'] = $cookies.get('XSRF-TOKEN');

2. specifying headers

   $httpProvider.defaults.xsrfHeaderName = 'X-XSRF-TOKEN'; $httpProvider.defaults.xsrfCookieName = 'XSRF-TOKEN';

3. on express side csrf: { angular: true },

Not using krakenjs

and yet still the same error, any tips?

thank you

[jasisk]

Should be working just fine. Do you have a cookie parsing middleware on the express side?

I wrote a little example project a few months back. It's using kraken but the basic principles still apply.

You can see the config I'm using for lusca here. The equivalent for a vanilla express app would be:

var cookieParser = require('cookie-parser');
var express = require('express');
var lusca = require('lusca');

var app = express();

var opts = { csrf: { angular: true } }; // options for lusca

app.use(cookieParser());
app.use(lusca(opts)); // lusca registered AFTER cookieParser

app.listen(8000);

After that, I don't need to do any special configuration in the angular app, itself.

[jeveloper]

@jasisk Thanks for response. I read that express no longer requires cookie parser , i tried with and without it.

Are you saying that my angular app doesn't need to try to store a token it receives on the first load and later pass it in its headers?

I've observed something odd, using chrome dev tool, for the moment i use memory as a session store (later ill use redis). Also my angular app (1.5) has ngRoute. I am curious if this can be a problem:

/?someparam=fdsfds will redirect to ngroute "/location" like this return $location.path('/location');

This would probably generate 2 different tokens.

What do you think?