Chrome浏览器https网站里http资源加载报错

今天遇到这么一个问题,我们的网站是https的,Chrome浏览器在加载一个http的图片时报错:

仔细查看报错的图片路径,发现图片路径的http协议被Chrome浏览器强制改成了https。

原因分析:

https是严格加密传输,不允许调用http普通协议数据,其中包括:JS、CSS、图片等任何http协议普通资源的存在。在https地址中,如果加载了http资源,浏览器将认为这是不安全的资源,将会默认阻止。

在 https 网站加载 http 协议的图片时,Chrome浏览器会强制把图片路径的 http 改成 https,然后进行资源请求,所以图片就加载报错了。

谷歌官方也发了通告:

https://security.googleblog.com/2019/10/no-more-mixed-messages-about-https_3.html

https网页中加载的http资源被称之为 Mixed Content(混合内容),不同浏览器对 Mixed Content 有不一样的处理规则。经测试,只有Chrome浏览器才会把http图片强制转换成https,搜狗、360极速浏览器不会强制转换,可以正常的加载图片。

解决办法

办法1:更改Chrome对网站不安全内容处理行为为允许

 把“不安全内容”设置为“允许”,然后刷新页面就可以了。这个设置只针对具体某个网站有效。

方法2:把http图片存储到支持https的服务器

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
当前端"Not allowed to load local resource"时,这通常是由于浏览器安全策略的限制导致的。浏览器默认不允许通过本地文件系统资源,以防止恶意站读取用户的本地文件。为了解决这个,你可以尝试以下几种方法: 1. 使用Web Server for Chrome插件:这是一种在本地搭建Web服务器的方法,通过将你的文件放在Web服务器上,然后通过浏览器访问服务器上的文件来解决该问题。你可以在Chrome上应用商店中搜索并下Web Server for Chrome插件。然后按照插件的使用说明配置服务器,并选择你想要访问的文件。 2. 配置Spring Boot项目:如果你在使用Spring Boot项目,并且想要在前端本地资源,你可以通过配置Spring的资源处理器来解决该问题。你可以创建一个配置类,使用`addResourceHandlers`方法来指定本地资源的访问路径。根据你的具体情况,你需要修改`addResourceLocations`方法中的路径为你想要访问的本地资源的路径。 3. 将资源上传到服务器:如果你的资源是需要在生产环境中访问的,你可以将资源上传到服务器上,并通过服务器的URL来访问资源,而不是直接使用本地文件系统的路径。这样可以避免浏览器的安全策略限制。 需要注意的是,以上方法只是解决"Not allowed to load local resource"的几种常见方法,具体的解决方法还要根据你的具体情况进行调整和实施。<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* [Not allowed to load local resource: file:///,浏览器禁止访问浏览器图片,文件解决方法](https://blog.csdn.net/weixin_42802725/article/details/123460700)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] - *3* [Not allowed to load local resource: 解决方法](https://blog.csdn.net/bwddd/article/details/81530446)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v92^chatsearchT3_1"}}] [.reference_item style="max-width: 50%"] [ .reference_list ]

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值