feat(ui): path prefix support via HTTP header

[mgoltzsche]

Description

Makes the web app honour the X-Forwarded-Prefix HTTP request header that may be sent by a reverse-proxy in order to inform the app that its public routes contain a path prefix. This allows to serve the webapp via a reverse-proxy/ingress controller under a path prefix/sub path such as e.g. /localai/ while still being able to use the regular LocalAI routes/paths without prefix when directly connecting to the LocalAI server.

Changes:

• Add new StripPathPrefix middleware to strip the path prefix (provided with the X-Forwarded-Prefix HTTP request header) from the request path prior to matching the HTTP route.
• Add a BaseURL utility function to build the base URL, honouring the X-Forwarded-Prefix HTTP request header.
• Generate the base URL using the BaseURL function into the HTML (head.html and login.html templates) as <base/> tag.
• Make all webapp-internal URLs (within HTML+JS) relative in order to make the browser resolve them against the <base/> URL specified within each HTML page's header.
• Make font URLs within the CSS files relative to the CSS file.
• Generate redirect location URLs using the new BaseURL function.
• Use the new BaseURL function to generate absolute URLs within gallery JSON responses.

This PR fixes #3095

TL;DR:
The header-based approach allows to move the path prefix configuration concern completely to the reverse-proxy/ingress as opposed to having to align the path prefix configuration between LocalAI, the reverse-proxy and potentially other internal LocalAI clients.
The gofiber swagger handler already supports path prefixes this way, see here.

Known limitations:

• gofiber swagger does not support executing API requests when a path prefix is used because it doesn't replace the base URL within the served swagger JSON, see Cannot try/execute endpoints within the swagger GUI when exposing it under a different path prefix via a reverse-proxy gofiber/swagger#104.
• gofiber swagger does not support using a web app with multiple path prefixes simultaneously, see Don't store the path prefix as global app state but derive it on a per-request basis gofiber/swagger#105.

Notes for Reviewers
Apart from the added automated tests, I did some manual testing and grepping, hoping to have all URLs covered.

Signed commits

• Yes, I signed my commits.

[netlify]

✅ Deploy Preview for localai ready!

Name	Link
🔨 Latest commit	80cb8ba
🔍 Latest deploy log	https://app.netlify.com/sites/localai/deploys/676f3f844770bb00083f54d2
😎 Deploy Preview	https://deploy-preview-4497--localai.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify site configuration.

[mudler]

Thank you 💯 - it makes totally sense as an addition to me. As soon as I have a bit of time will try to test out locally too to see if there aren't any regression

[mgoltzsche]

The app test failed. I think I fixed it now. Please re-run the workflow.

UPDATE: Also, I rebased the PR and added the <base/> URL also to the login page.

[mgoltzsche]

Oups, turns out I introduced a cyclic dependency within the test code between the new utils package and the middleware package yesterday when I also added the <base/> URL to the login page that is rendered by the auth middleware.
I'll fix that...

[mgoltzsche]

I fixed it by simplifying the BaseURL implementation, letting it not look at the HTTP header (leaving that to the middleware) but compare the originalPath with the path instead, also allowing the unit test not to depend on the middleware.
Please re-run the workflow.