problems with mixed content (HTTPS over Synology WebVPN)

[kljosc]

Faikin hardware Faikin you purchased from Amazon

Daikin hardware not relevant

Describe the bug

To Reproduce Open Synology WebVPN. Open "Home" page => only first and last line showing, no controls, but Setting pages are working

Same behaviour in Chrome, Iron and Edge on PC Win10 but it's working on a Pixel 8 with WebVPN and Chrome Browser.

Expected behavior Showing Home with controls

Additional context In Chrome debugger I tried to remove the transition attribute in embedded style on "Home" page .on{opacity:1;transition:1s;}.off{opacity:0;transition:1s;} and it works.

[revk]

I just tested on Chrome here and it was fine.

Do you know what is wrong with the transition attributes?

[kljosc]

I dont know what is wrong but I inspected the HTML and there is a <div id="top" class="off"> which hides the content of the div. When changing class to on in debugger it shows the content as expected. Dont know why the script does not change the class. Which purpose does this transition have?

[revk]

It should change based on web socket connection.

Is it repeatable?

What version of chrome?

[kljosc]

Iron (uses Chrome) Version is 125.0.6350.0 (Offizieller Build) (32-Bit) Edge Version is 127.0.2651.105 (Offizielles Build) (64-Bit) Same effect. Yes it is repeatable.

I think this is the root cause

[Nano] **Nano Defender Activated :: da9af645.dapvpn.synology.me**
(Index):21 Mixed Content: The page at 'https://da9af645.dapvpn.synology.me/' was loaded over HTTPS, but attempted to connect to the insecure WebSocket endpoint 'ws://da9af645.dapvpn.synology.me/status'. **This request has been blocked; this endpoint must be available over WSS.**
c @ (Index):21
(anonym) @ (Index):21
(Index):21 **Uncaught DOMException: Failed to construct 'WebSocket': An insecure WebSocket connection may not be initiated from a page loaded over HTTPS.**
    at c (https://da9af645.dapvpn.synology.me/:21:663)
    at https://da9af645.dapvpn.synology.me/:21:1977
c @ (Index):21
(anonym) @ (Index):21
**contentScript.js:49 dispatching the event: emc.ctf.addonInited**

This request has been blocked; this endpoint must be available over WSS. An insecure WebSocket connection may not be initiated from a page loaded over HTTPS. So the event is not triggered.

[kljosc]

function c() { ws = new WebSocket('ws://' + window.location.host + '/status'); ws.onopen = function(v) { g('top').className = 'on'; } new WebSocket is executed with error.

Even though the initial HTML page is loaded over a secure HTTPS connection, some resources like images, stylesheets or scripts are being accessed over an insecure HTTP connection. Usage of insecure resources is restricted to strengthen the security of your entire site. To resolve this issue, load all resources over a secure HTTPS connection.

[revk]

Ok that is interesting, and does sort of explain it...

Except, the faikin control page IS only http and not https. So does work, normally!

I can only assume you are proving it somehow. We could make the web socket code assume you will proxy web socket too and use wss if we are https, perhaps.

But if no web socket the control and status won't work, not just a matter of opacity and transition.

[kljosc]

It works normally if I open it at home in my own local network. But if I open it via WebVPN (HTTPS) the browser blocks this unsecure content (HTTP). Even enabling the settings for unsecure content in Chrome does not solve the problem.

unsecure content disabled: executing ws = new WebSocket is blocked because of mixed content unsecure content enabled: ws = new WebSocket is executed but ws.error(...) is called and display of div remains hidden

[revk]

Yes, like I say, works perfectly as intended :-)

Now, does your WebVPN also proxy wss? If so, a simple change would be for my javascript to use wss when the page is somehow on https.

[kljosc]

Ok settings page has the same problem with executing ws = new WebSocket but has no "opacity switch" so it's not obvious that it's not working.

I played with VPN settings but it does not solve the problem. I don't know if the VPN does proxy wss. Maybe I will ask Synology support.

[revk]

Edit to change ws to wss, does that work? That should answer it.

[revk]

OK issuing a beta now that uses wss: if https: - try that in a few minutes.

[kljosc]

OK I will try it in the evening 17:00 UTC+2 when I'm home from work.

[kljosc]

No chance with the combination of Synology WebVPN and Chrome browser on my PC. On Android it works perfect. I'm on holiday now and can not do further tests until I'm back.

[revk]

OK, well we are doing all that can be really, sounds like any issue with the proxy to be honest.