Mixed Content: The page at ‘https://lingyidianke.com/index‘ was loaded over HTTPS, but requested 安全

今天敲代码出现了bug：

Mixed Content: The page at 'https://lingyidianke.com/index' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://154.8.165.152:9090/code/list'. This request has been blocked; the content must be served over HTTPS.

翻译：

混合内容:“https://lingyidianke.com/index”处的页面是通过https加载的，但请求了不安全的XMLHttpRequest终结点“http://154 . 8 . 165 . 152:9090/code/list”。此请求已被阻止；内容必须通过HTTPS提供。

这里自己的前端发送了一个http://154 . 8 . 165 . 152:9090/code/list请求，为了获取后端数据

CSDN解决问题的答案：

混合内容(Mixed Content)是指在一个使用安全协议HTTPS（Hypertext Transfer Protocol Secure）加载的网页上，尝试通过不安全的HTTP协议（例如GET、POST请求）获取数据的情况。在这个例子中，访问"https://lingyidianke.com/index"的页面，试图通过"http://154.8.165.152:9090/code/list"这个非加密的XMLHttpRequest端点发送数据。由于现代浏览器为了提升网站安全性，通常会阻止这种混合请求，以防止敏感信息在传输过程中被中间人窃取。为了消除这个警告并保证完整的HTTPS体验，你应该将所有非HTTPS资源都升级到HTTPS，或者在服务器配置中调整跨域策略以允许通过HTTPS连接访问该HTTP资源。

同时根据同源协议

同时后端访问https协议也无法访问获取数据，要改成https的请求

最终在修改了，vue.config.js为映射域名，使用的是https的协议

发送的是https的协议请求

以及配置Ngnix的相关的映射文件，解决了这个问题：

 
user  www;
worker_processes auto;
error_log  /www/wwwlogs/nginx_error.log  crit;
pid        /www/server/nginx/logs/nginx.pid;
worker_rlimit_nofile 51200;
events
    {
        use epoll;
        worker_connections 51200;
        multi_accept on;
    }
http {
    include       mime.types;
    default_type  application/octet-stream;
    sendfile        on;
    keepalive_timeout  65;
    client_max_body_size 100m;
 
    #用于tomcat反向代理,解决nginx 504错误
 
    proxy_connect_timeout 7200; #单位秒
 
    proxy_send_timeout 7200; #单位秒
 
    proxy_read_timeout 7200; #单位秒
 
    proxy_buffer_size 16k;
 
    proxy_buffers 4 64k;
 
    proxy_busy_buffers_size 128k;
 
    proxy_temp_file_write_size 128k;
    # ps:以timeout结尾配置项时间要配置大点
    server {
        listen       80;
        server_name  www.lingyidianke.com;
        # return 301 http://lingyidianke.com$request_uri;
        charset utf-8;
        location / {
                    root   /home/myProject/ruoyi-vue/dist;
                    try_files $uri $uri/ /index.html;
                    index  index.html index.htm;
                    # proxy_pass http://154.8.165.152:9090/;
                    rewrite ^(.*) https://www.lingyidianke.com$1;
                }
        # location /admin/ {
        #   alias /home/myProject/ruoyi-vue/dist;
        #   try_files $uri $uri/ /admin/index.html;
        #   index index.html index.html;
        # }
        # location @dsrouter {
        #   rewrite ^/(admin)/(.+)$ /$1/index.html last;
        # }
#           location /prod-api/ {
#           proxy_set_header Host $http_host;
#           proxy_set_header X-Real-IP $remote_addr;
#           proxy_set_header REMOTE-HOST $remote_addr;
#         proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
#         proxy_pass http://localhost:9090/;
# }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }
    }
    server {
    #SSL 默认访问端口号为 443
    listen 443 ssl; 
    #请填写绑定证书的域名
    server_name www.lingyidianke.com; 
    #请填写证书文件的绝对路径。此路径仅供参考，具体请您按照实际目录操作
    ssl_certificate /home/myProject/https/lingyidianke.com_bundle.crt; 
    #请填写私钥文件的绝对路径。此路径仅供参考，具体请您按照实际目录操作
    ssl_certificate_key /home/myProject/https/lingyidianke.com.key;
    ssl_session_timeout 5m;
    #请按照以下协议配置
    ssl_protocols TLSv1.2 TLSv1.3; 
    #请按照以下套件配置，配置加密套件，写法遵循 openssl 标准。
    ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE; 
    ssl_prefer_server_ciphers on;
    location / {
    #网站主页路径。此路径仅供参考，具体请您按照实际目录操作。
    root /home/myProject/ruoyi-vue/dist;
    index  index.html index.htm;
         }
     }
  
}
 
 
 

同时设置相关的Tomcate的SSL配置文件

SSL Error: Hostname/IP does not match certificate‘s altnames-CSDN博客

https，http协议相关资源整合,软件开发常见流程

https，http协议相关资源整合,软件开发常见流程-CSDN博客