[SOLVED] Are there security rist if my okta credentials are exposed in frontend?

Are there security rist if my okta credentials are exposed in frontend?

I am trying to implement Okta in my app. All tutorials I saw online (even on the docs) has the config in the front-end. Sample config below:

const oktaConfig = {
  issuer: process.env.NEXT_PUBLIC_OKTA_ISSUER,
  clientId: process.env.NEXT_PUBLIC_OKTA_CLIENT_ID,
  redirectUri: 'http://localhost:3000/login',
  responseMode: 'query',
  response_type: 'code',
  tokenManager: {
    storage: 'sessionStorage',
  },
};

This can be viewed by the user in their browser. I was wondering if this has any security issues? This is how I sign-in the users (we don't use okta's sign-in page):

const oktaClient = new OktaAuth(oktaConfig);
const oktaData = await oktaClient.signInWithCredentials({ username, password });

Any thoughts if it is bad if those issuerId and cliendId are exposed or is that normal?

Solution

The issuer and client ID are public information. I like to think of a client ID like a vehicle's license plate. It's just an identifier and doesn't contain any private information. Client secrets are the only thing you need to worry about. They should never be in any frontend code.