latenighttales / alcali

Featureful Saltstack GUI

Home Page:https://alcali.dev

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Alcali under sub-URL not working, since URL are hard-coded

FlyingBugs13 opened this issue · comments

Describe the bug
Django 'static' path is hard-coded in multiple section of the application, therefore the files are not found if we put Alcali under a sub-URL via a reverse-proxy.

We believe that the problems are from the file in '.../alcaliVENV/lib/python3.6/site-packages/dist/*'.

For example, in '.../alcaliVENV/lib/python3.6/site-packages/dist/index.html' we can find something like '<script src="/static/js/app.3a1e9671.js">', which does not take in consideration our definer sub-URL.

To Reproduce

Steps to reproduce the behavior:

1.In '.../alcaliVENV/lib/python3.6/site-packages/config/settings.py', add:

USE_X_FORWARDED_HOST = True
FORCE_SCRIPT_NAME = '/alcali' # or any other uri you wish
  1. Restart Gunicorn, for the change to take effect.
  2. Go to your web-application under the sub-URL defined above
    4.You will a see a blank page with no login or other items. If you inspeact the page under ther 'Network' tab, you will see that every requests have a '404' response.

Expected behavior
Once the modification above are made, we should be able to access and use Alcali normally.

Screenshots
Under the full URL: https:///alcali/

Invalid request under the set sub-URL: throws 404 since the URL is hardcoded to /static/...
image

Valid request under the set sub-URL: get item since URL was manually modified. (Note, the URL on the left is now /alcali/static/...)
image

Desktop :

  • OS: Windows 10
  • Browser: Firefox
  • Version: 91.0.1 (64-bit)

Additional context
We are trying to set Alcali under a sub-URL under our current web-application. We are using Nginx and a Django reverse-proxy to access Alcali from local-host on the machine.

I think the problem is that static files and the web UI is build via VueJS and generated during build time. So it automatically contains the default BASE_URL aka publicPath which will be /.

If you like to achieve something like that it's required that you rebuild the static files by yourself. This will not fully work because some additional changes in
JavaScript are required:

vue.config.js:

module.exports = {
  publicPath: process.env.BASE_URL,
  ...
};

.env:

BASE_URL=/whatever_you_like

Run the following command to build the static files again:

npm run build

Note this are more or less development comments. As I said it does not fully work because in some VueJS files in src it's required to remove the leading slash to avoid using a full path.