谷歌浏览器87版本 iframe_谷歌浏览器阻止未经验证脚本的加载

9ae097ce72145aa4fe7663e3fa295d92.png

问题:

最近遇到了个问题,同事电脑的谷歌浏览器在加载websocket(实际项目用的是stomp.js)推送的时候,websocket连接不上。

原因:

从网上获取了相似情况的图片:

e9393d58b9364d2f95107b775cfba364.png

46aabdf0d54860fa98f9311c563c51c0.png

首先谷歌浏览器拦截了未经验证来源的脚本,然后控制台打印除了混合内容报错的,大概模板是这样的:

Mixed Content: The page at '****************' was loaded over HTTPS, but requested an insecure resource '****************'. This request has been blocked; the content must be served over HTTPS.

解决方法:

1. 点击网址输入栏右边的小金盾,允许加载未知来源的脚本

2. 将https连接的协议,改为http连接的协议,比如: https://saas.aqara.cn 改为http://saas.aqara.cn

最近社区中也发现了mixed content的问题,列下补充一下:

HTTPS页面里动态的引入HTTP资源,比如引入一个js文件,会被直接block掉的.在HTTPS页面里通过AJAX的方式请求HTTP资源,也会被直接block掉的。

  1. 问题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. 问题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.


3. 具体的的解决方法主要是:

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

可以在相应的页面的<head>里加上这句代码,意思是自动将http的不安全请求升级为https。

社区问题地址: https://segmentfault.com/q/1010000005872734

图片获取:https://www.cnblogs.com/Marydon20170307/p/9086279.html

参考文章: https://thehackernews.com/2015/04/disable-mixed-content-warning.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值