navigator.share需同时满足HTTPS、用户点击、同源URL三条件；检测须组合判断share与canShare存在性及安全上下文，并验证参数合法性；参数仅支持title、text、url，且有平台差异和降级策略。
能用，但不是加个按钮就能弹出来——必须同时满足 HTTPS、用户点击、同源 URL 三个硬条件，缺一不可。
如何检测浏览器真正支持 navigator.share
只写 if (navigator.share) 是不够的。iOS Safari 16.4+ 才开始支持，Firefox 桌面版至今不支持，部分安卓定制系统（如华为 EMUI）会返回函数但调用即失败。
- 必须组合判断：
if ('share' in navigator && 'canShare' in navigator && window.isSecureContext) - 进一步用
navigator.canShare({ url: window.location.href })验证参数合法性，比直接navigator.share()更早暴露问题 - 别在
DOMContentLoaded或window.onload里检测，等按钮 DOM 就绪后再查，避免navigator未定义 - 微信内置浏览器（X5 内核）始终返回
undefined，这不是你的代码问题，是微信主动禁用
navigator.share() 的参数怎么填才不被忽略
它只认 title、text、url 三个字段，其他一律静默丢弃。各平台处理差异极大，不能靠“填了就显示”来假设。
-
url必须是绝对 URL，且与当前页面同源（https://a.com/page不能传https://b.com/xxx），相对路径如/share可接受 -
text建议控制在 100–120 字以内，Safari 可能截断，部分安卓 ROM 对超长text直接拒绝唤起面板 -
title在多数 Android 厂商系统中被忽略，仅用于系统分享面板顶部标题，不影响社交平台卡片渲染（那是<meta property="og:title">的事） - 不要传
null、undefined或空字符串，某些 Android 版本会直接报TypeError
为什么点了按钮没反应，控制台也没报错
大概率是触发上下文不满足“安全环境 + 用户手势 + 页面可见”三重条件——不是 JS 报错被吞掉，而是浏览器直接拒绝执行。
立即学习“前端免费学习笔记（深入）”；
- 调用必须在用户
click/touchend的同步链中：不能放在fetch().then()、setTimeout、Promise.resolve().then()里，哪怕延迟 0ms 也不行 - 页面协议必须是 HTTPS 或
http://localhost；http://127.0.0.1、IP 地址、HTTP 域名全都不行 - 按钮不能被
pointer-events: none、opacity: 0或遮罩层挡住，否则手势不被视为有效 - Vue/React 中别在
useEffect或mounted里绑定事件，要确保@click/onClick直接关联到原生事件处理器
错误类型和降级处理怎么写才靠谱
错误不会统一抛出异常类型，需用 try/catch 捕获，并根据 error.name 区分原因：
-
AbortError：用户取消分享弹窗（正常行为，无需报错提示） -
NotAllowedError：最常见，说明触发条件不满足——检查是否 HTTPS、是否由 click 触发、是否已响应过其他 share 调用 -
TypeError：参数格式错误，比如url不是字符串、text是null、或传入了不支持的字段（如files但在旧版 Safari 中使用） - 无任何反馈？可能是厂商系统屏蔽了分享面板（如部分国产安卓 ROM），此时应 fallback 到
navigator.clipboard.writeText(url)+ 提示“链接已复制”
真正难处理的不是 API 调用本身，而是跨平台行为差异：iOS 的分享面板不显示 text，Android 各厂商对 title 的渲染位置不一致，而桌面端（Chrome 89+）仅支持 url 字段。
