Bolt.new + Netlify Security Blueprint

Share

To secure a Bolt.new + Netlify stack, you need to: (1) configure security headers via _headers file or netlify.toml, (2) store all secrets in Netlify environment variables rather than code, (3) implement authentication in Netlify Functions for server-side operations, and (4) ensure service keys are only accessible from Functions, not client code. This blueprint covers deployment security specific to Netlify hosting.

Setup Time1-2 hours

TL;DR

Deploying Bolt exports to Netlify requires configuration through netlify.toml or _headers files. Key tasks: configure environment variables in Netlify dashboard, add security headers, secure Netlify Functions for server-side operations, and scope deploy preview access appropriately.

Part 1: Netlify Security Headers

public/_headers
/*
  X-Frame-Options: DENY
  X-Content-Type-Options: nosniff
  Referrer-Policy: strict-origin-when-cross-origin
  Permissions-Policy: camera=(), microphone=(), geolocation=()

Part 2: Netlify Environment Variables

Configure in Netlify Dashboard
# Public (use framework prefix: VITE_, REACT_APP_)
VITE_SUPABASE_URL=https://xxx.supabase.co
VITE_SUPABASE_ANON_KEY=eyJ...

# Private (Netlify Functions only)
SUPABASE_SERVICE_ROLE_KEY=eyJ...
DATABASE_URL=postgres://...

Framework prefixes: Vite uses VITE_, Create React App uses REACT_APP_. Only prefixed variables are exposed to the client.

Part 3: Netlify Functions

netlify/functions/protected.ts
import { Handler } from '@netlify/functions';
import { createClient } from '@supabase/supabase-js';

const supabase = createClient(
  process.env.VITE_SUPABASE_URL!,
  process.env.SUPABASE_SERVICE_ROLE_KEY!
);

export const handler: Handler = async (event) => {
  const authHeader = event.headers.authorization;

  if (!authHeader) {
    return { statusCode: 401, body: 'Unauthorized' };
  }

  const { data: { user }, error } = await supabase.auth.getUser(
    authHeader.replace('Bearer ', '')
  );

  if (error || !user) {
    return { statusCode: 401, body: 'Invalid token' };
  }

  return { statusCode: 200, body: JSON.stringify({ userId: user.id }) };
};

Security Checklist

Netlify Deployment Checklist

Security headers in _headers or netlify.toml

Environment variables in Netlify dashboard

No hardcoded secrets in code

Netlify Functions authenticate requests

Service keys only in Functions

.env files in .gitignore

Alternative Stacks to Consider

      **Bolt.new + Vercel**
      Alternative deployment platform


      **Bolt.new + Railway**
      Container-based deployment


      **Bolt.new + Supabase**
      Database security guide

Should I use _headers or netlify.toml?

Either works. Use _headers for simple configuration, netlify.toml if you're configuring build settings and functions together.

Deploying Bolt to Netlify?

Scan for configuration issues and exposed secrets.

Start Free Scan
Security Blueprints

Bolt.new + Netlify Security Blueprint