每年春招安全公司的前端笔试题总会被拿出来反复讨论。2023年奇安信这套前端方向试卷1在当时不少应届生群里传得很广有人觉得它像“面试八股文合集”有人觉得有些题出得让人摸不着头脑。但把它当成程序员社区里大家互相交流的面试复盘来读其实能拆出不少对后来者有实际参考价值的信息安全厂商招前端到底在考什么为什么要这么考以及如果你现在准备投这类岗位该怎么针对性地补自己的短板。我结合这套试卷的题型结构、安全行业前端的日常工作内容以及这几年反复出现在各家安全公司笔试里的高频考点把它做了一次完整的复盘拆解。下面这份分析不是简单的“题目答案”罗列更多是想说清楚每一类题目背后的出题动机和回答策略。如果你正打算投奇安信或者其他安全厂商的前端岗这篇文章应该能帮你少走不少弯路。1. 拆卷之前先理解这套试卷在筛选什么人1.1 为什么安全公司的前端题会“长这样”很多人第一次拿到安全厂商的前端试卷第一反应是“考得真杂”JavaScript语言机制、浏览器原理、框架用法、网络安全基础全都有甚至还会出现让你分析一段危险代码的题。这和普通互联网公司“React/Vue二选一手写题场景题”的套路确实不太一样。原因在于安全公司的前端工程师日常不只是写页面。你要接触的是安全产品的前端控制台、态势感知大屏、漏洞管理平台、代码审计系统的交互界面。这些产品有共同的特点数据量大、交互密、权限模型复杂、对异常输入的处理要求极高。这意味着你的代码不仅要跑得起来还要扛得住脏数据、恶意请求和极端操作。所以这套试卷的筛选目标非常明确不是找“能切图的页面仔”而是找“能站在安全视角写业务代码的前端工程师”。你在普通公司写一个搜索框用户输入什么都行最多做个防抖和空值判断但你在安全公司写一个搜索框用户输入一段scriptalert(1)/script你输出了一个带有过滤缺陷的页面那就是事故。理解了这层差异整套试卷的题目分布就说得通了。1.2 试卷的结构与时间分配逻辑从题量和结构来看这套试卷完全符合“校招笔试”的通用节奏基础题占大头拔高题区分度场景题看潜力。虽然我无法完整复原每一道原始题面但从试卷方向、面试讨论和高频知识点可以反推出它的出题逻辑大致由单选/多选、简答、手写代码、代码审计四类题型构成。单选/多选覆盖面广重点考JavaScript基础、HTTP协议、浏览器渲染、前端安全基础。这类题速度快的话判断题干陷阱比会背答案更重要。简答题偏向原理说明比如“解释一下浏览器缓存机制”“说说XSS攻击原理和防御方式”。这里不是要你背诵定义而是看你能不能讲清楚机制链路。手写代码常见的是数组去重、防抖节流、深拷贝、Promise实现、Vue/React组件封装。这部分是“保分项”练多了就能拿稳。代码审计/场景题出题人给一段有明显安全问题的代码让你找漏洞并修复。这是奇安信这类安全厂商笔试里最有辨识度的题目也是普通公司试卷里很少出现的题型。时间分配上第一类题控制在20分钟内简答题30分钟左右手写题30分钟最后留20到30分钟给代码审计和场景题。如果你在做前两类题时耗时太长后面的场景题基本很难写好而恰恰是后面的题目才是区分度最高的地方。1.3 安全厂商前端工程师的能力画像我倾向于把这类岗位需要的能力拆成四层这套试卷本质上是四层能力的一次快速体检能力层级考察内容试题表现语言基础JS核心机制、ES6、异步编程选择题、手写题系统原理浏览器渲染、HTTP、缓存、安全策略简答、概念辨析框架实践Vue/React、组件设计、状态管理手写组件、方案设计安全素养输入校验、XSS/CSRF、代码审计、CSP场景题、代码审计题前两层决定你能不能干活后两层决定你能不能在安全公司干好活。出题人很清楚语言基础可以短期突击但安全素养需要长期积累和意识养成所以在试卷里刻意提高了后两类题的权重。2. 试卷里的高频考点逆向拆解2.1 JavaScript语言机制比“会写”更重要的是“讲得清”几乎每一套前端校招题都会考JavaScript核心机制奇安信这套也不例外。但相比普通公司它在JS语言机制上更喜欢抠细节尤其是那些容易出现“看似懂了、深问就垮”的知识点。第一个高频点是事件循环Event Loop。宏任务和微任务的执行顺序、setTimeout、Promise、async/await、requestAnimationFrame混在一起时执行顺序怎么排。题目不会直接问你“什么是事件循环”而是给你一段代码让你写出打印顺序再让你解释为什么。这里需要注意Node.js环境下的事件循环和浏览器略有差异如果题目没说明环境默认按浏览器环境作答同时指出差异点会给面试官留下“这人有体系”的印象。第二个高频点是原型链和this指向。笔试常考new、call/apply/bind、箭头函数以及原型继承的实际应用。我曾经在一次模拟中整理过一套经典原型链输出题很多同学在第一层就翻车function Foo() { this.a 1; } Foo.prototype.b 2; const foo new Foo(); console.log(foo.a); // 1 console.log(foo.b); // 2 console.log(Foo.b); // undefined console.log(Foo.prototype.b); // 2这类题看着简单但能区分出你是靠背结论还是真的理解原型链。答题时建议把查找机制拆开说先找自身属性再沿__proto__向上找直到Object.prototype为终点。第三个高频点是闭包与内存泄漏。笔试经常给一个循环中绑定事件监听的题目让你解释为什么输出不符合预期以及如何用let或闭包修复。更好的答案是顺手讲清楚闭包的本质是“函数词法作用域的组合”使用闭包时要关注对象引用何时释放否则就会造成内存泄漏。这在安全产品前端里特别常见——控制台页面长期不刷新如果到处是闭包泄漏页面会越用越卡。2.2 HTTP与浏览器原理安全岗前端的“地基”HTTP、浏览器缓存、跨域、渲染机制这一块在安全公司的试卷里权重明显高于普通公司。原因很简单安全产品的前端经常要和后端API交互而渗透测试、漏洞扫描、态势感知这类业务场景对请求的准确性、代理行为、缓存策略都有严格要求。HTTP相关题目里最常见的套路是让你比较Cookie的HttpOnly、Secure、SameSite属性的作用以及CSP内容安全策略如何配置。别看这只是一个简答题它在安全公司的语境下有具体的实战含义HttpOnly是为了防止XSS窃取CookieSameSite是为了缓解CSRF攻击。如果你能从“防御某类攻击”的角度来解释这三个属性答题深度立刻和网上的八股文模板拉开差距。浏览器缓存也是一个必考点尤其是强缓存和协商缓存。笔试中会要求说明Cache-Control与Expires的区别以及ETag和Last-Modified的优先级关系。除了背概念建议补充一句在安全产品中敏感页面通常需要设置Cache-Control: no-store避免登录凭证或用户敏感数据被浏览器缓存到磁盘。这个细节普通前端可能一辈子用不上但安全公司天天都在处理。渲染机制方面题面经常以“script标签放在哪里、为什么”切入考察DOMContentLoaded与load事件的区别、重排回流、defer与async。答题时还可以关联到前端性能监控因为安全大屏类页面往往需要处理实时刷新的数据流渲染性能直接决定产品体验。2.3 前端框架紧跟Vue/React但不止于“会用”从试卷方向看奇安信前端岗对Vue的重视度更高一些整体框架题也以Vue为主。题型大致有Vue响应式原理Object.defineProperty和Proxy的区别、组件通信方式、computed与watch的区别、v-if与v-show的区别、生命周期执行顺序等。其中最有区分度的一个题是“为什么Vue 3改用Proxy实现响应式而Vue 2用defineProperty”。标准答法是defineProperty只能劫持已有属性新增/删除属性需要额外APIProxy可以直接代理整个对象支持动态增删和数组索引操作。更好的答法是补充一句实际优化影响defineProperty需要递归遍历对象对大对象初始化更慢Proxy采用懒代理性能更好。这说明你不只看了面试题确实对比着用过两个版本。组件通信题目里props和$emit是基础但安全公司特别喜欢考“跨层级组件通信”。比如全局状态管理Vuex/Pinia、事件总线EventBus、provide/inject以及它们的适用场景和风险。答题时可以把自己代入业务场景态势感知大屏上各个可视化组件需要共享过滤条件你是用状态管理还是provide/inject为什么这种结合实际场景的回答比概念默写有价值得多。2.4 安全专项把通用考点翻译成“安全语法”这里是奇安信试卷和普通前端试卷最大的不同点也是网上的“前端面试八股文”几乎覆盖不到的部分。安全专项题往往以“输入验证”为核心出题方向这和热搜词里反复出现“奇安信 输入验证路径遍历”直接相关。一个典型的题面长这样后端接口接收一个文件名参数直接拼到文件路径里去读取文件例如/var/data/${filename}问存在什么风险前端如何配合防御。答案是路径遍历漏洞目录穿越。攻击者可以把filename设为../../etc/passwd越权读取任意文件。这类题想考察的不仅是攻击原理更关心你有没有防御意识。从后端视角需要做路径规范化比如使用path.resolve后再校验是否在预期目录内从安全产品的前端视角你在上传文件、下载文件、展示文件树的时候就要对文件名做合法性校验过滤../、空字节、特殊字符。前端还能做扩展名校验、文件大小预检、展示层编码转义避免文件名本身形成XSS。这类题目只要答出“前端能做什么、后端能做什么、兜底策略是谁”基本就是高分答案。不要只写“过滤一下”这么笼统要具体到用什么函数、过滤什么字符。3. 典型题型的答题思路一道题怎么答出安全岗差异3.1 手写题防XSS的过滤函数到底该怎么写手写题出现频率最高的安全相关题目是“写一个函数防止XSS攻击”。这题看似简单其实考察了三个层次第一层是能想到转义HTML字符第二层是能写出正确的正则或替换逻辑第三层是能指出纯前端转义不能根治XSS。基础版答案长这样function escapeHtml(str) { return String(str) .replace(//g, amp;) .replace(//g, lt;) .replace(//g, gt;) .replace(//g, quot;) .replace(//g, #39;); }如果你只写到这就停了能拿基础分但拿不到高分。更好的版本是接着补充innerHTML注入无法靠主观过滤彻底防御因为HTML解析规则极其复杂不同浏览器存在解析差异攻击者可以用编码绕过。更稳妥的方案是使用textContent而不是innerHTML需要富文本时走白名单策略只允许特定标签和属性或者使用成熟的库如DOMPurify。这类题给我的感觉是出题人真正想看的是你有没有“纵深防御”的概念。前端过滤是第一层后端校验是第二层CSP是第三层。答到第三层才算真正贴合安全公司的思维模式。3.2 网络题跨域方案里为什么安全产品会偏爱不同选项跨域方案是前端笔试的常规题但在安全公司的考卷里会多一层含义。常规选项有JSONP、CORS、代理服务器、postMessage、WebSocket。每种方案都要能说清原理和适用场景。安全公司笔试里比较有特色的是会追问“如果后端不允许在响应头里配置Access-Control-Allow-Origin你还有什么方案”。这个场景在真实业务里很常见第三方漏洞平台的数据接口不会为你的前端单独开CORS你得自己去搭代理层转发请求。这时候你要能说清楚同源策略是浏览器层面的限制不是服务端限制因此通过同源的代理服务转发请求可以绕开跨域约束同时代理层还可以统一加签名、校验权限、过滤敏感字段。另一个特色考点是postMessage的安全使用。笔试题可能给一段代码要求分析其中有没有安全问题。最经典的坑是父页面接收消息时没有校验event.origin导致任意来源的页面可以向父页面发送消息修改页面状态或窃取信息。正确代码是window.addEventListener(message, (event) { if (event.origin ! https://trusted.example.com) return; // 处理数据 });这种题在安全公司的面试反馈里出现的次数非常多。因为前端跨域通信一旦忽略来源校验就相当于把一个可受信端口暴露给任意陌生人这在即时通信类工具和内部系统嵌第三方页面的场景里是致命的。3.3 场景题文件上传与下载功能里前端到底该管多宽奇安信笔试的场景题经常围绕文件上传/下载展开这一点和它的安全产品线有关——不管是代码卫士还是漏洞管理平台都涉及文件的上传、解压、扫描、下载。出题人给一段上传文件的组件代码让你指出潜在问题并给出改进方案。这类题的完整回答可以分四层第一层前端校验上传前要校验文件类型、大小、扩展名但要知道前端校验纯粹是用户体验攻击者可以跳过前端直接构造请求所以不能作为安全边界。第二层后端校验文件类型要用MIME sniffing和文件头魔数校验不要只看扩展名文件名存储时尽量重命名例如生成UUID作为存储名避免直接把用户原始文件名拼进路径。第三层漏洞攻防文件名里可能含有../、路径分隔符、空字节如果后端直接拼路径就存在路径遍历风险。下载文件时要防止目录穿越例如通过文件ID映射物理路径而不是用文件名查路径。第四层展示层安全用户上传一个HTML文件如果另一个用户在线预览就可能触发存储型XSS。安全公司前端在预览场景里通常默认强制下载而非在线渲染或者将文件放到独立沙箱域名下展示。如果你在笔试里能把四层全部走一遍说明你真的思考过安全产品的数据链路而不只是一个写页面的。这类题目没标准答案但结构完整、层次清晰就是高分答案。3.4 代码审计题面对一段危险代码怎么系统性地找漏洞代码审计题是奇安信笔试最有辨识度的题型。出题人给一段代码可能是前端JavaScript也可能是Node.js后端代码让你找安全问题。对没接触过代码审计的应届生来说这题很容易让人慌神只盯着语法看看不出什么毛病。我的建议是做代码审计题时不要瞎看而是按“输入-处理-输出”三段式扫描输入扫描先找所有外部输入的入口包括URL参数、请求体、localStorage、postMessage、Cookie、文件上传。任何一个外部输入进入代码都要看有没有校验。处理扫描数据在处理过程中有没有被拼接、执行、渲染。重点看innerHTML、eval、new Function、document.write、模板字符串拼接SQL、路径拼接。这几类操作是漏洞高发区。输出扫描数据最后落到哪里。如果是DOM就是XSS风险如果是HTTP响应就是注入风险如果是文件系统就是路径遍历风险。举个例子如果题目给了一段这样的代码const userId req.query.id; const sql SELECT * FROM users WHERE id ${userId}; db.query(sql);一眼就能看出是SQL注入。前端卷子里不常直接考SQL注入但会考Node.js后端的同类逻辑。即使你只写前端也应该具备识别基本注入漏洞的能力因为安全公司的前后端经常在一个产品团队里协作面试官默认你了解常见的OWASP风险类型。审计题的答题结构也很重要先说风险类型再说攻击路径最后给修复方案。如果能把修复方案写到“参数化查询”或“白名单校验”这个颗粒度基本就是满分答案。4. 这套卷子之外的隐性考题安全思维才是分水岭4.1 用OWASP的维度补齐自己的安全盲区如果你认真刷过这套方向类似的试卷就会发现安全公司对前端的要求其实可以用OWASP Top 10对照着看。试卷里的XSS、CSRF、路径遍历、不安全反序列化对应JSON.parse异常处理、访问控制漏洞对应权限按钮、安全配置错误对应CSP缺失全在OWASP Top 10的框架里。所以我建议每一个目标安全公司前端的求职者不要只背安全面试题而是把OWASP Top 10的每一条都看一遍然后问自己一个问题这个漏洞在前端代码里会以什么形式出现拿“访问控制缺失”举例很多前端只关注“登录用户能不能进页面”但安全产品的前端更关注“低权限用户能不能在页面上操作高权限按钮”。作为前端你的职责是根据用户角色动态渲染操作按钮同时在请求后端时带上权限上下文并且不能信任前端判断——后端必须有二次鉴权。前端控制是为了体验后端鉴权才是边界。4.2 本地怎么练安全扫描和代码审计手感很多同学问没有真实的安全产品环境怎么练这种题的手感答案是用你自己写过的代码练。你可以把自己写过的任何一个前端项目的JS代码拉出来切到安全视角逐行过一遍哪些地方接收了外部输入这些输入有没有被插进DOM有没有用evalpostMessage监听有没有校验来源构建出来的URL拼接路径有没有被污染这种自审方式比刷十道题更锻炼感觉因为代码是你自己写的你清楚每一步的设计意图更容易发现“我以为这里安全其实不安全”的盲区。另外一个很实用的做法是安装开源的静态代码扫描工具扫描自己项目里的JS/Vue文件看扫描出来的安全问题再对照着修复。这类工具能帮你建立“代码里哪些位置容易出问题”的敏感性而这正是笔试代码审计题想考察的核心能力。日常做项目时就习惯跑一遍扫描比考前突击十道题更加有效。4.3 面试官真正想在笔试答案里看到的东西说到底笔试不是对着答案给分而是面试前的一次“能力采样”。面试官会在你交卷后看到你在每道题上的思考痕迹然后为后面的面试提问做准备。因此你在试卷上写的每一句解释、每一个补充都是在给后面的面试“埋钩子”。如果你在“CSP配置”这个空里写了“除了script-src建议同时配置object-src none和base-uri none”面试官大概率会在面试的时候追问“你知道为什么要限制base-uri吗”这时候如果你能坦诚说明是看过一篇文章提到的、自己还没有深入理解在面试的评价反而是正面的——因为你表现出了好奇心和钻研欲。最怕的是你把不了解的东西写得像自己很懂面试一深问就露馅。所以我的建议是刷题阶段做减法与其把十道题都背到滚瓜烂熟不如挑三道真正让你觉得“有点意思”的题往深里挖透。这比追求覆盖度更能体现一个人的学习能力。5. 一份可执行的自测清单离“能过这套卷”还差多少5.1 基础技术自测表如果你打算照着这份复盘去准备先对下面这张表做一次自评。每一项都能说清楚“是什么、为什么、怎么用”才算过关。技术模块核心检查点自评标准JS语言原型链、事件循环、闭包、this指向、ES6常用特性能用白话讲解能写示例代码跑通异步编程Promise原理、async/await异常处理、并发控制能手写一个带超时的fetch封装浏览器渲染过程、重排回流、缓存、存储方案能解释资源加载时序能说清缓存的坑网络HTTP状态码、跨域方案、Cookie属性能画出一次完整请求的链路Vue/React响应式原理、生命周期、组件通信、状态管理能说出核心源码思路能写通用组件工程化Webpack/Vite构建流程、代码规范、CI流程能独立搭建项目并优化构建速度这张表每一项都是笔试选择题和手写题的高频来源。不要抱着“我大概知道”的心态笔试是写出来的不是想出来的。自测时建议拿出一张白纸把每一项的核心机制画出来或者写下来能写出来的才算掌握。5.2 安全专项自测表基础技术过关只是拿到入场券安全专项才是决定你能不能进面最后一轮的关键。输入校验知道XSS和注入的原理能写出前端转义函数并明确前端校验的局限。浏览器安全策略能解释SameSite、CSP、CORS、SOP四种策略各自解决什么问题彼此之间如何配合。路径遍历能手写一个文件名校验函数过滤../、空字节、Windows保留字符。代码审计能按“输入-处理-输出”框架分析一段代码说出风险类型、攻击路径、修复方案。业务安全文件上传下载、命令执行、权限管理场景下前端该管哪些、不该管哪些。自测方法去GitHub或Gitee上搜一些有安全漏洞的靶场项目试着站在笔试角度分析它们强烈推荐这种方式。比刷一千道题管用。5.3 一个四周突击方案如果离笔试还有一个月可以参考这个节奏第一周把JS和浏览器原理过一遍做出自测表里前两行的白纸输出把基础八股文的每一道题都写成自己的话不要背网上的标准答案。第二周主攻框架。用Vue或其他框架各写一个中大型组件比如表格加筛选加分页加权限按钮控制把组件通信和状态管理的用法落到真实代码里。第三周主攻安全专项。把OWASP Top 10和本文第二节的安全专项内容逐一展开每天分析一段有漏洞的代码。第四周按试卷结构完整模拟一次线上笔试用计时器限制总时长重点是让自己适应“80分钟内写完所有题”的节奏。模拟卷做完后把错题全部整理成文档复盘为什么错是知识点没掌握还是题干理解偏了。这套方案强度不大但每一步都要求输出。笔试准备最怕的就是只看不写、只读代码不跑代码。眼睛会了和手会了之间隔着挺大一段距离。最后说一点个人的体会。安全厂商的前端笔试看起来是在考知识点实质上考的是“你面对一个可能被攻击的系统时会不会本能地想到哪里可能会出问题”。这种本能不是天生的是通过大量安全阅读和代码审计练习养成的。基础八股文可以通过短期记忆突击出来但这种安全本能需要提前铺垫。如果你在准备过程中觉得某些安全概念理解起来费劲不用急。我自己最开始看CSP配置的时候也完全不明白为什么要限制对象的加载来源直到有一次自己搭了一个在线HTML预览功能加载第三方站点资源时差点把敏感数据暴露出去才真正理解那条规则存在的意义。这种顿悟会在你积累到一定量级之后自然发生。在此之前保持耐心把代码一行一行看下去把每一个“为什么”都当成一次长经验的机会。这套试卷放在2023年看能够帮你判断安全类前端岗位的考察方向放在今天看这些能力要求依然成立而且只会越来越重视。提前把安全这条腿练起来将来不管是校招还是晋升都会成为你的差异化优势。
2023奇安信前端笔试题复盘：安全视角下的考点与备考策略
每年春招安全公司的前端笔试题总会被拿出来反复讨论。2023年奇安信这套前端方向试卷1在当时不少应届生群里传得很广有人觉得它像“面试八股文合集”有人觉得有些题出得让人摸不着头脑。但把它当成程序员社区里大家互相交流的面试复盘来读其实能拆出不少对后来者有实际参考价值的信息安全厂商招前端到底在考什么为什么要这么考以及如果你现在准备投这类岗位该怎么针对性地补自己的短板。我结合这套试卷的题型结构、安全行业前端的日常工作内容以及这几年反复出现在各家安全公司笔试里的高频考点把它做了一次完整的复盘拆解。下面这份分析不是简单的“题目答案”罗列更多是想说清楚每一类题目背后的出题动机和回答策略。如果你正打算投奇安信或者其他安全厂商的前端岗这篇文章应该能帮你少走不少弯路。1. 拆卷之前先理解这套试卷在筛选什么人1.1 为什么安全公司的前端题会“长这样”很多人第一次拿到安全厂商的前端试卷第一反应是“考得真杂”JavaScript语言机制、浏览器原理、框架用法、网络安全基础全都有甚至还会出现让你分析一段危险代码的题。这和普通互联网公司“React/Vue二选一手写题场景题”的套路确实不太一样。原因在于安全公司的前端工程师日常不只是写页面。你要接触的是安全产品的前端控制台、态势感知大屏、漏洞管理平台、代码审计系统的交互界面。这些产品有共同的特点数据量大、交互密、权限模型复杂、对异常输入的处理要求极高。这意味着你的代码不仅要跑得起来还要扛得住脏数据、恶意请求和极端操作。所以这套试卷的筛选目标非常明确不是找“能切图的页面仔”而是找“能站在安全视角写业务代码的前端工程师”。你在普通公司写一个搜索框用户输入什么都行最多做个防抖和空值判断但你在安全公司写一个搜索框用户输入一段scriptalert(1)/script你输出了一个带有过滤缺陷的页面那就是事故。理解了这层差异整套试卷的题目分布就说得通了。1.2 试卷的结构与时间分配逻辑从题量和结构来看这套试卷完全符合“校招笔试”的通用节奏基础题占大头拔高题区分度场景题看潜力。虽然我无法完整复原每一道原始题面但从试卷方向、面试讨论和高频知识点可以反推出它的出题逻辑大致由单选/多选、简答、手写代码、代码审计四类题型构成。单选/多选覆盖面广重点考JavaScript基础、HTTP协议、浏览器渲染、前端安全基础。这类题速度快的话判断题干陷阱比会背答案更重要。简答题偏向原理说明比如“解释一下浏览器缓存机制”“说说XSS攻击原理和防御方式”。这里不是要你背诵定义而是看你能不能讲清楚机制链路。手写代码常见的是数组去重、防抖节流、深拷贝、Promise实现、Vue/React组件封装。这部分是“保分项”练多了就能拿稳。代码审计/场景题出题人给一段有明显安全问题的代码让你找漏洞并修复。这是奇安信这类安全厂商笔试里最有辨识度的题目也是普通公司试卷里很少出现的题型。时间分配上第一类题控制在20分钟内简答题30分钟左右手写题30分钟最后留20到30分钟给代码审计和场景题。如果你在做前两类题时耗时太长后面的场景题基本很难写好而恰恰是后面的题目才是区分度最高的地方。1.3 安全厂商前端工程师的能力画像我倾向于把这类岗位需要的能力拆成四层这套试卷本质上是四层能力的一次快速体检能力层级考察内容试题表现语言基础JS核心机制、ES6、异步编程选择题、手写题系统原理浏览器渲染、HTTP、缓存、安全策略简答、概念辨析框架实践Vue/React、组件设计、状态管理手写组件、方案设计安全素养输入校验、XSS/CSRF、代码审计、CSP场景题、代码审计题前两层决定你能不能干活后两层决定你能不能在安全公司干好活。出题人很清楚语言基础可以短期突击但安全素养需要长期积累和意识养成所以在试卷里刻意提高了后两类题的权重。2. 试卷里的高频考点逆向拆解2.1 JavaScript语言机制比“会写”更重要的是“讲得清”几乎每一套前端校招题都会考JavaScript核心机制奇安信这套也不例外。但相比普通公司它在JS语言机制上更喜欢抠细节尤其是那些容易出现“看似懂了、深问就垮”的知识点。第一个高频点是事件循环Event Loop。宏任务和微任务的执行顺序、setTimeout、Promise、async/await、requestAnimationFrame混在一起时执行顺序怎么排。题目不会直接问你“什么是事件循环”而是给你一段代码让你写出打印顺序再让你解释为什么。这里需要注意Node.js环境下的事件循环和浏览器略有差异如果题目没说明环境默认按浏览器环境作答同时指出差异点会给面试官留下“这人有体系”的印象。第二个高频点是原型链和this指向。笔试常考new、call/apply/bind、箭头函数以及原型继承的实际应用。我曾经在一次模拟中整理过一套经典原型链输出题很多同学在第一层就翻车function Foo() { this.a 1; } Foo.prototype.b 2; const foo new Foo(); console.log(foo.a); // 1 console.log(foo.b); // 2 console.log(Foo.b); // undefined console.log(Foo.prototype.b); // 2这类题看着简单但能区分出你是靠背结论还是真的理解原型链。答题时建议把查找机制拆开说先找自身属性再沿__proto__向上找直到Object.prototype为终点。第三个高频点是闭包与内存泄漏。笔试经常给一个循环中绑定事件监听的题目让你解释为什么输出不符合预期以及如何用let或闭包修复。更好的答案是顺手讲清楚闭包的本质是“函数词法作用域的组合”使用闭包时要关注对象引用何时释放否则就会造成内存泄漏。这在安全产品前端里特别常见——控制台页面长期不刷新如果到处是闭包泄漏页面会越用越卡。2.2 HTTP与浏览器原理安全岗前端的“地基”HTTP、浏览器缓存、跨域、渲染机制这一块在安全公司的试卷里权重明显高于普通公司。原因很简单安全产品的前端经常要和后端API交互而渗透测试、漏洞扫描、态势感知这类业务场景对请求的准确性、代理行为、缓存策略都有严格要求。HTTP相关题目里最常见的套路是让你比较Cookie的HttpOnly、Secure、SameSite属性的作用以及CSP内容安全策略如何配置。别看这只是一个简答题它在安全公司的语境下有具体的实战含义HttpOnly是为了防止XSS窃取CookieSameSite是为了缓解CSRF攻击。如果你能从“防御某类攻击”的角度来解释这三个属性答题深度立刻和网上的八股文模板拉开差距。浏览器缓存也是一个必考点尤其是强缓存和协商缓存。笔试中会要求说明Cache-Control与Expires的区别以及ETag和Last-Modified的优先级关系。除了背概念建议补充一句在安全产品中敏感页面通常需要设置Cache-Control: no-store避免登录凭证或用户敏感数据被浏览器缓存到磁盘。这个细节普通前端可能一辈子用不上但安全公司天天都在处理。渲染机制方面题面经常以“script标签放在哪里、为什么”切入考察DOMContentLoaded与load事件的区别、重排回流、defer与async。答题时还可以关联到前端性能监控因为安全大屏类页面往往需要处理实时刷新的数据流渲染性能直接决定产品体验。2.3 前端框架紧跟Vue/React但不止于“会用”从试卷方向看奇安信前端岗对Vue的重视度更高一些整体框架题也以Vue为主。题型大致有Vue响应式原理Object.defineProperty和Proxy的区别、组件通信方式、computed与watch的区别、v-if与v-show的区别、生命周期执行顺序等。其中最有区分度的一个题是“为什么Vue 3改用Proxy实现响应式而Vue 2用defineProperty”。标准答法是defineProperty只能劫持已有属性新增/删除属性需要额外APIProxy可以直接代理整个对象支持动态增删和数组索引操作。更好的答法是补充一句实际优化影响defineProperty需要递归遍历对象对大对象初始化更慢Proxy采用懒代理性能更好。这说明你不只看了面试题确实对比着用过两个版本。组件通信题目里props和$emit是基础但安全公司特别喜欢考“跨层级组件通信”。比如全局状态管理Vuex/Pinia、事件总线EventBus、provide/inject以及它们的适用场景和风险。答题时可以把自己代入业务场景态势感知大屏上各个可视化组件需要共享过滤条件你是用状态管理还是provide/inject为什么这种结合实际场景的回答比概念默写有价值得多。2.4 安全专项把通用考点翻译成“安全语法”这里是奇安信试卷和普通前端试卷最大的不同点也是网上的“前端面试八股文”几乎覆盖不到的部分。安全专项题往往以“输入验证”为核心出题方向这和热搜词里反复出现“奇安信 输入验证路径遍历”直接相关。一个典型的题面长这样后端接口接收一个文件名参数直接拼到文件路径里去读取文件例如/var/data/${filename}问存在什么风险前端如何配合防御。答案是路径遍历漏洞目录穿越。攻击者可以把filename设为../../etc/passwd越权读取任意文件。这类题想考察的不仅是攻击原理更关心你有没有防御意识。从后端视角需要做路径规范化比如使用path.resolve后再校验是否在预期目录内从安全产品的前端视角你在上传文件、下载文件、展示文件树的时候就要对文件名做合法性校验过滤../、空字节、特殊字符。前端还能做扩展名校验、文件大小预检、展示层编码转义避免文件名本身形成XSS。这类题目只要答出“前端能做什么、后端能做什么、兜底策略是谁”基本就是高分答案。不要只写“过滤一下”这么笼统要具体到用什么函数、过滤什么字符。3. 典型题型的答题思路一道题怎么答出安全岗差异3.1 手写题防XSS的过滤函数到底该怎么写手写题出现频率最高的安全相关题目是“写一个函数防止XSS攻击”。这题看似简单其实考察了三个层次第一层是能想到转义HTML字符第二层是能写出正确的正则或替换逻辑第三层是能指出纯前端转义不能根治XSS。基础版答案长这样function escapeHtml(str) { return String(str) .replace(//g, amp;) .replace(//g, lt;) .replace(//g, gt;) .replace(//g, quot;) .replace(//g, #39;); }如果你只写到这就停了能拿基础分但拿不到高分。更好的版本是接着补充innerHTML注入无法靠主观过滤彻底防御因为HTML解析规则极其复杂不同浏览器存在解析差异攻击者可以用编码绕过。更稳妥的方案是使用textContent而不是innerHTML需要富文本时走白名单策略只允许特定标签和属性或者使用成熟的库如DOMPurify。这类题给我的感觉是出题人真正想看的是你有没有“纵深防御”的概念。前端过滤是第一层后端校验是第二层CSP是第三层。答到第三层才算真正贴合安全公司的思维模式。3.2 网络题跨域方案里为什么安全产品会偏爱不同选项跨域方案是前端笔试的常规题但在安全公司的考卷里会多一层含义。常规选项有JSONP、CORS、代理服务器、postMessage、WebSocket。每种方案都要能说清原理和适用场景。安全公司笔试里比较有特色的是会追问“如果后端不允许在响应头里配置Access-Control-Allow-Origin你还有什么方案”。这个场景在真实业务里很常见第三方漏洞平台的数据接口不会为你的前端单独开CORS你得自己去搭代理层转发请求。这时候你要能说清楚同源策略是浏览器层面的限制不是服务端限制因此通过同源的代理服务转发请求可以绕开跨域约束同时代理层还可以统一加签名、校验权限、过滤敏感字段。另一个特色考点是postMessage的安全使用。笔试题可能给一段代码要求分析其中有没有安全问题。最经典的坑是父页面接收消息时没有校验event.origin导致任意来源的页面可以向父页面发送消息修改页面状态或窃取信息。正确代码是window.addEventListener(message, (event) { if (event.origin ! https://trusted.example.com) return; // 处理数据 });这种题在安全公司的面试反馈里出现的次数非常多。因为前端跨域通信一旦忽略来源校验就相当于把一个可受信端口暴露给任意陌生人这在即时通信类工具和内部系统嵌第三方页面的场景里是致命的。3.3 场景题文件上传与下载功能里前端到底该管多宽奇安信笔试的场景题经常围绕文件上传/下载展开这一点和它的安全产品线有关——不管是代码卫士还是漏洞管理平台都涉及文件的上传、解压、扫描、下载。出题人给一段上传文件的组件代码让你指出潜在问题并给出改进方案。这类题的完整回答可以分四层第一层前端校验上传前要校验文件类型、大小、扩展名但要知道前端校验纯粹是用户体验攻击者可以跳过前端直接构造请求所以不能作为安全边界。第二层后端校验文件类型要用MIME sniffing和文件头魔数校验不要只看扩展名文件名存储时尽量重命名例如生成UUID作为存储名避免直接把用户原始文件名拼进路径。第三层漏洞攻防文件名里可能含有../、路径分隔符、空字节如果后端直接拼路径就存在路径遍历风险。下载文件时要防止目录穿越例如通过文件ID映射物理路径而不是用文件名查路径。第四层展示层安全用户上传一个HTML文件如果另一个用户在线预览就可能触发存储型XSS。安全公司前端在预览场景里通常默认强制下载而非在线渲染或者将文件放到独立沙箱域名下展示。如果你在笔试里能把四层全部走一遍说明你真的思考过安全产品的数据链路而不只是一个写页面的。这类题目没标准答案但结构完整、层次清晰就是高分答案。3.4 代码审计题面对一段危险代码怎么系统性地找漏洞代码审计题是奇安信笔试最有辨识度的题型。出题人给一段代码可能是前端JavaScript也可能是Node.js后端代码让你找安全问题。对没接触过代码审计的应届生来说这题很容易让人慌神只盯着语法看看不出什么毛病。我的建议是做代码审计题时不要瞎看而是按“输入-处理-输出”三段式扫描输入扫描先找所有外部输入的入口包括URL参数、请求体、localStorage、postMessage、Cookie、文件上传。任何一个外部输入进入代码都要看有没有校验。处理扫描数据在处理过程中有没有被拼接、执行、渲染。重点看innerHTML、eval、new Function、document.write、模板字符串拼接SQL、路径拼接。这几类操作是漏洞高发区。输出扫描数据最后落到哪里。如果是DOM就是XSS风险如果是HTTP响应就是注入风险如果是文件系统就是路径遍历风险。举个例子如果题目给了一段这样的代码const userId req.query.id; const sql SELECT * FROM users WHERE id ${userId}; db.query(sql);一眼就能看出是SQL注入。前端卷子里不常直接考SQL注入但会考Node.js后端的同类逻辑。即使你只写前端也应该具备识别基本注入漏洞的能力因为安全公司的前后端经常在一个产品团队里协作面试官默认你了解常见的OWASP风险类型。审计题的答题结构也很重要先说风险类型再说攻击路径最后给修复方案。如果能把修复方案写到“参数化查询”或“白名单校验”这个颗粒度基本就是满分答案。4. 这套卷子之外的隐性考题安全思维才是分水岭4.1 用OWASP的维度补齐自己的安全盲区如果你认真刷过这套方向类似的试卷就会发现安全公司对前端的要求其实可以用OWASP Top 10对照着看。试卷里的XSS、CSRF、路径遍历、不安全反序列化对应JSON.parse异常处理、访问控制漏洞对应权限按钮、安全配置错误对应CSP缺失全在OWASP Top 10的框架里。所以我建议每一个目标安全公司前端的求职者不要只背安全面试题而是把OWASP Top 10的每一条都看一遍然后问自己一个问题这个漏洞在前端代码里会以什么形式出现拿“访问控制缺失”举例很多前端只关注“登录用户能不能进页面”但安全产品的前端更关注“低权限用户能不能在页面上操作高权限按钮”。作为前端你的职责是根据用户角色动态渲染操作按钮同时在请求后端时带上权限上下文并且不能信任前端判断——后端必须有二次鉴权。前端控制是为了体验后端鉴权才是边界。4.2 本地怎么练安全扫描和代码审计手感很多同学问没有真实的安全产品环境怎么练这种题的手感答案是用你自己写过的代码练。你可以把自己写过的任何一个前端项目的JS代码拉出来切到安全视角逐行过一遍哪些地方接收了外部输入这些输入有没有被插进DOM有没有用evalpostMessage监听有没有校验来源构建出来的URL拼接路径有没有被污染这种自审方式比刷十道题更锻炼感觉因为代码是你自己写的你清楚每一步的设计意图更容易发现“我以为这里安全其实不安全”的盲区。另外一个很实用的做法是安装开源的静态代码扫描工具扫描自己项目里的JS/Vue文件看扫描出来的安全问题再对照着修复。这类工具能帮你建立“代码里哪些位置容易出问题”的敏感性而这正是笔试代码审计题想考察的核心能力。日常做项目时就习惯跑一遍扫描比考前突击十道题更加有效。4.3 面试官真正想在笔试答案里看到的东西说到底笔试不是对着答案给分而是面试前的一次“能力采样”。面试官会在你交卷后看到你在每道题上的思考痕迹然后为后面的面试提问做准备。因此你在试卷上写的每一句解释、每一个补充都是在给后面的面试“埋钩子”。如果你在“CSP配置”这个空里写了“除了script-src建议同时配置object-src none和base-uri none”面试官大概率会在面试的时候追问“你知道为什么要限制base-uri吗”这时候如果你能坦诚说明是看过一篇文章提到的、自己还没有深入理解在面试的评价反而是正面的——因为你表现出了好奇心和钻研欲。最怕的是你把不了解的东西写得像自己很懂面试一深问就露馅。所以我的建议是刷题阶段做减法与其把十道题都背到滚瓜烂熟不如挑三道真正让你觉得“有点意思”的题往深里挖透。这比追求覆盖度更能体现一个人的学习能力。5. 一份可执行的自测清单离“能过这套卷”还差多少5.1 基础技术自测表如果你打算照着这份复盘去准备先对下面这张表做一次自评。每一项都能说清楚“是什么、为什么、怎么用”才算过关。技术模块核心检查点自评标准JS语言原型链、事件循环、闭包、this指向、ES6常用特性能用白话讲解能写示例代码跑通异步编程Promise原理、async/await异常处理、并发控制能手写一个带超时的fetch封装浏览器渲染过程、重排回流、缓存、存储方案能解释资源加载时序能说清缓存的坑网络HTTP状态码、跨域方案、Cookie属性能画出一次完整请求的链路Vue/React响应式原理、生命周期、组件通信、状态管理能说出核心源码思路能写通用组件工程化Webpack/Vite构建流程、代码规范、CI流程能独立搭建项目并优化构建速度这张表每一项都是笔试选择题和手写题的高频来源。不要抱着“我大概知道”的心态笔试是写出来的不是想出来的。自测时建议拿出一张白纸把每一项的核心机制画出来或者写下来能写出来的才算掌握。5.2 安全专项自测表基础技术过关只是拿到入场券安全专项才是决定你能不能进面最后一轮的关键。输入校验知道XSS和注入的原理能写出前端转义函数并明确前端校验的局限。浏览器安全策略能解释SameSite、CSP、CORS、SOP四种策略各自解决什么问题彼此之间如何配合。路径遍历能手写一个文件名校验函数过滤../、空字节、Windows保留字符。代码审计能按“输入-处理-输出”框架分析一段代码说出风险类型、攻击路径、修复方案。业务安全文件上传下载、命令执行、权限管理场景下前端该管哪些、不该管哪些。自测方法去GitHub或Gitee上搜一些有安全漏洞的靶场项目试着站在笔试角度分析它们强烈推荐这种方式。比刷一千道题管用。5.3 一个四周突击方案如果离笔试还有一个月可以参考这个节奏第一周把JS和浏览器原理过一遍做出自测表里前两行的白纸输出把基础八股文的每一道题都写成自己的话不要背网上的标准答案。第二周主攻框架。用Vue或其他框架各写一个中大型组件比如表格加筛选加分页加权限按钮控制把组件通信和状态管理的用法落到真实代码里。第三周主攻安全专项。把OWASP Top 10和本文第二节的安全专项内容逐一展开每天分析一段有漏洞的代码。第四周按试卷结构完整模拟一次线上笔试用计时器限制总时长重点是让自己适应“80分钟内写完所有题”的节奏。模拟卷做完后把错题全部整理成文档复盘为什么错是知识点没掌握还是题干理解偏了。这套方案强度不大但每一步都要求输出。笔试准备最怕的就是只看不写、只读代码不跑代码。眼睛会了和手会了之间隔着挺大一段距离。最后说一点个人的体会。安全厂商的前端笔试看起来是在考知识点实质上考的是“你面对一个可能被攻击的系统时会不会本能地想到哪里可能会出问题”。这种本能不是天生的是通过大量安全阅读和代码审计练习养成的。基础八股文可以通过短期记忆突击出来但这种安全本能需要提前铺垫。如果你在准备过程中觉得某些安全概念理解起来费劲不用急。我自己最开始看CSP配置的时候也完全不明白为什么要限制对象的加载来源直到有一次自己搭了一个在线HTML预览功能加载第三方站点资源时差点把敏感数据暴露出去才真正理解那条规则存在的意义。这种顿悟会在你积累到一定量级之后自然发生。在此之前保持耐心把代码一行一行看下去把每一个“为什么”都当成一次长经验的机会。这套试卷放在2023年看能够帮你判断安全类前端岗位的考察方向放在今天看这些能力要求依然成立而且只会越来越重视。提前把安全这条腿练起来将来不管是校招还是晋升都会成为你的差异化优势。