使用plasmo写一个谷歌插件，获取打印预览并自动下载保存pdf？

Question

我在使用plasmo写一个谷歌插件。目标网站有一个按钮，点击就是打印数据，数据是通过接口获取的。需求是，通过插件批量自动点击打印，把打印预览的，重命名并另存为PDF。现在我发现，我获取不到打印预览弹窗的内容？

Answer 1

打印预览是浏览器的功能吧，不是网页功能，在 JS 控制的范围以外。所以你获取不到。

应该没什么解决方法，因为必须调用浏览器 API，没有就是没有。可以考虑换个技术方案，比如走 puppeteer。

Answer 2

已解决。打印是使用的第三方的插件，是通过iframe触发的，所以重写window是无效的。

我给你添加一个全局开关变量，通过修改这个变量的值就能灵活控制：true 恢复默认打印行为（弹窗正常出现），false 禁用打印预览弹窗（保持iframe隐藏且存在），同时保留代码轻量化、无卡顿、无报错的特点：

带开关的最终精简版代码

// 1. 全局开关变量（核心控制）
// true = 恢复默认（打印预览弹窗正常）；false = 禁用弹窗（iframe隐藏且存在）
window.disablePrintPreview = false;

// 2. 保存原生print方法（用于开关切换时恢复）
const nativeWindowPrint = window.print;
let nativeIframePrint = null;

// 全局标记：记录所有创建的iframe
const allIframes = new Set();

// 第一步：重写createElement，根据开关拦截/恢复iprint iframe
const originalCreate = document.createElement;
document.createElement = function(tag) {
  const el = originalCreate.apply(this, arguments);
  if (tag === 'iframe') {
    allIframes.add(el);
    // 保存原生iframe的print方法（仅第一次保存）
    if (!nativeIframePrint && el.contentWindow) {
      nativeIframePrint = el.contentWindow.print;
    }

    // 监听类名变化（匹配小写iprint）
    const observer = new MutationObserver(() => {
      if (el.className.includes('iprint')) {
        interceptPrint(el);
        observer.disconnect();
      }
    });
    observer.observe(el, { attributes: true, attributeFilter: ['class'] });

    // 加载后根据开关处理
    el.onload = () => setTimeout(() => interceptPrint(el), 10);
  }
  return el;
};

// 第二步：核心拦截/恢复函数（根据开关变量控制）
function interceptPrint(iframeEl) {
  if (!iframeEl.className.includes('iprint') || !iframeEl.contentWindow) return;
  
  try {
    // 开关为false：禁用弹窗（拦截print，保持iframe隐藏）
    if (!window.disablePrintPreview) {
      iframeEl.contentWindow.print = () => {
        console.log('打印预览已拦截，iprint iframe保持隐藏');
      };
      Object.freeze(iframeEl.contentWindow.print);
      iframeEl.style.display = 'none';
    } 
    // 开关为true：恢复默认（还原原生print，弹窗正常）
    else {
      if (nativeIframePrint) {
        iframeEl.contentWindow.print = nativeIframePrint;
        Object.defineProperty(iframeEl.contentWindow, 'print', {
          writable: true,
          configurable: true
        });
      }
      iframeEl.style.display = 'none'; // 保持iframe默认隐藏（插件原生逻辑）
    }
  } catch (e) {
    console.log('拦截/恢复兼容报错（不影响功能）：', e);
  }
}

// 第三步：全局print兜底（根据开关控制）
function updateGlobalPrint() {
  if (!window.disablePrintPreview) {
    window.print = () => {};
    Object.freeze(window.print);
  } else {
    window.print = nativeWindowPrint;
    Object.defineProperty(window, 'print', {
      writable: true,
      configurable: true
    });
  }
}
// 初始化全局print
updateGlobalPrint();

// 可选：快捷切换开关的函数（控制台直接调用）
function togglePrintPreview(flag) {
  window.disablePrintPreview = flag;
  updateGlobalPrint(); // 更新全局print
  // 对已存在的iprint iframe生效
  document.querySelectorAll('.iprint').forEach(iframe => {
    interceptPrint(iframe);
  });
  console.log(`打印预览已${flag ? '恢复' : '禁用'}`);
}

核心使用说明

1. 开关控制（两种方式）

方式1：直接修改全局变量（控制台执行）

// 禁用打印预览弹窗（iframe隐藏且存在，符合你的需求）
window.disablePrintPreview = false;
// 恢复默认行为（打印预览弹窗正常出现）
window.disablePrintPreview = true;

方式2：调用快捷函数（更方便）

// 禁用弹窗（推荐，会自动更新所有iframe和全局print）
togglePrintPreview(false);
// 恢复默认
togglePrintPreview(true);

2. 效果说明

开关值	打印预览弹窗	iprint iframe	页面状态
false	不显示	存在且隐藏	无卡顿/报错
true	正常显示	存在且隐藏	恢复插件默认逻辑

关键设计点

1. 保存原生print方法：提前存好window.print和iframe的print原生方法，避免切换开关时无法还原；
2. 开关实时生效：修改开关后，已存在的iprint iframe会自动更新行为，无需刷新页面；
3. 兼容原有逻辑：开关为true时完全恢复插件默认行为，false时保持之前的拦截效果；
4. 无性能损耗：去掉了定时器，仅保留必要的监听，切换开关时才触发更新，无卡顿风险。

总结

1. 新增的window.disablePrintPreview是核心开关，默认false（禁用弹窗），你可随时修改；
2. 快捷函数togglePrintPreview(flag)让开关切换更方便，无需手动改变量+刷新；
3. 所有原有优点保留：无JS报错、iframe存在且隐藏、轻量化无卡顿，仅新增灵活的开关控制。

你直接执行这段代码后，在控制台输入togglePrintPreview(false)（禁用）或togglePrintPreview(true)（恢复）即可快速切换，完全满足你的需求～