UUID in JavaScript

What is a UUID in JavaScript

crypto.randomUUID() is the built-in answer. It is available in secure contexts — HTTPS pages, localhost and Node.js from 16.7 — and returns a canonical lowercase v4 UUID such as 550e8400-e29b-41d4-a716-446655440000. It draws from the same cryptographically secure generator as the rest of the Web Crypto API, so there is no reason to hand-roll one with Math.random(), which is not secure and has been the source of many bug reports.

The one thing the platform does not give you is a different version. If you need v7 — the RFC 9562 format whose leading 48 bits are a Unix timestamp, which keeps database inserts sequential — install the uuid package and import v7. If you only need v4 and must support an older runtime without randomUUID, build it from crypto.getRandomValues and set the version and variant nibbles yourself, as the fallback below shows.

How to

1. In a browser or Node 16.7+: call crypto.randomUUID(). Nothing to install.
2. For v7, install the uuid package and import v7 instead.
3. Need a value right now, or a batch for test fixtures? Use the generator above.

Use cases

• React and Vue keys, request identifiers and optimistic-update ids that must not collide between clients.
• Test data where each fixture row needs its own identifier, generated in a script rather than kept in a fixture file.
• File and upload names that must not leak a name or an index and must survive being put in a header.

Compare UUID in JavaScript with other formats

Code examples

Browser / Node 16.7+

// version 4, cryptographically secure, zero dependencies
const id = crypto.randomUUID();
// '550e8400-e29b-41d4-a716-446655440000'

Node with v7

import { v7 as uuidv7, v4 as uuidv4 } from 'uuid';

const ordered = uuidv7();   // 019535d9-3df7-79fb-b466-fa907fa17f9e
const random  = uuidv4();

// v7 sorts by creation time, so ORDER BY id is close to ORDER BY created_at

Fallback for older runtimes

function uuidv4() {
  const b = crypto.getRandomValues(new Uint8Array(16));
  b[6] = (b[6] & 0x0f) | 0x40;   // version 4
  b[8] = (b[8] & 0x3f) | 0x80;   // variant RFC 4122
  const hex = [...b].map((x) => x.toString(16).padStart(2, '0')).join('');
  return `${hex.slice(0,8)}-${hex.slice(8,12)}-${hex.slice(12,16)}-${hex.slice(16,20)}-${hex.slice(20)}`;
}

UUID v5 from a name

import { v5 as uuidv5 } from 'uuid';

// The same namespace + name always yields the same UUID
const NS = '6ba7b810-9dad-11d1-80b4-00c04fd430c8';
uuidv5('example.com', NS);   // stable for every caller

Frequently asked questions