Mixed content causes website page confusion? A complete investigation and repair of an ISC project

1. The website interface is messed up, open the developer tool – network – all. Then refresh the web page and view the network request. The status of the found style file is: (shield: mixed-content). as shown in Figure 1

2. However, the URL of the CSS file with the status: (blocked:mixed-content) will be opened in a new tab, and the status is 200. as shown in Figure 2

3. Why does it appear (blocked: mixed-content)

The website is:

👉https://www.jammerfromchina.com

But the CSS loaded in the page is:

👉http://xxx.css（注意是http)

The browser security policy is like this:

https page
❌ Not allowed to load HTTP resources (css/js/image)

Otherwise it will:
👉 Direct blocking (blocked: mixed-content)

So see:

Status: (shield:mixed-content)

4. Why is ‘opening CSS alone is 200’?

This is also well understood:

Open in the new tab:
👉http://xxx.css

This is an independent HTTP request

Browser will not restrict → return 200 ✅

But:

❗ Refer to HTTP resources in HTTPS pages → blocked

5. Check the source code of the web page, search: styles/styles.css, and find that the reference URL is:http://www.jammerfromchina.com/templates/__master/Styles/styles.css.

6. ISC (Interspire Shopping Cart) is an old-fashioned PHP+MySQL commercial e-commerce system. It has been officially suspended in 2012. A powerful competing product for Magento and ZenCart. Edit the configuration file /config/config.php, http: replace with https:

<?php

        $GLOBALS['ISC_CFG']["ShopPath"] = 'https://www.jammerfromchina.com';

7. Refresh the page, the interface is already normal. Open Developer Tools – Network – All. Then refresh the web page and view the network request. The status of the found style file is: 200. as shown in Figure 3