如何阻止或检测iframe中文档的下载操作？

方案一：可靠禁用下载功能 #

直接用#toolbar=0很容易被用户篡改，必须从服务端+前端双重入手：

1. 服务端锁死文档权限（核心） #

不要直接给用户原始文档URL，通过服务端代理返回处理后的文档，以PDF为例，修改文档本身的权限，禁用下载、打印：

// Node.js + pdf-lib示例
const { PDFDocument } = require('pdf-lib');
const fs = require('fs');
const express = require('express');
const app = express();

app.get('/proxy-doc', async (req, res) => {
  // 读取原始PDF
  const rawPdf = fs.readFileSync('./target-doc.pdf');
  const pdfDoc = await PDFDocument.load(rawPdf);
  
  // 设置权限：禁止修改、复制、下载相关操作
  pdfDoc.setPermissions({
    modifying: false,
    copying: false,
    printing: 'lowResolution',
    fillingForms: false,
    contentAccessibility: false
  });
  
  // 返回处理后的PDF
  const modifiedPdf = await pdfDoc.save();
  res.setHeader('Content-Type', 'application/pdf');
  res.send(modifiedPdf);
});

app.listen(3000);

这样处理后，即使用户拿到代理URL，文档本身也没有下载权限，工具栏的下载按钮会失效。

2. 前端iframe沙箱限制（辅助） #

给iframe添加sandbox属性，不允许下载行为：

<iframe src="/proxy-doc" sandbox="allow-same-origin allow-scripts"></iframe>

注意：根据实际需求添加允许的权限，千万别加allow-downloads，进一步阻止浏览器默认下载触发。

方案二：记录下载行为 #

如果需要统计下载而不是禁用，核心还是靠服务端代理：

1. 服务端代理统计（100%可靠） #

所有文档请求走服务端代理，每次响应下载请求时记录用户信息：

# Python Flask示例
from flask import Flask, send_file, request
import datetime
import logging

app = Flask(__name__)
# 配置日志文件
logging.basicConfig(filename='download-logs.log', 
                    format='%(asctime)s - %(user_id)s - %(doc_id)s',
                    level=logging.INFO)

@app.route('/download-doc')
def download_doc():
    # 获取用户和文档标识（根据你的业务调整）
    user_id = request.cookies.get('user_id')
    doc_id = request.args.get('doc_id')
    
    # 记录下载日志
    logging.info(f'User {user_id} downloaded doc {doc_id}')
    
    # 返回文档，触发下载
    return send_file('./target-doc.pdf', as_attachment=True)

不管用户通过什么方式触发下载（工具栏、直接改URL），只要走这个代理就会被记录，完全不受前端操作影响。

2. 前端事件监听（仅同域可用） #

如果文档和当前页面同域，可以尝试监听iframe内的下载按钮点击，作为补充统计：

const iframe = document.querySelector('#doc-iframe');
iframe.onload = () => {
  try {
    // 根据实际工具栏下载按钮的选择器调整
    const downloadBtn = iframe.contentDocument.querySelector('[title="下载"]');
    if (downloadBtn) {
      downloadBtn.addEventListener('click', () => {
        // 发送统计请求到服务端
        fetch('/log-download-click', {
          method: 'POST',
          headers: {'Content-Type': 'application/json'},
          body: JSON.stringify({user_id: 'xxx', doc_id: 'xxx'})
        });
      });
    }
  } catch (e) {
    // 跨域时无法访问iframe内容，忽略即可
  }
};

注意：跨域场景下这个方法直接失效，只能作为同域的补充手段，核心还是服务端统计。

重要提醒 #

前端的任何控制都能被用户绕过（比如改DOM、禁JS），服务端处理才是唯一可靠的方案。如果用的是第三方文档服务，没法修改文档权限的话，就全靠服务端代理转发请求+记录，绝对不要暴露原始文档地址。

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