Secure context: This feature is available only insecure contexts (HTTPS), in some or allsupporting browsers.

Note: This feature is available inWeb Workers.

deriveBits(algorithm, baseKey, length)

Note:You cantry the working examples on GitHub.

async function deriveSharedSecret(privateKey, publicKey) {  const sharedSecret = await window.crypto.subtle.deriveBits(    {      name: "ECDH",      namedCurve: "P-384",      public: publicKey,    },    privateKey,    128,  );  const buffer = new Uint8Array(sharedSecret, 0, 5);  const sharedSecretValue = document.querySelector(".ecdh .derived-bits-value");  sharedSecretValue.classList.add("fade-in");  sharedSecretValue.addEventListener("animationend", () => {    sharedSecretValue.classList.remove("fade-in");  });  sharedSecretValue.textContent = `${buffer}…[${sharedSecret.byteLength} bytes total]`;}// Generate 2 ECDH key pairs: one for Alice and one for Bob// In more normal usage, they would generate their key pairs// separately and exchange public keys securelyconst generateAliceKeyPair = window.crypto.subtle.generateKey(  {    name: "ECDH",    namedCurve: "P-384",  },  false,  ["deriveBits"],);const generateBobKeyPair = window.crypto.subtle.generateKey(  {    name: "ECDH",    namedCurve: "P-384",  },  false,  ["deriveBits"],);Promise.all([generateAliceKeyPair, generateBobKeyPair]).then((values) => {  const aliceKeyPair = values[0];  const bobKeyPair = values[1];  const deriveBitsButton = document.querySelector(".ecdh .derive-bits-button");  deriveBitsButton.addEventListener("click", () => {    // Alice then generates a secret using her private key and Bob's public key.    // Bob could generate the same secret using his private key and Alice's public key.    deriveSharedSecret(aliceKeyPair.privateKey, bobKeyPair.publicKey);  });});

<input type="button" value="Derive bits" /><input type="button" value="Change keys" />

<pre></pre>

#log {  height: 150px;  width: 90%;  white-space: pre-wrap; /* wrap pre blocks */  overflow-wrap: break-word; /* break on words */  overflow-y: auto;  padding: 0.5rem;  border: 1px solid black;}

const logElement = document.querySelector("#log");function log(text) {  logElement.innerText = `${logElement.innerText}${text}\n`;  logElement.scrollTop = logElement.scrollHeight;}

async function deriveSharedSecret(privateKey, publicKey) {  return await window.crypto.subtle.deriveBits(    {      name: "X25519",      public: publicKey,    },    privateKey,    128,  );}

let aliceKeyPair;let bobKeyPair;async function changeKeys() {  try {    aliceKeyPair = await window.crypto.subtle.generateKey(      {        name: "X25519",      },      false,      ["deriveBits"],    );    bobKeyPair = await window.crypto.subtle.generateKey(      {        name: "X25519",      },      false,      ["deriveBits"],    );    log("Keys changed");  } catch (e) {    log(e);  }}changeKeys();const changeKeysButton = document.querySelector("#buttonChangeKeys");// Generate 2 X25519 key pairs: one for Alice and one for Bob// In more normal usage, they would generate their key pairs// separately and exchange public keys securelychangeKeysButton.addEventListener("click", changeKeys);

const deriveBitsButton = document.querySelector("#buttonDeriveKeys");deriveBitsButton.addEventListener("click", async () => {  // Generate 2 X25519 key pairs: one for Alice and one for Bob  // In more normal usage, they would generate their key pairs  // separately and exchange public keys securely  // Alice then generates a secret using her private key and Bob's public key.  // Bob could generate the same secret using his private key and Alice's public key.  const sharedSecretAlice = await deriveSharedSecret(    aliceKeyPair.privateKey,    bobKeyPair.publicKey,  );  let buffer = new Uint8Array(sharedSecretAlice, 0, 10);  log(`${buffer}…[${sharedSecretAlice.byteLength} bytes total] (Alice secret)`);  const sharedSecretBob = await deriveSharedSecret(    bobKeyPair.privateKey,    aliceKeyPair.publicKey,  );  buffer = new Uint8Array(sharedSecretBob, 0, 10);  log(`${buffer}…[${sharedSecretAlice.byteLength} bytes total] (Bob secret)`);});

let salt;/*Get some key material to use as input to the deriveBits method.The key material is a password supplied by the user.*/function getKeyMaterial() {  const password = window.prompt("Enter your password");  const enc = new TextEncoder();  return window.crypto.subtle.importKey(    "raw",    enc.encode(password),    { name: "PBKDF2" },    false,    ["deriveBits", "deriveKey"],  );}/*Derive some bits from a password supplied by the user.*/async function getDerivedBits() {  const keyMaterial = await getKeyMaterial();  salt = window.crypto.getRandomValues(new Uint8Array(16));  const derivedBits = await window.crypto.subtle.deriveBits(    {      name: "PBKDF2",      salt,      iterations: 100000,      hash: "SHA-256",    },    keyMaterial,    256,  );  const buffer = new Uint8Array(derivedBits, 0, 5);  const derivedBitsValue = document.querySelector(    ".pbkdf2 .derived-bits-value",  );  derivedBitsValue.classList.add("fade-in");  derivedBitsValue.addEventListener("animationend", () => {    derivedBitsValue.classList.remove("fade-in");  });  derivedBitsValue.textContent = `${buffer}…[${derivedBits.byteLength} bytes total]`;}const deriveBitsButton = document.querySelector(".pbkdf2 .derive-bits-button");deriveBitsButton.addEventListener("click", () => {  getDerivedBits();});

Help improve MDN

This page was last modified on⁨Feb 20, 2025⁩ byMDN contributors.