1.10.1 • Published 4 years ago

nakawankuma-react-microsoft-login-1-10modify v1.10.1

Weekly downloads
3
License
ISC
Repository
github
Last release
4 years ago

react-microsoft-login

npm npm bundle size npm

React component for a simple login with Microsoft services, based on Official Microsoft Authentication Library for JavaScript.

DEMO HERE

🚀 Get started

  1. Install package:
    npm i react-microsoft-login
    # or
    yarn add react-microsoft-login
  2. Import and configure component:

    import React from "react";
    import MicrosoftLogin from "react-microsoft-login";
    
    export default (props) => {
      const authHandler = (err, data) => {
        console.log(err, data);
      };
    
      return (
        <MicrosoftLogin clientId={YOUR_CLIENT_ID} authCallback={authHandler} />
      );
    };
  3. YOUR_CLIENT_ID is the key which you need to generate for your Microsoft app. How to create Microsoft app? When finished, on the app Overview page, note down the Application (client) ID value.

📖 API

ParameterTypeDefaultDescription
clientIdstringrequiredApplication (client) ID
authCallbackfunctionrequiredCallback function which takes two arguments (error, authData)
graphScopesarray["user.read"]Array of Graph API permission names. More about Graph API permissions.
redirectUristringwindow.location.hrefThe redirect URI of the application, this should be same as the value in the application registration portal.
tenantUrlstringA URL indicating a directory that MSAL can request tokens from. More about MSAL tenant auth.
promptenum("login", "select_account", "consent", "none")Specify custom prompt behavior
buttonThemeenum("dark_short", "light_short", "dark", "light")"light"Theme for button style that based on Official Microsoft brand design.
withUserDatabooleanBoolean flag to make an additional request to GraphAPI to get user data.
forceRedirectStrategybooleanBoolean flag to force redirect login strategy for all browsers. This strategy used by default just for IE browsers to avoid issues.
debugbooleanBoolean flag to enable detailed logs of authorization process.
classNamestringAdditional class name string.
childrenReactComponentAlternative way to provide custom button element as a children prop instead of Official Microsoft brand design

📝 License

MIT

1.10.1

4 years ago

1.10.0

4 years ago