I’m trying to auth into my microsoft account with MSAL.
So this is my msalConfig :
export const msalConfig = {
auth: {
clientId: "xxx",
authority: "https://login.microsoftonline.com/xxx",
redirectUri: "http://localhost:3000",
},
cache: {
cacheLocation: "sessionStorage", // This configures where your cache will be stored
storeAuthStateInCookie: false, // Set this to "true" if you are having issues on IE11 or Edge
},
};
// Add scopes here for ID token to be used at Microsoft identity platform endpoints.
export const loginRequest = {
scopes: ["User.Read"],
};
// Add the endpoints here for Microsoft Graph API services you'd like to use.
export const graphConfig = {
graphMeEndpoint: "https://graph.microsoft.com/v2.0/me",
};
Here my graph file :
import { graphConfig } from "./authConfig";
/**
* Attaches a given access token to a Microsoft Graph API call. Returns information about the user
*/
export async function callMsGraph(accessToken) {
const headers = new Headers();
const bearer = `Bearer ${accessToken}`;
headers.append("Authorization", bearer);
const options = {
method: "GET",
headers: headers
};
return fetch(graphConfig.graphMeEndpoint, options)
.then(response => response.json())
.catch(error => console.log(error));
}
And here my request function
function RequestProfileData() {
const request = {
...loginRequest,
account: accounts[0],
};
// Silently acquires an access token which is then attached to a request for Microsoft Graph data
instance.acquireTokenSilent(request).then((response) => {
callMsGraph(response.accessToken).then(response => setGraphData(response));
}).catch((e) => {
instance.acquireTokenPopup(request).then((response) => {
callMsGraph(response.accessToken).then(response => setGraphData(response));
});
});
}
return (
<>
<h5 className="card-title">Welcome {name}</h5>
{graphData ?
<ProfileData graphData={graphData} />
:
<Button variant="secondary" onClick={RequestProfileData}>Request Profile Information</Button>
}
</>
);
};
But when I’m trying to log, i get a bad request
POST https://login.microsoftonline.com/xxxxxx/oauth2/v2.0/token 400 (Bad Request) - Msal - Microsoft graph
Does someone know why ?
I’ve seen that i maybe need to add “grand_type: authorization_code”.
But i don’t really know where to add it ( in my requestProfileData > request ? )
Thank you
