Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix auth MS Graph React sample #750

Merged
merged 10 commits into from
Apr 25, 2024
Merged

Fix auth MS Graph React sample #750

merged 10 commits into from
Apr 25, 2024

Conversation

davidchesnut
Copy link
Member

@davidchesnut davidchesnut commented Apr 4, 2024

Q A
Bug fix? yes
New feature? no
New sample? no
Related issues? #628 #629

What's in this Pull Request?

MSAL was old and sample wasn't completely working. I upgraded to MSAL browser 3.7.1 and fixed several issues.

Copy link
Collaborator

@AlexJerabek AlexJerabek left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Tested this out and it works fine! I left a few comment formatting suggestions. The biggest fixes are the file name correction and the node v20 note.

server: {
type: 'https',
options: {
cert: certPath + 'localhost.crt',
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

usually use path.resolve for paths

auth: {
clientId: 'YOUR APP ID HERE',
authority: 'https://login.microsoftonline.com/common',
redirectUri: 'https://localhost:3000/login/login.html' // Must be registered as "spa" type.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

${window.location.origin}/login/login.html will still work after publish to server

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed.

},
cache: {
cacheLocation: 'localStorage', // Needed to avoid a "login required" error.
storeAuthStateInCookie: true // Recommended to avoid certain IE/Edge issues.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

don't think this is still necessary

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed.

Office.context.ui.messageParent(JSON.stringify({ status: 'success', token: response.accessToken, userName: response.account.username}));
} else {
// A problem occurred, so invoke login.
pca.loginRedirect({
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

this is a Promise, may want to await it so that the catch block could work properly if error.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed.

},
cache: {
cacheLocation: 'localStorage', // Needed to avoid a "login required" error.
storeAuthStateInCookie: true // Recommended to avoid certain IE/Edge issues.
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I think you can remove this setting

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed.

displayError: (x: string) => void) => {
setToken: (x: string) => void,
setUserName: (x: string) => void,
displayError: (x: string) => void) => {

setState({ authStatus: 'loginInProcess' });

await Office.context.ui.displayDialogAsync(
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

displayDialogAsync does not return a promise, await here does not do anything.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed.


const processLoginMessage = (arg: {message: string, origin: string}) => {
const processLoginMessage = (arg: { message: string, origin: string }) => {

let messageFromDialog = JSON.parse(arg.message);
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

best to check origin == window.location.origin before trusting the message

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

added check and throws error if not correct.


// You can select which account application should sign out.
const logoutRequest = {
account: messageFromParent.userName,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

account property is AccountInfo, not a string. I don't think this will be used, it may even cause issues.

Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

fixed.

@davidchesnut davidchesnut merged commit 05f76e7 into main Apr 25, 2024
1 check passed
@davidchesnut davidchesnut deleted the davech-sec-updates branch April 25, 2024 23:45
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants