如何在HTTPS 网页中引入HTTP资源: Mixed Content?
HTTPS页面里动态的引入HTTP资源,比如引入一个js文件,会被直接block掉的.在HTTPS页面里通过AJAX的方式请求HTTP资源,也会被直接block掉的。
参考了这篇文章:https页面中引入http资源的解决方式 ,但依然没有解决问题。
方法1:相对协议。
对于同时支持HTTPS和HTTP的资源,引用的时候要把引用资源的URL里的协议头去掉,浏览器会自动根据当前是HTTPS还是HTTP来给资源URL补上协议头的,可以达到无缝切换。
方法2:iframe方式
使用iframe的方式引入HTTP资源,然后将这个页面嵌入到HTTPS页面里就可以了,
PS..我的博客是用的github+hexo搭建的,博客地址默认为https://
开头,引用的http资源,没有https型。
问题1:
在博客中引入优酷视频,采用的是iframe形式,如下:
<div class="video_content">
<iframe height=148 width=220 src="http://player.youku.com/embed/XMTU4MTY4OTg5Mg==" frameborder=0 allowfullscreen></iframe>
</div>
但无法打开这个视频,chrome浏览器下提示错误:
Mixed Content: The page at 'https://xifengxx.github.io/web-demo/imooc/index.html' was loaded over HTTPS, but requested an insecure resource 'http://player.youku.com/embed/XMTU4MTY4OTg5Mg=='. This request has been blocked; the content must be served over HTTPS.
问题2:
博客中,通过Ajax引入了http
资源,也是无法顺利访问,chrome浏览器下提示错误:
jquery.min.js:4 Mixed Content: The page at 'https://xifengxx.github.io/web-demo/music-APP/index.html' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://api.jirengu.com/fm/getChannels.php'. This request has been blocked; the content must be served over HTTPS.
这样的问题,如何解决呢?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(6)
<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">
可以在相应的页面的<head>里加上这句代码,意思是自动将http的不安全请求升级为https
详情可以参考这里:http://thehackernews.com/2015/04/disable-mixed-content-warning.html
如果目标有https资源,就是用https方式能打开连接,可以直接用相对路径例如//baidu.com,如果不想改,而且确定连接有https资源,也可以用楼上的<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">,不过如果目标本身没有https资源,无论你用jsonp还是meta标签还是相对路径都无法解决的,唯一能解决的方法是自己在后端抓取目标页面的内容然后以https形式输出给前端,就像代理页一样,不过这样影响效率,如果是api接口类可以尝试,如果是图片视频类恐怕比较慢
HTTP和HTTPS交叉使用属于跨域的范畴,直接转接解决跨域问题的方法:
跨域资源共享的10种方式
还是要斗胆问一下,有人知道解决方案吗,目前在https页面嵌入http iframe,被block掉了 伤心
如果只有一个地方用到 可以自己拼接一下,请求方式 . 域名
https://www.ydh100.cn/Home/vi...
这篇文章也许能解决你的问题,唯一的办法就是全部弄成一样的。