微信ios webview中input maxlength失效源于输入法组合状态处理异常，需双监听input/compositionend事件并用iscomposing标记状态，textarea须js接管paste/drop/input，服务端必须按unicode码点校验且不可绕过。
微信内网页的input maxlength经常失效，是因为iOS WebView对输入法组合状态处理不一致
在微信内置浏览器（尤其是iOS）中，maxlength 对中文拼音输入阶段不生效——用户还没按空格确认，输入框就卡住，或直接吞掉后续输入。这不是 bug，是 iOS WKWebView 在 compositionstart/compositionend 事件中未同步更新 DOM value，导致 maxlength 判断滞后。Chrome 和 Android WebView 表现相对稳定，但微信内核版本碎片化严重，不能依赖原生行为。
必须同时监听input和compositionend事件，否则中文输入会错乱
只靠 input 事件截断，会在拼音上屏前误删候选字；只靠 compositionend 又无法响应英文/数字实时输入。正确做法是双监听 + 状态标记：
- 用
isComposing判断当前是否处于输入法组合中：若为true，跳过截断逻辑 - 在
compositionend触发后立即检查长度，超限时调用value = value.slice(0, N) - 给
input事件加防抖（setTimeout延迟 0ms），避免与 composition 事件冲突导致死循环
示例代码片段：
const input = document.querySelector('input');
let isComposing = false;
input.addEventListener('compositionstart', () => { isComposing = true; });
input.addEventListener('compositionend', () => {
isComposing = false;
if (input.value.length > 10) {
input.value = input.value.slice(0, 10);
}
});
input.addEventListener('input', () => {
if (!isComposing && input.value.length > 10) {
setTimeout(() => {
input.value = input.value.slice(0, 10);
}, 0);
}
});
textarea在微信内必须手动 fallback，别信 maxlength="140"
微信内嵌 WebView（尤其 iOS 15–16）对 textarea 的 maxlength 支持极不稳定：有时允许粘贴超长文本，有时 auto-height 拉伸后仍不触发截断。而且微信默认 maxlength="140" 是硬编码行为，覆盖 HTML 属性值。
- 务必移除 HTML 中的
maxlength属性，改用 JS 全面接管 - 监听
input、paste、drop三个事件，event.preventDefault()阻止粘贴/拖放后再手动插入截断后的内容 - 注意换行符
\n占 1 个长度单位，但某些输入法可能插入\r\n，需统一 normalize
服务端校验必须按 Unicode 码点计数，别用 len(str)
前端 JS 的 str.length 在部分 emoji（如 ??）上会返回错误码点数，而微信内网页提交的数据经微信 SDK 中转后，服务端收到的字符串编码已标准化。Python 用 len(s)、Node.js 用 s.length 都不可靠——它们统计的是 UTF-16 code unit 数，不是 Unicode code point。
- Python 后端推荐用
len(list(grapheme.graphemes(s)))或len(unicodedata.normalize('NFC', s))（需先做 NFC 归一化） - Node.js 推荐用
Array.from(s).length或Intl.Segmenter实例分段后计数 - 数据库字段长度限制必须按字节（如 MySQL
VARCHAR(255)是字节数），UTF-8 下一个中文占 3 字节，emoji 占 4 字节，得用new TextEncoder().encode(s).length校验
最常被忽略的一点：微信内网页的 form submit 可能绕过所有前端拦截（比如用户禁用 JS 后直接点“发送”），所以服务端长度校验不是可选项，是上线前必须压测的路径。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
