Is keeping Pendo Api key in client-code secure?

[gambheera]

We are developing an Angular application with Pendo integration. But according to the documentation we have to keep api key in our client code. But our security team is pointing out this as a huge vulnerability. What is the solution for this?

[damingerdai]

try Configure environment-specific defaults](https://angular.dev/tools/cli/environments#configure-environment-specific-defaults)

[yociduo]

He might want to save the pendo key in the server side and using a api call to get it.

[yociduo]

import {
  IPendoSettings,
  NGX_PENDO_SETTINGS_TOKEN,
  NGX_PENDO_WINDOW,
  NgxPendoModule,
  PendoWindow,
  pendoInitializer
} from 'ngx-pendo';

export function overridePendoInitializer(
  httpClient: HttpClient,
  $settings: IPendoSettings,
  window: PendoWindow
): () => Observable<void> {
  return () => {
    // You can use http client to make a api call
    return of('pendo-api-key').pipe(
      delay(1000),
      switchMap(pendoApiKey => from(pendoInitializer({ ...$settings, pendoApiKey }, window)()))
    );
  };
}

@NgModule({
  ...
  imports: [
    ...
    NgxPendoModule.forRoot({
      pendoApiKey: '', // leave it empty string, if have any value it will initialize pendo.
      pendoIdFormatter: kebabCase
    })
  ],
  providers: [
    {
      provide: APP_INITIALIZER,
      multi: true,
      useFactory: overridePendoInitializer,
      deps: [HttpClient, NGX_PENDO_SETTINGS_TOKEN, NGX_PENDO_WINDOW]
    }
  ],
  ...
})
export class AppModule {}