Page loaded over HTTPS but requested an insecure XMLHttpRequest endpoint

I had the same issue for my angular project, then I make it work in Chrome by changing the setting. Go to Chrome setting -->site setting -->Insecure content --> click add button of allow, then add your domain name [*.]XXXX.biz

Now problem will be solved.

What I can do to fix this (other than installing a real SSL certificate).

You can't.

On an https webpage you can only make AJAX request to https webpage (With a certificate trusted by the browser, if you use a self-signed one, it will not work for your visitors)

Steps to Allow Insecure Content in Chrome

To allow insecure content on individual sites within Chrome, click on the lock icon in the URL bar, then click 'Site settings'.

There you will see a list of various permissions the page has. Choose 'Allow' next to 'Insecure content'.

Now your HTTPS site can access HTTP endpoint