菜单
OAuth 2.1 compliant authentication flows (MANDATORY Q2 2026). PKCE required for ALL clients, Implicit Flow removed, modern token security.
默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。
决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/oimiragieo/agent-studio --skill authentication-flow-rules命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
Agent frontmatter enhancements — disallowedTools, mcpServers scoping, fork_eligible field
Context management — pre-compact persistence, threshold alignment, microcompact/circuit breaker detection
Hook enhancements — updatedInput for bash safety prefixes, suppressOutput for verbose blocks, denial-based routing feedback
正在显示 SKILL.md
基于 SOC 职业分类
| name | authentication-flow-rules |
| description | OAuth 2.1 compliant authentication flows (MANDATORY Q2 2026). PKCE required for ALL clients, Implicit Flow removed, modern token security. |
| version | 2.1.0 |
| agents | ["security-architect","developer"] |
| category | security |
| verified | true |
| lastVerifiedAt | 2026-03-01 |
| model | sonnet |
| invoked_by | both |
| user_invocable | true |
| tools | ["Read","Write","Edit"] |
| globs | frontend/app/(landing-page)/**/*action.ts |
| best_practices | ["OAuth 2.1 compliance is MANDATORY (Q2 2026)","PKCE required for ALL clients (public AND confidential)","Never use Implicit Flow or Password Credentials","Store tokens in HttpOnly, Secure, SameSite=Strict cookies","Access tokens ≤15 minutes, refresh token rotation required"] |
| error_handling | graceful |
| streaming | supported |
| source | builtin |
| trust_score | 100 |
| provenance_sha | 4d76970b6c00ad18 |
response_type=token; tokens returned in URL fragments leak via browser history, referrer headers, and server logs. Migrate immediately to Authorization Code + PKCE.| Anti-Pattern | Why It Fails | Correct Approach |
|---|---|---|
Storing tokens in localStorage | Exposed to XSS; any script on the page (including third-party) can read and exfiltrate | Use HttpOnly cookies set server-side after token exchange |
Using Implicit Flow (response_type=token) | Tokens in URL fragments leak via browser history, Referer headers, and proxy/CDN logs | Use Authorization Code Flow with PKCE |
| Collecting user passwords directly (Resource Owner Password Credentials) | Violates OAuth separation of concerns; client handles credentials it should never see | Use Authorization Code Flow; direct users to the authorization server login page |
| Wildcard or partial redirect URI matching |
Open redirect attack; adversary registers https://evil.com which prefix-matches a wildcard |
| Register exact URIs; server rejects any URI not in the pre-approved list |
| Long-lived access tokens (>15 min) without rotation | Token theft window is unbounded; compromised token grants long-term access | Keep access tokens ≤15 min; implement refresh token rotation with reuse detection |
Step 1: Generate PKCE Challenge
// Client-side: Generate code_verifier (43-128 chars, URL-safe)
async function generatePKCE() {
const array = new Uint8Array(32);
crypto.getRandomValues(array);
const verifier = base64UrlEncode(array);
// Hash verifier to create challenge
const encoder = new TextEncoder();
const hash = await crypto.subtle.digest('SHA-256', encoder.encode(verifier));
const challenge = base64UrlEncode(new Uint8Array(hash));
return { verifier, challenge };
}
Step 2: Authorization Request
const { verifier, challenge } = await generatePKCE();
sessionStorage.setItem('pkce_verifier', verifier); // Temporary storage only
const authUrl = new URL(authorizationEndpoint);
authUrl.searchParams.set('response_type', 'code');
authUrl.searchParams.set('client_id', clientId);
authUrl.searchParams.set('redirect_uri', redirectUri); // MUST match exactly
authUrl.searchParams.set('code_challenge', challenge);
authUrl.searchParams.set('code_challenge_method', 'S256'); // SHA-256 required
authUrl.searchParams.set('scope', 'openid profile email');
authUrl.searchParams.set('state', cryptoRandomState); // CSRF protection
window.location.href = authUrl.toString();
Step 3: Token Exchange with Code Verifier
const response = await fetch(tokenEndpoint, {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: new URLSearchParams({
grant_type: 'authorization_code',
code: authorizationCode,
code_verifier: sessionStorage.getItem('pkce_verifier'), // Prove possession
client_id: clientId,
redirect_uri: redirectUri, // MUST match authorization request
}),
});
// Clear verifier immediately after use
sessionStorage.removeItem('pkce_verifier');
Token Lifetimes (RFC 8725)
Token Storage (CRITICAL)
// ✅ CORRECT: HttpOnly, Secure, SameSite cookies
// Server sets cookies after token exchange
res.cookie('access_token', accessToken, {
httpOnly: true, // Prevents XSS access
secure: true, // HTTPS only
sameSite: 'strict', // CSRF protection
maxAge: 15 * 60 * 1000, // 15 minutes
});
res.cookie('refresh_token', refreshToken, {
httpOnly: true,
secure: true,
sameSite: 'strict',
path: '/auth/refresh', // Limit scope
maxAge: 7 * 24 * 60 * 60 * 1000, // 7 days, rotate frequently
});
// ❌ WRONG: NEVER store tokens in localStorage or sessionStorage
localStorage.setItem('token', accessToken); // VULNERABLE TO XSS
sessionStorage.setItem('token', accessToken); // VULNERABLE TO XSS
Refresh Token Rotation
// Server-side: Rotate refresh tokens on every use
async function refreshTokens(oldRefreshToken) {
// Validate old token
const userId = await validateRefreshToken(oldRefreshToken);
// Detect token reuse (possible theft)
if (await isTokenAlreadyUsed(oldRefreshToken)) {
await revokeAllTokensForUser(userId); // Kill all sessions
throw new Error('Token reuse detected - all sessions revoked');
}
// Mark old token as used BEFORE issuing new one
await markTokenAsUsed(oldRefreshToken);
// Issue new tokens
const newAccessToken = generateAccessToken(userId, '15m');
const newRefreshToken = generateRefreshToken(userId);
return { newAccessToken, newRefreshToken };
}
❌ Implicit Flow (REMOVED in OAuth 2.1)
// NEVER DO THIS - Implicit Flow is REMOVED
authUrl.searchParams.set('response_type', 'token'); // ❌ FORBIDDEN
// Tokens in URL fragments leak via browser history, referrer headers, logs
Migration Path: Use Authorization Code Flow + PKCE instead.
❌ Resource Owner Password Credentials (REMOVED)
// NEVER DO THIS - Collecting passwords directly violates OAuth
fetch(tokenEndpoint, {
body: new URLSearchParams({
grant_type: 'password', // ❌ FORBIDDEN
username: user.email,
password: user.password,
}),
});
Migration Path: Use Authorization Code Flow for user auth, Client Credentials for service accounts.
Passkeys/WebAuthn (Recommended for 2026+)
// Register passkey
const credential = await navigator.credentials.create({
publicKey: {
challenge: serverChallenge,
rp: { name: 'Your App' },
user: {
id: userIdBytes,
name: user.email,
displayName: user.name,
},
pubKeyCredParams: [{ alg: -7, type: 'public-key' }],
authenticatorSelection: {
authenticatorAttachment: 'platform', // Device-bound
userVerification: 'required',
},
},
});
// Authenticate with passkey
const assertion = await navigator.credentials.get({
publicKey: {
challenge: serverChallenge,
rpId: 'yourapp.com',
userVerification: 'required',
},
});
Before deploying:
Login with OAuth 2.1 (email/password)
// Use Authorization Code Flow with PKCE even for first-party login
async function login(email: string, password: string) {
// 1. Start PKCE flow
const { verifier, challenge } = await generatePKCE();
sessionStorage.setItem('pkce_verifier', verifier);
// 2. POST credentials to your auth server's login endpoint
const response = await fetch('/auth/login', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify({ email, password, code_challenge: challenge }),
});
// 3. Server validates credentials, returns authorization code
const { code } = await response.json();
// 4. Exchange code for tokens with verifier
await exchangeCodeForTokens(code);
}
Login with GitHub OAuth
async function loginWithGitHub() {
const { verifier, challenge } = await generatePKCE();
sessionStorage.setItem('pkce_verifier', verifier);
const authUrl = new URL('https://github.com/login/oauth/authorize');
authUrl.searchParams.set('client_id', GITHUB_CLIENT_ID);
authUrl.searchParams.set('redirect_uri', 'https://yourapp.com/auth/callback');
authUrl.searchParams.set('scope', 'user:email');
authUrl.searchParams.set('state', generateState());
// Note: GitHub doesn't support PKCE yet, but use it when available
window.location.href = authUrl.toString();
}
Logout
async function logout() {
// 1. Clear client-side cookies
document.cookie = 'access_token=; Max-Age=0; path=/';
document.cookie = 'refresh_token=; Max-Age=0; path=/';
// 2. Revoke tokens on server
await fetch('/auth/logout', { method: 'POST' });
// 3. Redirect to login
window.location.href = '/login';
}
Before starting:
cat .claude/context/memory/learnings.md
After completing: Record any new patterns or exceptions discovered.
ASSUME INTERRUPTION: Your context may reset. If it's not in memory, it didn't happen.