I have some Google-Scripts on my website and unfortunately one of them loads some additional scripts and images over http instead of https (my website is delivered over https). I managed to get the scripts loaded over https with the following code (from this question):
Object.defineProperty(HTMLScriptElement.prototype, 'src', {
get: function(url) {
return this.getAttribute('src')
},
set: function(url) {
//console.log(url);
var prefix = "http://";
if (url.startsWith(prefix))
url = "https://" + url.substr(prefix.length);
//console.log('being set: ' + url);
this.setAttribute('src', url);
}
});
But there are a few image files, which are still loaded over http. These files are not available over https.
My thought was to download these images and put them on my server and load them from there. Is there a way with JavaScript to overwrite the image path? Of course, I could use jQuery but before this, I have to block the image-request before it's fired. Otherwise I have the Problem of mixed content on my page.
So let's put it together: - page is loaded and after some time a certain user-action (in my case submitting a form) happens - based on this action an additional script is loaded which places a virtual keyboard on my page - this keyboard has some images which could not be loaded over https so I want to block these requests - then, I want to replace the blocked image-urls with my custom image-urls
Is this possible?
Thanks!