EventSource not working about http-proxy-middleware HOT 12 CLOSED

@chimurai I've verified that it works when you disable compression, but what it does not do is close the connection to the server when the client disconnects from an EventStream. I've tried it both with just closing the browser window and with cleaning up with eventStream.close(). I'm using http-proxy-middleware through the webpack dev server.

from http-proxy-middleware.

@chimurai Why is this closed? SSE is definitely not working over http-proxy-middleware.
I tested with a simple barebone setup (https://dev.to/4shub/building-with-server-sent-events-13j - only with express and http-proxy-middleware) and it's working without the middleware, but not working when I try to proxy.

Also every time the connection times out node logs out this message:
[HPM] Error occurred while trying to proxy request /stream-random-numbers from localhost:4000 to http://localhost:4040 (ECONNRESET) (https://nodejs.org/api/errors.html#errors_common_system_errors)

I can setup an example repo if needed, to demonstrate that messages are not arriving to the client

from http-proxy-middleware.

any example for SSE ?

from http-proxy-middleware.

@jmls Could you provide a sample setup showing this issue? Debugging it will be much faster.

Did you tried your setup with express + http-proxy-middleware to check if the same issue occurs. If it doesn't than it might be an issue browser-sync. If it also happens in that setup it might be an issue in http-proxy-middleware.

from http-proxy-middleware.

Don't think this is a http-proxy-middleware issue.

Feel free to re-open this issue if you think it is a bug.

from http-proxy-middleware.

Just out of curiosity: Is there any way to set the keep alive timeout for proxy within webpack config?
When using SSE (EventSource) in combination with http-proxy-middleware, proxy disconnects SSE after 2 minutes (I assume it's the proxy's default keep-alive timeout).

Is there any flag I can set to avoid a SSE keep-alive-related disconnect?

devServer: {
    proxy: {
      '/api/*': {
        target: 'XYZ',
        secure: false,
        changeOrigin: true
      },[...]

from http-proxy-middleware.

I never used SSE...

But you can try to configure a custom agent and set the timeout accordingly.
https://nodejs.org/api/http.html#http_class_http_agent

You'll something like this:

const http = require('http');
var keepAliveAgent = new http.Agent({ keepAlive: true });

devServer: {
    proxy: {
      '/api/*': {
        target: 'XYZ',
        secure: false,
        changeOrigin: true,
        agent: keepAliveAgent
      },[...]

from http-proxy-middleware.

Has anyone made progress using eventSource requests through httlp-proxy-middleware? For my tests, the request works, but reconnection fails, even with the agent set as above.

from http-proxy-middleware.

Same problem.

from http-proxy-middleware.

Here is an issue #371 in which compression module is causing issues. Maybe it's related to that.

A dozen of (mis)configuration can lead to a non-working setup.
Without a minimal working example (server + client) there is little to investigate.

from http-proxy-middleware.

Verified proxying SSE is working with:
http://express-eventsource.herokuapp.com

const app = express();

app.use(createProxyMiddleware({
  target: 'http://express-eventsource.herokuapp.com',
  changeOrigin: true,
}));

app.listen(3000);

from http-proxy-middleware.

I'm using http-proxy-middleware in a React environment and I found out that the problem wasn't really with http-proxy-middleware, but somehow with how react is handling proxying by default with setupProxy.js.
I was able to bypass this EventSource "problem", creating a separated dev proxy file and proxying the React dev environment there.

      const express = require('express')
      const app = express()
      const { createProxyMiddleware } = require('http-proxy-middleware')
      
      app.use(
        '/api',
        createProxyMiddleware({
          secure: true,
          changeOrigin: true,
          target: 'http://your-api-url'
        })
      )
      
      const wsProxy = createProxyMiddleware({
        changeOrigin: true,
        target: 'http://localhost:3000',
        ws: true
      })
      app.use('/sockjs-node', wsProxy)
      
      app.use(
        '/',
        createProxyMiddleware({
          changeOrigin: true,
          target: 'http://localhost:3000'
        })
      )
      
      const server = app.listen(3001)
      
      server.on('upgrade', wsProxy.upgrade)

from http-proxy-middleware.