错误：CSRF 令牌丢失，hackathon-starter 加上 AngularJS答案

【问题标题】：Error: CSRF token missing, hackathon-starter plus AngularJS错误：CSRF 令牌丢失，hackathon-starter 加上 AngularJS
【发布时间】：2015-07-19 09:09:57
【问题描述】：

我正在将 AngularJS 集成到 hackathon-starter 中。正如我在here 提到的那样，使用以下 test.html 和 test.controller.js 完成了

<div>
    The record: {{record}}
</div>

<div align="right">
    <button class="btn btn-lg btn-primary" ng-click="createRecord()" onclick="window.location.href='/order/shipping'">
        <i class=""> Create record</i>
    </button>
</div>

test.controller.js

(function () {

'use strict';
var injectParams = ['$scope', '$location', '$http'];

function TestController($scope, $location, $http) {

    $scope.record = {
        interId: 1,
        sku: '107k',
        category: 'Useful'
    };

    function createRecord(record) {
        return $http.post('/order/create', record).then(function (response) {
            return response.data;
        })
    }

    $scope.createRecord = function () {

        var record = $scope.record;

        createRecord(record)
            .then(function (data) {
                if (data.success) {
                    return $location.url('/shipping');
                }
                alert('Something wrong...');
            });
    }
};

TestController.$inject = injectParams;

angular.module('miniApp')
    .controller('TestController', TestController);
}());

如果 csrf 的值设置为 false，它会起作用，例如：

 app.use(lusca({
    csrf: false,
    xframe: 'SAMEORIGIN',
    xssProtection: true }));

当 csrf 的值设置为 true 时，会出现以下错误： 错误：缺少 CSRF 令牌

解决此问题的一个选项是在 lusca 配置之前提出对“/order/create”路径的请求，例如：

app.post('/order/create', passportConf.isAuthenticated, orderController.postCreateOrder);
app.use(lusca({
csrf: true,

...

但是这个解决方案不是很优雅。

另一种选择是在 CSRF 中间件中使用 whitelist dynamic URLs using regular expression。我尝试了这种方法，但我缺乏如何正确执行此操作的经验。 如何通过白名单解决这个问题（具体示例）？

我可能是错的，但应该可以在 test.controller.js 中传递 csrf。怎么做我不知道。所以，如果有人能提供具体的例子，那就太好了。

带有白名单的解决方案将被排除在外，因为我不知道如何使其发挥作用。

【问题讨论】：

标签： angularjs node.js express csrf-protection

【解决方案1】：

据我所知，lusca 没有内置任何易于配置的 CSRF 白名单，hackathon-starter 也没有。从您的linked article 措辞方式来看，听起来他们希望您在自己的自定义中间件中自己进行白名单。为此，我认为您可能需要放弃您的 app.use(lusca({})) 调用，而是单独 app.use() 每个 lusca 中间件，如下所示：

var csrfMiddleware = lusca.csrf();
app.use(function(req, res, next) {
    // Paths that start with /foo don't need CSRF
    if (/^\/foo/.test(req.originalUrl)) {
        next();
    } else {
        csrfMiddleware(req, res, next);
    }
});

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

【讨论】：