# Mixed Content Error

**URL:** <https://community.vikunja.io/t/mixed-content-error/75>\
**Category:** Support\
**Created:** [3 September 2020 03:45 UTC](https://community.vikunja.io/t/mixed-content-error/75 "2020-09-03T03:45:02Z")\
**Posts on this page:** 9\
**Page:** 1

<div class="post-metadata">

**Author:** ![HungrySkeleton](https://community.vikunja.io/letter_avatar_proxy/v4/letter/h/a183cd/32.png) [@HungrySkeleton](https://community.vikunja.io/u/HungrySkeleton)\
**Post date:** [3 September 2020 03:45 UTC](https://community.vikunja.io/t/mixed-content-error/75/1 "2020-09-03T03:45:02Z")

</div>

Hi again,

I’ve successfully managed to set up the Vikunja backend on my FreeBSD jail, and set up the frontend on my nginx reverseproxy. I’ve confirmed that the two are talking to each other correctly by typing `https://MYDOMAINNAME/api/v1/info` and I receive the JSON response - so all good.

However, when I go to register my first user, nothing happens. I’ve logged the network traffic and found the source of the error:

![Capture](https://community.vikunja.io/uploads/default/original/1X/d7b00e7e80301586eecb19c604eaa4121bf12a22.png)

 ![Capture3](https://community.vikunja.io/uploads/default/original/1X/357e690f3b4343d8b5ff91061beb403fd20fc31a.png)

It looks like Chrome doesn’t like having a https connection to the proxy, but a plain http connection over the local network. (the `http://192.168.1.123:3456/api/v1` login is specified in the `index.html` file at the frontend).

Any thoughts on how to resolve this? Is it a mis-configuration on my side, or a bug?

EDIT: There is no ‘response’ data captured in the network analyser as the page is blocked

 ![Capture2](https://community.vikunja.io/uploads/default/original/1X/27a8de882715480c91a5f95eb4355d02ef665d6b.png)

Thanks in advance!  
Skelly

---

<div class="post-metadata">

**Author:** ![HungrySkeleton](https://community.vikunja.io/letter_avatar_proxy/v4/letter/h/a183cd/32.png) [@HungrySkeleton](https://community.vikunja.io/u/HungrySkeleton)\
**Post date:** [3 September 2020 07:16 UTC](https://community.vikunja.io/t/mixed-content-error/75/2 "2020-09-03T07:16:47Z")

</div>

I’ve been thinking a bit more about this, and think maybe I can avoid the issue by running the frontend on an nginx server hosted on the same jail as the backend, and then point the reverseproxy to that nginx server instead… I’ll post back in the next day or so with how that turns out 😅

EDIT: No luck - just wind up with the exact same problem 😥

---

<div class="post-metadata">

**Author:** ![kolaente](https://community.vikunja.io/user_avatar/community.vikunja.io/kolaente/32/5_2.png) [@kolaente](https://community.vikunja.io/u/kolaente)\
**Post date:** [3 September 2020 11:15 UTC](https://community.vikunja.io/t/mixed-content-error/75/3 "2020-09-03T11:15:10Z")

</div>

AFAIK this is a chrome feature.

I think the easiest way to resolve this is to also proxy the api requests the same way you’re serving the frontend. Please [take a look at the docs](https://vikunja.io/docs/reverse-proxy/#nginx) about this.

---

<div class="post-metadata">

**Author:** ![HungrySkeleton](https://community.vikunja.io/letter_avatar_proxy/v4/letter/h/a183cd/32.png) [@HungrySkeleton](https://community.vikunja.io/u/HungrySkeleton)\
**Post date:** [3 September 2020 12:21 UTC](https://community.vikunja.io/t/mixed-content-error/75/4 "2020-09-03T12:21:28Z")

</div>

Thanks for the reply Konrad.

I have my nginx config set up as per the docs, yet the issue persists. It appears to be because we have to specify (read: _force_) the path to the api in the `index.html` file (`window.API_URL = 'http://192.168.1.123:3456/api/v1'`) - and therefore the resources are returned as http through a https connection. I feel like this is an actual issue, as I’ve followed the documentation and it does not work as expected?

Thankfully, accessing vikunja works totally fine locally (i.e. pointing to the nginx instance hosting the vikunja frontend via the local 192.168.1.XXX address) as this is only accessed via http. It’s just for access via the reverseproxy that doesn’t work due to this mixed http/s issue.

Again, I appreaciate your time Konrad 🙂

---

<div class="post-metadata">

**Author:** ![kolaente](https://community.vikunja.io/user_avatar/community.vikunja.io/kolaente/32/5_2.png) [@kolaente](https://community.vikunja.io/u/kolaente)\
**Post date:** [3 September 2020 14:32 UTC](https://community.vikunja.io/t/mixed-content-error/75/5 "2020-09-03T14:32:32Z")

</div>

If you can reach the api through `https://MYDOMAINNAME/api/v1/info` you should be able to just switch the `API_URL` in the frontend to `/api/v1` and be good to go.

---

<div class="post-metadata">

**Author:** ![HungrySkeleton](https://community.vikunja.io/letter_avatar_proxy/v4/letter/h/a183cd/32.png) [@HungrySkeleton](https://community.vikunja.io/u/HungrySkeleton)\
**Post date:** [4 September 2020 07:18 UTC](https://community.vikunja.io/t/mixed-content-error/75/6 "2020-09-04T07:18:59Z")

</div>

Hi Konrad,

Turns out I _can’t_ actually access the api through `https://MYDOMAINNAME/api/v1/info`. I got confused with which tab I had open… oops!

I’ve tried changing the url in `index.html` to all these variants:

```auto
http://192.168.1.123:3456/api/v1
https://192.168.1.123:3456/api/v1
192.168.1.123:3456/api/v1
/api/v1

```

None of them work through the reverseproxy, and only `http://192.168.1.123:3456/api/v1` works locally…

This is my architechture:  
Internet -\> (https) -\> NGINX ReverseProxy -\> (http) -\> NGINX Vikunja frontend (port 80) -\> (http) -\> Vikunja api (port 3456)

Any thoughts?

Cheers,  
Skelly

---

<div class="post-metadata">

**Author:** ![kolaente](https://community.vikunja.io/user_avatar/community.vikunja.io/kolaente/32/5_2.png) [@kolaente](https://community.vikunja.io/u/kolaente)\
**Post date:** [4 September 2020 08:25 UTC](https://community.vikunja.io/t/mixed-content-error/75/7 "2020-09-04T08:25:19Z")

</div>

Hi Skelly,

You would need to configure it so that the nginx serving the frontend (`NGINX Vikunja frontend (port 80)`) also proxies the api requests. Does it work with [this example](https://vikunja.io/docs/reverse-proxy/#nginx)? Then you should be able to reach the api both at `https://MYDOMAINNAME/api/v1/info` and through `http://192.168.1.123/api/v1/info` (no port `3456` in the url).

---

<div class="post-metadata">

**Author:** ![HungrySkeleton](https://community.vikunja.io/letter_avatar_proxy/v4/letter/h/a183cd/32.png) [@HungrySkeleton](https://community.vikunja.io/u/HungrySkeleton)\
**Post date:** [5 September 2020 02:05 UTC](https://community.vikunja.io/t/mixed-content-error/75/8 "2020-09-05T02:05:29Z")

</div>

ahh yes you legend! I had the following block in the wrong nginx config 😅:

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

```

Thanks so much Konrad!

For anyone else who faces the same challenge as me, here is the **minimalist** nginx configs I have used. Be sure to leave the `index.html` file line as `window.API_URL = '/api/v1'`

# Reverse Proxy Config (NGINX):

```auto
server {
    listen 443 ssl;
    
    location / {
        proxy_pass http://192.168.1.123:80;
        client_max_body_size 20M;
    }
}

```

# Vikunja Config (NGINX):

```auto
server {
    listen 80 default_server;
    server_name default_server;
    
    location / {
        root /mnt/frontend;
        try_files $uri $uri/ /;
        index index.html index.htm;
    }
    
    location ~* ^/(api|dav|\.well-known)/ {
        proxy_pass http://192.168.1.123:3456;
        client_max_body_size 20M;
    }
}

```

---

<div class="post-metadata">

**Author:** ![kolaente](https://community.vikunja.io/user_avatar/community.vikunja.io/kolaente/32/5_2.png) [@kolaente](https://community.vikunja.io/u/kolaente)\
**Post date:** [5 September 2020 14:05 UTC](https://community.vikunja.io/t/mixed-content-error/75/9 "2020-09-05T14:05:32Z")

</div>

Awesome, glad it works now!
