OAuth2 and OIDC now recommend that a single page app (SPA) should use the authorization code flow with the addition of PKCE to strengthen token handoff. I didn't find a simple code example of generating the code_verifier in JavaScript in a browser so I created this. It is an implementation of the method suggested in the PKCE spec (https://tools.…

generatePKCECodeVerifier.js

function generatePKCECodeVerifier() {
    var buffer = new ArrayBuffer(96); // 96 bytes creates a 128 character base64 encoded string
    var uint8Array = new Uint8Array(buffer);  // Uint8 makes getRandomValues choose numbers betwee 0 and 255
    (window.crypto || window.msCrypto).getRandomValues(uint8Array);
    var binaryString = String.fromCharCode.apply(null, uint8Array);  // Utilise 'apply' converting array to function params
    return btoa(binaryString).replace(/\+/g, '-').replace(/\//g, '_').replace(/=/g, '');  // base64url encoding
}