I am using a particular API, which has an image url convention like:
https://us.battle.net/static-render/us/illidan/249/96749817-avatar.jpg?alt=wow/static/images/2d/avatar/6-0.jpg
As per convention, the server will redirect to an alternate thumbnail if the exact image is not found. The problem is - when redirecting, the server redirects to http
, even if original call is made via https
. My page that makes use of these urls is using https
, and I end up getting warnings whenever there is such a redirect.
Is there an easy way in javascript/html using which I can force the use of https
urls even if server is redirecting to http
? One option perhaps is to load via javascript and intercept the redirect, change the protocol to https, etc, but that looks a bit complex.
As test code, an html page with below code suffices (must be loaded over https
to see the issue):
<html>
<head><title>Some title</title></head>
<body>
<img src='https://us.battle.net/static-render/us/illidan/249/96749817-avatar.jpg?alt=wow/static/images/2d/avatar/6-0.jpg'>
</body>
</html>
Note: The server behaviour might have changed since the question was first asked, but I am still leaving the code as is because it is sufficient to understand the issue.
Replace HTTP to HTTPS with Beter Search Replace Plugin In the “Search for” field enter the HTTP version of your website URL and the HTTPS version in the “Replace with” field. Under select tables, scroll down and select the “wp_posts” table which contains image URLs, and URLs embedded inside posts and pages.
To use image as a link in HTML, use the <img> tag as well as the <a> tag with the href attribute. The <img> tag is for using an image in a web page and the <a> tag is for adding a link. Under the image tag src attribute, add the URL of the image.
Although HTTP and HTTPs seem similar enough, it's important to know the difference between the two. Here's how it all boils down: HTTPS is secure, while HTTP is not. The websites that have made the move to redirect HTTP to HTTPS appear with a padlock on the browser bar before the URL.
Redirecting old image URLs to new URLs will forward ranking signals from the old images to the new ones. Using redirects is a “fantastic” way to deal with the situation, Mueller says. Avoid changing image URLs it at all possible. But, if it has to be done, make sure redirects are in place.
With javascript and HTML it won't work because Google Chrome blocks anything with http urls on secured sites.
If the alternate image is on your server,you can embed it using https.
If not,you need a PHP curl script which parses the http image and makes it available on a https url.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With