从数学随机更改为 window.crypto

Question

I use a random word generator, which I wanted to change from math.random to the more secure window.crypto .

I tried for hours to get this working and I'm sure there is a error in the code. How must I change my code to get this code to using the window.crypto method?

var wordings = ['X',
  'I',
  'II'
];

function getRandom(randArray) {
  return Math.floor(Math.random() * randArray.length);
}

function showrandom() {
  document.getElementById('random').innerHTML = wordings[getRandom(wordings)] + ' ' + wordings[getRandom(wordings)];
}

showrandom();

What I tried so far:

var wordings = ['X',
  'I',
  'II'
];

function getRandom(randArray) {
  var array = new Uint32Array(10);
  window.crypto.getRandomValues(array);
}


function showrandom() {
  document.getElementById('random').innerHTML = wordings[getRandom(wordings)] + ' ' + wordings[getRandom(wordings)];
}

Answer 1

The basic problem is that the Math.random returns values from 0 ( inclusive ) to 1 ( exclusive ), while the window.crypto.getRandomValues returns integers from 0 to the max 32 bit integer ( or whatever the max of the type of the array you pass in ).

So you need to to scale down the range of the window.crypto to the one in the Math.random

Something like

function cryptoRandom(){
  // return a crypto generated number
  // between 0 and 1 (0 inclusive, 1 exclusive);
  // Mimics the Math.random function in range of results
  var array = new Uint32Array(1),
    max = Math.pow(2, 32), // normally the max is 2^32 -1 but we remove the -1
                           //  so that the max is exclusive
    randomValue = window.crypto.getRandomValues(array)[0] / max;

    return randomValue;
}

function getRandom(randArray) {
    return Math.floor(cryptoRandom() * randArray.length);
}

---

See https://news.ycombinator.com/item?id=9976493 for why using modulo % decreases the entropy of the random number

Answer 2

You are missing ) It should be document.getElementById('random').innerHTML = wordings[getRandom(wordings)] + ' ' + wordings[getRandom(wordings)]; Does this solve your problem?

Also as documentation shows crypto this method generates random integer values. As i understand from your code you are trying to derive index of the words inside wordings array from random number. To get indexes from random integers you could use modulo operation by wordings.length for each random number, but this approach needs to be investigated in terms of security issues.

the code would look like this:

var wordings = ['X',
    'I',
    'II'
];

function getRandom(randArray){
    var cryptoObj = window.crypto || window.msCrypto; // for IE 11
    var array = new Uint32Array(1);
    cryptoObj.getRandomValues(array);

    return array[0]%randArray.length;
}

function showrandom() {
    document.getElementById('random').innerHTML = wordings[getRandom(wordings)] + ' ' + wordings[getRandom(wordings)];
}