Generating Secure Random Numbers in TypeScript

techjstscryptographysecurity
November 20, 2023
Table Of Contents

Typed Arrays

To understand how secure random number generation works in TS, you first have to understand how JavaScriptā€™s typed arrays work. Typed arrays are objects that store binary data as arrays of numbers. The capacity of a typed array is measured in bits.

Bits are binary, meaning they can be in one of two states (0 or 1). A single bit therefore has a capacity of 2**1, which is of course equal to 2. Every time you add a bit, youā€™re multiplying the capacity by two. Two bits can therefore store 2**2 numbers, because they can be in any of four states (00, 11, 01, and 10).

The JS specification includes several unsigned typed arrays (unsigned meaning all of the numbers are positive, and therefore donā€™t require a negative or positive sign to differentiate them).

  1. Uint8Array - these can hold 2**8 integers (i.e. 0-255).
  2. Uint16Array - these can hold 2**16 integers.
  3. Uint32Array - these can hold 2**32 integers.
  4. BigUint64Array - these can hold 2**64 integers, however 2**64 is larger than the maximum safe integer in JS, so these numbers are stored as BigInts. You can retrieve the largest safe integer in a given JS runtime by accessing the MAX_SAFE_INTEGER property of the Number object.

For the purpose of simplicity weā€™ll assume that the minimum, maximum, and range of the set of random numbers weā€™re generating are all numbers (rather than bigints), and that the range fits in a 32 bit array. In practice, Iā€™ve rarely found myself needing random numbers that donā€™t satisfy these requirements.

Determining the Range

First you have to determine the range of numbers youā€™ll be generating, which is equal to the max subtracted by the min plus one.

const range = max - min + 1

The reason weā€™re adding one to the difference of the max and min becomes obvious when you consider the simplest example. If the min were 1 and the max were 2, weā€™d be generating numbers in the set 1-2, and this set obviously has a size of 2: 2 - 1 + 1.[1]

Selecting a Typed Array

Next, you have to select the smallest typed array thatā€™s large enough to hold values within the range of your set of random numbers. This is pretty straightforward:

const RANGE_8_BIT = 2 ** 8
const RANGE_16_BIT = 2 ** 16
const typedArrayConstructor =
  range <= RANGE_8_BIT
    ? Uint8Array
    : range <= RANGE_16_BIT
    ? Uint16Array
    : Uint32Array

Generating the Actual Numbers

Now weā€™re at the point where we can actually generate some random numbers. The crypto api that ships with all JS runtimes has a method called getRandomValues which accepts a typed array, and returns that same array filled with cryptographically secure random numbers.

So you could generate a single random number by calling this method with a typed array of length 1, and then accessing the first element in the array.

const array = new typedArrayConstructor(1)
let randomNum = crypto.getRandomValues(array)[0]

Unless the range of numbers youā€™re generating is exactly the same as the capacity of the typed array, youā€™d then have to filter out numbers that fall outside of your given range. We can simply run this code in a loop, and break when we finally generate a number within our desired range.

let randomNum: number
while (true) {
  randomNum = crypto.getRandomValues(new typedArrayConstructor(1))[0]
  if (randomNum < range) break
}

Performance

The problem with this solution is that itā€™s incredibly inefficient. Consider for example the case in which weā€™re generating numbers from 0 to 25. [2] The smallest typed array that would satisfy our requirements would be an 8 bit array which contains numbers from 0 to 255. Using the naive approach above only 10.15625% of the generated numbers would be useful, which would mean weā€™d be doing a lot of unnecessary work.

Ideally, we would like to have a 5 bit array which would contain 32 numbers (0-31), and would result in far less useless work, but alas thereā€™s no such array in the JS spec. We can achieve the same result however by simply dividing the generated number by 32, and using the remainder of that operation as our random number, which is exactly what the modulo operator does. This will produce an even distribution of numbers from 0-31. Itā€™s important that the capacity of the array is evenly divisible by the number on the right side of the modulo operator, otherwise some numbers will be generated more frequently than others, which renders the process non-random and is therefore a security vulnerability.

So how do we generalize this process for any given number? We need to find the smallest power of 2 thatā€™s greater than or equal to our range. Luckily, thereā€™s a built in function for doing this called Math.log2. The problem is that this function will gladly return a floating point number rather than rounding up to the largest integer, but thatā€™s pretty simple to remedy by using another built in function Math.ceil. If Math.ceil receives an integer, it will return it unchanged, otherwise itā€™ll round up to the next largest integer which is exactly what we need.

const nearestLog2 = Math.ceil(Math.log2(range))

If we combine this with our looping code to filter out numbers that fall outside of our range, weā€™re almost finished.

let randomNum: number

while (true) {
  randomNum = crypto.getRandomValues(new typedArrayConstructor(1))[0]
  randomNum = randomNum % 2 ** nearestLog2  if (randomNum < range) break
}

Shifting the Set

So far weā€™ve been generating numbers with the implicit assumption that the range begins at 0, but itā€™s trivially easy to allow the range to begin at any arbitrary point on the integer number line. We can do this by adding the min to our generated random numbers. So for example, if the min is 2 and the max is 4, instead of generating numbers in the set ā€˜0,1,2ā€™ we would add 2 to our randomly generated numbers to shift them into the set ā€˜2,3,4ā€™. With this final step, the random number generator is done.

const RANGE_8_BIT = 2 ** 8
const RANGE_16_BIT = 2 ** 16
export function random({
  min,
  max,
}: Required<Record<'min' | 'max', number>>): number {
  const range = max - min + 1

  const typedArrayConstructor =
    range <= RANGE_8_BIT
      ? Uint8Array
      : range <= RANGE_16_BIT
      ? Uint16Array
      : Uint32Array

  const nearestLog2 = Math.ceil(Math.log2(range))

  let randomNum: number

  while (true) {
    randomNum = crypto.getRandomValues(new typedArrayConstructor(1))[0]
    randomNum = randomNum % 2 ** nearestLog2
    if (randomNum < range) break
  }

  return randomNum + min}

Applications

This process has several useful applications including generating unique ids and secure passphrases.

Unique Ids

To generate a unique ID (similar to what the npm package nanoid does), you could wrap the random number generating script in a function like this:

const idGenerator = (alphabet: string, length: number) => {
  const charArray = alphabet.split('')
  return Array.from(
    { length },
    () => charArray[random({ min: 0, max: charArray.length - 1 })]
  )
}

You could then generate an alphanumeric id by running:

const alpha = Array.from({ length: 26 }, (_, i) =>
  String.fromCharCode(i + 'a'.charCodeAt(0))
)
const numeric = Array.from({ length: 10 }, (_, i) => i.toString())
const id = idGenerator(alpha.concat(numeric).join(''), 36)

In fact, this post was inspired by a comment I wrote on HN about how nanoid generates random ids.

Secure Passphrases

You could also use this random number generator as the basis for a secure passphrase generator.

const passPhraseGenerator = (
  wordList: string[],
  length: number,
  separator = '-'
) => {
  return Array.from(
    { length },
    () => wordList[random({ min: 0, max: wordList.length - 1 })]
  ).join(separator)
}

You could then generate a secure passphrase by running:

const wordList = `abandon ability able about above absent absorb abstract absurd abuse access accident account accuse achieve acid acoustic acquire across act action actor actress actual adapt add addict address adjust admit adult advance advice aerobic affair afford afraid again age agent agree ahead aim air airport aisle alarm album alcohol alert alien all alley allow almost alone alpha already also alter always amateur amazing among amount amused analyst anchor ancient anger angle angry animal ankle announce annual another answer antenna antique anxiety any apart apology appear apple approve april arch arctic area arena argue arm armed armor army around arrange arrest arrive arrow art artefact artist artwork ask aspect assault asset assist assume asthma athlete atom attack attend attitude attract auction audit august aunt author auto autumn average avocado avoid awake aware away awesome awful awkward axis baby bachelor bacon badge bag balance balcony ball bamboo banana banner bar barely bargain barrel base basic basket battle beach bean beauty because become beef before begin behave behind believe below belt bench benefit best betray better between beyond bicycle bid bike bind biology bird birth bitter black blade blame blanket blast bleak bless blind blood blossom blouse blue blur blush board boat body boil bomb bone bonus book boost border boring borrow boss bottom bounce box boy bracket brain brand brass brave bread breeze brick bridge brief bright bring brisk broccoli broken bronze broom brother brown brush bubble buddy budget buffalo build bulb bulk bullet bundle bunker burden burger burst bus business busy butter buyer buzz cabbage cabin cable cactus cage cake call calm camera camp can canal cancel candy cannon canoe canvas canyon capable capital captain car carbon card cargo carpet carry cart case cash casino castle casual cat catalog catch category cattle caught cause caution cave ceiling celery cement census century cereal certain chair chalk champion change chaos chapter charge chase chat cheap check cheese chef cherry chest chicken chief child chimney choice choose chronic chuckle chunk churn cigar cinnamon circle citizen city civil claim clap clarify claw clay clean clerk clever click client cliff climb clinic clip clock clog close cloth cloud clown club clump cluster clutch coach coast coconut code coffee coil coin collect color column combine come comfort comic common company concert conduct confirm congress connect consider control convince cook cool copper copy coral core corn correct cost cotton couch country couple course cousin cover coyote crack cradle craft cram crane crash crater crawl crazy cream credit creek crew cricket crime crisp critic crop cross crouch crowd crucial cruel cruise crumble crunch crush cry crystal cube culture cup cupboard curious current curtain curve cushion custom cute cycle dad damage damp dance danger daring dash daughter dawn day deal debate debris decade december decide decline decorate decrease deer defense define defy degree delay deliver demand demise denial dentist deny depart depend deposit depth deputy derive describe desert design desk despair destroy detail detect develop device devote diagram dial diamond diary dice diesel diet differ digital dignity dilemma dinner dinosaur direct dirt disagree discover disease dish dismiss disorder display distance divert divide divorce dizzy doctor document dog doll dolphin domain donate donkey donor door dose double dove draft dragon drama drastic draw dream dress drift drill drink drip drive drop drum dry duck dumb dune during dust dutch duty dwarf dynamic eager eagle early earn earth easily east easy echo ecology economy edge edit educate effort egg eight either elbow elder electric elegant element elephant elevator elite else embark embody embrace emerge emotion employ empower empty enable enact end endless endorse enemy energy enforce engage engine enhance enjoy enlist enough enrich enroll ensure enter entire entry envelope episode equal equip era erase erode erosion error erupt escape essay essence estate eternal ethics evidence evil evoke evolve exact example excess exchange excite exclude excuse execute exercise exhaust exhibit exile exist exit exotic expand expect expire explain expose express extend extra eye eyebrow fabric face faculty fade faint faith fall false fame family famous fan fancy fantasy farm fashion fat fatal father fatigue fault favorite feature february federal fee feed feel female fence festival fetch fever few fiber fiction field figure file film filter final find fine finger finish fire firm first fiscal fish fit fitness fix flag flame flash flat flavor flee flight flip float flock floor flower fluid flush fly foam focus fog foil fold follow food foot force forest forget fork fortune forum forward fossil foster found fox fragile frame frequent fresh friend fringe frog front frost frown frozen fruit fuel fun funny furnace fury future gadget gain galaxy gallery game gap garage garbage garden garlic garment gas gasp gate gather gauge gaze general genius genre gentle genuine gesture ghost giant gift giggle ginger giraffe girl give glad glance glare glass glide glimpse globe gloom glory glove glow glue goat goddess gold good goose gorilla gospel gossip govern gown grab grace grain grant grape grass gravity great green grid grief grit grocery group grow grunt guard guess guide guilt guitar gun gym habit hair half hammer hamster hand happy harbor hard harsh harvest hat have hawk hazard head health heart heavy hedgehog height hello helmet help hen hero hidden high hill hint hip hire history hobby hockey hold hole holiday hollow home honey hood hope horn horror horse hospital host hotel hour hover hub huge human humble humor hundred hungry hunt hurdle hurry hurt husband hybrid ice icon idea identify idle ignore ill illegal illness image imitate immense immune impact impose improve impulse inch include income increase index indicate indoor industry infant inflict inform inhale inherit initial inject injury inmate inner innocent input inquiry insane insect inside inspire install intact interest into invest invite involve iron island isolate issue item ivory jacket jaguar jar jazz jealous jeans jelly jewel job join joke journey joy judge juice jump jungle junior junk just kangaroo keen keep ketchup key kick kid kidney kind kingdom kiss kit kitchen kite kitten kiwi knee knife knock know lab label labor ladder lady lake lamp language laptop large later latin laugh laundry lava law lawn lawsuit layer lazy leader leaf learn leave lecture left leg legal legend leisure lemon lend length lens leopard lesson letter level liar liberty library license life lift light like limb limit link lion liquid list little live lizard load loan lobster local lock logic lonely long loop lottery loud lounge love loyal lucky luggage lumber lunar lunch luxury lyrics machine mad magic magnet maid mail main major make mammal man manage mandate mango mansion manual maple marble march margin marine market marriage mask mass master match material math matrix matter maximum maze meadow mean measure meat mechanic medal media melody melt member memory mention menu mercy merge merit merry mesh message metal method middle midnight milk million mimic mind minimum minor minute miracle mirror misery miss mistake mix mixed mixture mobile model modify mom moment monitor monkey monster month moon moral more morning mosquito mother motion motor mountain mouse move movie much muffin mule multiply muscle museum mushroom music must mutual myself mystery myth naive name napkin narrow nasty nation nature near neck need negative neglect neither nephew nerve nest net network neutral never news next nice night noble noise nominee noodle normal north nose notable note nothing notice novel now nuclear number nurse nut oak obey object oblige obscure observe obtain obvious occur ocean october odor off offer office often oil okay old olive olympic omit once one onion online only open opera opinion oppose option orange orbit orchard order ordinary organ orient original orphan ostrich other outdoor outer output outside oval oven over own owner oxygen oyster ozone pact paddle page pair palace palm panda panel panic panther paper parade parent park parrot party pass patch path patient patrol pattern pause pave payment peace peanut pear peasant pelican pen penalty pencil people pepper perfect permit person pet phone photo phrase physical piano picnic picture piece pig pigeon pill pilot pink pioneer pipe pistol pitch pizza place planet plastic plate play please pledge pluck plug plunge poem poet point polar pole police pond pony pool popular portion position possible post potato pottery poverty powder power practice praise predict prefer prepare present pretty prevent price pride primary print priority prison private prize problem process produce profit program project promote proof property prosper protect proud provide public pudding pull pulp pulse pumpkin punch pupil puppy purchase purity purpose purse push put puzzle pyramid quality quantum quarter question quick quit quiz quote rabbit raccoon race rack radar radio rail rain raise rally ramp ranch random range rapid rare rate rather raven raw razor ready real reason rebel rebuild recall receive recipe record recycle reduce reflect reform refuse region regret regular reject relax release relief rely remain remember remind remove render renew rent reopen repair repeat replace report require rescue resemble resist resource response result retire retreat return reunion reveal review reward rhythm rib ribbon rice rich ride ridge rifle right rigid ring riot ripple risk ritual rival river road roast robot robust rocket romance roof rookie room rose rotate rough round route royal rubber rude rug rule run runway rural sad saddle sadness safe sail salad salmon salon salt salute same sample sand satisfy satoshi sauce sausage save say scale scan scare scatter scene scheme school science scissors scorpion scout scrap screen script scrub sea search season seat second secret section security seed seek segment select sell seminar senior sense sentence series service session settle setup seven shadow shaft shallow share shed shell sheriff shield shift shine ship shiver shock shoe shoot shop short shoulder shove shrimp shrug shuffle shy sibling sick side siege sight sign silent silk silly silver similar simple since sing siren sister situate six size skate sketch ski skill skin skirt skull slab slam sleep slender slice slide slight slim slogan slot slow slush small smart smile smoke smooth snack snake snap sniff snow soap soccer social sock soda soft solar soldier solid solution solve someone song soon sorry sort soul sound soup source south space spare spatial spawn speak special speed spell spend sphere spice spider spike spin spirit split spoil sponsor spoon sport spot spray spread spring spy square squeeze squirrel stable stadium staff stage stairs stamp stand start state stay steak steel stem step stereo stick still sting stock stomach stone stool story stove strategy street strike strong struggle student stuff stumble style subject submit subway success such sudden suffer sugar suggest suit summer sun sunny sunset super supply supreme sure surface surge surprise surround survey suspect sustain swallow swamp swap swarm swear sweet swift swim swing switch sword symbol symptom syrup system table tackle tag tail talent talk tank tape target task taste tattoo taxi teach team tell ten tenant tennis tent term test text thank that theme then theory there they thing this thought three thrive throw thumb thunder ticket tide tiger tilt timber time tiny tip tired tissue title toast tobacco today toddler toe together toilet token tomato tomorrow tone tongue tonight tool tooth top topic topple torch tornado tortoise toss total tourist toward tower town toy track trade traffic tragic train transfer trap trash travel tray treat tree trend trial tribe trick trigger trim trip trophy trouble truck true truly trumpet trust truth try tube tuition tumble tuna tunnel turkey turn turtle twelve twenty twice twin twist two type typical ugly umbrella unable unaware uncle uncover under undo unfair unfold unhappy uniform unique unit universe unknown unlock until unusual unveil update upgrade uphold upon upper upset urban urge usage use used useful useless usual utility vacant vacuum vague valid valley valve van vanish vapor various vast vault vehicle velvet vendor venture venue verb verify version very vessel veteran viable vibrant vicious victory video view village vintage violin virtual virus visa visit visual vital vivid vocal voice void volcano volume vote voyage wage wagon wait walk wall walnut want warfare warm warrior wash wasp waste water wave way wealth weapon wear weasel weather web wedding weekend weird welcome west wet whale what wheat wheel when where whip whisper wide width wife wild will win window wine wing wink winner winter wire wisdom wise wish witness wolf woman wonder wood wool word work world worry worth wrap wreck wrestle wrist write wrong yard year yellow you young youth zebra zero zone zoo`
const passphrase = passPhraseGenerator(wordList.split(' '), 12)

This is essentially how most passphrase generators work. The encryption utility age for example uses the BIP32 word list from the Bitcoin project to generate random passphrases.

Passphrase Entropy Calculation

Given the explanation of binary numbers at the beginning of this post, it should be very easy to understand how passphrase complexity is calculated.

const entropy = (wordListLength: number, passphraseLength: number) =>
  Math.log2(wordListLength ** passphraseLength)

A passphrase generated using the 2048 words from the BIP32 wordlist, with a length of 12 words would have an entropy of 132 bits, which would be non-feasible to crack using brute force methods. Thereā€™s a famous XKCD comic about the difficulty of cracking seemingly simple passphrases.

This is an XKCD comic which humorously talks about the fact that typical passwords (e.g. Tr0ub4dor) are both harder to remember and also less secure than passwords which consist of a string of random words (e.g. correct-horse-battery-staple).

Footnotes

  1. Another way to conceptualize this is that we shouldnā€™t be subtracting the min from the set, we should be subtracting everything smaller than the min from the set (i.e. max - (min - 1)). ā†©

  2. E.g. if weā€™re trying to select random letters from the 26 character latin alphabet. ā†©