LangChain网页数据：WebBaseLoader与HTML清洗（附：OCR识别扫描件文档）

网页抓取总失败？你缺的不是爬虫，而是“智能清洗+OCR兜底”

上周帮一家做竞品监控的客户调试 LangChain 工作流时，他们抱怨：“明明 WebBaseLoader 能拉到网页，但提取出来的全是广告和 JS 代码，根本没法喂给 LLM！”——这几乎是所有刚接触 LangChain 网页数据处理者的共同痛点。更别提那些 PDF 扫描件、截图文档，纯文字提取直接归零。今天，Dr. n8n 就手把手教你打通从“原始 HTML”到“干净结构化文本”的任督二脉，连 OCR 识别扫描件也一并拿下。

WebBaseLoader 不是万能钥匙，它只是“快递员”

很多人误以为 WebBaseLoader 是个智能爬虫，其实它更像一个“快递小哥”——只负责把整包 HTML 快递到你门口，拆包、分类、丢垃圾都得你自己来。比如这段典型报错：

ValueError: Document is empty after cleaning.

问题往往不在加载器，而在后续的“清洗环节”。我在为某跨境电商搭建自动商品摘要系统时，就发现目标页面充斥着动态广告脚本和隐藏评论区，直接喂给模型只会得到一堆乱码。这时候，你需要的是“HTML 清洗流水线”。

💡 类比教学：把 WebBaseLoader 想象成超市送货员，他把整箱生鲜（含包装盒、冰袋、促销单）堆在你厨房。你要做的不是退货，而是拆箱 → 去包装 → 分类冷藏 —— 这就是 HTML 清洗的本质。

三步构建你的 HTML 清洗流水线

LangChain 内置了强大的 BeautifulSoupTransformer 和自定义过滤器，我们用实战代码说话：

from langchain_community.document_loaders import WebBaseLoader
from langchain_community.document_transformers import BeautifulSoupTransformer

# Step 1: 加载原始网页
loader = WebBaseLoader("https://example.com/product-page")
docs = loader.load()

# Step 2: 清洗 —— 只保留正文区域，剔除脚本/样式/广告
bs_transformer = BeautifulSoupTransformer()
cleaned_docs = bs_transformer.transform_documents(
    docs,
    tags_to_extract=["p", "h1", "h2", "li"],  # 只提取这些标签
    remove_unwanted_tags=["script", "style", "nav", "footer"]  # 彻底删除这些
)

# Step 3: 进一步按 CSS class 精准剔除（如广告横幅）
final_docs = [doc for doc in cleaned_docs if "ad-banner" not in doc.metadata.get("class", "")]

这套组合拳打下来，90% 的噪音内容都能被清除。但注意：不同网站结构千差万别，你需要用浏览器“检查元素”功能，找到真正承载内容的标签或 CSS 类名，针对性调整 tags_to_extract 和 remove_unwanted_tags 参数。

扫描件/PDF 图片文字？OCR 是你的“第二双眼睛”

当遇到合同扫描件、老式 PDF 报表或截图文档时，HTML 清洗完全失效。此时必须引入 OCR（光学字符识别）。好消息是，LangChain 社区已集成 Unstructured 库，一行代码调用 Tesseract 或 Azure AI OCR：

from langchain_community.document_loaders import UnstructuredFileLoader

# 自动识别文件类型（支持 JPG/PNG/PDF 扫描件）
loader = UnstructuredFileLoader("contract_scan.jpg", mode="elements")
docs = loader.load()  # 返回带坐标和文本块的结构化数据

实测中，我曾用此方案帮客户从 200+ 份扫描发票中提取关键字段，准确率超 85%。若追求更高精度，可替换为付费 API（如 Google Vision 或 Azure Form Recognizer），只需更换 loader 配置即可。

终极工作流：Web + OCR 双引擎自动切换

真正的企业级应用，必须能“智能判断来源，自动选择处理路径”。比如用户上传的可能是网页链接，也可能是扫描件图片。我们可以用 n8n 搭建一个路由节点：

在 n8n 中，用“If”节点判断文件扩展名或 URL 协议，就能实现全自动分流处理，最终汇入同一个知识库或 LLM 提示词入口。

总结：数据预处理决定 AI 应用成败

无论是 WebBaseLoader 的粗放抓取，还是 OCR 对扫描件的攻坚，核心思想都是“把脏数据变成干净燃料”。记住 Dr. n8n 的忠告：LLM 再强大，也消化不了满是广告脚本的 HTML；OCR 再精准，也需要你提供清晰的输入源。清洗与识别，才是自动化链条中最值得投入的环节。

你在处理网页或扫描件时踩过哪些坑？有没有自创的清洗技巧？欢迎在评论区分享你的“血泪史”，我会挑三位读者的问题深度解答！