前端零信任安全策略：CORS、SameSite、权限最小化与令牌隔离

前端零信任安全策略：CORS、SameSite、权限最小化与令牌隔离技术背景零信任理念要求任何请求均需验证与最小权限控制。前端通过合理的 CORS 与 SameSite 策略、令牌隔离与可信源校验，减少跨站风险与令牌滥用，构建更稳健的安全防线。核心内容CORS 与可信源校验async function secureFetch(url: string, opts: RequestInit = {}) {

const headers = new Headers(opts.headers || {});

headers.set('Accept', 'application/json');

return fetch(url, { ...opts, headers, mode: 'cors', credentials: 'include' });

}

SameSite 与 Cookie 安全Set-Cookie: session=...; HttpOnly; Secure; SameSite=Lax

令牌隔离与最小权限type Token = { access_token: string; scope: string; expires_at: number };

const TokenStore = (() => {

let token: Token | null = null;

return {

set: (t: Token) => { token = t; },

get: () => token,

clear: () => { token = null; }

};

})();

async function authFetch(url: string, init: RequestInit = {}) {

const t = TokenStore.get();

const h = new Headers(init.headers || {});

if (t) h.set('Authorization', `Bearer ${t.access_token}`);

return fetch(url, { ...init, headers: h });

}

可信源白名单与内容安全Content-Security-Policy:

default-src 'self';

connect-src 'self' https://api.example.com;

img-src 'self' https: data:;

frame-ancestors 'none';

技术验证参数在 Chrome 128/Edge 130（Windows/macOS）下：跨站提交阻断率：≥ 98%令牌滥用事件：0同源策略兼容性：核心流程通过率 ≥ 99%应用场景敏感业务的登录与支付流程多域协同但需严格跨域控制的产品最佳实践最小化令牌作用域与有效期统一可信源清单并启用 CSP控制跨域与 SameSite 以阻断 CSRF 风险