I have a python flask-cors code that is run on GCP compute engine and presents its output on port 3001. Lets say the physical address of my server instance is x1.x2.x3.x4.
I have a Javascript file named myJSFile.js which is a loaded by a javascript plugin. It contains the following lines of code (the rest of code not provided as it seems irrelavant to the issue):
fetch('http://x1.x2.x3.x4:3001/p1', { method: 'POST', body: JSON.stringify({ message: text123 }), mode: 'cors', headers: {'Content-Type': 'application/json'}, myJSFile.js is shared in a public cloud bucket such that the plugin which will be embedded in public websites can access it.
When I run the plugin from a html file (locally on my compputer) it runs without any issues and results are provided.
When I run the plugin from a wordpress website aaa.com, I get the error:
Mixed Content: The page at 'https://aaa.com/' was loaded over HTTPS, but requested an insecure resource 'http://x1.x2.x3.x4:3001/p1'. This request has been blocked; the content must be served over HTTPS.
I have checked my compute engine instance properties and it shows "https traffic: On".
I tried changing http to https in the code, but did not resolve this issue. In the broswer, I see the error: "Failed to load resource: net::ERR_SSL_PROTOCOL_ERROR"
On the server, I noticed the following error:
See error on Google compute engine
I noticed there are some workarounds for example this site in wordpress. However, to have a more general plugin, I am looking for a solution that allows me solve this by changing GCP settings or changes to my code. Any advice is extremely appreciated; also, if there is any suggestion on how to enhance my current approach to sharing js file please let me know.
google-compute-engine
http://somepathtohttps://somepath. Your problem is not a GCP problem. You are fetching http and https resources when only https resources are allowed. Make sure you understand the difference betweenhttp://andhttps://.