Updated how csrf is handled

Author: Dan Wahlin

src/.vscode/launch.json

@@ -0,0 +1,25 @@
+{
+    // Use IntelliSense to learn about possible Node.js debug attributes.
+    // Hover to view descriptions of existing attributes.
+    // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387
+    "version": "0.2.0",
+    "configurations": [
+        {
+            "type": "node",
+            "request": "launch",
+            "name": "Launch Program",
+            "program": "${workspaceRoot}/server.js",
+            "cwd": "${workspaceRoot}",
+            "outFiles": [],
+            "sourceMaps": true
+        },
+        {
+            "type": "node",
+            "request": "attach",
+            "name": "Attach to Process",
+            "port": 5858,
+            "outFiles": [],
+            "sourceMaps": true
+        }
+    ]
+}

src/controllers/api/tokens/tokens.controller.js

@@ -1,15 +1,36 @@
-const  util = require('util');
+const  util = require('util'),
+       url = require('url');
+
+//#### WARNING: Shown for an example but not recommended!!!!
+//#### Read more at https://github.com/pillarjs/understanding-csrf
+//#### The following is not recommended - said that twice now!!!! :-)
 
 class TokensController {
 
     constructor(router) {
+        //Check referer
+        router.use(this.refererCheck.bind(this));
+
+        //This can be VERY, VERY DANGEROUS if not done properly so just avoid it! Make sure:
+        //1. CORS is disabled for this route if you've enabled CORS (CORS is not enabled in this app)
+        //   Note that disabling CORS won't prevent GET/POST requests using standard HTML though
+        //2. Should always check referrer to be safe (see referrerCheck() middleware above)
         router.get('/csrf', this.getCsrfToken.bind(this));
     }
 
+    refererCheck(req, res, next) {
+        //Simple check to ensure that calls to routes here are only supported for http(s)://localhost:3000
+        var referer = url.parse(req.headers.referer);
+        console.log('Referer: ' + req.headers.referer);
+        if (referer.host !== 'localhost' && referer.port !== '3000') {
+            throw new Error('Invalid request');
+        }
+        next();
+    }
+
     getCsrfToken(req, res) {
         console.log('*** getCsrfToken');
-        const csrfToken = res.locals._csrf;
-        res.json({ csrfToken: csrfToken });
+        res.json({ csrfToken: res.locals._csrf });
     }
 }
 

src/package.json

@@ -26,7 +26,8 @@
         "reflect-metadata": "^0.1.8",
         "rxjs": "5.0.0-beta.12",
         "zone.js": "^0.6.26",
-        "body-parser": "~1.15.2",
+        "cookie-parser": "^1.4.3",
+        "body-parser": "^1.15.2",
         "csurf": "^1.9.0",
         "errorhandler": "^1.5.0",
         "express": "^4.14.0",

src/public/app/core/core.module.js

@@ -1,5 +1,5 @@
 import { NgModule, Optional, SkipSelf } from '@angular/core';
-import { HttpModule } from '@angular/http';
+import { HttpModule, XSRFStrategy, CookieXSRFStrategy } from '@angular/http';
 
 import { DataService } from './data.service';
 import { DataFilterService } from './data-filter.service';
@@ -9,7 +9,10 @@ import { EnsureModuleLoadedOnceGuard } from '../shared/ensureModuleLoadedOnceGua
 
 @NgModule({
   imports: [ HttpModule ],
-  providers: [DataService, DataFilterService, Sorter, TrackByService] // these should be singleton
+  providers: [
+    //Default XSRF provider setup (change cookie or header name if needed): 
+    //{ provide: XSRFStrategy, useValue: new CookieXSRFStrategy('XSRF-TOKEN', 'X-XSRF-TOKEN') },
+    DataService, DataFilterService, Sorter, TrackByService] // these should be singleton
 })
 export class CoreModule extends EnsureModuleLoadedOnceGuard {    //Ensure that CoreModule is only loaded into AppModule
 

src/public/app/core/core.module.js.map

@@ -13,26 +13,11 @@ import { ICustomer, IOrder, IState } from '../shared/interfaces';
 export class DataService {
 
     baseUrl: string = '/api/customers';
-    csrfToken: string = null;
 
     constructor(private http: Http) { 
-        this.onInit();
-    }
-
-    onInit() {
-        this.getCsrfToken();
-    }
 
-    getCsrfToken() {
-        return this.http.get('/api/tokens/csrf')
-                   .map((res: Response) => res.json().csrfToken)
-                   .catch(this.handleError)
-                   .subscribe((token: string) => {
-                       this.csrfToken = token;
-                   },
-                   (err) => console.log(err));
     }
-    
+   
     getCustomers() : Observable<ICustomer[]> {
         return this.http.get(this.baseUrl)
                    .map((res: Response) => {
@@ -64,7 +49,7 @@ export class DataService {
     }
 
     insertCustomer(customer: ICustomer) : Observable<ICustomer> {
-        return this.http.post(this.baseUrl, customer, this.getRequestOptions())
+        return this.http.post(this.baseUrl, customer)
                    .map((res: Response) => {
                        const data = res.json();
                        console.log('insertCustomer status: ' + data.status);
@@ -74,7 +59,7 @@ export class DataService {
     }
 
     updateCustomer(customer: ICustomer) : Observable<ICustomer> {
-        return this.http.put(this.baseUrl + '/' + customer._id, customer, this.getRequestOptions())
+        return this.http.put(this.baseUrl + '/' + customer._id, customer) 
                    .map((res: Response) => {
                        const data = res.json();
                        console.log('updateCustomer status: ' + data.status);
@@ -84,14 +69,15 @@ export class DataService {
     }
 
     deleteCustomer(id: string) : Observable<boolean> {
-        return this.http.delete(this.baseUrl + '/' + id, this.getRequestOptions())
+        return this.http.delete(this.baseUrl + '/' + id)
                    .map((res: Response) => res.json().status)
                    .catch(this.handleError);
     }
 
     getRequestOptions() {
+        //Not needed since 
         const options = new RequestOptions({
-            headers: new Headers({ 'csrf-token': this.csrfToken })
+            headers: new Headers({ 'x-xsrf-token': this.csrfToken })
         });
         return options;
     }