How to use PKCE and codeChallengeMethod within Temporal UI

Community Support
1

Hi Team,

I am using a public client for Temporal Web UI Auth which is configured on Keycloak with below config:

ui:
    enabled: true
    image: temporalio/ui
    overrides:
      deployment:
        spec:
          template:
            spec:
              containers:
              - env:
                - name: TEMPORAL_UI_PUBLIC_PATH
                  value: /api/temporal
                - name: TEMPORAL_AUTH_ENABLED
                  value: "true"
                - name: TEMPORAL_AUTH_TYPE
                  value: oidc
                - name: TEMPORAL_AUTH_PROVIDER_URL
                  value: https://myapp.domain.com/auth/realms/default
                - name: TEMPORAL_AUTH_ISSUER_URL
                  value: https://myapp.domain.com/auth/realms/default
                - name: TEMPORAL_AUTH_CLIENT_ID
                  value: api-frontend
                - name: TEMPORAL_AUTH_CALLBACK_URL
                  value: https://myapp.domain.com/api/temporal/auth/sso/callback
                - name: TEMPORAL_AUTH_SCOPES
                  value: openid,profile,email,temporal-read-permission-scope
                - name: TEMPORAL_AUTH_OPTIONS
                  value: '{"usePKCE": true, "codeChallengeMethod": "S256"}'
                - name: TEMPORAL_SHOW_TEMPORAL_SYSTEM_NAMESPACE
                  value: "true"
                name: ui

But whenever I hit myapp.domain.com/api/temporal, it fails with below error:

{"message":"Unable to exchange token: oauth2: \"invalid_grant\" \"Code not valid\""}

Within payload we see:

error                       invalid_request
error_description           Missing parameter: code_challenge_method
state                       0k6FGh7loPAsDE2O7Q1G-g

My client is enabled with:

Proof Key for Code Exchange Code Challenge Method: S256
2

It appears that the Temporal UI server does not natively support PKCE-based OIDC authentication flows. To address this, we introduced an OAuth2 Proxy between the client and the Temporal UI server. This proxy handles the complete authentication and authorization process using Keycloak, including support for PKCE. We delegated authentication responsibilities to the proxy and defined appropriate claim-based access controls for Temporal within Keycloak. This setup successfully resolved the issue.

"permissions": [
    "temporal-system:read",
    "default:read",
    "default:write"
  ]