
本文介绍在保留 source map 的前提下,如何准确还原 typescript 构建后的原始源码,重点解析 inline source 与 separate map 两种模式的区别及还原关键条件。
本文介绍在保留 source map 的前提下,如何准确还原 typescript 构建后的原始源码,重点解析 inline source 与 separate map 两种模式的区别及还原关键条件。
TypeScript 编译生成的 JavaScript 代码本身不可读,但若构建时正确生成并保留了 Source Map,理论上可实现源码级逆向映射——注意:这不是“反编译”,而是通过映射关系将运行时错误或压缩代码中的位置精准回溯至原始 .ts 文件。能否成功还原,核心取决于 Source Map 的内容完整性,而非工具版本新旧。
? Source Map 的两种关键形态
TypeScript(v4.7+)默认生成的是 *`.js.map分离式映射文件**(即sourceMap: true),它仅记录行/列位置到源文件路径的映射关系,**不内嵌原始源码内容**。这类 map 文件体积小、部署安全,但无法独立完成源码还原——因为缺少sourcesContent字段(即原始.ts` 文件的文本内容)。
而真正支持逆向还原的,是启用了 inlineSources: true 的配置组合:
{
"compilerOptions": {
"sourceMap": true,
"inlineSources": true,
"inlineSourceMap": false // 或 true(二者选一,推荐 false + separate .map)
}
}
启用 inlineSources: true 后,TypeScript 会将每个引用的 .ts 文件内容以字符串形式写入 .map 文件的 sourcesContent 数组中。此时 .map 文件虽变大,但具备完整还原能力。
✅ 正确生成的 map 文件应包含类似结构:
使用 Scrapfly SDK(scrapfly-sdk)在 TypeScript 或 JavaScript 中进行网页抓取,用于用户请求抓取 URL、绕过反爬虫防护、渲染页面等场景。
{
"version": 3,
"sources": ["src/index.ts", "src/utils.ts"],
"sourcesContent": ["export function hello() { ... }", "export const PI = 3.14;"],
"mappings": "AAAA,IAAI,..."
}
⚠️ 若 sourcesContent 为空或缺失,则任何逆向工具(如 reverse-sourcemap、source-map-explorer 或 VS Code 调试器)都会报错 "Not all sources were included in the sourcemap" —— 这正是你遇到的问题根源,而非工具过时。
✅ 可靠的还原方案(实测有效)
-
确认构建配置
检查 tsconfig.json 是否同时启用:"sourceMap": true, "inlineSources": true
验证 .map 文件内容
打开生成的 dist/index.js.map,搜索 "sourcesContent",确认其为非空数组且长度与 "sources" 一致。-
使用现代工具还原
推荐使用官方维护的 source-map 库手动解析,或更便捷的 CLI 工具:npx source-map-explorer --no-border dist/index.js # 或直接提取源码(需配合自定义脚本)
若需批量导出 .ts 文件,可用以下 Node.js 脚本:
import * as fs from 'fs'; import * as path from 'path'; import { SourceMapConsumer } from 'source-map'; const mapContent = fs.readFileSync('dist/index.js.map', 'utf8'); const consumer = await new SourceMapConsumer(mapContent); consumer.sources.forEach((src, i) => { const content = consumer.sourceContentFor(src); if (content) { fs.writeFileSync(path.join('recovered', src), content); } });
? 注意事项与最佳实践
- ❌ 不要依赖 inlineSourceMap: true(将 map 内联进 JS)+ inlineSources: false:此时 sourcesContent 仍为空,无法还原。
- ✅ 生产环境建议关闭 inlineSources(避免泄露源码),仅在调试/内部 QA 阶段启用。
- ? Source Map 文件应与 JS 文件同目录部署,并确保 HTTP 响应头允许加载(如 Access-Control-Allow-Origin)。
- ? reverse-sourcemap 确实已长期未维护,推荐转向 source-map 官方库或 VS Code 的内置 Source Map 支持(F1 → “Debug: Open Link in Source Map”)。
总之,逆向还原的本质是数据完备性问题:有 sourcesContent,就能还原;没有,再先进的工具也无能为力。请优先检查 tsconfig.json 和生成的 .map 文件内容,而非更换工具。










