Playwright点击按钮后无法获取JSON响应体的问题求助

问题1：Protocol error (Network.getResponseBody): No resource with given identifier found #

这个错误是因为浏览器已回收响应资源，导致后续调用resp.body()/resp.json()时无法定位到对应资源。可通过两种方案解决：

方案1：用page.route拦截请求（更可靠） #

直接在响应到达时拦截目标API，实时获取响应体，避免资源被回收：

await page.route('https://example.com/user-check', async (route) => {
  const response = await route.fetch();
  const body = await response.text(); // 按需选择response.json()/response.body()
  console.log("Response body:", body);
  await route.continue(); // 让响应继续传递给页面
});

await page.click('#clickButton');

方案2：调整waitForResponse的使用逻辑 #

确保在响应资源未被回收时立即获取响应体，避免异步回调延迟处理：

const respPromise = page.waitForResponse(resp => 
  resp.url().includes('https://example.com/user-check') && 
  resp.status() === 200 && 
  resp.request().method() === 'POST'
);

await page.click('#clickButton');
const resp = await respPromise;
// 立即执行响应体获取操作
const body = await resp.json(); // 按需选择resp.text()/resp.body()
console.log("Response body:", body);

问题2：TypeError [ERR_INVALID_ARG_TYPE]: The "buffer" argument must be of type... #

这个错误是因为resp.body()返回的是Promise，而zlib.gunzipSync需要实际的Buffer实例，必须先通过await拿到实际值再传入：

const zlib = require('zlib');

const respPromise = page.waitForResponse(resp =>
  resp.url().includes("https://example.com/user-check") &&
  resp.status() === 200 &&
  resp.request().method() === "POST"
);
await page.click("#buttonClick");
const resp = await respPromise;

const buffer = await resp.body(); // 先await获取实际Buffer
const decompressed = zlib.gunzipSync(buffer);
console.log("Response body:", decompressed.toString()); // 转成字符串查看内容

如果响应是JSON格式，解压后可直接解析：

const jsonData = JSON.parse(decompressed.toString());
console.log("Parsed JSON:", jsonData);

补充说明 #

• 若使用page.route方案，也可直接处理gzip压缩响应：

  await page.route('https://example.com/user-check', async (route) => {
    const response = await route.fetch();
    const buffer = await response.body();
    const decompressed = zlib.gunzipSync(buffer);
    const jsonData = JSON.parse(decompressed.toString());
    console.log("Parsed JSON:", jsonData);
    await route.continue();
  });
  

• 确保已正确引入zlib模块：const zlib = require('zlib');

内容的提问来源于stack exchange，提问作者Adam