How to implement OpenID in Angular 4

Question

I'm building an application with Angular 4 that I want to integrate with Steam.

I'm currently trying to wrap my head around openID and how to use it to get a user's 64-bit Steam ID. This is going badly. I've found the TypeScript lib on openID's website and installed it to my app but steam says I need to set http://steamcommunity.com/openid as the provider.

Having looked thoroughly over the documentation for the Angular 4 OpenID lib I can't find "provider" anywhere D:

Then again, I'm not even sure I'm using the right library! (OpenID mentions "obsolete specifications such as OpenID 2" which I'm pretty sure is what Steam uses)

How can I proceed with this? Or is there a simpler API for accessing steam with OpenID?

Edit

Here's the code for the config, which is where I realised I didn't understand what I was doing anymore:

export class AppModule {
constructor(public oidcSecurityService: OidcSecurityService) {

    let openIDImplicitFlowConfiguration = new OpenIDImplicitFlowConfiguration();
    openIDImplicitFlowConfiguration.stsServer = 'https://localhost:44318';
    openIDImplicitFlowConfiguration.redirect_url = 'https://localhost:44311';
    openIDImplicitFlowConfiguration.client_id = 'angularclient';
    openIDImplicitFlowConfiguration.response_type = 'id_token token';
    openIDImplicitFlowConfiguration.scope = 'openid email profile';
    openIDImplicitFlowConfiguration.post_logout_redirect_uri = 'https://localhost:44311/Unauthorized';
    openIDImplicitFlowConfiguration.startup_route = '/home';
    openIDImplicitFlowConfiguration.forbidden_route = '/Forbidden';
    openIDImplicitFlowConfiguration.unauthorized_route = '/Unauthorized';
    openIDImplicitFlowConfiguration.log_console_warning_active = true;
    openIDImplicitFlowConfiguration.log_console_debug_active = false;
    openIDImplicitFlowConfiguration.max_id_token_iat_offset_allowed_in_seconds = 10;
    openIDImplicitFlowConfiguration.override_well_known_configuration = false;
    openIDImplicitFlowConfiguration.override_well_known_configuration_url = 'https://localhost:44386/wellknownconfiguration.json';
    // openIDImplicitFlowConfiguration.storage = localStorage;

    this.oidcSecurityService.setupModule(openIDImplicitFlowConfiguration);
}

Can you provide the code what you tried and what errors you got ? — Vamshi
– Vamshi, Commented Jul 19, 2017 at 3:34
I'll provide the code for the config, which is where I got stuck, from reading steam I thought there'd be a doLoginForProvider(provider) function (or something along those lines), but I got about 20 lines of config instead and no clear documentation (that I could see) to explain it :/ — Jamie McAllister
– Jamie McAllister, Commented Jul 19, 2017 at 10:29

JGFMK · Accepted Answer · 2017-07-19 15:13:07Z

3

+100

You aren't even putting the code in the correct file or against correct class app.component.ts i.e. AppComponent should contain that stuff.

You should download the zip or better still use Git and check it out from https://github.com/manfredsteyer/angular2-oauth-oidc-demo.git

answered Jul 19, 2017 at 15:13

JGFMK

8,9824 gold badges65 silver badges101 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Jamie McAllister Over a year ago

Thanks, I get how it works now....umm, is this backwards compatible to work with an openID 2 provider rather than OIDC?

Collectives™ on Stack Overflow

How to implement OpenID in Angular 4

Edit

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

Edit

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related