iOS原生App需在WKWebView加载完成后再注入水印JS脚本，通过动态创建fixed定位div实现倾斜透明文字覆盖，须适配背景色、缩放及滚动优化，并规避CSP、iframe沙箱等限制。
iOS 原生 App 如何安全注入水印到 WebView 中的 HTML5 页面
不能直接“调用 HTML5 水印”，iOS 侧没有现成 API 把水印“塞进”网页里；实际做法是：在 WKWebView 加载完成、DOM 可操作后，用 JavaScript 注入水印逻辑。关键不是“调用”，而是“时机 + 注入方式 + 样式隔离”。
- 必须等
webView(_: didFinishNavigation:)触发后再执行 JS 注入，过早执行（如webView(_: didStartNavigation:)）会导致 DOM 未就绪，document.body为null - 避免用
evaluateJavaScript(_:completionHandler:)直接传大段字符串拼接 JS，易被 XSS 过滤或引号转义破坏；推荐将水印脚本封装为独立字符串常量，用String(format:)动态填入文字/坐标参数 - 水印需用
position: fixed+pointer-events: none，否则会遮挡页面点击，且要加z-index: 2147483647（iOS WebKit 最高有效值）确保压在所有层之上
水印文字倾斜+透明叠加的 JS 实现要点
HTML5 水印本质是动态创建一个全屏覆盖的 不是 JS 写错了，而是环境或权限卡住了。典型报错： 因为那些方案对 iOS WebView 完全无效：打印样式不触发、 立即学习“前端免费学习笔记（深入）”； 真正难的不是写几行 JS，而是判断当前页面是否允许注入、是否已被其他脚本污染、是否处于 iframe 沙箱环境——这些边界情况不处理，水印就只在 demo 页里有效。
evaluateJavaScript("addWatermark('\(userID)')") 调用预定义函数，而非在 JS 里硬编码
transform: rotate(-25deg)，不要用 -30deg 或更大——iOS Safari 对大角度 rotate 渲染有锯齿，-22° ~ -28° 是清晰度与辨识度平衡点opacity: 0.08，比常规的 0.1 更不易干扰阅读，同时仍可被截图识别；低于 0.06 在 Retina 屏上基本不可见window.getComputedStyle(document.body).backgroundColor，若为浅色背景则水印文字用深灰（#333），深色背景则切为浅灰（#ccc），否则反差失效WKWebView 中 JS 注入失败的常见错误现象
TypeError: null is not an object (evaluating 'document.body.appendChild') 或完全静默无反应。
WKWebViewConfiguration 里没开 javaScriptEnabled = true（默认是 true，但自定义 config 时容易漏设）Content-Security-Policy 头禁止 'unsafe-eval'，导致 eval 类执行失败；此时必须改用 document.createElement('script') + appendChild 动态加载水印脚本navigationAction.request.url 重定向过程中（比如 OAuth 跳转），此时页面已卸载，JS 执行被丢弃；应监听 webView(_: didFinishNavigation:) 的 final URL，确认是目标页面再注入为什么不用 CSS @media print 或 background-image？
background-image 会被页面 CSS 覆盖且无法固定定位，更无法响应滚动。
px 单位，全部改用 vw/vh（例如 font-size: 2.4vw），否则在 iPhone SE 和 Pro Max 上显示大小差异巨大will-change: transform 到水印容器，iOS WebKit 需显式提示硬件加速，否则 repaint 频率跟不上 scroll event
