React2Shell安全漏洞分析：React应用文件处理风险及修复方法

2026 年 5 月 8 日，Web 安全研究员 lachlan.nz 披露了一个名为 React2Shell 的严重安全漏洞。这个漏洞影响 React 应用中的客户端文件处理功能——恶意用户可以通过上传特定格式的文件，在服务器上执行任意代码。目前该漏洞已经修复，但很多老项目可能还在使用受影响的版本。

漏洞原理

React2Shell 的核心问题是：某些 React 库在处理用户上传的文件时，没有正确过滤文件内容中的可执行代码。攻击者可以构造一个看起来像正常文件（如图片、文档）但实际上包含恶意代码的文件，当服务器解析这个文件时，恶意代码就会被执行。

具体来说，漏洞出现在以下场景：

• React 应用使用 dangerouslySetInnerHTML 或类似方式渲染用户上传的内容
• 服务端使用 Node.js 的 child_process 或类似模块处理文件
• 文件类型验证只检查扩展名，不检查文件实际内容

影响范围

• 使用受影响版本的文件上传库的 React 应用
• 服务端处理用户上传文件时没有做内容验证的 Node.js 应用
• 任何允许用户上传文件并服务端处理的 Web 应用

检测方法

检查你的项目是否使用了受影响的库：

# 检查 package.json 中是否有受影响的依赖
grep -r "react-file\|file-upload\|multer" package.json

# 检查服务端是否有危险的文件处理模式
grep -r "child_process\|exec\|spawn" --include="*.js" --include="*.ts" src/

修复方法

1. 更新依赖

# 更新所有依赖到最新版本
npm update

# 或使用 npm audit 检查已知漏洞
npm audit
npm audit fix

2. 加强文件验证

不要只检查文件扩展名，要验证文件的实际内容：

const fileType = require('file-type');

async function validateFile(buffer) {
  const type = await fileType.fromBuffer(buffer);
  if (!type || !['image/jpeg', 'image/png', 'image/gif'].includes(type.mime)) {
    throw new Error('Invalid file type');
  }
  return true;
}

3. 文件处理沙箱化

在处理用户上传的文件时，使用沙箱环境：

// 不要直接在主进程中处理文件
// 使用子进程或容器来隔离文件处理
const { Worker } = require('worker_threads');

function processFileInSandbox(filePath) {
  return new Promise((resolve, reject) => {
    const worker = new Worker('./file-processor.js', {
      workerData: { filePath }
    });
    worker.on('message', resolve);
    worker.on('error', reject);
  });
}

4. 配置安全头

添加 Content-Security-Policy 等安全头，限制脚本执行：

// Express 示例
app.use((req, res, next) => {
  res.setHeader("Content-Security-Policy", 
    "default-src 'self'; script-src 'self'; object-src 'none';");
  next();
});

预防建议

• 定期运行 npm audit 或 yarn audit 检查项目依赖的安全问题
• 文件上传功能一定要做服务端内容验证，不能只靠前端
• 处理用户文件时使用沙箱环境，避免在主进程中直接执行
• 限制上传文件的大小和类型，减少攻击面
• 关注安全社区的最新动态，及时更新依赖

总结

React2Shell 虽然已经修复，但它提醒我们：Web 应用中的文件处理功能是高风险区域。如果你的项目涉及用户文件上传和处理，建议立即检查依赖版本，更新到最新版，并加强文件内容验证。

来源：lachlan.nz – The React2Shell Story