COOP-COEP-CORP 进程隔离与 SharedArrayBuffer 能力治理实践

正文要启用 `SharedArrayBuffer` 等高权限能力，需要将站点置于跨源隔离状态：设置 `Cross-Origin-Opener-Policy`（COOP）与 `Cross-Origin-Embedder-Policy`（COEP）。同时，针对自有资源设置 `Cross-Origin-Resource-Policy`（CORP），控制跨源嵌入策略，降低混合上下文风险。一、Next.js 中间件设置隔离头import { NextResponse } from 'next/server' export function middleware() { const res = NextResponse.next() res.headers.set('Cross-Origin-Opener-Policy', 'same-origin') res.headers.set('Cross-Origin-Embedder-Policy', 'require-corp') return res } 二、为自有静态资源设置 CORP对于站点自身的静态资源（如 JS/CSS/字体/图片），建议设置：export const runtime = 'edge' export async function GET() { const body = new TextEncoder().encode('/* app.css */') return new Response(body, { headers: { 'Content-Type': 'text/css; charset=utf-8', 'Cross-Origin-Resource-Policy': 'same-origin', 'Cache-Control': 'public, max-age=31536000, immutable' } }) } 三、外部资源与兼容策略第三方资源如需跨源嵌入，应由第三方服务器返回 `Cross-Origin-Resource-Policy: cross-origin` 或通过 `COEP: credentialless`（实验）降低凭据要求。对无法满足 CORP 的第三方资源，应改用 `fetch`/代理后以同源方式投递，或放弃嵌入。四、治理要点隔离生效：COOP+COEP 生效后页面与跨源上下文隔离；与 `window.opener` 交互受限，需评估业务影响。回退策略：为兼容旧资源逐步迁移至同源或可跨源嵌入的供应商；阶段性灰度上线并观测错误率。缓存：静态资源结合 `immutable` 长缓存；隔离头设置在中间件层，避免遗漏。