Login with Microsoft in Flutter Application

Developing the feature that allows a Microsoft account login in a Flutter app involves integrating Microsoft’s identity service using OAuth 2.0 authentication.

Add Dependencies in Flutter

Inside the Flutter application, add the package “flutter_appauth: ^6.0.2” which helps configure Microsoft login.

Azure Setup

1. Navigate to the Azure portal and, within app registrations, create a new app.
2. Retrieve crucial details such as application ID, client secret (password), and tenant ID.

Platform configuration in Azure

Inside your application in Azure:

1. Go to Authentication.
2. Add the Android platform and configure details like package name and SHA-1 key.

Flutter Configuration

After Azure configuration setup, call the method _loginWithMicrosoft, which is given below:

 Future<void> _loginWithMicrosoft(BuildContext context) async {
    final AuthorizationTokenResponse? result =
        await appAuth.authorizeAndExchangeCode(
      AuthorizationTokenRequest(
        scopes: _scopes,
        'f0788450-4dc9-4a29-946a-063789c2c762', // application id
        'https://hrmsprodapp.azurewebsites.net',// redirect uri
        serviceConfiguration: const AuthorizationServiceConfiguration(
          authorizationEndpoint:
              'https://login.microsoftonline.com/9f01d40c-8ea1-43c5-835f-f919fadeace0/oauth2/v2.0/authorize',
          tokenEndpoint:
              'https://login.microsoftonline.com/9f01d40c-8ea1-43c5-835f-f919fadeace0/oauth2/v2.0/token',
        ),
      ),
    );

Call this method inside the onTap function of your login button.

    body: Center(
        child: ElevatedButton(
          onPressed: () => _loginWithMicrosoft(context),
          child: Text('Login with Microsoft'),
      )

Handle Authentication Result

Upon successful completion of the method, retrieve the authentication token from the response.

Conclusion

This third-party integration utilizing the “flutter_appauth” package simplifies Microsoft account login in your Flutter app. Follow these steps for a hassle-free setup.