crossorigin="anonymous" 是 标签中实现跨域模块安全加载的关键属性，它强制请求不携带凭据（如 Cookie、Authorization），要求服务端响应 Access-Control-Allow-Origin 且不可设 Access-Control-Allow-Credentials: true，同时屏蔽脚本错误详情、保护模块内部状态，并影响 integrity 校验行为；CDN 加载、动态 import() 或需调试 sourcemap 时必须显式声明。
crossorigin="anonymous" 是 <script></script> 标签中一个关键的跨域加载属性，它直接影响浏览器如何处理模块（如 ES 模块）的加载、凭据传递和错误暴露。理解它，核心在于把握凭据隔离与安全限制这两层机制。
什么是凭据隔离
凭据（credentials）指 cookies、HTTP 认证信息（如 Authorization 头）、客户端证书等能标识用户身份的敏感数据。
当脚本通过 <script crossorigin="anonymous"></script> 加载时，浏览器会：
- 不发送任何凭据（即使当前域已登录、存在同源 cookie）；
-
强制以“匿名”身份发起请求，即请求头中不带
Cookie或Authorization； - 同时，服务端响应必须显式允许：返回
Access-Control-Allow-Origin: *或Access-Control-Allow-Origin: https://your-site.com，且不能同时设置Access-Control-Allow-Credentials: true（否则整个请求会被浏览器拒绝）。
✅ 正确示例（服务端响应）：
Access-Control-Allow-Origin: https://myapp.comAccess-Control-Allow-Methods: GET
❌ 错误组合（会被浏览器拦截）：Access-Control-Allow-Origin: https://myapp.com+Access-Control-Allow-Credentials: true
这个“不允许带凭据却允许指定源”的约束，就是凭据隔离——既防止敏感信息意外泄露，又保留对可信源的精细控制。
安全限制的具体表现
启用 crossorigin="anonymous" 后，浏览器施加三项关键安全限制，目的都是防止信息窃取：
脚本错误细节被屏蔽
若模块加载失败（如 403、404、网络中断或 CORS 头缺失），window.onerror或addEventListener('error')只能捕获到泛化的"Script error."，无法获取具体行号、列号、堆栈或错误消息。这是为了防止恶意页面通过加载失败的跨域脚本试探目标服务器状态（例如判断某内部接口是否存在）。document.domain不受影响，但无法读取跨域模块的内部状态
即使两个页面设置了相同的document.domain，只要模块是crossorigin="anonymous"加载的，其导出内容仍受模块作用域保护，且无法绕过 CORS 检查访问其源码或调试信息。不支持
integrity属性的降级回退
若同时使用integrity（子资源完整性校验），而服务端未返回匹配的Content-Type: application/javascript或缺少Cross-Origin-Resource-Policy配合，浏览器可能直接拒绝执行，不会尝试“忽略 integrity”或“降级为普通 script”。
什么时候必须用 crossorigin="anonymous"
以下情况需显式声明，否则模块加载会失败或行为异常：
- 脚本托管在 CDN（如
https://cdn.example.com/app.js），而你的页面在https://myapp.com； - 你想在
import map或动态import()中加载跨域 ES 模块； - 你依赖
ErrorEvent.filename或 sourcemap 调试——此时必须确保服务端返回正确的Access-Control-Allow-Origin，否则 filename 显示为"undefined"，sourcemap 无法映射。
? 小提示：若服务端只返回
Access-Control-Allow-Origin: *，那你可以安全使用crossorigin="anonymous"；但如果它只允许特定源（如https://myapp.com），你也必须写成crossorigin="anonymous"（不能省略），否则浏览器会当作“非 CORS 请求”处理，导致加载失败。
不复杂但容易忽略
