Js 扫描实现
使用 MutationObserver 监听 DOM 变化
MutationObserver 可以监测 DOM 树的变化，适用于动态加载内容的扫描。通过监听节点的添加、属性修改等事件，触发自定义扫描逻辑。
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
mutation.addedNodes.forEach((node) => {
if (node.nodeType === Node.ELEMENT_NODE) {
scanElement(node); // 自定义扫描函数
}
});
});
});
observer.observe(document.body, {
childList: true,
subtree: true,
attributes: true
});递归遍历 DOM 树
通过深度优先遍历 DOM 树，检查每个元素的属性、文本内容或子节点是否符合扫描规则。
function scanDOM(root) {
const nodes = root.querySelectorAll('*');
nodes.forEach((node) => {
checkAttributes(node); // 检查属性
checkTextContent(node); // 检查文本内容
if (node.shadowRoot) {
scanDOM(node.shadowRoot); // 处理 Shadow DOM
}
});
}
scanDOM(document.body);正则匹配敏感内容
定义正则表达式规则，匹配文本中的敏感关键词、恶意脚本或异常模式。
function checkTextContent(node) {
const sensitivePatterns = [/malware/i, /<script.*?>.*?<\/script>/i];
const text = node.textContent;
sensitivePatterns.forEach((pattern) => {
if (pattern.test(text)) {
console.warn('敏感内容:', node);
}
});
}检查资源加载
通过拦截网络请求或监听资源加载事件，扫描外部脚本、图片等资源的 URL 或内容。
document.addEventListener('DOMContentLoaded', () => {
const scripts = document.getElementsByTagName('script');
Array.from(scripts).forEach((script) => {
if (script.src && !isTrustedDomain(script.src)) {
console.warn('可疑脚本:', script.src);
}
});
});集成第三方扫描库
使用现成的安全扫描库（如 DOMPurify）对输入或动态内容进行过滤。
import DOMPurify from 'dompurify';
const cleanHTML = DOMPurify.sanitize(userInput);
document.getElementById('output').innerHTML = cleanHTML;
