如何计算PCKE的code_verifier？

Question

我正在浏览Okta 的 PCKE Flow 演示，以更好地了解它的工作原理，但我无法重现code_challenge从code_verifier. 这是演示的屏幕截图：

使用Zg6klgrnixQJ629GsawRMV8MjWvwRAr-vyvP1MHnB6X8WKZN的代码验证，他们是如何产生
iF_7prUeJ6rr3jMG3LmhW3R1cZ2ecZavFqS0jtb6tzo的代码的挑战？

使用这个SHA256 哈希计算器和Base64 Encoder，我得到了ODg1ZmZiYTZiNTFlMjdhYWViZGUzMzA2ZGNiOWExNWI3NDc1NzE5ZDllNzE5NmFmMTZhNGI0OGVkNmZhYjczYQ与iF_7prUeJ6rr3jMG3LmhW3R1cZ2ecZavFqS0jtb6tzo. 没有获得预期值我做错了什么？

这个来自 approsto 的 SHA256 base 64 哈希计算器给了我一个非常接近预期值的值。使用这个计算器，我得到iF/7prUeJ6rr3jMG3LmhW3R1cZ2ecZavFqS0jtb6tzo了与预期值相差一个字符的值（注意是如何/代替 的_）。

我在做什么导致这种差异？如何计算期望code_verifier的价值iF_7prUeJ6rr3jMG3LmhW3R1cZ2ecZavFqS0jtb6tzo？谢谢

Answer 1

PKCE 代码挑战是验证者的 Base64-URL 编码的 SHA256 哈希。这意味着您需要获取原始字符串，计算它的 SHA256 哈希值，然后对哈希值进行 Base64-URL 编码。字很多，让我们来看看吧。

您在上面尝试执行的操作存在两个问题：

您找到的在线 SHA256 哈希计算器将哈希输出为十六进制编码的字符串，而不是原始字节。这通常很有帮助，但在这种情况下不是。因此，您通过 base64 编码做的下一件事是对哈希的十六进制表示进行 base64 编码，而不是原始字节。您需要使用输出原始字节的哈希函数，并将原始字节传递给 base64-url-encoder。

下一个问题是你需要base64-url编码，而不是base64编码。Base64-URL-encoding 是 Base64 编码的一个小变种，唯一的区别是使用字符-而不是+和_代替/，并=从末尾修剪填充字符。这使其成为 URL 安全的，否则+/=字符将需要在 URL 中进行转义。

因此，要计算 PKCE 代码挑战，您需要使用可以为您提供原始字节的 SHA256 函数，然后使用修改后的 Base64 编码函数对这些字节进行编码。

这是 PHP 中的一些代码可以做到这一点：

    function pkce_code_challenge($verifier) {
        $hash = hash('sha256', $verifier, true);
        return rtrim(strtr(base64_encode($hash), '+/', '-_'), '=');
    }

也可以在浏览器中使用纯 JavaScript，但由于 WebCrypto API 的复杂性，代码稍长：

    function sha256(plain) { 
        // returns promise ArrayBuffer
        const encoder = new TextEncoder();
        const data = encoder.encode(plain);
        return window.crypto.subtle.digest('SHA-256', data);
    }

    function base64urlencode(a) {
        // Convert the ArrayBuffer to string using Uint8 array.
        // btoa takes chars from 0-255 and base64 encodes.
        // Then convert the base64 encoded to base64url encoded.
        // (replace + with -, replace / with _, trim trailing =)
        return btoa(String.fromCharCode.apply(null, new Uint8Array(a)))
            .replace(/\+/g, '-').replace(/\//g, '_').replace(/=+$/, '');
    }

    async function pkce_challenge_from_verifier(v) {
        hashed = await sha256(v);
        base64encoded = base64urlencode(hashed);
        return base64encoded;
    }