背景
image
由于需要使用摄像头拍照，需要将原来的http升级到https，通过一顿捣鼓，升级成功。
不过页面加载出现了问题，具体的提示是说：你的页面是在https环境，但是你访问了一个资源（我这里是iframe，也可能是stylesheet等其他资源），而这个资源是在http环境下的，浏览器不给你这样玩。
https只能访问https的资源，也因为此修改了接口的baseURL。
解决办法
在nginx 配置中加上 add_header Content-Security-Policy "upgrade-insecure-requests"; 这一条配置即可。
让 http 能够自动转发到 https
server {
listen 80;
server_name yourdomain.com;
location / {
return 301 https://$host$request_uri;
}
}
server {
listen 443 ssl;
server_name yourdomain.com;
ssl_certificate yourcrt.pem;
ssl_certificate_key yourkey.pem;
ssl_session_timeout 5m;
location / {
port_in_redirect off;
proxy_pass http://127.0.0.1:1234;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
# 加上这条即可 👇
add_header Content-Security-Policy "upgrade-insecure-requests";
}
}
为什么HTTPS和HTTP不能混用？
混合内容问题：当一个安全的 HTTPS 页面试图加载非安全的 HTTP 内容时，这种情况被称为“混合内容”。浏览器通常会阻止这种行为，因为它降低了整个页面的安全性。
安全风险：HTTP 内容没有加密，易受中间人攻击。如果在 HTTPS 页面中加载 HTTP 内容，攻击者可能利用这个未加密的内容来攻击整个页面，比如通过注入恶意脚本。
[kod.kangmingjian.com）
[kod.ybs0510.com）
[kod.chinavision1.com）
[kod.pld8.com）
[kod.rwhds.com）
[kod.bzxtp.com）
隐私和完整性：HTTPS 旨在保护用户数据的隐私和完整性。混合内容使得 HTTPS 页面的这些保障部分失效，因为嵌入的 HTTP 内容不受同样的保护。
用户信任：用户可能信任一个安全的 HTTPS 页面，如果这个页面包含不安全的内容，这可能误导用户，使他们对整个页面的安全性有错误的理解。
如果实在要混用怎么办？
参考这篇文章：如何在 https 的 iframe 里访问 http 页面？ | nginx应用实战-3
原理就是在服务器访问http拿到页面，然后包装成https再返回来。
其实最好就是原http页面也升级成https，上面的方法是针对原http不是自己写的没法改的情况下。
