How to export content in Chrome's local storage for a website

LocalStorageExport.md

Original idea is from this post

1. Open a tab and navigate to the website where you have content to export.

2. Open devtools and switch to the console tab.

3. Copy and paste the following snippet in the console and Chrome should ask you to save the output file

var obj = JSON.stringify(localStorage, null, 4)
var vLink = document.createElement('a')
vBlob = new Blob([obj], {type: "octet/stream"})
vUrl = window.webkitURL.createObjectURL(vBlob);
vLink.setAttribute('href', vUrl);
vLink.setAttribute('download', vUrl.split('/')[2] + '-export.json'); // give you the website name + "export.json"
vLink.click();

4. Profit!

Thanks for the code! But for those who are looking to import the JSON back with a file selector, here is the code to load the JSON back to local storage which will overwrite the localStorage on the current website,

function loadLocalStorageFromFile() {
    var fileInput = document.createElement('input');
    fileInput.type = 'file';
    fileInput.accept = '.json';  // only JSON files

    fileInput.click();

    fileInput.addEventListener('change', function(event) {
        var file = event.target.files[0];

        if (file) {
            var reader = new FileReader();
            reader.readAsText(file);
            reader.onload = function(e) {
                try {
                    var jsonData = JSON.parse(e.target.result);  // Parse the file content

                    // Iterate over all keys in the parsed JSON and set them in localStorage
                    for (var key in jsonData) {
                        if (jsonData.hasOwnProperty(key)) {
                            localStorage.setItem(key, jsonData[key]);
                        }
                    }
                    alert("LocalStorage has been updated from the JSON file.");
                } catch (err) {
                    alert("Error parsing JSON: " + err);
                }
            };

            // Handle any errors that occur during file reading
            reader.onerror = function() {
                alert("Error reading file.");
            };
        } else {
            alert("No file selected.");
        }
    });
}

loadLocalStorageFromFile();  // Triggers the file selection dialog