AGM三防手机HTML5适配核心是viewport精准配置与touch事件修复。需设置user-scalable=no、max/min-scale=1及target-densitydpi；touch事件须设touch-action:manipulation、preventDefault()并避免passive；Canvas需按screen.width/window.innerWidth计算DPR并scale渲染。
AGM三防手机的HTML5适配核心是 viewport 和 touch 事件支持
AGM 系列三防手机（如 AGM G1、G2、H2、X系列）大多运行 Android 8–12，WebView 基于 Chromium 内核（但版本常滞后），默认禁用部分现代 API。直接套用通用响应式模板大概率出现缩放异常、点击延迟、Canvas 渲染模糊或 touchstart 不触发等问题。关键不是“加个 meta”，而是针对性补全底层能力。
必须设置的 viewport 配置与常见失效原因
AGM 手机对 viewport 的解析较严格，尤其在横屏切换或系统字体放大后容易重置缩放。仅写 不够。
- 强制禁用用户缩放，避免误触放大：添加
user-scalable=no（AGM 系统级手势可能干扰双指缩放逻辑） - 明确指定
maximum-scale=1和minimum-scale=1，防止系统 UI 覆盖导致 viewport 重计算 - 某些 AGM 机型（如 H2 Pro）需额外加
target-densitydpi=device-dpi（仅限旧版 Android WebView，Chrome 50+ 已废弃，但 AGM 自研 WebView 仍依赖它）
touch 事件失效或延迟的修复方法
AGM 手机普遍存在 click 事件 300ms 延迟，且部分型号（如 X6）的 touchstart 在 Canvas 或绝对定位元素上完全不触发——这不是代码问题，是系统 WebView 对 touch-action 的默认值处理异常。
- 全局禁用默认 touch 行为：给
加style="touch-action: manipulation;"（比none更安全，保留滚动） - 对 Canvas、按钮等交互区域显式设置
touch-action: none，否则 AGM WebView 可能忽略其上的touchmove - 避免监听
touchend判定点击，改用touchstart+preventDefault()+ 定时器模拟 click，兼容性更稳
document.addEventListener('touchstart', function(e) {
if (e.target.tagName === 'CANVAS' || e.target.classList.contains('btn')) {
e.preventDefault();
}
}, { passive: false });Canvas 渲染模糊与 DPR 适配陷阱
AGM 多数机型物理像素密度（DPR）为 2 或 3，但部分型号（如 G1）的 window.devicePixelRatio 返回错误值（恒为 1），导致 Canvas 绘制后被浏览器自动缩放拉伸，文字/线条发虚。
立即学习“前端免费学习笔记（深入）”；
- 不要只依赖
window.devicePixelRatio，优先检测screen.width / window.innerWidth作为实际 DPR - Canvas 初始化时手动设置
canvas.width和canvas.height为实际宽高 × DPR，再用 CSS 缩放到目标尺寸 - 对文字绘制，必须用
ctx.scale(dpr, dpr)配合ctx.font字号调整，否则 font 渲染仍走低 DPR 流程
const dpr = window.devicePixelRatio || (screen.width / window.innerWidth);
const canvas = document.getElementById('myCanvas');
const ctx = canvas.getContext('2d');
canvas.width = canvas.offsetWidth * dpr;
canvas.height = canvas.offsetHeight * dpr;
ctx.scale(dpr, dpr);AGM 三防手机的适配难点不在功能缺失，而在行为不一致：同一型号不同固件版本，devicePixelRatio 可能从 1 变成 2.5；同一个 touchstart 监听，在桌面 Chrome 正常，在 AGM H2 上必须加 { passive: false } 才生效。真机测试不能省，刷机包更新后务必回归验证。
