enable https / public certificates example - black screen

br4tt3

Hi all,

Kind of new so forgive me if i’ve missed the “answer” if existing already. I’ve google it a couple of time - found references for it but nothing works out so far. My scenario is:
MM running on a Pi4, I’ve got MM Remote Control running of it, and the config is running smoothly except that I want to have https enabled. That being said - what I’ve done:

I moved the .pem files (private and fullchain) over to a local folder on the Pi.
went into config.js and changed / added the following entries:

useHttps: true,
httpsPrivateKey: “/home/pi/MagicMirror/config/https/privkey.pem”,
httpsCertificate: “/home/pi/MagicMirror/config/https/fullchain.pem”,
Restart. From that point on: I can access the slideshow / configuraiton over
https://myfakedomain.org:8080 - certificate is validated, is accessible, all good. I can also see configuration coming up when accessing it through the MM RemoteControl module integration. However…
The physical display connected to the PI is pitch black, when trying to out the configuration and does not display what is shown over: https://myfakedomain.org:8080. As soon as i turn of useHttps: true to false, reboot - working again - except the https integration - both on the physical display or the web browser.

Do I have to make additional changes, except the config.js file, to support https configurations? Also tried to find an existing template, example - where some one is using https/ssl but to no success so far.

Thanks in advance!

sdetweil

@br4tt3 typically when using https, you would use port 443

if you open the developers window, ctrl-shift-i on the keyboard, and select the console tab, do you see any errors? usually in red text

br4tt3

@sdetweil - hey and thanks for reply! I checked the dev console: basically found this clue message:

" Policy set or a policy with “unsafe-eval” enabled. This exposes users of
this app to unnecessary security risks."

Google it, found another entry where u participated: https://github.com/MichMich/MagicMirror/issues/2147

I proceeded with adding row:
meta http-equiv=“Content-Security-Policy” content=“script-src ‘self’;”
to index.html, rebooted - same stuff…

then came to think of that I had a reference inside of the config.js file which was pointing to a 192.168.x.x address… sorted that part out, so it works just fine over the certificate (over a browser from my main PC) - however, same stuff on the physical display, pitch black and still displaying the above listed “console clue”…

Thanks again Sam!

br4tt3

Looked at the console of the dev window, detailed message being:

Electron Security Warning (Insecure Content-Security-Policy) This renderer process has either no Content Security Policy or a policy with “unsafe-eval” enabled. This exposes users of this app to unnecessary security risks.

For more information and help. Consult https://electronjs.org/docs/tutorial/security
This warning will not show up once the app is packaged.