转载

让浏览器不再显示 https 页面中的 http 请求警报,所有静态资源强制转https





原创

让浏览器不再显示 https 页面中的 http 请求警报,所有静态资源强制转https















版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。


本文链接:https://blog.csdn.net/u014723529/article/details/78789112













HTTPS 是 HTTP over Secure Socket Layer,以安全为目标的 HTTP 通道,所以在 HTTPS 承载的页面上不允许出现 http 请求,一旦出现就是提示或报错:





Mixed Content: The page at ‘https://www.tqcto.com/‘ was loaded over HTTPS, but requested an insecure image ‘http://g.alicdn.com/s.gif’. This content should also be served over HTTPS.
  • 1


HTTPS改造之后,我们可以在很多页面中看到如下警报:



img



很多运营对 https 没有技术概念,在填入的数据中不免出现 http 的资源,体系庞大,出现疏忽和漏洞也是不可避免的。





Nginx设置upgrade-insecure-requests



好在 W3C 工作组考虑到了我们升级 HTTPS 的艰难,在 2015 年 4 月份就出了一个 Upgrade Insecure Requests 的草案,他的作用就是让浏览器自动升级请求。



在我们nginx服务器的响应头中加入:



add_header Content-Security-Policy upgrade-insecure-requests;
  • 1




CSP设置upgrade-insecure-requests





header("Content-Security-Policy: upgrade-insecure-requests");
  • 1


参考编程技术

我们的页面是 https 的,而这个页面中包含了大量的 http 资源(图片、iframe等),页面一旦发现存在上述响应头,会在加载 http 资源时自动替换成 https 请求。可以查看 google 提供的一个 demo



img



不过让人不解的是,这个资源发出了两次请求,猜测是浏览器实现的 bug:

img



当然,如果我们不方便在服务器/Nginx 上操作,也可以在页面中加入 meta 头:



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


目前支持这个设置的还只有 chrome 43.0,不过我相信,CSP 将成为未来 web 前端安全大力关注和使用的内容。而 upgrade-insecure-requests 草案也会很快进入 RFC 模式。

参考编程技术



从 W3C 工作组给出的 example,可以看出,这个设置不会对外域的 a 链接做处理,所以可以放心使用。




技术交流学习或者有任何问题欢迎加群

编程技术交流群 : 154514123 爱上编程






Java技术交流群 : 6128790  Java









文章最后发布于: 2017-12-13 10:36:09



正文到此结束
该篇文章的评论功能已被站长关闭
本文目录