Ext.js适配CSP规则禁用unsafe-eval场景下的替代方案咨询

问题说明 #

• 项目使用Ext.js时触发安全规则拦截，最初调用eval()被标记为高风险，切换为函数实现的替代方案后仍被拦截，对应功能完全无法正常运行
• 已验证无法通过开启unsafe-eval解决问题，该配置不符合安全合规要求
• 已尝试升级到Ext.js 7.4.0最新版本，该版本底层仍存在new Function ()、Function.prototype.constructor.apply()这类会被CSP策略拦截的动态代码执行逻辑，无法解决根因问题

可行替代方案 #

方案1：静态预编译消除动态执行逻辑 #

Ext.js触发unsafe-eval拦截的核心原因是模板引擎、动态表达式解析、动态组件渲染等模块会在运行时动态生成代码执行，可使用Sencha Cmd工具的compile命令对项目全量做静态编译：

• 提前把所有Ext.XTemplate模板、动态配置表达式转换为静态JS代码
• 移除运行时动态生成代码的逻辑，完全避免调用eval或new Function相关接口

方案2：替换风险模块 #

如果项目仅使用Ext.js的部分核心能力，可单独替换触发拦截的模块：

• 若为模板渲染触发拦截：替换为支持预编译的静态模板引擎，提前把所有模板编译为静态渲染函数，替换所有Ext.XTemplate调用
• 若为动态组件配置解析触发拦截：把所有动态拼接的组件配置改为静态声明的JSON结构，直接传递给组件构造器，跳过Ext内部的动态表达式解析逻辑

方案3：CSP哈希白名单放行可信代码 #

如果存在少量无法替换的动态执行逻辑，可计算Ext.js内置的合法动态代码的SHA-256哈希值，添加到CSP的script-src指令中，无需开启全局unsafe-eval即可放行这些可信的动态代码片段，同时满足安全合规要求 #

内容的提问来源于stack exchange，提问作者rahul bhawsar