Microsoft Authentication Library (MSAL) loginPopup: Error The "provided request must include a 'client_secret' input parameter.|

user_14216439 0
Viewed 2947

I am trying to use MSAL to add SSO for my single page app, for the purpose of getting an Oauth2 token to be used for resolving a Microsoft SaaS subscription. I have configured my code based on this sample repo: https://github.com/Azure-Samples/ms-identity-javascript-v2. This uses MSAL 2.0, instead of 1.X versions.

Here is the relevant code snippet, ran on the /signup page:

var config = {
      auth: {
        clientId: <MY_CLIENT_ID>,
        authority: "https://login.microsoftonline.com/common",
        redirectUri: <APP_URL> + "/signup",
      },
      cache: {
        cacheLocation: "sessionStorage",
        storeAuthStateInCookie: false,
      }
    };
var msalInstance = new msal.PublicClientApplication(config);
msalInstance.loginPopup(["openid", "profile", "User.Read"]).then((response) => {
      console.log(response)
    }).catch(error => {
      console.error(error);
    });

Calling this code inside my application, I successfully log in using the popup window, but get the following error: ServerError: invalid_client: 70002 - [2020-09-03 16:55:35Z]: AADSTS70002: The provided request must include a 'client_secret' input parameter.

I can see the underlying network call is https://login.microsoftonline.com/common/oauth2/v2.0/token with the following form data:

client_id: <MY_CLIENT_ID>
redirect_uri: <APP_URL>/signup
scope: openid profile
code: <some value>
code_verifier: <some value>
grant_type: authorization_code
client_info: 1
client-request-id: <some value>

Based on the documentation here https://docs.microsoft.com/en-us/advertising/guides/authentication-oauth-identity-platform?view=bingads-13#request-accesstoken, this call should have a configurable client_secret parameter, which results in the error I am getting I believe.

I have the required client secret from my App on Azure Portal. My question is, how can I configure the client secret in my config object? I have not been able to find any examples online, as well I tried adding clientSecret as a key under auth inside my config blindly, this did not pass it to the login.microsoftonline.com call.

UPDATE

After a bit more digging around, I realized the underlying issue of my setup was that I was trying to use the authorization grant flow to request a token but needed to use the client credentials flow. After moving the token acquisition to the backend (and using the client secret there), and some more help in this followup thread I was able to get SSO and token acquisition working as expected.

microsoft-teams msal azure
3 Answers

Instead of creating Web create Single-page-application this will solve you problem. See the example below

enter image description here

user_45032990

We have debugged your sample and we are able to use it with out any issue. After testing we believe the issue is occurring sine your code is not able to call Signin() method in '/authPopup.js'.You will not face any issue if this method call happens in your index.html.

user_132502750

Instead of using MSAL directly, consider looking into using the new SSO capabilities inside Teams - it wraps a lot of this for you and makes it easier to use. Here's an overview and here is a working sample.

Regarding the sample, it's in node, and I'm working on a dotnet version of the same. It looks like you use node, so you should rather refer to the original, but I think I found a few bugs so you can look at the client-side script in my version if you run into any issues - see here.

user_86013720
Related