Suppose the page below is loaded from https://127.0.100.1. The page makes an XMLHttpRequest to http://127.0.100.2. This seems like mixed content: The page is loaded over a secure connection and a resource is loaded over an insecure connection. Mixed content should be blocked by the browser. Yet, the page below works just fine.* Why does it work: Why isn't the request blocked?
Update: Going beyond the accepted answer, browsers can be configured to block mixed content for such addresses.
* Wireshark confirms browsers aren't loading the resource over a secure connection.
<html>
<body>
<img id="dst"/>
<script>
let xhr = new XMLHttpRequest();
xhr.open('get', 'http://127.0.100.2/img.jpg');
xhr.responseType = 'blob';
xhr.onload = function(){
document.getElementById('dst').src = URL.createObjectURL(xhr.response);
}
xhr.send();
</script>
</body>
</html>
See Question&Answers more detail:
os 与恶龙缠斗过久,自身亦成为恶龙；凝视深渊过久,深渊将回以凝视…
