在Moodle浏览器控制台导入JSZip失败求解决方案

一、修复JSZip加载失败问题 #

Moodle的内容安全策略（CSP）或脚本加载时机问题，会导致直接导入脚本失效。改用带加载等待的动态脚本注入，同时使用可信CDN地址避免上传限制：

// 加载JSZip的Promise封装，确保脚本加载完成再执行后续代码
function loadJSZip() {
  return new Promise((resolve, reject) => {
    const script = document.createElement('script');
    script.src = 'https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js';
    script.onload = () => {
      console.log('JSZip加载完成');
      resolve(window.JSZip);
    };
    script.onerror = (err) => reject(err);
    document.head.appendChild(script);
  });
}

// 调用示例：先等JSZip加载好再执行业务逻辑
loadJSZip().then((JSZip) => {
  // 这里写批量下载的代码
});

二、批量下载文件（含文件夹）实现 #

结合JSZip，按页面DOM结构整理文件层级，打包后下载：

loadJSZip().then(async (JSZip) => {
  const zip = new JSZip();
  const folderMap = new Map(); // 缓存已创建的Zip文件夹对象

  // 替换为Moodle页面实际的文件链接选择器，比如页面中文件链接的类名
  const fileLinks = document.querySelectorAll('a[href$=".pdf"], a[href$=".docx"], a[href$=".zip"]');
  
  for (const link of fileLinks) {
    const fileName = link.textContent.trim();
    const fileUrl = link.href;
    // 从页面结构中提取文件所属文件夹路径（需根据实际DOM调整，比如父元素文本）
    const folderPath = link.closest('.activityinstance')?.querySelector('.instancename')?.textContent.replace('File', '').trim() || '根目录';

    // 获取或创建对应文件夹
    let folder = folderMap.get(folderPath);
    if (!folder) {
      folder = zip.folder(folderPath);
      folderMap.set(folderPath, folder);
    }

    // 下载文件并添加到Zip
    try {
      const response = await fetch(fileUrl);
      const blob = await response.blob();
      folder.file(fileName, blob);
    } catch (err) {
      console.log(`下载${fileName}失败:`, err);
    }
  }

  // 生成Zip并触发下载
  zip.generateAsync({ type: 'blob' }).then((content) => {
    const downloadBtn = document.createElement('a');
    downloadBtn.href = URL.createObjectURL(content);
    downloadBtn.download = 'Moodle课程文件打包.zip';
    downloadBtn.click();
    URL.revokeObjectURL(downloadBtn.href);
  });
});

注意：需要根据你使用的Moodle版本页面DOM结构，调整文件链接选择器、文件夹路径提取逻辑，确保能正确识别所有文件和对应的文件夹。

三、备选方案（无需JSZip） #

如果打包需求不强，可直接用Tampermonkey脚本批量触发下载：

// Tampermonkey脚本示例，自动点击所有文件链接下载
// ==UserScript==
// @name         Moodle批量下载文件
// @match        https://你的moodle课程地址/*
// ==/UserScript==

document.querySelectorAll('a[href$=".pdf"], a[href$=".docx"]').forEach(link => {
  const newLink = link.cloneNode();
  newLink.target = '_blank';
  newLink.click();
});

这种方式会将文件逐个下载到浏览器默认文件夹，无需打包，适合快速批量获取文件。

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