WeChat Image Loader

解决微信文章中图片懒加载、防盗链和 Obsidian Web Clipper 漏解析问题的用户脚本。

功能特点

🚀 自动加载 - 自动将微信文章中的懒加载图片（data-src）转换为真实图片
🔓 突破防盗链 - 通过设置 Referrer Policy 突破微信图片防盗链限制
🧹 智能清洗 - 移除可能导致图片加载失败的 URL 参数（如 tp、wxfrom、from 等）
👁️ 显式可见 - 强制微信图片变为可见状态，并补齐宽高和加载状态
🧩 剪藏兼容 - 将独立图片块规范为 section / figure 结构，降低 Obsidian Web Clipper 漏解析概率
⚡ 实时监控 - 自动检测并处理动态加载的内容

安装

第一步：安装脚本管理器

Tampermonkey（推荐）

Chrome 商店搜索 "Tampermonkey" 安装
或访问 tampermonkey.net 下载

ScriptCat（国产替代）

访问 scriptcat.org 下载对应浏览器版本

第二步：创建脚本

点击油猴/ScriptCat 图标 → "创建新脚本"
将 wechat-img-loader.user.js 的全部内容复制到编辑器
按 Ctrl+S 保存

使用方法

验证脚本是否生效

打开任意微信公众号文章
按 F12 打开开发者工具 → Elements
找到任意图片，检查 src 属性
如果 URL 中的 &tp=、&from= 等参数已被移除，说明 URL 清洗正常
如果独立图片外层出现 figure[data-wechat-img-loader]，说明剪藏兼容处理正常

脚本运行状态

开始使用

安装并验证后，使用 Obsidian Web Clipper 正常剪藏，图片即可正常加载并被解析进笔记。

修复前（图片加载失败）：

剪藏失败

修复后（图片正常显示）：

剪藏成功

工作原理

Referrer Policy - 设置 no-referrer-when-downgrade 策略，使外部访问时能够正常显示图片
图片地址提取 - 从 data-src 或已有 src 中提取微信图片真实链接
URL 清洗 - 精准移除可能导致加载失败或剪藏异常的参数，如 tp、wxfrom、from
可见性修复 - 设置 visibility: visible !important、height: auto !important，必要时从 data-w 补齐宽度
加载状态修复 - 设置 loading="eager"、decoding="sync"，并把真实图片地址同步写入 src、data-src、data-original、data-original-src
DOM 结构修复 - 将只有一张图片的段落规范为 section[nodeleaf]，并包装为 figure > a > img，提升 Obsidian Web Clipper 识别成功率
动态监听 - 使用 MutationObserver 监控页面变化，实时处理新增图片

已处理的典型失败场景

图片链接存在但剪藏后裂图

原因通常是微信图片 URL 带有防盗链或格式参数，剪藏到 Obsidian 后图片地址无法正常加载。

脚本会清理参数并设置 Referrer Policy。

页面中能看到图片，但 Obsidian 没有剪藏出图片链接

部分微信图片虽然已有 src，但仍带有微信编辑器、懒加载或占位属性，且外层是深层 p > span > span > img 结构。Obsidian Web Clipper 可能直接跳过这类图片。

脚本会将这类独立图片块规范为更通用的语义结构：

<section nodeleaf="">
  <figure data-wechat-img-loader="">
    <a href="图片真实地址">
      <img src="图片真实地址">
    </a>
  </figure>
</section>

兼容性

Tampermonkey (推荐)
Greasemonkey
Violentmonkey

支持的浏览器：Chrome、Firefox、Edge、Safari 等主流浏览器

License

MIT License

微信文章自动加载图片 (防盗链穿透版)