媒体助手

About

📖 媒体助手 — 使用说明
一、简介
媒体助手是一款 Chrome 浏览器扩展插件，专门用于从小红书（xiaohongshu.com）采集笔记中的图片和视频素材，支持打包下载到本地或上传至云端。

二、安装
从 Chrome Web Store 安装,工具栏会出现 ⬇ 媒体助手 图标

三、基本使用流程
第一步：打开小红书笔记
在 Chrome 中访问小红书网站，浏览并打开任意一篇图文类型笔记的详情页。
⚠️ 当前版本仅支持图文笔记，视频笔记的采集功能暂未开放。
第二步：点击采集按钮
页面加载后，插件会在笔记详情页的 作者名称右侧 自动显示一个 下载图标按钮（⬇）：
点击该按钮后：
页面会显示 加载遮罩（转圈动画）
插件自动采集当前笔记中的所有图片等媒体资源
采集完成后弹出 绿色提示：「收集完成，任务已加入队列」
第三步：查看任务队列
点击 Chrome 工具栏上的 媒体助手图标，打开侧边栏面板，即可看到所有采集任务

四、下载素材到本地
在侧边栏中找到状态为 「已保存」 或 「已下载」 的任务
点击该任务卡片下方的 「下载到本地」 按钮
浏览器自动生成 ZIP 压缩包 并触发下载
ZIP 包内容示例：
xhs_abc123def_20260414_120000/
├── xhs_abc123def_image_01.jpg      # 图片文件
├── xhs_abc123def_image_02.jpg
├── xhs_abc123def_image_03.jpg
├── note_snapshot.json              # 笔记元数据（标题、正文、标签等）
└── run_result.json                 # 采集统计结果
💡 已保存的任务可以反复下载，数据持久化存储在浏览器 IndexedDB 中。

五、上传到云端（高级功能）
如果需要将素材自动上传到自己的服务端：
在侧边栏 设置区域 的 「上报页面 URL」 输入框中，填写你的接收页面地址，例如：https://example.com/auto-upload
点击 「保存 URL」
之后对已保存的任务，卡片上会出现 「上传云端」 按钮
点击后，插件会：
同时自动打开你配置的上报页面，并在 URL 中携带 uploadId 参数
上报页面可通过外部 API 分块拉取素材数据，实例代码如下：
```javascript
(function() {
// =============================================
// XHS Collector 外部 API 完整验证脚本（含文件下载）
// 在上报页面的 Console 中执行
// =============================================

const EXTENSION_ID = "dpnjkichnfjknliphamgkogfmjhffepn";

// 从 URL 参数提取，或手动指定
const params = new URLSearchParams(location.search);
const uploadId = params.get("uploadId");
const taskId  = params.get("taskId") ;

console.log("📦 uploadId:", uploadId);
console.log("📋 taskId: ", taskId);

// ─── 工具函数：base64 → Blob → 触发浏览器下载 ───
function downloadBase64File(base64Data, fileName, mimeType) {
  const binStr = atob(base64Data);
  const bytes = new Uint8Array(binStr.length);
  for (let i = 0; i < binStr.length; i++) bytes[i] = binStr.charCodeAt(i);
  const blob = new Blob([bytes], { type: mimeType });
  const url = URL.createObjectURL(blob);
  const a = document.createElement("a");
  a.href = url;
  a.download = fileName;
  document.body.appendChild(a);
  a.click();
  setTimeout(() => { URL.revokeObjectURL(url); a.remove(); }, 1000);
}

// ─── Step 1: 获取上传清单 ───
async function getManifest() {
  console.log("\n📂 [1/4] 获取上传清单...");
  const res = await chrome.runtime.sendMessage(EXTENSION_ID, {
    type: "XHS_COLLECTOR_GET_UPLOAD_MANIFEST",
    uploadId
  });
  if (!res?.ok) { console.error("❌ 失败:", res); return null; }
  console.log(`✅ 清单获取成功! 共 ${res.manifest.files.length} 个文件:`);
  res.manifest.files.forEach((f, i) =>
    console.log(`   ${i + 1}. ${f.path} (${f.mimeType}, ${(f.size / 1024).toFixed(1)}KB)`)
  );
  console.log("📝 笔记标题:", res.manifest.title);
  return res;
}

// ─── Step 2: 拉取单个完整文件（自动分块合并） ───
async function pullFullFile(filePath) {
  console.log(`\n📥 [拉取] ${filePath} ...`);
  let offset = 0;
  const chunks = [];
  let totalSize = 0, mimeType = "";

  while (true) {
    const chunk = await chrome.runtime.sendMessage(EXTENSION_ID, {
      type: "XHS_COLLECTOR_PULL_UPLOAD_CHUNK",
      uploadId,
      filePath,
      offset
    });

    if (!chunk?.ok) { console.error("❌ 拉取失败:", chunk); return null; }

    totalSize = chunk.totalSize;
    mimeType = chunk.mimeType;

    if (chunk.chunkBase64) chunks.push(chunk.chunkBase64);
    console.log(`   📦 分块 ${chunk.offset}-${chunk.nextOffset}/${totalSize} (${chunk.done ? "✅完成" : "继续..."})`);

    if (chunk.done) break;
    offset = chunk.nextOffset;
  }

  // 合并所有 base64 分块
  const fullBase64 = chunks.join("");
  return { fullBase64, totalSize, mimeType };
}

// ─── Step 3: 逐个下载所有文件到本地 ───
async function downloadAllFiles(manifest) {
  const files = manifest.manifest.files;
  console.log(`\n💾 [3/4] 开始下载 ${files.length} 个文件...`);

  for (let i = 0; i < files.length; i++) {
    const file = files[i];
    console.log(`\n--- [${i + 1}/${files.length}] ${file.path} ---`);
    const result = await pullFullFile(file.path);
    if (!result) { console.warn(`⚠️ 跳过 ${file.path}`); continue; }

    // 触发浏览器下载
    downloadBase64File(result.fullBase64, file.path, result.mimeType);
    console.log(`✅ 已下载: ${file.path} (${(result.totalSize / 1024).toFixed(1)}KB)`);

    // 避免浏览器阻塞，稍微间隔
    await new Promise((r) => setTimeout(r, 300));
  }
}

// ─── Step 4: 确认完成（清理 session） ───
async function ackDone() {
  console.log("\n🏁 [4/4] 确认上传完成，清理 session...");
  const res = await chrome.runtime.sendMessage(EXTENSION_ID, {
    type: "XHS_COLLECTOR_ACK_UPLOAD_DONE",
    uploadId
  });
  console.log(res?.ok ? "✅ Session 已清理" : "⚠️", res);
  return res;
}

// ════════════════════════════════════════
// 🚀 一键执行完整流程
// ════════════════════════════════════════
async function runFullDownload() {
  console.log("╔══════════════════════════════════════╗");
  console.log("║  XHS Collector 完整下载测试           ║");
  console.log("╚══════════════════════════════════════╝");

  const manifest = await getManifest();
  if (!manifest) { console.error("🛑 终止：无法获取清单"); return; }

  await downloadAllFiles(manifest);
  await ackDone();

  console.log("\n🎉 全部完成！请检查浏览器下载目录。");
}

// ════════════════════════════════════════
// 执行（取消注释即可）
// ════════════════════════════════════════

runFullDownload();
    
})()
```

六、管理任务
- 下载到本地
将已保存任务的素材打包为 ZIP 下载
- 上传云端
跳转到配置的上报页面，并通过编程的方式提交到自己的服务器
- 删除任务
移除任务记录及关联的所有媒体数据（不可恢复）

七、注意事项
仅支持图文笔记 — 视频笔记暂不支持采集
需在小红书笔记详情页操作 — 首页/搜索页不会显示采集按钮
数据存储在浏览器本地 — 使用 IndexedDB 存储，清除浏览器数据会导致任务丢失
单次采集范围 — 每次点击按钮仅采集当前打开的那一篇笔记的素材
ZIP 文件命名规则 — 格式为 xhs_{笔记ID摘要}_{时间戳}.zip