Custom OAuth authentication

Custom Angular project with added c8y libraries

customer license

I’m trying to implement custom authentication with oAuth, but im currently unable to do that.

I’ve tried using Login service or login component, but the do not seem to work.
Is there a link to some docs (i personally have not found) or example on how or with what it could be/should be implemented ?

We basically want to be able to log in with current existing credentials using OAuth

Hi Alisa,

we have as far as I know no code snippet in any repository for you usecase.
The few customers that create their own angular based frontend usually only use the @c8y/client library and not the @c8y/ngx-components. The @c8y/client library does not handle the login process for OAuth.

In case you want to proceed with the @c8y/ngx-components, maybe the following code snippets help you:

constructor(private loginService: LoginService, private ui: AppStateService) {}

  async login(): Promise<void> {
    // check what kind of loginOptions the tenant has
    await this.ui.refreshLoginOptions();
    this.loginService.initLoginOptions();

    // check if we are already logged in via existing cookie
    try {
      await this.loginService.login();
      return;
    } catch {
      // proceed with actual login
    }

    const credentials: ICredentials = {
      user: 'userId',
      password: 'password',
    };
    const auth = this.loginService.useBasicAuth(credentials);

    // will automatically switch to OAuth if possible
    await this.loginService.login(auth, credentials);
  }

Ensure that you import the following modules:

    CommonModule.forRoot(),
    LoginModule.forRoot()

And make sure that your proxy config is going to rewrite the cookie domain to your local domain during development as otherwise the OAuth cookie is requested, but can’t be used locally:

"cookieDomainRewrite": "localhost"

Regards,
Tristan

2 Likes

Everything works! Thank you a lot for the solution!