blocked content on OpcSaveBilling with cloudflare SSL

I am getting an error in the checkout process on 'OpcSaveBilling'
The error is '(blocked:mixed-content)'.
The error  occurred after switching to cloudflare SSL (Flexible - Encrypts traffic between the browser and Cloudflare).

NopCommerce 4.3

Thanks.

eyalankri wrote:

That issue can sometimes happen when your site has mix content using the HTTP protocol. For example if you programed your site page to call on a HTTP URL for an image, .js, .css or any file using HTTP. You will get that error.

To resolve the problem you  would need to change the URL to HTTPs or don't use a URL to call on the file. Instead use the path to the file  ex; /image/image.gif

Best way to find out what file is causing the problem. Load the site on Google Chrome Developer Tools.  (Ctrl + Shift + I)

Click the Network tab.

Reload the page. Review the error messages and look at what protocol is being used for each file.

Although the solution provided here did the trick but it does not seem the right way to go. Does anyone have a better explanation and resolution?

I anticipated that the previous resolution would not completely resolve the problem. I encountered an issue with the sitemap, as it did not utilize secure URLs. However, the solution that proved effective was adjusting the SSL/TLS settings in CloudFlare to 'Full (strict)' instead of the 'Flexible' option.