Getting access to the request body to proxy to a development backend

[jmzagorski]

Thanks for the great work on the 11ty ecosystem! I would like to incorporate this plugin and remove @11ty/eleventy-server-browsersync, but I have a use case similar to #9. Below I show my use case with the browsersync plugin and http-proxy-middleware to proxy the entire request to a development backend. I believe this library could replicate the behavior below if onRequest passed the request or request body so that I could forward the request with the form data for methods such as POST (11ty creates HTML forms that post data)

What are your thoughts on this for your library?

    const apiProxy = createProxyMiddleware({
        pathFilter: opts.intercept,
        target: opts.backend,
        changeOrigin: true,
        logger: console,
        on: {
            proxyReq: function (proxyReq, req) {
                proxyReq.setHeader("Authorization", opts.authorization || "");
                proxyReq.setHeader(
                    "Referer",
                    req.headers.referer?.replace(
                        "http://localhost:8080",
                        `http://${process.env.HOSTNAME}:8080`,
                    ) || "",
                );
            },
        },
    });

    config.setServerOptions({
        module: "@11ty/eleventy-server-browsersync",
        port: 8080,
        open: false,
        notify: false,
        ui: false,
        ghostMode: false,
        snippet: true,
        middleware: [apiProxy],
    });

[zachleat]

Do the onRequest option callbacks solve this? https://github.com/11ty/eleventy-dev-server/releases/tag/v2.0.7 See #9 (comment)

[zachleat]

Oops, sorry I missed that you mentioned this. Does #30 overlap here?

[jmzagorski]

Oops, sorry I missed that you mentioned this. Does #30 overlap here?

Yes, I missed that one! Thank you. I can close this issue and keep an eye on that issue.

[jmzagorski]

@zachleat Sorry to reopen this after closing it. I was able to get back to my use case, and it looks like the onRequest handler doesn’t allow me to modify the original request.

Our app has several forms that POST data to a backend. During development, we run a backend in a container, so I need to change the request's origin to point to the container's address and add an Authorization header, then let the request proceed normally.

Is this something that you would want to support in the future, or should I stick with browsersync?