如何在Angular通用Httpclient Xhr调用中设置"Referer"header？

Question

我有一个 Angular 通用 SSR 应用程序，它使用 HttpClient 从 API 服务器获取数据。一切正常，我可以渲染数据 server-side.

问题是我想让浏览器在 CSR 中默认设置客户端 Referer，并根据每个站点发送数据（我有多个不同域的站点）。

我得到这样的引用：

import { isPlatformBrowser } from '@angular/common';
import { REQUEST } from '@nguniversal/express-engine/tokens';
...

if (!this.isBrowser) {
  const serverRequest = this.injector.get(REQUEST) as Request;
  this.referer = `${serverRequest.protocol}://${serverRequest.get('Host')}`;
  console.log('refrerr is : ',this.referer) 
}

然后我将它设置在我的 header 中：

request = req.clone({
    url: `${this.Config.url}${req.url}`,
    setHeaders: {
      referer: this.referer,
    },
    params
  });

但我在控制台中收到此错误：

Refused to set unsafe header "referer"

Answer 1

试试这个

npm install xhr2

然后在您的 server.ts 文件中

import * as xhr2 from 'xhr2';

//...
xhr2.prototype._restrictedHeaders = {};

如何在Angular通用Httpclient Xhr调用中设置"Referer"header？

How to set "Referer" header in Angular universal Httpclient Xhr calls?

xmlhttprequest

referer

express

angular-universal

angular