为何HTTP协议的远程图片URL被强制转为HTTPS？

基本信息 #

• 在AWS服务器上通过Laravel Forge部署Laravel应用，使用Nginx作为Web服务器

需求场景 #

页面内通过以下代码加载第三方HTTP协议的图片：

style="background-image: url('http://xx.xx.xxx.xxx/foo/bar/image.png');"

第三方服务器仅支持HTTP，未配置SSL。

问题现象 #

浏览器访问页面时，图片URL被自动转为HTTPS请求，第三方服务器不支持HTTPS，导致请求超时，报错net::ERR_CONNECTION_TIMED_OUT，图片无法加载。

排查信息 #

• Chrome开发者工具显示图片请求URL已被替换为HTTPS协议，最终请求超时
• 页面响应头包含相关HTTP头字段（如Content-Security-Policy）

可能的原因及解决办法 #

1. 内容安全策略（CSP）强制升级 #

检查页面响应头中的Content-Security-Policy是否包含upgrade-insecure-requests指令——该指令会自动将所有HTTP资源请求转为HTTPS。解决方式：移除该指令，同时添加img-src http://xx.xx.xxx.xxx规则，明确允许加载指定HTTP图片。

2. Laravel或Forge的HTTPS强制配置 #

• 检查Laravel项目的AppServiceProvider中是否存在URL::forceScheme('https')代码，若有且需加载HTTP资源，可针对特定场景调整逻辑
• 查看Laravel Forge的站点设置，是否开启了“Force HTTPS”选项，若开启需配置允许加载HTTP资源的例外规则

3. Nginx的HTTPS重定向规则 #

检查Nginx配置文件，是否存在将所有HTTP请求重定向到HTTPS的规则，若有需确认是否影响了资源请求的转发逻辑，必要时调整规则排除目标图片资源的强制跳转

4. 浏览器自动HTTPS功能 #

检查浏览器是否安装了HTTPS Everywhere等自动升级HTTP请求的扩展，暂时禁用后测试是否恢复正常

5. 混合内容代理方案 #

若第三方服务器无法配置HTTPS，可在自己的服务器上搭建代理，将第三方HTTP图片通过自身HTTPS服务器转发，避开浏览器的混合内容限制

内容的提问来源于stack exchange，提问作者sohal07