如何在威胁建模中识别前端API的注入攻击风险？

沐岩酱~ 提问于 2026-02-06 19:48:30 阅读 40

安全

最近在做威胁建模时发现前端调用的API可能存在注入攻击风险，但不确定该怎么具体分析。比如用第三方富文本库上传图片时，后台返回的Markdown内容直接渲染到页面，虽然加了输入过滤，但测试时发现特殊字符能绕过。该从哪些角度切入做威胁建模？

尝试过用OWASP的威胁分类表，但不知道如何对应到具体代码场景。比如这个渲染流程需要标记哪些威胁类型？数据流分析应该关注哪些边界点？有没有什么工具能辅助前端的威胁建模工作？

安全开发生命周期

我来解答赞 6 收藏

反馈

1 条解答

上官紫瑶 Lv1

我的做法是从数据流和渲染环节入手分析这类问题。你提到的富文本上传后返回Markdown内容直接渲染，这个流程里要特别注意三个环节：上传时的文件内容校验、后台返回的数据结构、前端渲染方式。

从威胁分类角度看，这个场景主要涉及A03:2021-Injection（注入）和A02:2021-Cryptographic Failures（加密失败）。上传环节可能被绕过的原因通常是只校验了文件后缀，没校验文件内容。建议在上传接口加个二次校验，比如用FileReader读取文件头几个字节判断真实类型。

渲染环节的注入风险往往出现在用了dangerouslySetInnerHTML或者Vue的v-html这种渲染方式。我一般会强制要求把所有用户内容经过DOMPurify过滤后再渲染，这个库可以过滤掉大部分恶意脚本。npm上就有包，安装后用起来很简单，比如：

import DOMPurify from 'dompurify'



const cleanContent = DOMPurify.sanitize(markdownContent)

// 然后再用innerHTML或者框架提供的方法渲染

数据流方面要重点关注三个边界点：前端往服务端传数据时、服务端处理完返回时、前端拿到数据渲染前。这三个环节都要加校验和过滤，不能只靠前端或者只靠后端。

工具方面我用过Microsoft的Threat Modeling Tool，它内置的STRIDE模型能帮助理清攻击面。如果是团队协作，还可以把发现的风险点直接标注在接口文档里，方便前后端一起配合防御。

2026-02-06 20:00