Getting access tokens using the authorization code grant with PKCE

Instructions for getting access tokens using the authorization code grant flow with PKCE.

Login as admin in Swagger UI

  1. Go to https://localhost:8443/api/swagger/default.

  2. Select Authorize.

  3. Enter the following values in the form:

    Key Value
    client_id admin-swagger
    client_secret n8HF35qzZkmsukHJzzz9LnN8m9Mf97uq
  4. Select Authorize.

  5. Select Close.

Create a client

  1. Select POST /api/admin/{tid}/clients API.

  2. Select Try it out.

  3. Enter default as tid (tenant ID).

  4. Use the following json as the body:

    {
        "authorization_server_id": "default",
        "client_id": "client-pkce",
        "client_name": "My app",
        "grant_types": [
            "authorization_code"
        ],
        "public": true,
        "redirect_uris": [
            "https://example.com/callback"
        ],
        "token_endpoint_auth_method": "none",
        "response_types": [
            "token",
            "id_token",
            "code"
        ],
        "scopes": [
        "email",
        "openid"
        ]
    }
    
  5. Select Execute.

Make the authorize request

  • Generate a random code_verifier string that is at least 43-character long but no longer than 128 characters.

    SyHPzEZGl18pR7L5z5qvEcgPdbL7h4mtJVb63Po4UAagzF8lhgAa5BYjWFSwPhpRmkNYPl9lbZKGl2VLh3ezJQsvgtCE8Wma
    
  • Calculate code_challange with the following formula:

    BASE64URL-ENCODE(SHA256(ASCII(code_verifier)))
    

    Note

    code_challange is a base64-url-encoded string of the SHA256 hash of code_verifier.

    SHA256 cannot be hex-encoded. If you test it with one of the online sha256 encoders, it can fail as they generate hex-encoded strings.

Sample

code_challenge generated from the provided code_verifier

G-o5Mtv_Ln-94juZnrqSbS2aBFkKLDpZhzoXFTuG7XM
  • Your application initializes a redirect in the browser to the following URL:

    https://localhost:8443/default/default/oauth2/authorize
    ?client_id=client-pkce
    &scope=openid
    &redirect_uri=https%3A%2F%2Fexample.com%2Fcallback
    &response_type=code
    &code_challenge_method=S256
    &code_challenge=G-o5Mtv_Ln-94juZnrqSbS2aBFkKLDpZhzoXFTuG7XM
    
  • The user authenticates and approves the access to the data on the consent page.

    Note

    To test the authentication, you can use the user:user credentials.

Exchange the authorization code

  • Once the user has granted the access to the application, the authorization server makes a redirect to the requested redirect_uri with the authorization code in the query parameter.

    https://example.com/callback
    ?code=cYegZcNgCgWz1Q-OmHfexwSzkJEaUwYdYObZB5Fm6a
    
  • Your application exchanges the authorization code for the access and ID tokens.

    curl -X POST -k https://localhost:8443/default/default/oauth2/token \
    -H "Content-type: application/x-www-form-urlencoded" \
    -d "grant_type=authorization_code&client_id=client-pkce&redirect_uri=https%3A%2F%2Fexample.com%2Fcallback&code=cYegZcNgCgWz1Q-OmHfexwSzkJEaUwYdYObZB5Fm6a&code_verifier=SyHPzEZGl18pR7L5z5qvEcgPdbL7h4mtJVb63Po4UAagzF8lhgAa5BYjWFSwPhpRmkNYPl9lbZKGl2VLh3ezJQsvgtCE8Wma"
    

Expected response

{
   "access_token": "..",
   "expires_in": 3600,
   "id_token": "..",
   "scope": "openid",
   "token_type": "bearer"
}