So I have a webserver running nginx, and I want to use it as a reverse proxy to access web applications running elsewhere. I know this is a pretty standard use case, and that the traditional approach is to use virtual hosts to proxy the different apps.

Like, normally you would do something like:

I am familiar with this approach, and know how to set it up.

In this case, there is a catch though. For reasons that I can’t get into here, I can’t use virtual hosts, and everything should be hosted in the same webserver.something domain. So I thought I would use a subpath to host each app.

What I want to do is this basically:

In my nginx config file I have something like this:

upstream app1 {
  server app1.host:3000;
}

server {
    ...
    location /app1 {
        proxy_pass http://app1/;
    }
    ...
}

This works to the extent that all requests going to /app1/* get forwarded to the correct application host. The issue though is that the application itself uses absolute paths to reference some resources. For example, app1 will try to reference a resource like /_app/something/something.js, which of course produces a 404 error.

I suppose that for this particular error I could map /_app/ to the app1 application host with another location statement, but that seems dirty to me and I don’t like it. First off it could quickly become a game of whack-a-mole, trying to get all the absolute paths remapped, and secondly it could easily lead to conflicts if other applications use that absolute path too.

So I guess my question is: is there a way to do this cleanly, and dynamically rewrite those absolute paths per app?

  • @[email protected]OP
    link
    fedilink
    English
    2
    edit-2
    11 months ago

    Hmm no, that’s not really it… that’s more so that you don’t pass URLs starting with /app1/ onwards to the application, which would not be aware of that subpath.

    I think I need something that intercepts the content being served to the client, and inserts /app1/ into all hardcoded absolute paths.

    For example, let’s say on app1’s root I have an index.html that contains:

    ...
    src="/static/image.jpg"
    ...
    

    It should be dynamically served as:

    ...
    src="/app1/static/image.jpg"
    ...
    
    • @[email protected]
      link
      fedilink
      English
      411 months ago

      Ah, I see your problem, that is definitely trickier. Sorry for the lack of help :/

      The wackamole method you described is something I have seen, no idea if it’s the best approach though. Dynamic rewriting may be non-trivial as well.

      A possibly suitable/worse approach could be to write a quick html page with IFrames and embed each app in an full screen IFrame :) I have that in my nginx as well :/

      • @[email protected]OP
        link
        fedilink
        English
        411 months ago

        No worries, your input was helpful and informative anyway, so thanks.

        Going with vhosts anyway seems to be the least cumbersome route at this point.

        • @[email protected]
          link
          fedilink
          English
          411 months ago

          May I comments you both for the openness, politeness and helpfulness displayed here?

          Thanks!

          I also found the response informative, and thanks for making lemmy/fediverse happen!