获取URL参数如何避免XSS攻击

// 从路由参数中获取加密编码后的参数字符串

const encodedParams = route.params.params;

try {

// 解密获取路由参数

const decodedParams = decryptionParams(encodedParams);

// 验证参数是否为有效JSON格式

if (!decodedParams || typeof decodedParams !== 'string') {

throw new Error('Invalid parameter format');

}

// 检查潜在的XSS攻击模式

const xssPatterns = [

/<script\b\^\<*(?:(?!<\/script>)<\^\<*)*<\/script>/gi,

/javascript:/gi,

/on\w+\s*=/gi,

/<iframe/gi,

/<object/gi,

/<embed/gi,

/<link/gi,

/<meta/gi,

/eval\s*\(/gi,

/expression\s*\(/gi

];

// 检查是否存在潜在的XSS攻击代码

for (const pattern of xssPatterns) {

if (pattern.test(decodedParams)) {

throw new Error('Potential XSS attack detected');

}

}

// 解析JSON并验证结构

const parsedParams = JSON.parse(decodedParams);

// 验证解析后的参数是否为对象且不包含函数

if (typeof parsedParams !== 'object' || parsedParams === null || Array.isArray(parsedParams)) {

throw new Error('Parameters must be a valid object');

}

// 深度检查对象属性,确保没有嵌套的函数或危险内容

const validateObject = (obj, maxDepth = 5, currentDepth = 0) => {

if (currentDepth > maxDepth) {

throw new Error('Object nesting too deep');

}

for (const key in obj) {

// 检查键名是否包含危险字符

if (/\<\>\\"'\&/.test(key)) {

throw new Error(`Invalid key name: ${key}`);

}

if (typeof objkey === 'function') {

throw new Error('Functions are not allowed in parameters');

}

if (typeof objkey === 'object' && objkey !== null) {

validateObject(objkey, maxDepth, currentDepth + 1);

}

}

};

validateObject(parsedParams);

// 所有验证通过,设置参数

return parsedParams;

} catch (error) {

console.error("Error parsing or validating parameters:", error);

ElMessage.error("参数格式错误或包含不安全内容");

// 重定向回安全页面

router.push("/xxx/xxxx");

return null;

}

相关推荐
码艺-Alimjan4 小时前
Vue项目源码备份最佳实践:无视node_modules,打包体积仅2MB
前端·javascript·vue.js
隔窗听雨眠4 小时前
esbuild构建工具简介:重新定义前端构建速度的极速打包器
前端
蔓越莓4 小时前
Webpack 常用 Loader +手写Loader
前端·面试
潍坊老登5 小时前
写了一个某音自动刷视频,通过大模型分析视频主题的Android应用
前端
蔓越莓5 小时前
性能优化:webpack打包层面优化
前端·面试
TJHHH.5 小时前
XSS-labs-master
前端·web安全·xss
风月说与山鬼5 小时前
十二、Vue插件
前端·vue.js
spter。5 小时前
一次 Redis SETNX 的小插曲,我重新理解了原子性
前端·redis·bootstrap