JavaScript crypto.subtle — хешування й шифрування в браузері

crypto.subtle — це справжня криптографія в браузері: хешування, шифрування, підписи, генерація ключів.

правити

Загальний опис

Ім'я обрано навмисно застережливе: subtle означає «тонкий, підступний». Автори стандарту так натякають, що криптографію легко застосувати неправильно — і отримати відчуття безпеки замість безпеки.

Усі методи асинхронні (повертають проміси) і приймають байти, не рядки. Тому в парі з ними завжди йде TextEncoder.

Найчастіше з нього беруть digest() — хеш SHA-256. Значно рідше — шифрування AES.

І лише на HTTPS: на звичайному HTTP crypto.subtle просто undefined.

правити

Нотатка

Хешування паролів на клієнті не робить систему безпечнішою. Хеш стає новим паролем: хто його перехопив, той увійде. Паролі хешує сервер, і лише він.

автор: NagarD правити

+ додати пораду чи нотатку

Переглядачі

Стаціонарні переглядачі Мобільні переглядачі

Підтримка: стаціонарні переглядачі

Переглядач
subtle	37+	34+	11+	24+	12+	11+

Підтримка: мобільні переглядачі

Переглядач
subtle	37+	yes	yes	11+

Приклади

+ запропонувати свій приклад у пісочниці

async function sha256(text) {
    const data = new TextEncoder().encode(text);
    const hash = await crypto.subtle.digest('SHA-256', data);

    return [...new Uint8Array(hash)]
        .map(b => b.toString(16).padStart(2, '0'))
        .join('');
}

(async () => {
    console.log(await sha256('привіт'));

    // контрольна сума файлу — щоб не вантажити дублікат
    const file = new File(['вміст файлу'], 'demo.txt');
    const digest = await crypto.subtle.digest('SHA-256', await file.arrayBuffer());
    console.log('Сума файлу:', digest.byteLength, 'байтів');
})();