For a given non-secure, HTTP, host (host1) I am trying to implement an API call from a secure, HTTPS, host (host2). Both are in the same domain and have no trouble reaching each other.
Below is an example of the fetch that I ran when testing with my localhost acting as host1, at this point, I ran into no issues and the code/api was executed successfully from a XAMPP hosted webpage.
URL is the API call to host2.
fetch(url, {
method: 'GET',
mode: 'cors',
headers: {
'Content-Type': 'application/json'
},
}).then( response => {
try {
if(response.status == 200){
return response.json();
}
reject(response.json());
} catch(error){
reject(response.text());
}
}).then( data => {
resolve(data);
}).catch( error => {
reject(error);
});
However, when I test this from the actual machine and not my localhost I get the CORS issue below.
Access to fetch at 'https://host2/api' from origin 'http://host1' has been blocked by CORS policy: The requesting client is not in a secure context and the resource is in a more-private address space `private`.
I'm sure what could cause this because my machine should have simulated the same case. A non-secure host requests data from a secure one. Does anyone have any pointers that could lead me to fix this issue? Fyi, the issue above was reported in the Microsoft edge (chromium) debugger.
Chrome simply gives, Failed to load resource: net::ERR_CERT_AUTHORITY_INVALID.