How to Encrypt a File Before Uploading: AES-256 in the Browser

export interface EncryptedPayload {
  cipherBuffer: ArrayBuffer;
  iv: Uint8Array;
}

// 1. Generate an AES-256 Encryption Key
export async function generateAesKey(): Promise<CryptoKey> {
  return await crypto.subtle.generateKey(
    { name: 'AES-GCM', length: 256 },
    true, // extractable
    ['encrypt', 'decrypt']
  );
}

// 2. Encrypt File ArrayBuffer
export async function encryptFile(file: File, key: CryptoKey): Promise<EncryptedPayload> {
  const iv = crypto.getRandomValues(new Uint8Array(12)); // 96-bit IV recommended for AES-GCM
  const plaintextBuffer = await file.arrayBuffer();

  const cipherBuffer = await crypto.subtle.encrypt(
    {
      name: 'AES-GCM',
      iv: iv,
    },
    key,
    plaintextBuffer
  );

  return { cipherBuffer, iv };
}

// 3. Decrypt CipherBuffer
export async function decryptFile(
  cipherBuffer: ArrayBuffer,
  key: CryptoKey,
  iv: Uint8Array
): Promise<ArrayBuffer> {
  return await crypto.subtle.decrypt(
    {
      name: 'AES-GCM',
      iv: iv,
    },
    key,
    cipherBuffer
  );
}