mvertopoulos / vue-msal

Vue plugin for using Microsoft Authentication Library (MSAL)
MIT License
123 stars 66 forks source link

acquireToken returns v1 token #7

Open mihaiserban opened 4 years ago

mihaiserban commented 4 years ago

not sure if it's related to this library. basically after login, the access token is a v2 token.

after calling acquireToken manually, the response contains a v1 token.

https://github.com/AzureAD/microsoft-authentication-library-for-js/issues/1040

mvertopoulos commented 4 years ago

Are you using different request scopes when acquiring a token manually?

The original request scope (used on login) is set in the request options. You can set a different request scope when calling acquireToken manually by passing it as a function argument.

If you have different scopes for these two calls then the two tokens would not match.

Regarding the difference in versions, quoting this line from the relevant section of the official documentation, should answer your question:

However the v2.0 endpoints (used by MSAL) emits the version of the token that the Web API accepts. A property of the application manifest of the Web API enables developers to choose which version of token is accepted.

mihaiserban commented 4 years ago

Thanks @mvertopoulos for the quick reply. I'm using the default ["user.read"], this is why it's confusing to me. I've also set accessTokenAcceptedVersion: 2 in the application manifest. With this change in the manifest I managed to get a v2 token in the initial login.

But any acquireToken calls witht he same scopes as the initial login, return a v1 token

mvertopoulos commented 4 years ago

I am reopening this issue to do some further research and I will get back to you.

mihaiserban commented 4 years ago

i've created a new scope for my frontend application to use. and it seems to work now. the issued token for this new scope is a v2 token.

I'm not entirely sure how the tokens are issued. According to the issue from msal, a access token is issued for each resource. ''user.read", "openid", "profile" scopes are for MS Graph, and that seems to be v1 token. Correct me if i'm wrong.

superlazycoder commented 4 years ago

msal gives a token that can be validated. msGraph gives a token that cannot. msGraph requires the token that cannot be validated to obtain any graph data.

If you call acquireToken( {scopes: [ clientId] } ) you will get a token that can be validated, This is the token that I use for my website's api. This is the token that I needed this entire time.

However if you call acquireToken( {scopes: [ "user.read' ] } ) which is the default refreshed token, you get a token that works for msgraph, but wont work for asp.net authentication.

My issues became that I was unable to authenticate to my api for more than an hour, and was quite frustrating...

My solution was as follows.

 Vue.mixin({
      computed: {
        graphToken() {
          return this.$msal.data.accessToken;
        },
        idToken() {
          return localStorage.getItem("msal.idtoken");
        }
      },
      methods: {
        async refreshToken() {
          await this.$msal.acquireToken({ scopes: ["862f092f-...-9c0b3868518a"] })
          await this.$msal.acquireToken();
        }
      }

    });

I would have used lib.store to get my msal.idtoken, but the developer saw fit to hide everything from access...

This solution works for me to use idToken for my personal api calls, and $msal.msGraph calls still function.