使用 Cheerio 和 http-proxy-middleware 在 Express 节点中对代理响应进行 DOM 操作

Question

我已经在express Node中设置了代理服务器，运行良好。

const express = require('express');
const { createProxyMiddleware } = require('http-proxy-middleware');

const app = express();

// Define your proxy rules here
app.use(
  '/', // Replace with the path you want to proxy
  createProxyMiddleware({
    target: 'https://www.lemonade.com/',
    changeOrigin: true,
  })
);

// Start the Express server on your desired port
const port = process.env.PORT || 3000; // Use an appropriate port
app.listen(port, () => {
  console.log(`Proxy server is running on port ${port}`);
});

现在，我想执行 DOM 操作，但它不起作用。以下是到目前为止我的代码：

const express = require("express");
const { createProxyMiddleware } = require("http-proxy-middleware");
const cheerio = require("cheerio");

const app = express();

// Define your proxy rules here
app.use(
  "/", // Replace with the path you want to proxy
  createProxyMiddleware({
    target: "https://www.lemonade.com/",
    changeOrigin: true,
    onProxyRes: (proxyRes, req, res) => {
      let body = [];

      proxyRes.on("data", (chunk) => {
        body.push(chunk);
      });

      proxyRes.on("end", () => {
        body = Buffer.concat(body).toString();

        // Use Cheerio to load the HTML content
        const $ = cheerio.load(body);

        // Now you can manipulate the DOM using Cheerio
        // For example, let's change the title of the page
        $("title").text("Modified Title");

        // Set the manipulated HTML content as the response
        const modifiedHTML = $.html();
        console.log("modifiedHTML:", modifiedHTML);

        // Send the response here, outside of the Cheerio operations
        res.send(modifiedHTML);
      });
    },
  })
);

// Start the Express server on your desired port
const port = process.env.PORT || 3000; // Use an appropriate port
app.listen(port, () => {
  console.log(`Proxy server is running on port ${port}`);
});

我收到此错误：

Error [ERR_HTTP_HEADERS_SENT]: Cannot set headers after they are sent to the client

我好像漏掉了一些东西。

Answer 1

您需要添加

selfHandleResponse: true

选项，因为随着您的调用，它会被自动调用，因此会出现错误，并且此标志可以防止它：

 createProxyMiddleware({
    target: "https://www.lemonade.com/",
    changeOrigin: true,
    selfHandleResponse: true,
    onProxyRes: (proxyRes, req, res) => {
        //...

参见：

option.selfHandleResponse true/false，如果设置为 true，则不会 web传出通行证被调用，您有责任 通过倾听并采取行动来适当地返回响应 proxyRes 事件

/**
 * IMPORTANT: avoid res.end being called automatically
 **/
selfHandleResponse: true, // res.end() will be called internally by responseInterceptor()

示例