CSRF 使用绝对 URL - Angular

Question

我希望在 gh-pages 上部署一个 angular 前端应用程序并在 heroku 上部署一个 springboot 应用程序，因此它们显然会运行在不同的服务器上。默认 angular xsrf 似乎不能支持这个。是否有一种干净的方法来自动处理所有 csrf cookie 和 headers，或者我是否需要像这里一样破解一个解决方案？

Answer 1

创建自定义 HttpInterceptor 并确保将其作为提供商包含在 app.module 中。

这是我使用的类似 class 的示例。您可以替换 If 条件中的条件以匹配您的特定用例。

您可以在 Angular Here

中找到有关 HTTP 拦截器的更多信息

@Injectable({
  providedIn: 'root'
})
export class AbsoluteurlCsrfHeaderInterceptorService implements HttpInterceptor {

  constructor(
    private tokenExtractor: HttpXsrfTokenExtractor,
    private environment: Environment
  ) {}

  // add application default headers to all requests
  intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
    const headerName = 'X-CSRF-Token';

    const token = this.tokenExtractor.getToken() as string;
    let newReq = req.clone();

    // because we are using aboslute paths in development mode
    // we can't rely on the built in CSRF behavior
    // if we are not in prod mode and the url is absolute (begins with http)
    // add the csrf token if one exists
    if ( !this.environment.production
      && this.environment.api_endpoint.length
      && ( req.url.substr(0, 4 ) === 'http' || req.url.substr(0, 5 ) === 'https')
      && token !== null
      && !req.headers.get(headerName)
    ) {
      newReq = req.clone({headers: req.headers.set(headerName, token)});
    }

    return next.handle(newReq);
  }

}

CSRF 使用绝对 URL - Angular

CSRF using absolute URL - Angular

csrf

angular