Solution to the (Mixed Content error, which is the error that occurs in the browser when https requests http) in [Google Chrome]

1. Problem details

Mixed Content: The page at ‘https://xxx’ was loaded over HTTPS, but requested an insecure test ‘http://xxx’. This request has been blocked; the content must be served over HTTPS.

Note: The blue marked [test] in the above picture is the keyword of the last level directory of the http request, which is the directory keyword that displays the current problem.

2. Solution (just choose one of the two methods)

2.1. Method 1: Add a meta tag element to the head of the corresponding HTML page on the front end (meaning to automatically upgrade unsafe http requests to https). The content is as follows:

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

2.2. Method 2, configure [add_header Content-Security-Policy upgrade-insecure-requests;] in Nginx Server

server
{
    
    
    listen 80;
    server_name xxx.test.com;
    index index.php index.html index.htm default.php default.htm default.html;
    root /www/wwwroot/xxx.test.com;
    add_header Content-Security-Policy upgrade-insecure-requests;
    try_files $uri $uri/ /index.html;
    gzip_static on;
}