通过 RequestHook 添加响应 headers

Question

如何将 headers 添加到 Testcafe 的响应中？到目前为止，我已经尝试使用 RequestHook class 的 onResponse 函数。使用 RequestLogger，我可以验证是否添加了 headers，但它们实际上并没有进入浏览器（在 [=25= 中的响应 headers 列表中不可见] 的网络选项卡）。

这是我正在使用的：

import { RequestLogger, RequestHook } from 'testcafe';

class HeadersHook extends RequestHook {
  constructor(requestFilterRules) {
    super(requestFilterRules, { includeBody: false, includeHeaders: true });
  }

  async onRequest(event) { }

  async onResponse(event) {
    event.headers['bar'] = 'foo';
    event.headers.foo = 'bar';
    console.log('hook: ', event.headers);
  }
}

fixture('My Fixture');

test('Example internal-sdk usage', async (t) => {
  const headerLogger = RequestLogger(process.env.TEST_URL, {
    logResponseHeaders: true
  });

  // This order is significant: adding the logger first causes it to miss the additional headers.
  // Not sure why.
  await t.addRequestHooks(new HeadersHook(process.env.TEST_URL));
  await t.addRequestHooks(headerLogger);

  await t.navigateTo(process.env.TEST_URL);
  console.log('logger: ', headerLogger.requests.length, headerLogger.requests[0].response.headers);

  t.debug();
});

这给出了以下控制台输出，似乎表明 headers 已成功添加：

hook:  {
  'content-type': 'text/html;charset=utf-8',
  vary: 'origin,accept-encoding',
  'access-control-allow-credentials': 'true',
  'access-control-expose-headers': 'WWW-Authenticate,Server-Authorization',
  'cache-control': 'no-cache',
  'content-encoding': 'gzip',
  date: 'Fri, 05 Mar 2021 16:43:06 GMT',
  connection: 'keep-alive',
  'keep-alive': 'timeout=5',
  'transfer-encoding': 'chunked',
  bar: 'foo',
  foo: 'bar'
}
logger:  1 {
  'content-type': 'text/html;charset=utf-8',
  vary: 'origin,accept-encoding',
  'access-control-allow-credentials': 'true',
  'access-control-expose-headers': 'WWW-Authenticate,Server-Authorization',
  'cache-control': 'no-cache',
  'content-encoding': 'gzip',
  date: 'Fri, 05 Mar 2021 16:43:06 GMT',
  connection: 'keep-alive',
  'keep-alive': 'timeout=5',
  'transfer-encoding': 'chunked',
  bar: 'foo',
  foo: 'bar'
}

但是在浏览器的网络选项卡中，我看到的是这个（缺少额外的headers）：

access-control-allow-credentials: true
access-control-expose-headers: WWW-Authenticate,Server-Authorization
cache-control: no-cache
connection: keep-alive
content-encoding: gzip
content-type: text/html;charset=utf-8
date: Fri, 05 Mar 2021 16:45:51 GMT
keep-alive: timeout=5
transfer-encoding: chunked
vary: origin,accept-encoding

Answer 1

这种行为看起来像一个错误，因为在钩子中修改 headers object 不会影响真正的响应。我在 GitHub 上重新打开了作者的问题：https://github.com/DevExpress/testcafe/issues/6021.

目前，将 headers 添加到响应的唯一方法是使用 RequestHook class:

的私有 _onConfigureResponse 方法

class HeadersHook extends RequestHook {
  constructor(requestFilterRules) {
    super(requestFilterRules, { includeBody: false, includeHeaders: true });
  }

  async onRequest () { }

  async onResponse () { }

  _onConfigureResponse (event) {
    super._onConfigureResponse(event);

    event.setHeader('foo', 'bar');
    event.setHeader('bar', 'foo');
  }
}

请注意，此 API 是私人的，将来可能会更改。请参阅上面的 GitHub 问题以跟踪其状态。

通过 RequestHook 添加响应 headers

Add response headers via RequestHook

javascript

testing

automated-tests

e2e-testing

testcafe