Application

Storing Data

Using Encrypted Storage

ToDesktop's @todesktop/client-core API provides access to methods for safely encrypting and decrypting strings on the user's local machine:

        import { safeStorage } from '@todesktop/client-core';

if (await safeStorage.isEncryptionAvailable()) {
  const encrypted = await safeStorage.encryptString('password');
  const decrypted = await safeStorage.decryptString(encrypted); // password
}

For a complete example, here's how we could go about saving login credentials for future use within a simple HTML form:

        <!DOCTYPE html>
<html>
  <body>
    <form id="loginForm">
      <input type="text" id="username" placeholder="Username" />
      <input type="password" id="password" placeholder="Password" />
      <label>
        <input type="checkbox" id="saveCredentials" /> Save login credentials for future use
      </label>
      <button type="submit">Login</button>
    </form>

    <script>
      const { safeStorage } = require('@todesktop/client-core');

      document.addEventListener('DOMContentLoaded', async () => {
        const savedCredentials = localStorage.getItem('userCredentials');
        if (savedCredentials && (await safeStorage.isEncryptionAvailable())) {
          try {
            const decryptedPassword = await safeStorage.decryptString(savedCredentials);
            document.getElementById('password').value = decryptedPassword;
            // Optionally, you can also autofill the username if it's stored
          } catch (error) {
            console.error('Failed to decrypt password', error);
          }
        }
      });

      document.getElementById('loginForm').addEventListener('submit', async (event) => {
        event.preventDefault();

        const password = document.getElementById('password').value;
        const saveCredentials = document.getElementById('saveCredentials').checked;

        if (saveCredentials && (await safeStorage.isEncryptionAvailable()) && password) {
          const encryptedPassword = await safeStorage.encryptString(password);
          localStorage.setItem('userCredentials', encryptedPassword);

          // Handle login logic here
        }

        // Proceed with login process
      });
    </script>
  </body>
</html>

Using Local Storage

You can also use local storage to persist data.

For example, a common pattern in SaaS apps is to give each customer a unique subdomain. By default second-level domains are considered internal to your application. (For more info see Defining Internal URLs below)

Say you have your customers login at https://login.yourapp.com which then redirects them to https://yourcustomer.yourapp.com. You can store the last used subdomain in local storage and redirect your users there when they open the app.

        // On login to subdomain https://yourcustomer.yourapp.com
if (windows.todesktop) {
  localStorage.setItem('subdomain', 'yourcustomer');
}

// When not already on subdomain then redirect to last used subdomain
if (window.todesktop) {
  const subdomain = localStorage.getItem('subdomain');

  if (subdomain) {
    window.location = `https://${subdomain}.yourapp.com`;
  }
}

NOTE

When constructing URLs from stored data, validate the data to ensure it matches expected patterns before using it. See our security best practices for more tips.

We recommend having a separate javascript app for all of your ToDesktop specific login and importing that conditionally when your app is running as a desktop app.

Storing Data

# Using Encrypted Storage

# Using Local Storage

On this page

Using Encrypted Storage

Using Local Storage