[Solved] Add a <base> tag when reverse proxying with a subirectory


(David Kebler) #1

I am attempting to reverse proxy a url subdirectory. The page begins to loads but of course none of the resources it calls can be found cause they all refer to the root. Since I have run into this before the fix is to add a <base> tag to every page <head> in the same way Hugo can do that when generating a site served from a subdirectory. My issue is I can’t grok the proper syntax for the http.filter to select every page and add a url to the section. I did this manually in the page inspector just to make sure and yes if all page resource requests get the extra /router they are found.

https://status.foo.net/router {
              import wildcard_cert
              filter rule {
                 path .*\.html
                 search_pattern "<head>"
                 replacement "<head><base href='/router'>"
              }
              proxy / http://router.foo.net:19999
              }

for example in the source of the main page is
<script type="text/javascript" src="dashboard.js?v20180922-1"></script>
which can’t be found but if it was
<script type="text/javascript" src="router/dashboard.js?v20180922-1"></script>
well it would be. That was confirmed in the network tab of the page inspector.


(Matthew Fay) #2

Hi @dkebler,

You could try using content_type text/html instead of path to rule out cases where the URI sent from the client doesn’t end in the .html you’re looking for. This will ensure your replacement is injected for all HTML content.

The search pattern and replacement look good to me, though.


(David Kebler) #3

Thought I tried that before but that worked. Thx @Whitestrake. Also needed to fiddle with my base url. Must be absolute and must end with /

Here is what worked.

https://status.foo.net/router {
              import wildcard_cert
              filter rule {
                 content_type text/html.*
                 search_pattern <head>
                 replacement "<head><base href='https://status.foo.net/router/'>"
              }
              proxy / http://router.foo.net:19999
              }  

Hope others find this post cause it is really useful for leveraging a single sub/domain pointing to lots of supporting servers. Now I can have for instance status.foo.net/router and status.foo.net/nas etc for a status page for each device served from that device on my network and yet other requests will go to my main status page which can of course have links to these…nice.


(David Kebler) #4

This is even better. You can import this “baseurl” filter rule into any of your blocks

# inject in all pages a <base href='url'>
(baseurl) {
    filter rule {
       content_type text/html.*
       search_pattern <head>
       replacement "<head><base href='https://{request_host}/router/'>"
    }
}

then

https://status.foo.net/router {
              import wildcard_cert
              import baseurl
              proxy / http://router.foo.net:19999
              }

@Whitestrake, I would make this even more groovy but the {request_path} doesn’t return anything neither the {request_url} only the {request_host}