How to save CryptoKey in LocalStorage?

Question

I want to use the web cryptography API in an existing project. To encrypt and decrypt something, I have to use CryptoKey, but when I save CryptoKey to localStorage, it saves a String object (CryptoKey) instead of an object.

Is it possible to serialize / convert CryptoKey to a simple type (string)?

My decryption method

function decryptDataWithAES(keyName)
{
    var decrypt_promise; 
    var aesKey = localStorage.getItem(keyName + 'key')
    var item = localStorage.getItem(keyName)
    var invokeVektor = localStorage.getItem(keyName + 'vector')
    console.log("aesKey", aesKey )

    crypto.subtle.decrypt({ name: "AES-CBC", iv: invokeVektor }, aesKey, item).then(function (result) {
        decrypted_data = new Uint8Array(result); decrypted_data = new Uint8Array(result);

        decrypt_promise = convertArrayBufferViewtoString(decrypted_data);
        console.log('decryptDataWithAES ' + decrypt_promise);
        return decrypt_promise; 
    },
        function(e){
            console.log(e.message);
        }
    );
}

Of course the error message is:

Failed to execute 'decrypt' in 'SubtleCrypto': parameter 2 is not of type 'CryptoKey'. 2localStorageHandler.js: 39 CryptoPromise [CryptoKey object]

If I decrypt without using localStorage, there is no problem encrypting the data.

Answer 1

crypto.subtle.exportKey() crypto.subtle.importKey() localStorage, :

function decryptDataWithAES(keyName)
{
    var decrypt_promise; 

    // read raw value of aesKey
    var aesKey_RAW = localStorage.getItem(keyName + 'key')
    var importPromise = crypto.subtle.importKey('raw', aesKey_RAW, 'AES-CBC', true, ['encrypt','decrypt']);

    importPromise.then(function(aesKey){

    var item = localStorage.getItem(keyName)
    var invokeVektor = localStorage.getItem(keyName + 'vector')

        console.log("aesKey", aesKey )

        crypto.subtle.decrypt({ name: "AES-CBC", iv: invokeVektor }, aesKey, item).then(function (result) {
            decrypted_data = new Uint8Array(result); decrypted_data = new Uint8Array(result);

            decrypt_promise = convertArrayBufferViewtoString(decrypted_data);
            console.log('decryptDataWithAES ' + decrypt_promise);
            return decrypt_promise; 
        },
            function(e){
                console.log(e.message);
            }
        );

    }, function(e){ console.log(e.message) } );
}

localStorage:

function saveKeyInLocalStorage(keyName, aesKey){
   var exportPromise = crypto.subtle.exportKey('raw',aesKey);
   exportPromise.then(function(aesKey_RAW){ 
        localStorage.setItem(keyName + 'key' , aesKey_RAW);
        console.log("saved.");
   });
}

, exportKey() importKey() .

Answer 2

RAW. , JWK (json web key) , .

// to store the key:
window.crypto.subtle.exportKey("jwk", key)
.then(e=>localStorage.setItem("webkey",JSON.stringify(e)));

, Key() , . . https://github.com/diafygi/webcrypto-examples/