hoppscotch: [bug]: Hard trouble with refreshing and admin dashboard. Software is not usable.

Is there an existing issue for this?

• I have searched the existing issues

Current behavior

We’re getting hard in trouble with the whole Hoppscotch application because we have to refreshing all pages a lot till it works. This behavior is coming up on all computers and browsers in our team. We’re working in a self-hosted environment behind a reverse proxy (apache). Check the configuration below.

Apache Configuration Snippet

<VirtualHost *:80>

    DocumentRoot    /var/www/html
    ServerName      my-server-url
    ServerAdmin     root@localhost

    ErrorLog        /var/log/apache2/ssl_error_hoppscotch.log
    TransferLog     /var/log/apache2/ssl_access_hoppscotch.log
    CustomLog       /var/log/apache2/ssl_access_hoppscotch.log combined

    RewriteEngine on
    <Location />
        Order allow,deny
        Allow from all
    </Location>

    RewriteRule ^/(.*)$ https://my-server-url/$1 [L]
</VirtualHost>


<VirtualHost *:443>
    DocumentRoot    /var/www/html
    ServerName      my-server-url
    ServerAdmin     root@localhost

    ErrorLog        /var/log/apache2/ssl_error_hoppscotch.log
    TransferLog     /var/log/apache2/ssl_access_hoppscotch.log
    CustomLog       /var/log/apache2/ssl_access_hoppscotch.log combined

    SSLProxyEngine on
    SSLEngine On
    SSLCertificateFile      /etc/apache2/ssl/certificate.pem
    SSLCertificateKeyFile   /etc/apache2/ssl/certificate.key

    RewriteEngine on
    ProxyPreserveHost On
    ProxyRequests off
    ProxyVia on

    <Location />
        Order allow,deny
        Allow from all
    </Location>

    RequestHeader set X-Forwarded-Proto "https"
    RequestHeader set X-Forwarded-Prot "443"
    SetEnvIf Origin "https://(my-server-url|my-server-url:8443)$" AccessControlAllowOrigin=$0
    Header set Access-Control-Allow-Origin %{AccessControlAllowOrigin}e

    RewriteCond %{HTTP:Connection} Upgrade [NC]
    RewriteCond %{HTTP:Upgrade} websocket [NC]
    RewriteRule /backend/graphql(.*) ws://127.0.0.1:3170/graphql$1 [P,L]

    RewriteRule ^/my-server-url$ http://my-server-url [L]

    ProxyPass         /backend/  http://127.0.0.1:3170/
    ProxyPassReverse  /backend/  http://127.0.0.1:3170/
    ProxyPass         /  http://127.0.0.1:3000/
    ProxyPassReverse  /  http://127.0.0.1:3000/

</VirtualHost>


Listen 8443
<VirtualHost *:8443>

    DocumentRoot    /var/www/html
    ServerName      my-server-url
    ServerAdmin     root@localhost

    ErrorLog        /var/log/apache2/ssl_error_hoppscotch.log
    TransferLog     /var/log/apache2/ssl_access_hoppscotch.log
    CustomLog       /var/log/apache2/ssl_access_hoppscotch.log combined

    SSLProxyEngine on
    SSLEngine On
    SSLCertificateFile      /etc/apache2/ssl/certificate.pem
    SSLCertificateKeyFile   /etc/apache2/ssl/certificate.key

    RewriteEngine on
    ProxyPreserveHost On
    ProxyRequests off
    ProxyVia on

    <Location />
        Order allow,deny
        Allow from all
    </Location>

    RequestHeader set X-Forwarded-Proto "https"
    RequestHeader set X-Forwarded-Prot "443"
    SetEnvIf Origin "https://(my-server-url|my-server-url:8443)$" AccessControlAllowOrigin=$0
    Header set Access-Control-Allow-Origin %{AccessControlAllowOrigin}e

    RewriteCond %{HTTP:Connection} Upgrade [NC]
    RewriteCond %{HTTP:Upgrade} websocket [NC]
    RewriteRule /backend/graphql(.*) ws://127.0.0.1:3170/graphql$1 [P,L]

    ProxyPass         /backend/  http://127.0.0.1:3170/
    ProxyPassReverse  /backend/  http://127.0.0.1:3170/
    ProxyPass         /  http://127.0.0.1:3100/
    ProxyPassReverse  /  http://127.0.0.1:3100/
</VirtualHost>

You can checkout our docker-compose.yml file below. We’re using our own registry because we’re scanning all incoming images additionally.

version: "3.7"
services:
  hoppscotch-aio:
    container_name: hoppscotch-aio
    image: own.registry.local/scotty/hoppscotch-aio:latest
    env_file:
      - ./.env
    depends_on:
      hoppscotch-db:
        condition: service_healthy
    ports:
      - "3000:3000"
      - "3100:3100"
      - "3170:3170"

  hoppscotch-db:
    container_name: hoppscotchdb
    image: own.registry.local/images/postgres:14.4
    user: postgres
    volumes:
      - scottydatabase:/var/lib/postgresql/data
    environment:
      POSTGRES_USER: xxx
      POSTGRES_PASSWORD: xxx
      POSTGRES_DB: xxx
    healthcheck:
      test:
        [
          "CMD-SHELL",
          "sh -c 'pg_isready -U $${POSTGRES_USER} -d $${POSTGRES_DB}'",
        ]
      interval: 5s
      timeout: 5s
      retries: 10

volumes:
  scottydatabase:

Steps to reproduce

Users Dashboard

1. Go to the website
2. Click on “login”
3. Choose only available option “Microsoft”
4. I will be instantly redirected to “https://my-server-url/backend/v1/auth/microsoft” which shows me the “Hoppscotch 404 page”.
5. Just after clicking “Shift + Cmd + R” (for refresh without cache) I will be redirected to the Azure Active directory page.
6. After login into the azure AD I’ve been redirected to the callback address like “https://my-server-url/backend/v1/auth/microsoft/callback?code=XYZ” which shows me the “Hoppscotch 404 page”.
7. After refreshing this page here with “Shift + Cmd + R” the page shows me internal server error.

After some refreshing and manual navigating to https://my-server-url and also refreshing the pages shows me as logged in and I can see my profile and workspaces.

Admin Dashboard No more words needed I think 😃 also here the refreshing trouble!

Environment

Production

Version

Self-hosted