Forum Discussion
DevElijah
Jul 28, 2023Copper Contributor
Microsoft Graph toolkit Person component
Please, I need help with this. I am using the Person component of the Microsoft graph toolkit to render the profile picture of a user signing into my react application. It was displaying but stopped at some point without having any error and I didn't make changes to my code. This is my code snippet =>
const { instance, accounts } = useMsal();
const [graphData, setGraphData] = useState<any | null>(null);
function callMsGraph(accessToken: any) {
const headers = new Headers();
const bearer = `Bearer ${accessToken}`;
headers.append("Authorization", bearer);
const options = {
method: "GET",
headers: headers,
};
return fetch("https://graph.microsoft.com/v1.0/me", options)
.then((response) => response.json())
.catch((error) => console.log(error));
}
// Function to get and store a logged in user information using Microsoft Graph
useEffect(() => {
function RequestProfileData() {
// Silently acquires an access token which is then attached to a request for MS Graph data
instance
.acquireTokenSilent({
...loginRequest,
account: accounts[0],
})
.then((response) => {
console.log(
"access token from headers is",
response.accessToken
);
callMsGraph(response.accessToken).then((response) => {
setGraphData(response);
});
});
}
RequestProfileData();
}, [accounts, instance]);
<Person userId={graphData?.id} />
No RepliesBe the first to reply