情况概述：
微信小程序开发者工具，勾选不校验合法域名后，所有图片均能显示，但真机调试时，非https域名的图片（不包括本地的静态资源图片）出不来，但将图片设置为背景图是能显示出来的，视频也能正常显示。
问题分析：
微信小程序里图片加载跟接口请求的域名校验是分开的，即使你在开发者工具里勾选了 「不校验合法域名」，图片还是会受限制。
原因：
1、图片域名需要配置到下载域名
小程序加载网络图片，不走 request 的「request 合法域名」白名单，而是走 downloadFile 合法域名 或 业务域名 白名单。
也就是说，图片的服务器地址必须在小程序后台配置。
2、开发工具和真机差异
开发者工具里「不校验合法域名」可以让接口请求绕过，但 真机不生效。
真机调试时，如果域名没配置，就算勾选了也加载不出来。
为什么视频能出来
在微信小程序里：
图片 属于 downloadFile 域名 的管控范围
视频 属于 media（多媒体）资源，走的是 video 组件，而 video 组件加载资源时，走的是 业务域名 (business-domain) 或者直接只要求 https（官方对视频资源限制比图片宽松）
具体区别
图片 ( 组件)
必须在小程序后台 开发设置 → downloadFile 合法域名里配置，否则真机加载不了（开发工具可以勾选绕过，但真机不行）
视频 ( 组件)
可以直接用任意 HTTPS 链接（只要证书有效、CORS 没问题），微信限制相对宽松，一般不需要额外配置 downloadFile 域名
因为微信认为视频文件较大，通常是流式播放，不直接走 downloadFile，而是交给系统播放器加载
为什么出现这种差异？
微信对不同资源的安全策略不同：
图片、音频文件 → 有可能涉及接口请求或埋点，必须强校验合法域名
视频 → 作为多媒体流播放，对域名校验放宽，避免大文件频繁配置
为什么将图片设置为背景图就能出来
image组件
走的是小程序的 图片资源管控，它会严格检查 downloadFile 合法域名 白名单，所以没配置域名就加载失败。
CSS 背景图（background-image: url(...)）
本质上是 样式资源，走的是 WebView 的渲染逻辑，而不是 组件的逻辑，不走小程序资源安全校验。
WebView 本身对 HTTP/HTTPS 的限制没那么严格，所以：
http 链接也能显示
甚至有些情况下非白名单 https 域名也能显示
为什么微信这样设计？
图片组件 ：有交互、可预览、可保存，所以微信必须做安全校验（防止加载恶意资源）。
背景图：只是样式装饰，不可直接交互，微信就宽松处理，只要能请求到就显示。
实际开发的坑
用 image 标签：受微信域名和 https 强限制，最规范。
用 background-image：能绕过 http/白名单限制，但有缺点：
不能使用 的 懒加载、mode（裁剪/缩放） 等功能
不能预览（长按/点击大图查看）
可能在 iOS/Android WebView 下渲染表现不一致