Secure Form Handling with AI Prompts

Review my forms and add security best practices.

For each form, ensure:

1. method="POST" for data-changing forms
2. CSRF token included and validated
3. autocomplete attributes set correctly
4. Input types match data (email, tel, number)
5. Server-side validation matches client-side
6. Error messages don't leak information

Security additions:

• Add honeypot field for bot detection
• Rate limit submissions per IP
• Log form submissions (without passwords)
• Validate file uploads if present

For login forms specifically:

• autocomplete="username" on username field
• autocomplete="current-password" on password
• Don't reveal if username exists in errors

Show updated HTML and server-side handler.

Implement CSRF protection for all my forms.

Framework: Next.js/Express/Django

CSRF flow:

1. Generate unique token per session
2. Include token in form (hidden field or header)
3. Validate token on form submission
4. Reject if missing or mismatched

For traditional forms:

For AJAX/fetch:

• Send token in X-CSRF-Token header
• Or include in request body

Token generation:

• Cryptographically random
• Bound to user session
• Regenerate on login
• Expires with session

Also check:

• SameSite cookie attribute (additional CSRF defense)
• Referer/Origin header validation (supplementary)

Add bot and spam protection to my forms.

Techniques:

1. Honeypot field (hidden field bots fill)
2. Time-based validation (too fast = bot)
3. JavaScript token (bots often don't run JS)
4. Rate limiting per IP
5. CAPTCHA for high-value forms

Honeypot implementation:

On server: if (formData.website) { // Bot detected - silently reject or log return { success: true }; // Don't reveal detection }

Time-based:

• Include timestamp in hidden field
• Reject if submitted in < 3 seconds
• Reject if submitted after > 1 hour

Rate limiting:

• Max 5 submissions per minute per IP
• Max 20 per hour for same email

Create secure and accessible password form fields.

Password input should have:

1. type="password" (masks input)
2. autocomplete attribute (helps password managers)
3. Show/hide toggle (accessibility)
4. Strength meter (user feedback)
5. Clear requirements list

Autocomplete values:

• Login: autocomplete="current-password"
• Registration: autocomplete="new-password"
• Change password: both fields appropriately

Show/hide toggle:

• Button to toggle type between password/text
• aria-label updates based on state
• Don't use checkbox (poor UX)

Password requirements display:

• Show requirements before user types
• Update checkmarks in real-time as user types
• Clear visual feedback (colors, icons)

Don't:

• Disable paste (breaks password managers)
• Mask with asterisks only (use proper type)
• Auto-clear on failed submission