Lesson 8 Express Version of single-route, multi-origin-proxy

dominik.urban

const express = require("express");
const app = express();
const port = 3000;
const createError = require("http-errors");
const { createProxyMiddleware } = require("http-proxy-middleware");
 
function isUrl(req, res, next) {
  const { url } = req.query;
  try {
    const newURL = new URL(url);
    const targetURL = newURL.origin;
    req.test = { targetURL };
    next();
  } catch (err) {
    next(createError(400));
  }
}
 
app.use(
  "/",
  isUrl,
  (req, res, next) => {
    console.log("targetURL: ", req.test.targetURL);
    next();
  },
  createProxyMiddleware({
    target: "http://localhost:5000",
    // target: req.test.targetURL,
    changeOrigin: true,
  })
);
 
// 404 handling
app.use((req, res, next) => {
  next(createError(404));
});
 
// error handling
app.use((err, req, res, next) => {
  res.status(err.status || 500);
  res.send(err.message);
});
 
app.listen(port, () => {
  console.log(`Server listening at http://localhost:${port}`);
});
 

The target is hard-coded with target: "http://localhost:5000".

Is there a possibility to make the target dynamic (and use the express).

Could you please provide an express example (instead of linking to medium.com version of a proxy with express)?

davidmarkclements

@dominik.urban if you wanted to make the target dynamic you can set an environment variable and take the port from that

as for implementing in express - that's up to you. The approach of the material is focused on concepts and understanding, not providing boilerplate.

dominik.urban

@davidmarkclements

Could you please revisit my question how to make the target url dynamic. The question is about the whole url given via query params, and not by providing env variables.

Or can I make the impl dynamic by using router instead of target (provided by http-proxy-middleware.

Would be great to have a working solution in express instead of relying on fastify and the fastify-reply-from package.

My question is not boilerplate-related. I am curious if there is a solution working in express - or is it conceptual not possible?

davidmarkclements

hey @dominik.urban ok I see what you're saying.

Target here is used in the same way as base in fastify-reply-from - it's supposed to set the top level domain. We don't proxy to different targets/bases in Chapter 8, the "Single-origin, multi-route proxy" subsection doesn't deal with switching the base.

Implementing the equivalent of the source material in Express mostly involves setting target to https://news.ycombinator.com/

I think if you want to redirect to multiple targets, the router option, as you suggest, is the best way to go.

johndalton

Thank you so much for showing us how to create a one-route proxy server, I was just stuck on this topic and could not solve this issue in any way. I tried to make it on my own and even with the help of friends, but nothing worked out for me.

johndalton

Thank you so much for showing us how to create a one-router proxy server, I was just stuck on this topic and could not resolve this issue in any way. I tried to make it on my own and even with the help of friends, but nothing worked out for me. Since I live in Germany and I sometimes have problems with the Internet connection due to the peculiarity of my place of residence. Therefore, I plan to create a fast german web proxy so that I can not worry about a slow internet connection and play games and watch movies comfortably. I hope I will succeed thanks to your hepl. I also would like you to show us more similar lessons on this topic, cause they are very interesting. Wish me luck!

d.m.c

@johndalton good luck!

sauliusp

@dominik.urban hey. I was also stuck with the same problem - single route, multi origin proxy in express. It took a while for me to make the origin dynamic.

This is my 'hacky' approach in express (definitely the fastify version looks cleaner to my taste )

const express = require('express');
const createError = require('http-errors');
const { createProxyMiddleware } = require('http-proxy-middleware');
 
const app = express();
app.use(express.json());
 
const handleURL = (req, res, next) => {
    const { url } = req.query;
 
    try {
        const {origin, pathname} = new URL(url);
 
        req.proxyOrigin = origin;
        req.proxyPath = pathname;
 
        next();
    } catch (error) {
        next(createError(400));
    }
}
 
app.get('/', handleURL, createProxyMiddleware({
  pathRewrite: (path, req) => path.replace('/', req.proxyPath),
 
  router: (req) => req.proxyOrigin
}));
 
app.use((req, res, next) => {
    next(createError(404));
})
 
app.use((err, req, res, next) => {
    res.status(err.status || 500)
    res.send(err.message)
  })
 
app.listen(process.env.PORT || 3000);