Axios ssl call HTTPS

Question

I have install on VPS a nodejs server with react front. I buy comondo SSL, fix both server and domain and after that if i call http it shows Mixted type error. SSL checker gives A grade to SSL. I use https.create to create the node server. Also postman gives correct result for http://example.com/5000/posts.

Mixed Content: The page at 'https://example.com/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://example.com:5000/posts'. This request has been blocked; the content must be served over HTTPS.

How i can fix this error ? Its axios , node or SSL problem ?

Answer 1

in the first step, you have to know what's the mean by Mixed Content, quoted from web.dev:

Mixed content occurs when initial HTML is loaded over a secure HTTPS connection, but other resources (such as images, videos, stylesheets, scripts) are loaded over an insecure HTTP connection. This is called mixed content because both HTTP and HTTPS content are being loaded to display the same page, and the initial request was secure over HTTPS.

to solve this problem, you must serve your API under SSL protocol.