求推荐支持自定义工具的PDF WebViewer技术栈及Python对接方案

适配的PDF SDK组合 #

针对你的需求，推荐两种不同场景的SDK组合：

1. 开源免费高定制：PDF.js + Python后端（FastAPI/Flask） #

PDF.js是Mozilla开源的PDF渲染库，完全免费且可深度定制，能轻松实现文本/区域选择功能，再配合Python后端处理数据，完美契合你的需求。

2. 成熟工具快速开发：Apryse WebViewer + Python后端 #

你之前测试的Apryse其实可以满足需求，只是需要通过前后端交互传递数据。它自带完善的文本/表格区域选择工具，无需从零开发选择逻辑，适合快速落地项目。

数据传递与处理实现方案 #

一、文本提取与处理流程 #

核心逻辑为前端获取选中文本 → 传给Python后端 → 处理后返回结果

前端侧（PDF.js示例）

// 获取PDFViewer实例
const pdfViewer = document.querySelector('#viewer').viewer;

// 监听用户选中事件
pdfViewer.addEventListener('textlayerselectionchanged', () => {
  const selection = pdfViewer.getSelection();
  if (selection) {
    const selectedText = selection.getText();
    // 调用Python后端接口
    fetch('/api/process-text', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ text: selectedText })
    })
    .then(res => res.json())
    .then(data => {
      // 在页面展示处理结果
      alert('分析结果：' + data.result);
    });
  }
});

前端侧（Apryse WebViewer示例）

// 初始化WebViewer后获取documentViewer
const { documentViewer } = instance.Core;

// 监听选中事件
documentViewer.addEventListener('selectionChanged', () => {
  const selectedText = documentViewer.getSelectedText();
  if (selectedText) {
    // 传给Python后端
    fetch('/api/process-text', {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify({ text: selectedText })
    })
    .then(res => res.json())
    .then(data => {
      // 展示结果
      console.log('处理结果:', data.result);
    });
  }
});

Python后端侧（FastAPI实现）

from fastapi import FastAPI, Request
from fastapi.middleware.cors import CORSMiddleware

app = FastAPI()

# 解决跨域问题（前后端不同域名时启用）
app.add_middleware(
    CORSMiddleware,
    allow_origins=["*"],
    allow_credentials=True,
    allow_methods=["*"],
    allow_headers=["*"],
)

@app.post("/api/process-text")
async def process_text(request: Request):
    data = await request.json()
    selected_text = data['text']
    
    # 替换为你的自定义分析逻辑，比如关键词提取、情感分析等
    processed_result = f"文本分析完成：共{len(selected_text)}个字符，包含关键词：{'测试' if '测试' in selected_text else '无'}"
    
    return {"result": processed_result}

二、表格提取与处理流程 #

需用户先框选表格区域，前端传递区域坐标和页码给后端，后端用Python表格提取库处理：

前端侧（PDF.js自定义框选工具）

// 简化实现：让用户鼠标框选表格区域，获取坐标和页码
let startX, startY, endX, endY;
const viewer = document.querySelector('#viewer');

viewer.addEventListener('mousedown', (e) => {
  startX = e.clientX;
  startY = e.clientY;
});

viewer.addEventListener('mouseup', (e) => {
  endX = e.clientX;
  endY = e.clientY;
  // 获取当前页码
  const currentPage = pdfViewer.currentPageNumber;
  
  // 构造表格区域数据
  const tableRegion = {
    pageNumber: currentPage,
    x1: Math.min(startX, endX),
    y1: Math.min(startY, endY),
    x2: Math.max(startX, endX),
    y2: Math.max(startY, endY)
  };
  
  // 传给后端
  fetch('/api/extract-table', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ region: tableRegion, pdf_path: './sample.pdf' })
  })
  .then(res => res.json())
  .then(data => {
    // 渲染表格结果到页面
    const tableHtml = `<table>${data.table_data.map(row => `<tr>${row.map(cell => `<td>${cell}</td>`).join('')}</tr>`).join('')}</table>`;
    document.querySelector('#result').innerHTML = tableHtml;
  });
});

Python后端侧（Camelot提取表格）

import camelot
from fastapi import FastAPI, Request

app = FastAPI()

@app.post("/api/extract-table")
async def extract_table(request: Request):
    data = await request.json()
    region = data['region']
    pdf_path = data['pdf_path']
    
    # 转换为Camelot支持的区域格式
    table_region = f"{region['x1']},{region['y1']},{region['x2']},{region['y2']}"
    
    # 提取指定区域的表格（规整表格用flavor='lattice'，非规整用'stream'）
    tables = camelot.read_pdf(
        pdf_path,
        pages=str(region['pageNumber']),
        flavor='stream',
        table_regions=[table_region]
    )
    
    # 返回表格数据
    if tables:
        table_data = tables[0].df.values.tolist()
        return {"table_data": table_data}
    else:
        return {"table_data": [], "message": "未提取到表格数据"}

补充说明 #

• Apryse WebViewer本身支持表格识别，若需自定义Python处理，只需通过JS获取选中的表格区域坐标，再传给后端即可，无需依赖Apryse内置表格功能。
• 表格提取库除Camelot外，还可选用Tabula-py、PyMuPDF，根据表格规整程度选择合适的库。

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