How to Create a UUID in JavaScript

By  on  

The UUID identifier has been used in programming since the days a baby-faced David Walsh became a professional software engineer. My first exposure to UUIDs was via a ColdFusion app I inherited and ... the less we say about that the better. In any event, I was recently surprised to see that JavaScript has the ability to create UUIDs.

Developers can use the native JavaScript crypto library to generate a UUID:

crypto.randomUUID() // '5872aded-d613-410e-841f-a681a6aa8d8b'
crypto.randomUUID() // 'fe6c7438-a833-4c7c-9ea3-cdc84ef41dfc'
crypto.randomUUID() // 'e47a03d4-5da3-4451-a2c1-265de99cc2c1'
crypto.randomUUID() // '04cdadeb-0228-43db-85dc-ce7e960a6cde'

It's important to remember that the UUID is not guaranteed to be unique, though the probability of repetition is incredibly low. I look forward to exploring the window.crypto API further to see what other cool things we can do!

Recent Features

  • By
    Page Visibility API

    One event that's always been lacking within the document is a signal for when the user is looking at a given tab, or another tab. When does the user switch off our site to look at something else? When do they come back?

  • By
    39 Shirts – Leaving Mozilla

    In 2001 I had just graduated from a small town high school and headed off to a small town college. I found myself in the quaint computer lab where the substandard computers featured two browsers: Internet Explorer and Mozilla. It was this lab where I fell...

Incredible Demos

Discussion

  1. Christian Bettinger

    Unfortunately, browser support is very patchy so far…

  2. zakius

    V8 is not equal to JavaScript

  3. Prakash Chokalingam

    Yes, the article should have included ‘node’ or ‘v8’ in the title.

  4. lemirij798

    Probably worth mentioning this doesn’t work in Safari or Firefox and is not a W3C Standard nor is it on the W3C Standards Track.

  5. rj

    Are there any other libraries that generate uuid other than crypto in js?

  6. Florian

    A note on browser support would be useful ;) But it‘s great to see that we can soon use it just like that.

  7. Chromium (including Edge): >=92
    Firefox: >=95 (Release notes how I discovered the API)
    Safari: :(
    IE: No!

    shim:

    if (! (crypto.randomUUID instanceof Function)) {
      function uuidv4() {
        return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
          (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
        );
      }
    }
    
    • Turns out I cannot edit comments…

      if (! (crypto.randomUUID instanceof Function)) {
        crypto.randomUUID = function uuidv4() {
          return ([1e7]+-1e3+-4e3+-8e3+-1e11).replace(/[018]/g, c =>
            (c ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> c / 4).toString(16)
          );
        }
      }

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!