AdGuard Home日志页面异常问题分析与解决方案

问题背景

AdGuard Home是一款流行的开源DNS服务器和网络广告拦截工具。近期有用户报告在macOS系统上使用最新稳定版时，访问日志页面出现空白并伴随JavaScript错误。该问题与浏览器语言设置存在直接关联。

技术分析

错误现象

当用户访问日志页面时，控制台出现以下JavaScript错误：

new Date(e).toLocaleString(navigator.language, t)

根本原因

经排查发现两个关键因素：

1. 浏览器扩展程序干扰：用户安装的CthulhuJs（Anti-Fingerprint）扩展将navigator.language属性值从正常的单语言字符串（如"ru"）修改为包含多个语言的字符串（如"ru,en,en-GB,en-US"）
2. 代码兼容性不足：AdGuard Home前端代码未对多语言字符串情况进行处理，导致日期格式化失败

深层原理

浏览器标准的navigator.language属性应返回单个BCP 47语言标签。Date对象的toLocaleString()方法虽然支持传入语言标签数组，但要求格式必须为数组类型而非逗号分隔的字符串。

解决方案

临时解决方案

1. 禁用或移除CthulhuJs扩展
2. 使用浏览器隐私模式访问（默认不加载扩展）

长期改进建议

AdGuard Home可考虑在前端代码中加入以下防御性处理：

// 获取首选语言
const getPrimaryLanguage = () => {
  const lang = navigator.language;
  return lang.includes(',') ? lang.split(',')[0] : lang;
};

// 使用示例
new Date(e).toLocaleString(getPrimaryLanguage(), t);

最佳实践建议

1. 浏览器扩展选择：谨慎选择隐私保护类扩展，优先考虑开源且维护活跃的项目
2. 多语言环境测试：开发者应测试不同语言设置下的界面表现
3. 输入验证：处理用户代理提供的任何数据时都应进行验证和清理

总结

这个问题展示了环境因素（浏览器扩展）与代码健壮性之间的相互作用。作为用户，了解问题原因后可以采取相应措施；作为开发者，则应该考虑各种边界情况的处理。AdGuard Home作为网络基础设施软件，其稳定性和兼容性对用户体验至关重要。