How to Fix 'this page is trying to load scripts from unauthenticated sources' Chrome Error [Solutions]
Last Updated -
If you have recently upgraded or plan to upgrade to HTTPS you may find aspects of your site are broken. If something is not rendering or working the developer tools console should be the first place you check. You can open it by pressing F12 or Ctrl + Shift + I. You should see a console tab. Here you will see messages from the page's scripts and the browser, including errors.
After upgrading your site to HTTPS an error you are possibly seeing this error in your Chrome browser tools console:
"this page is trying to load scripts from unauthenticated sources"
This is a common problem when upgrading to HTTPS due to mixed content. Loading external scripts using insecure HTTP triggers this error. This is because Chrome does not allow mixed protocol references in a secure (served via HTTPS) page.
Chrome does this to keep your site visitors safe.
HTTPS traffic keeps bad guys from looking in on your traffic. The only thing they can see is what URLs you load, not the content. But if a page loads an insecure resources the integrity of that secure connection is broken.
HTTPS not only guards against bad guys from seeing what you are browsing, it also prevents them from tampering with the request to the server and the response you get back.
An insecure request, made via HTTP, could possibly be intercepted by a bad party and replaced with their evil version. Because scripts can modify the HTML they can change what you see in the browser and even request more bad scripts and resources that can cause real damage.
Chrome and other browsers are protecting you by preventing these potentially unsafe scripts from loading.
A common source of this problem loading third party ad scripts or embedding YouTube or Twitch videos. In the past you may have referenced them via HTTP, which works. But once you upgraded to HTTPS those legacy HTTP references caused the unauthenticated sources error.
This means you may have errors loading videos and data from YouTube, Twitch, etc.
Chrome and Other Browsers are Getting Serious About HTTPS Everywhere
Over the past couple of years Chrome and the other browsers are gradually increasing the visual queues about insecure sites, those served via HTTP. The primary visual indicator is the green shield in the browser address bar.
Your goal is to have a pretty green shield indicating your pages are safe to the visitor.
This mixed protocol can lead to your site getting the HTTPS crossed out in red.
Not something you want if you are trying to impress customers.
To earn the secure green shield your page should be loaded using HTTPS. This means all the resources that compose the page, like scripts, images, fonts, etc.
How to Prevent the Unauthenticated Sources Message from Appearing
If you have upgraded to HTTPS you should take some time and audit all your pages for mixed content. You will want to perform the following steps:
- Change All URL References to HTTPS
- Change All URL to use protocoless address not a good practice
- Download the Script or Asset and Serve it from your Web Server
- Find a New Vendor or Source Offering HTTPS Access
The goal is to make all of your assets requested via HTTPS. This means you need to audit your pages to find all your references to resources, third party or on your own site loaded using HTTP.
You should not overlook your own resources. Any content created before the HTTPS upgrade may have referenced local resources, like images and scripts using HTTP. You will need to upgrade those references too.
If you have a copy of your site's source code locally accessible you can run a global search and replace for URLs using HTTP.
A helpful regular expression is (in JavaScript) /http:///g. I ran this on all the pages in Love2Dev after upgrading to HTTPS because I received the unauthenticated scripts error.
If you are using a CMS, like Wordpress you may need to manually go through all your pages for mixed protocol references. I would start with your app shell or primary theme layout HTML.
This is where your scripts should be loaded, it may not be the only place, but should be the primary location.
Search for 'http://'.
Replace any instances with 'https://'.
Load your pages and see if your issues are resolved.
Insecure Third Party Script Solutions
You may see some resources cannot be found or a server error returned. This may be due to the script not being available via HTTPS.
If this is the case you should look for an alternative source, available via HTTPS. Most reputable third parties have upgrade to HTTPS in recent years.
If they have not, it might a sign it is time to move on to a new vendor.
If you absolutely need the script you may consider serving the script locally. This will require you downloading the script from the supplier's server and placing it on your server.
This may not solve your problem as it may reference additional resources via HTTP.
As you can see this can open up a rabbit hole of potential issues. To be honest have them update their servers or find an alternative service for your needs.
Any hosted service not offering HTTPS today is a big signal to stay away. At least that is my opinion.
Using Protocoless or Protocol-Relative URLS
You could also use protocoless URLS. This is where you remove the HTTP or HTTPS all together.
When you do this the browser applies the protocol used to load the primary page, in this case HTTPS.
This can guard you against potential future protocol changes. But it also could open you up to other strange issues.
If for some reason you still enable HTTP then any of these references will use HTTP. This means the third party scripts might load via HTTP, when they should be loaded via HTTPS.
So I don't recommend using protocol-relative URLs.
Summary
Seeing 'this page is trying to load scripts from unauthenticated sources' is not a bad problem to have. It just means your HTTPS upgrade is not done yet.
Take some time and find all your legacy HTTP url references and update them to use HTTPS.
HTTPS is not just installing a certificate. You still have work to do. Updating legacy references is just one of them, but an important one in the pursuit of the coveted Green Security shield!