Security Review Skill

This skill ensures all code follows security best practices and identifies potential vulnerabilities.

When to Activate

•Implementing authentication or authorization
•Handling user input or file uploads
•Creating new API endpoints
•Working with secrets or credentials
•Writing ClickHouse queries
•Storing or transmitting sensitive data
•Integrating third-party APIs

Security Checklist

1. Secrets Management

❌ NEVER Do This

typescript

const clickhousePassword = "password123" // In source code
const upstashToken = "AXY..." // Hardcoded token

✅ ALWAYS Do This

typescript

const clickhouseHost = process.env.CLICKHOUSE_HOST
const upstashUrl = process.env.UPSTASH_REDIS_REST_URL

// Verify secrets exist at startup
if (!clickhouseHost || !upstashUrl) {
  throw new Error('Critical environment variables missing')
}

Verification Steps

• No hardcoded API keys, tokens, or passwords
• All secrets in environment variables
• .env.local in .gitignore
• No secrets in git history
• Production secrets in hosting platform (Cloud Run)

2. Input Validation

Always Validate User Input

Since the backend is Rust, frontend validation saves unnecessary API calls, but the Backend MUST also validate.

typescript

import { z } from 'zod'

// Define validation schema
const QueryParamsSchema = z.object({
  timerange: z.enum(['1h', '24h', '7d']),
  limit: z.coerce.number().int().min(1).max(1000),
  search: z.string().max(100).optional() // Sanitize strings
})

export async function getData(input: unknown) {
  try {
    const validated = QueryParamsSchema.parse(input)
    // Pass validated data to Rust API
    return await fetch(`${API_URL}/data`, { ... })
  } catch (error) {
    if (error instanceof z.ZodError) {
      return { success: false, errors: error.errors }
    }
    throw error
  }
}

File Upload Validation

typescript

function validateFileUpload(file: File) {
  // Size check (5MB max)
  const maxSize = 5 * 1024 * 1024
  if (file.size > maxSize) {
    throw new Error('File too large (max 5MB)')
  }

  // Type check
  const allowedTypes = ['image/jpeg', 'image/png', 'image/gif']
  if (!allowedTypes.includes(file.type)) {
    throw new Error('Invalid file type')
  }

  // Extension check
  const allowedExtensions = ['.jpg', '.jpeg', '.png', '.gif']
  const extension = file.name.toLowerCase().match(/\.[^.]+$/)?.[0]
  if (!extension || !allowedExtensions.includes(extension)) {
    throw new Error('Invalid file extension')
  }

  return true
}

Verification Steps

• All user inputs validated with schemas
• File uploads restricted (size, type, extension)
• No direct use of user input in queries
• Whitelist validation (not blacklist)
• Error messages don't leak sensitive info

3. SQL Injection Prevention

❌ NEVER Concatenate SQL

typescript

// DANGEROUS - SQL Injection vulnerability
const query = `SELECT * FROM users WHERE email = '${userEmail}'`
await db.query(query)

✅ ALWAYS Use Parameterized Queries

typescript

// Safe - using parameters
const resultSet = await db.query({
  query: 'SELECT * FROM events WHERE user_id = {userId:String}',
  params: {
    userId: userId,
  },
  format: 'JSONEachRow',
})

Note: Ensure your Rust backend also uses parameterized queries (e.g., using sqlx or clickhouse crate bindings).

Verification Steps

• No string concatenation in SQL
• ClickHouse client params object used for all variable data
• Input data types match ClickHouse column types

4. Authentication & Authorization

JWT Token Handling

typescript

// ❌ WRONG: localStorage (vulnerable to XSS)
localStorage.setItem('token', token)

// ✅ CORRECT: httpOnly cookies
res.setHeader('Set-Cookie',
  `token=${token}; HttpOnly; Secure; SameSite=Strict; Max-Age=3600`)

Authorization Checks

typescript

export async function deleteUser(userId: string, requesterId: string) {
  // ALWAYS verify authorization first
  const requester = await db.users.findUnique({
    where: { id: requesterId }
  })

  if (requester.role !== 'admin') {
    return NextResponse.json(
      { error: 'Unauthorized' },
      { status: 403 }
    )
  }

  // Proceed with deletion
  await db.users.delete({ where: { id: userId } })
}

Verification Steps

• Tokens stored in httpOnly cookies (not localStorage)
• Authorization checks before sensitive operations
• Role-based access control implemented
• Session management secure

5. XSS Prevention

Sanitize HTML

typescript

import DOMPurify from 'isomorphic-dompurify'

// ALWAYS sanitize user-provided HTML
function renderUserContent(html: string) {
  const clean = DOMPurify.sanitize(html, {
    ALLOWED_TAGS: ['b', 'i', 'em', 'strong', 'p'],
    ALLOWED_ATTR: []
  })
  return <div dangerouslySetInnerHTML={{ __html: clean }} />
}

Content Security Policy

typescript

// next.config.js
const securityHeaders = [
  {
    key: 'Content-Security-Policy',
    value: `
      default-src 'self';
      script-src 'self' 'unsafe-eval' 'unsafe-inline';
      style-src 'self' 'unsafe-inline';
      img-src 'self' data: https:;
      font-src 'self';
      connect-src 'self' https://api.example.com;
    `.replace(/\s{2,}/g, ' ').trim()
  }
]

Verification Steps

• User-provided HTML sanitized
• CSP headers configured
• No unvalidated dynamic content rendering
• React's built-in XSS protection used

6. CSRF Protection

CSRF Tokens

typescript

import { csrf } from '@/utils/csrf'

export async function POST(request: Request) {
  const token = request.headers.get('X-CSRF-Token')

  if (!csrf.verify(token)) {
    return NextResponse.json(
      { error: 'Invalid CSRF token' },
      { status: 403 }
    )
  }

  // Process request
}

SameSite Cookies

typescript

res.setHeader('Set-Cookie',
  `session=${sessionId}; HttpOnly; Secure; SameSite=Lax`)

Verification Steps

• CSRF tokens on state-changing operations
• SameSite=Lax on all cookies
• Double-submit cookie pattern implemented

7. Rate Limiting

API Rate Limiting

typescript

// middleware.ts
import { NextRequest, NextResponse } from 'next/server'
import { Ratelimit } from '@upstash/ratelimit'
import { Redis } from '@upstash/redis'

const ratelimit = new Ratelimit({
  redis: Redis.fromEnv(),
  limiter: Ratelimit.slidingWindow(10, '10 s'), // 10 requests per 10s
  analytics: true,
})

export default async function middleware(request: NextRequest) {
  // Identify user by IP or User ID
  const ip = request.headers.get("x-forwarded-for") ?? "127.0.0.1"

  const { success, pending, limit, reset, remaining } = await ratelimit.limit(ip)

  // Wait for the pending promise to finish
  await pending

  if (!success) {
    return new NextResponse('Too Many Requests', {
      status: 429,
      headers: {
        'X-RateLimit-Limit': limit.toString(),
        'X-RateLimit-Remaining': remaining.toString(),
        'X-RateLimit-Reset': reset.toString()
      }
    })
  }

  return NextResponse.next()
}

export const config = {
  matcher: '/api/:path*',
}

Verification Steps

• Rate limiting on all API endpoints
• Stricter limits on expensive operations
• IP-based rate limiting
• User-based rate limiting (authenticated)

8. Sensitive Data Exposure

Logging

typescript

// ❌ WRONG: Logging sensitive data
console.log('User login:', { email, password })
console.log('Payment:', { cardNumber, cvv })

// ✅ CORRECT: Redact sensitive data
console.log('User login:', { email, userId })
console.log('Payment:', { last4: card.last4, userId })

Error Messages

typescript

// ❌ WRONG: Exposing internal details
catch (error) {
  return NextResponse.json(
    { error: error.message, stack: error.stack },
    { status: 500 }
  )
}

// ✅ CORRECT: Generic error messages
catch (error) {
  console.error('Internal error:', error)
  return NextResponse.json(
    { error: 'An error occurred. Please try again.' },
    { status: 500 }
  )
}

Verification Steps

• No passwords, tokens, or secrets in logs
• Error messages generic for users
• Detailed errors only in server logs
• No stack traces exposed to users

10. Dependency Security

Regular Updates

bash

# Check for vulnerabilities
npm audit

# Fix automatically fixable issues
npm audit fix

# Update dependencies
npm update

# Check for outdated packages
npm outdated

Lock Files

bash

# ALWAYS commit lock files
git add package-lock.json

# Use in CI/CD for reproducible builds
npm ci  # Instead of npm install

Verification Steps

• Dependencies up to date
• No known vulnerabilities (npm audit clean)
• Lock files committed
• Dependabot enabled on GitHub
• Regular security updates

Security Testing

Automated Security Tests

typescript

// Test authentication
test('requires authentication', async () => {
  const response = await fetch('/api/protected')
  expect(response.status).toBe(401)
})

// Test authorization
test('requires admin role', async () => {
  const response = await fetch('/api/admin', {
    headers: { Authorization: `Bearer ${userToken}` }
  })
  expect(response.status).toBe(403)
})

// Test input validation
test('rejects invalid input', async () => {
  const response = await fetch('/api/users', {
    method: 'POST',
    body: JSON.stringify({ email: 'not-an-email' })
  })
  expect(response.status).toBe(400)
})

// Test rate limiting
test('enforces rate limits', async () => {
  const requests = Array(101).fill(null).map(() =>
    fetch('/api/endpoint')
  )

  const responses = await Promise.all(requests)
  const tooManyRequests = responses.filter(r => r.status === 429)

  expect(tooManyRequests.length).toBeGreaterThan(0)
})

Pre-Deployment Security Checklist

Before ANY production deployment:

Resources

Remember: Security is not optional. One vulnerability can compromise the entire platform. When in doubt, err on the side of caution.