question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

responseInterceptor changes headers

See original GitHub issue

Is this a bug report?

Yes

Steps to reproduce

I have a (nasty) legacy app that I’m trying to migrate away from, and I’m using http-proxy-middleware to wrap endpoints of the new and old backends. Some of the old app serves a horrible mashup of PHP, JS, and HTML, often with db queries embedded directly in the HTML/PHP files. I need to route to these, but I also need to make some changes to the HTML, pending a real overhaul of the backend. The responseInterceptor should be the perfect tool for this, but for some reason the response I get never loads: i.e. when I try to log in to our web app (legacy API), rather than serving me the homepage, I get redirected back to the login page. I recognize this may be a problem on my end, but the same process works fine if I use proxyRes.on("data", (data) => {};

This breaks:

router.use("/", proxy({
  target: <my app url>,
  changeOrigin: true,
  ws: true,
  selfHandleResponse: true,
  onProxyRes: responseInterceptor(
    async (responseBuffer, proxyRes, req, res) => {
      return responseBuffer;
    }
  ),
}));

This returns headers:

HTTP/1.1 200 OK
Access-Control-Allow-Origin: *
content-type: text/html; charset=UTF-8
Connection: close
content-length: 120251
Date: Tue, 20 Apr 2021 12:28:42 GMT

This works fine:

router.use("/", proxy({
  target: <my app url>,
  changeOrigin: true,
  ws: true,
  onProxyRes: (proxyRes, req, res) => {
    proxyRes.on("data", (data) => {
      const bufferAsString = data.toString("utf-8");
      console.log(bufferAsString);
    });
  },
}));

Which returns the desired headers:

HTTP/1.1 200 OK
Access-Control-Allow-Origin: *
server: nginx/1.18.0 (Ubuntu)
date: Tue, 20 Apr 2021 12:18:51 GMT
content-type: image/svg+xml
content-length: 2188
connection: close
last-modified: Thu, 28 Jan 2021 09:44:48 GMT
etag: "60128790-88c"
expires: Tue, 20 Apr 2021 13:18:51 GMT
cache-control: max-age=3600, public
accept-ranges: bytes

Expected behavior

I would expect responseInterceptor, when used in such a way that it does not modify the response buffer, to be side-effect free.

Actual behavior

Instead, it breaks my app ☹️

Setup

  • http-proxy-middleware: 1.1.2
  • http-proxy-middleware configuration: vanilla; see snippets above
  • server: express 4.17.1

client info

Firefox/Chrome

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Reactions:1
  • Comments:5 (3 by maintainers)

github_iconTop GitHub Comments

1reaction
chimuraicommented, Apr 20, 2021

Thanks for your report.

I’ll have to investigate this. Think when server responds with cookies it might cause issues too.

Did you identify which header was needed/missing?

If it is: Access-Control-Allow-Origin: *, you can try to set it manually:

router.use("/", proxy({
  target: <my app url>,
  changeOrigin: true,
  ws: true,
  selfHandleResponse: true,
  onProxyRes: responseInterceptor(
    async (responseBuffer, proxyRes, req, res) => {

      // set headers manually
      res.setHeader('Access-Control-Allow-Origin', '*);

      return responseBuffer;
    }
  ),
}));
0reactions
chimuraicommented, Apr 24, 2021

Thanks for the kind words!

Published the fix in v1.2.1

Read more comments on GitHub >

github_iconTop Results From Across the Web

Response Interceptor - chimurai/http-proxy-middleware - GitHub
http-proxy-middleware/recipes/response-interceptor.md ... Replace text and change http status code ... Remove the Content Security Policy header res.
Read more >
Fastify & NestJS - How to set response headers in interceptor
I have the following working for me with the FastifyAdapter in my main.ts : HeaderInterceptor. @Injectable() export class HeaderInterceptor ...
Read more >
Help! my response Interceptor is not seeing all the available ...
I have the following response interceptor defined in my app.config() ... app.js:69 response.headers Object {content-type: "application/json" ...
Read more >
Introduction | THEOplayer Documentation
The method is available under player.network and requires a request object. Within the request object, you can change headers, redirect a license request,...
Read more >
Apache HttpClient - Interceptors - Tutorialspoint
Interceptors are those which helps to obstruct or change requests or responses. Protocol interceptors in general act upon a specific header or a...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found