Basic HTTP Authentication Implementation

Overview

The application implements a secure basic HTTP authentication system that allows users to store and manage credentials for websites that require authentication. This implementation follows atomic design principles and integrates with the existing scanning infrastructure.

Architecture

Components

1. Atomic Component: BasicAuthForm

   • Pure presentational component
   • Handles user input for username and password
   • Displays validation errors
   • Located in src/renderer/components/atoms/

2. Container Component: BasicAuthContainer

   • Manages state and business logic
   • Handles credential fetching and saving
   • Communicates with the main process
   • Located in src/renderer/components/containers/

3. Store: basicAuthStore

   • Manages secure storage of credentials
   • Handles encryption/decryption
   • Located in src/main/basicAuthStore.ts

Data Flow

1. User enters credentials in the BasicAuthForm
2. BasicAuthContainer manages state and handles IPC communication
3. Credentials are sent to the main process via IPC
4. basicAuthStore encrypts and stores credentials
5. Scanning processes retrieve credentials when needed

Technical Implementation

Secure Storage

The application uses Electron's safeStorage API for credential encryption:

const encryptedUsername = safeStorage.encryptString(username);
const encryptedPassword = safeStorage.encryptString(password);

Credentials are stored in an Electron Store with the following structure:

• Key: ${hostname}-username and ${hostname}-password
• Value: Base64-encoded encrypted strings

URL Handling

The system automatically extracts hostnames from URLs:

const websiteUrl = new globalThis.URL(
  url.startsWith("http") ? url : `https://${url}`
);
const hostname = websiteUrl.hostname;

Integration Points

1. Scanning Process

   • BackgroundScanner retrieves credentials before starting scans
   • scanUrl function applies credentials to page authentication
   • Credentials are used for both single URL and batch scanning

2. Website Settings

   • Credentials are managed in the General Settings tab
   • Changes are immediately reflected in the scanning process
   • No website object modification required

3. IPC Communication

   • get-basic-auth: Retrieves credentials for a URL
   • edit-website-auth: Saves new credentials
   • All communication is encrypted and secure

Security Considerations

1. Credential Storage

   • Uses system-level encryption via safeStorage
   • Credentials are never stored in plain text
   • Each hostname has separate encrypted storage

2. Access Control

   • Credentials are only accessible to the main process
   • Renderer process communicates through secure IPC channels
   • No direct access to encrypted storage from renderer

3. URL Validation

   • Hostname extraction is secure and validated
   • Handles both HTTP and HTTPS URLs
   • Prevents credential leakage between domains

Areas Affected

1. Frontend

   • GeneralTab.tsx: Removed direct credential management
   • BasicAuthForm.tsx: New atomic component
   • BasicAuthContainer.tsx: New container component

2. Backend

   • basicAuthStore.ts: New secure storage implementation
   • scanHandlers.ts: Updated to use credentials
   • backgroundScanner.ts: Modified to include authentication

3. IPC Layer

   • Added new handlers for credential management
   • Updated existing handlers to use credentials
   • Improved error handling and validation

Usage

1. Setting Credentials

   // In BasicAuthContainer
   const handleSave = async () => {
     const result = await window.electron.ipcRenderer.invoke(
       "edit-website-auth",
       {
         url: website.url,
         authUsername: username,
         authPassword: password,
       }
     );
   };

2. Retrieving Credentials

   // In scanning process
   const credentials = getHostname(website.url);
   await page.authenticate({
     username: credentials.username,
     password: credentials.password,
   });

Error Handling

1. Validation

   • URL format validation
   • Credential presence checks
   • Encryption/decryption error handling

2. User Feedback

   • Clear error messages
   • Success notifications
   • Loading states

Future Considerations

1. Potential Improvements

   • Add credential validation before saving
   • Implement credential rotation
   • Add support for multiple credential sets per domain

2. Security Enhancements

   • Add credential strength requirements
   • Implement automatic credential expiration
   • Add audit logging for credential changes

Testing

1. Unit Tests

   • Test credential encryption/decryption
   • Validate URL parsing
   • Check error handling

2. Integration Tests

   • Test with scanning process
   • Verify IPC communication
   • Check persistence

3. Security Tests

   • Verify encryption
   • Test access control
   • Validate URL isolation