How to get access token in Angular on same trip to IdentityServer - MVC, WebApi with Angular

Question

My Layout

IdentityServer project:

MVC client (Implicit workflow)
API client (Client Credentials workflow)

WebApi project:

Business logic and DB access
Requesting only an "api" scope

MVC project:

Requesting "openid profile roles api" scopes
Requesting "id_token token"
Angular app accessing secure API (currently access token is not added to header)

What I'm doing

My MVC is getting secured correctly and ResourceAuthorize() works as expected. I'm currently in the process of making my Angular app adding the bearer token to our API calls.

My doubts

When accessing the MVC, the user is redirected to the IdSrv, gets logged in, then redirected back to MVC. At this point, my Angular app gets loaded for the first time, and obviously I don't have or need the username and password.

The access token has already been issued, but I can't get my head around how/when to provide it to the Angular app.

My Ideas

Inject it to my layout page using razor.
Switch MVC to authorization code workflow and make a second trip to IdServ requesting an access token [hmm but wait... how do I get the authorization code into angular? I guess I stayed with the same issue..??]
Make Angular use client credentials workflow, assuming if I got to the angular app, the user has authenticated [but than I have a security breach right?]

Please point me in the right direction. I can't seem to find which of the samples does something similar to what I need.

Thanks in advance, Shy.

Shy Agam · Accepted Answer · 2016-11-08 13:42:41Z

2

Ended up injecting the token along with user data using Razor, then fetching it with angular through window.user.

<script>
    window.user = @Html.JsonRaw(ViewBag.User as ClientSideIdentity);
</script>

public class ClientSideIdentity
{
    public string id { get; set; }
    public string username { get; set; }
    public string displayName { get; set; }
    public Dictionary<string, string> claims { get; set; }
    public string[] roles { get; set; }
}

answered Nov 8, 2016 at 13:42

Shy Agam

1,4551 gold badge18 silver badges40 bronze badges

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

Comments

GlennSills · Accepted Answer · 2016-11-08 14:25:56Z

0

You should check out the oidc-client.js package. The UserManager object provided with this packages gives you access to the id and access tokens associated with the authenticated user.

answered Nov 8, 2016 at 14:25

GlennSills

4,22728 silver badges30 bronze badges

Collectives™ on Stack Overflow

How to get access token in Angular on same trip to IdentityServer - MVC, WebApi with Angular

My Layout

What I'm doing

My doubts

My Ideas

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

My Layout

What I'm doing

My doubts

My Ideas

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related