保护Aurelia的CSRF攻击

时间:2015-07-14 06:45:39

标签: javascript security csrf csrf-protection aurelia

在Aurelia中,似乎还没有任何对CSRF保护的支持,而AngularJS的XSRF-TOKEN标头与AngularJS框架的所有XHR请求都是自动设置的。 / p>

我应该如何保护Aurelia应用程序免受CSRF攻击?我应该根据OWASP CSRF Prevention Cheat Sheet推出自己的支持,还是已经为Aurelia提供了其他替代方案?

2 个答案:

答案 0 :(得分:7)

你应该能够通过使用Aurelia的HTTP interceptors(参见examples in the docs)轻松地自己做到这一点。在每次请求之前,您都可以发送令牌。这可以使用传统的aurelia-http-client和新标准aurelia-fetch-client完成。

您的代码可能如下所示:

export class MyRestAPI {
    static inject () { return [HttpClient]; } // This could easily be fetch-client

    constructor (http) {
        this.http = http.configure(x => {
            x.withBaseUrl(myBaseUrl);
            x.useStandardConfiguration();
            x.withInterceptor({
                request: function (request) {
                    request.headers.set('XSRF-TOKEN', myAwesomeToken);
                    return request;
                }
            });
        });
    }

    ...

}

在每次请求时,都会发送您的令牌。您必须在服务器端处理验证。您可以轻松设置代码,以便初始请求可以获取令牌,或者您可以将令牌作为身份验证有效负载的一部分传回,或者如果您希望甚至可以将令牌存储在浏览器的本地存储中并使用它方式。

您甚至可以更进一步实施JWT身份验证。如果您正在使用node.js,我有一个小blog post,它描述了我如何在Express中实现JWT。 Github上有一个名为aurelia-auth的插件,用于处理JWT,并且有一个blog post on its implementation on the Aurelia blog as well

答案 1 :(得分:4)

这是一个示例拦截器,它从响应头中读取令牌(如果存在),并在每个需要它的请求上自动设置它。

import {Interceptor, HttpResponseMessage, RequestMessage} from "aurelia-http-client";

class CsrfHeaderInterceptor implements Interceptor {
  private static readonly TOKEN_HEADER = 'X-CSRF-Token';

  private latestCsrfToken: string;

  response(response: HttpResponseMessage): HttpResponseMessage {
    if (response.headers.has(CsrfHeaderInterceptor.TOKEN_HEADER)) {
      this.latestCsrfToken = response.headers.get(CsrfHeaderInterceptor.TOKEN_HEADER);
    }
    return response;
  }

  request(request: RequestMessage): RequestMessage {
    if (this.latestCsrfToken) {
      if (['POST', 'PUT', 'PATCH'].indexOf(request.method) >= 0) {
        request.headers.add(CsrfHeaderInterceptor.TOKEN_HEADER, this.latestCsrfToken);
      }
    }
    return request;
  }
}

您可以在http / fetch客户端注册它,例如:

httpClient.configure((config) => {
  config
    .withBaseUrl("/api/") // adjust to your needs
    .withHeader('Accept', 'application/json') // adjust to your needs
    .withHeader('X-Requested-With', 'XMLHttpRequest') // adjust to your needs
    .withInterceptor(new CsrfHeaderInterceptor());
});