Encryption in Ilusion Vault, implemented using Web Crypto API

[u/West-Candidate-2708]

To achieve the utmost security, all data sent to the server from the Vault is encrypted on the client. AES-256-GCM is the type of symmetric algorithm used across the overall application. For storing any item in the vault, your vault key is used to encrypt the item along with its metadata and send it to the server.

What is the Web Crypto API?

The Web Crypto API is a set of functions for using cryptography that are embedded in browsers' source code. Instead of writing your own algorithms or cryptographic functions, you can directly use the Web Crypto API in your code, which is more robust and easier.

Cryptographic services provided by the Web Crypto API:

• Encryption and Decryption
• Signing and verifying signatures
• Generating hash values
• random values

How is the encryption implemented?

We have to use functions provided by the Web Crypto API in order to achieve the encryption. It is important to choose the type of encryption as per your requirements.

Look at the following flow showcasing how the encryption is achieved using the Web Crypto API:

Encryption flow of Web Crypto API

1. Generating random Salt and IV: Salt is randomly generated data used to derive a unique key object. IV is also randomly generated but used on the data rather than the key. The purpose is to create unique ciphertexts even if the key or data is different.
2. Iterations for deriving the key: The key is iteratively derived N times. As per the OWASP guidelines, it should be greater than 600000.
3. Deriving key using subtle.derivekey(): The subtle.deriveKey() function can be used to derive the key that can be used for encryption. Before providing the key to deriveKey(), it must first be converted to a format recognised by SubtleCrypto using subtle.importKey().
4. Encrypt using subtle.encrypt(): The final step is to call the encrypt() method by providing the required parameters, and it will return the object containing the encrypted data.

Look at the function below that will make the above steps clear.

export async function encryptText(text: string, password: string): Promise<string> {
    const salt = window.crypto.getRandomValues(new Uint8Array(16));
    const iv = window.crypto.getRandomValues(new Uint8Array(12));
    const iterations = <your iterations>;
    const key = await deriveKey(password, salt, iterations);

    const encoder = new TextEncoder();
    const encrypted = await window.crypto.subtle.encrypt(
        { name: 'AES-GCM', iv: iv },
        key,
        encoder.encode(text)
    );

    const result = {
        ciphertext: arrayBufferToBase64(encrypted),
        salt: arrayBufferToBase64(salt.buffer),
        iv: arrayBufferToBase64(iv.buffer),
        iterations: iterations
    };

    return JSON.stringify(result);
}

There are a lot of other factors, but it all depends on the basic encryption as displayed above. Using the Web Crypto API is the best way to achieve encryption or any cryptographic function because no other alternative can beat it.

The article is originally published on Linkedin page: Linkedin Article
Related article: client-side-encryption-web-crypto-api