我正在参加「掘金·启航计划」

项目中iframe加载一些公司内部服务器的数据表或者可视化图形页面，在测试环境我们的服务器还是http的协议，当部署到正式环境的时候是使用https带证书的协议。 然后就遇到了加载失败的情况，浏览器提示

Mixed Content: The page at ‘https://xxx‘ was loaded over HTTPS, but requested an insecure image ‘http://xxx’. This content should also be served over HTTPS.

这个报错通常是由于我们的网站或应用程序中的iframe试图加载不安全的HTTP内容而导致的。浏览器为了保护用户的安全和隐私，要求所有内容都必须通过HTTPS进行传输。

解决方式

1. 确保我们的iframe中加载的所有内容都使用HTTPS，通过更改iframe中的HTTP链接为HTTPS链接来实现这一点
2. 可以在服务端nginx反向代理来解决。（我们是这么解决的）
    要在nginx中设置代理，需要编辑nginx配置文件并添加以下内容：

location / {
    proxy_pass http://your_upstream_server;
}

需要将“your_upstream_server”替换为你的代理的服务器的地址 3. 单纯的测试可以给浏览器中添加配置，让浏览器跳过安全检测。这个方式只适用我们自己测试，不可能让用户也去设置吧。 4. 当然如果交互比较多，干脆我们不使用iframe来展示，可以考虑微前端的方案来实现。