Csrf Protection
Implements CSRF protection using synchronizer tokens, double-submit cookies, and SameSite attributes. Use when securing web forms, protecting state-changing endpoints, or implementing defense-in-depth authentication.
Specification
- Skill ID
- secondsky/claude-skills/csrf-protection
- Publisher
- secondsky
- Repository
- claude-skills
- Installs
- 0
- Files
- 2
- License
- MIT
- Synced
- Sep 23, 2026
How to use it
Open any RiverX project, open the Skills panel in the chat, and search for this identifier. The files are fetched from the source repository at install time.
secondsky/claude-skills/csrf-protectionInstalls these files- SKILL.md
- references/python-react.md
What this skill tells the agent
CSRF Protection
Defend against Cross-Site Request Forgery attacks using multiple protection layers.
Protection Methods
| Method | How It Works | Browser Support |
|---|---|---|
| Synchronizer Token | Hidden form field validated server-side | All |
| Double Submit | Cookie + header must match | All |
| SameSite Cookie | Browser blocks cross-origin requests | Modern |
Token-Based Protection (Express)
const crypto = require('crypto');
function generateToken() {
return crypto.randomBytes(32).toString('hex');
}
// Middleware
app.use((req, res, next) => {
if (!req.session.csrfToken) {
req.session.csrfToken = generateToken();
}
res.locals.csrfToken = req.session.csrfToken;
next();
});
// Validation
app.post('*', (req, res, next) => {
const token = req.body._csrf || req.headers['x-csrf-token'];
// crypto.timingSafeEqual throws RangeError when buffers differ in length,
// so check length explicitly first (still constant-time on the equal-length path).
const csrf = req.session.csrfToken || '';
if (!token || token.length !== csrf.length) {
return res.status(403).json({ error: 'Invalid CSRF token' });
}
if (!crypto.timingSafeEqual(Buffer.from(token), Buffer.from(csrf))) {
return res.status(403).json({ error: 'Invalid CSRF token' });
}
next();
});SameSite Cookies
app.use(session({
cookie: {
httpOnly: true,
secure: true,
sameSite: 'strict', // or 'lax'
maxAge: 3600000
}
}));HTML Form Integration
<form method="POST" action="/transfer">
<input type="hidden" name="_csrf" value="<%= csrfToken %>">
<button type="submit">Submit</button>
</form>Best Practices
- Apply to all state-changing requests (POST, PUT, DELETE)
- Use SameSite=Strict for sensitive cookies
- Validate Origin/Referer headers
- Never use GET for modifications
- Implement token expiration (1 hour typical)
- Combine multiple defense layers
Additional Implementations
See references/python-react.md for:
- Flask-WTF complete CSRF setup
- React hooks for CSRF token management
- Double submit cookie pattern
Common Mistakes
- Assuming authentication prevents CSRF
- Reusing tokens across sessions
- Storing tokens in localStorage
- Missing token expiration
More from secondsky
Use this skill in a project
Open any RiverX project, search the Skills panel for secondsky/claude-skills/csrf-protection, and install it in one click.
