Javascript SDK OktaAuth How to include client secret

I’m using okta javascript sdk to implement a login button for okta. It returns a invalid_client error from the line “authClient.token.parseFromUrl()”. My code is as follows.

<script>
    let authClient = new OktaAuth({
        url: <included>,
        clientId: <included>,
        redirectUri : <included>,
        issuer: <included>
    });

    if (authClient.isLoginRedirect()) {
      authClient.token.parseFromUrl()
        .then(data => {
          const { idToken } = data.tokens;
        });
    }
    function octaSignIn(){
          authClient.tokenManager.get('idToken')
            .then(idToken => {
              if (idToken) {
              } else {
                authClient.token.getWithRedirect({
                  responseType: 'id_token'
                });
              }
            })
    }
</script>

Error message I'm getting ( status 401 )
{ 
"error" : "invalid_client",
"error_description" : "Client authentication failed. Either the client or the client credentials are invalid."
}

The request related to the error is a POST request to “…/oauth2/default/v1/token”. This endpoint requires client id and secret as basic authentication. But I couldn’t find any documentation on how to add those to the configuration.

What is the correct way of adding the client id and the client secret so that they are included in the request?

If this is a front end application, you should NOT be using Client Secret auth as that would involve exposing the secret client side!

Can you try creating a SPA in Okta (new OpenID Application, type SPA instead of Web), which will use PKCE auth, and see if that works instead? PKCE auth is intended to be used to get tokens with auth code flow without a backend to protect a secret.