Keep getting a mixed content error

I am using portainer with a stack created via documentation from Vikunja’s website. I’m also running nginx proxy manager for my proxy. However, when attempting to hit my instance I keep getting an error about the API URL not being set. However, it is set…

Dev tools shows a Mixed Content error. This lead me to believe the proxy wasn’t working correctly so I went to the documentation (Reverse Proxy | Vikunja) and set it up. However, that isn’t working either. I’m at a loss. I’ve spent about 4 hours hitting my head against the wall here. Any ideas?

Hi,

First verify your API is up & running by reaching https:///api/v1
If you got

{"message":"missing or malformed jwt"}

Should be OK

Second, did you try to setup manually the url in the frontend?

When I go to the /api/v1 url of my subdomain, I get:

An error occurred:
AxiosError: Network Error

Please check if the api url is correct

The API container is up and running and shows no errors in the logs from what I can tell. Both “tasks.domain.com” and “tasks.domain.com/api/v1” bring me to the same page with the same error.

did you try to replace tasks.domain.com to https://tasks.domain.com

In my setup, on the backend/api side VIKUNJA_SERVICE_FRONTENDURL variables is the full url format with https

the mixed content is returned by which element (triggered by your browser)?

That’s the problem. Your proxy does not seem to be set up correctly. Does this guide in the docs work for you?

I followed those instructions multiple times and it’s not worked a single time. I can get everything up and running just fine on my local machine, but as soon as I access via my proxy, it gives an error regarding the api.

Can you check if it hits the proxy? Which proxy are you using? Can you share your config?

I’m not sure how to check if it hits the proxy but here is the sanitized config file I’m using:

# ------------------------------------------------------------
# tasks.domain.com
# ------------------------------------------------------------


server {
  set $forward_scheme http;
  set $server         "192.168.0.119";
  set $port           8280;

  listen 80;
listen [::]:80;

listen 443 ssl http2;
listen [::]:443 ssl http2;


  server_name tasks.domain.com;


  # Let's Encrypt SSL
  include conf.d/include/letsencrypt-acme-challenge.conf;
  include conf.d/include/ssl-ciphers.conf;
  ssl_certificate /etc/letsencrypt/live/npm-38/fullchain.pem;
  ssl_certificate_key /etc/letsencrypt/live/npm-38/privkey.pem;






  # Block Exploits
  include conf.d/include/block-exploits.conf;









  access_log /data/logs/proxy-host-26_access.log proxy;
  error_log /data/logs/proxy-host-26_error.log warn;





  location ~* ^/(api|dav|\.well-known)/ {
                proxy_pass http://api:3456;
                client_max_body_size 20M;
        }

  location / {







    

    # Proxy!
    include conf.d/include/proxy.conf;
  }


  # Custom
  include /data/nginx/custom/server_proxy[.]conf;
}

After adding that location block to my config file, I get the following error in my nginx proxy manager container:

ginx: [emerg] host not found in upstream "api" in /data/nginx/proxy_host/26.conf:51

nginx: configuration file /etc/nginx/nginx.conf test failed

    at ChildProcess.exithandler (node:child_process:402:12)

    at ChildProcess.emit (node:events:513:28)

    at maybeClose (node:internal/child_process:1100:16)

    at Process.ChildProcess._handle.onexit (node:internal/child_process:304:5)

How are you hosting Vikunja?

I have an Ubuntu server running docker containers. I use Portainer to manage my services, so I have a docker compose file as a portainer stack. I’m port forwarding 80 and 443 on my router to my nginx proxy manager container using Cloudflare DNS. I have other services running the same way and I can reach them, so I’m not sure what’s going on. It has to be something to do with the proxy because I can locally get to the vikujna instance on my Ubuntu server but as soon as I try to use the subdomain I set up to point to things, it doesn’t work.

So the proxy config you shared earlier is the one you use in nginx proxy manager? Does that log any errors when you try to reach the api in your browser?

That’s correct, it’s the config for that specific proxy within nginx (I have a few services, the others of which are working). I don’t get any errors in the logs for the proxy container when I try to hit the API for vikunja or the frontend for vikunja, but I do see a few logs about SSL renewal not working over and over:

[9/8/2023] [2:47:14 PM] [SSL ] › :heavy_multiplication_x: error Error: Command failed: /usr/sbin/nginx -t -g “error_log off;”
[9/8/2023] [2:47:13 PM] [SSL ] › :information_source: info Renewing SSL certs close to expiry…
nginx: [emerg] host not found in upstream “api” in /data/nginx/proxy_host/26.conf:51
nginx: configuration file /etc/nginx/nginx.conf test failed
at ChildProcess.exithandler (node:child_process:402:12)
at ChildProcess.emit (node:events:513:28)
at maybeClose (node:internal/child_process:1100:16)
at Process.ChildProcess._handle.onexit (node:internal/child_process:304:5)

This indicates nginx is not able to reach the api container. Are they in the same docker network?

They are not - my proxy manager container is on it’s own network. Which is strange because my other services are reachable, so I’m not sure how that’s working I guess…

This won’t work unless your proxy can reach the api. If the proxy container runs with network mode host, it can reach the containers via their docker ip addresses but otherwise they have to be in the same network.

My nginx proxy manager is in bridged mode, but uses the host IP and exposed ports to listen to the other containers. However, I added my vikunja stack to the same network as my nginx proxy manager and now everything is working. Thanks!