最近在给自己的小站 https://nanobanana21.net/ 做内容发布后的自动巡检，需要确认文章里的外链图片是否真的加载成功。 一开始的判断很简单： img.complete && img.naturalWidth > 0 结果页面首屏图片正常，第二张图经常是 complete=false, naturalWidth=0 ，但手动往下滚后又能正常显示。后来发现不是图片挂了，而是目标平台用了 lazy loading ，图片还没进入视口。 现在改成三步： 找到目标图片后先 scrollIntoView({ block: 'center' }) ； 等待 complete && naturalWidth > 0 ； 最后检查 currentSrc ，不再只看原始 src 。 第三步也挺重要。有的平台会把外链图转成自己的代理地址，例如 Cloudinary / imgix 。此时 DOM 里的 src 可能已经不是提交时的 URL ，但图本身是正常的。我的验收逻辑现在会同时记录原始地址、 currentSrc 、尺寸和加载状态，避免把代理图当成丢图。 还有一个边界：HTTP HEAD 返回 200 只能说明资源可访问，不能说明页面渲染时没被 CSP 、代理参数或懒加载卡住。所以最终还是以浏览器渲染态为准。 大家做发布后验收时，是直接检查 DOM ，还是会再加网络请求/截图层面的校验？

  • 情报分类：综合情报
  • 分类依据：内容未命中明确的垂直分类规则，归入综合情报
  • 信息来源：服务器 / V2EX
  • 发布时间：2026/10/6 12:33:36