Windows Universal App C#

View on Github

Windows Universal App C#

Community maintained

This tutorial demonstrates how to add user login to a Windows Universal C# application using Auth0. We recommend you to Log in to follow this quickstart with examples configured for your account.

I want to explore a sample app

2 minutes

Get a sample configured with your account settings or check it on Github.

View on Github
System requirements: Microsoft Visual Studio 2017 | Windows 10 SDK (10.0.10586.0) | Auth0.OidcClient.UWP 1.0.0

New to Auth? Learn How Auth0 works, how it integrates with Native Applications and which protocol it uses.

Configure Auth0

Get Your Application Keys

When you signed up for Auth0, a new application was created for you, or you could have created a new one.

Your will need some details about that application to communicate with Auth0. You can get these details from the Application Settings section in the Auth0 dashboard.

You need the following information:

  • Client ID
  • Domain

If you download the sample from the top of this page these details are filled out for you.

If you have more than one application in your account, the sample comes with the values for your Default App.

App Dashboard

Configure Callback URLs

A callback URL is a URL in your application where Auth0 redirects the user after they have authenticated.

You need to whitelist the callback URL for your app in the Allowed Callback URLs field in your Application Settings. If you do not set any callback URL, your users will see a mismatch error when they log in.

For UWP applications, the callback URL needs to be in the format ms-app://SID, where SID is the Package SID for your application. Assuming you have associated your application with and application on the Windows Store, you can go to the Windows Developer Centre, go to the settings for your application, and then go to the App management > App identity section, where you will see the Package SID listed.

Alternatively - or if you have not associated your application with the Store yet - you can obtain the value by calling the Windows.Security.Authentication.Web.WebAuthenticationBroker.GetCurrentApplicationCallbackUri() method. So for example, in the OnLaunched method of your application, you can add the following line of code:

// App.xaml.cs

protected override void OnLaunched(LaunchActivatedEventArgs e)
{
#if DEBUG
    if (System.Diagnostics.Debugger.IsAttached)
    {
        System.Diagnostics.Debug.WriteLine(Windows.Security.Authentication.Web.WebAuthenticationBroker.GetCurrentApplicationCallbackUri());
    }
#endif

    // rest of code omitted for brevity
}

This will print out the callback URL to your Debug window in Visual Studio. This is a bit of a painful process to obtain this URL, but it is important to use this URL otherwise the authentication process will not function correctly.

Integrate Auth0 in your Application

Install Dependencies

Use the NuGet Package Manager Console (Tools -> NuGet Package Manager -> Package Manager Console) to install the Auth0.OidcClient.UWP package, running the command:

Install-Package Auth0.OidcClient.UWP

Trigger Authentication

To integrate Auth0 login into your application, simply instantiate an instance of the Auth0Client class, configuring the Auth0 Domain and Client ID:

// MainPage.xaml.cs

using Auth0.OidcClient;

var client = new Auth0Client(new Auth0ClientOptions
{
    Domain = "YOUR_AUTH0_DOMAIN",
    ClientId = "YOUR_CLIENT_ID"
});

You can then call the LoginAsync method to log the user in:

var loginResult = await client.LoginAsync();

This will load the Auth0 login page into a web view. You can learn how to customize the login page in this document.

Handle Authentication Tokens

The returned login result will indicate whether authentication was successful, and if so contain the tokens and claims of the user.

Authentication Error

You can check the IsError property of the result to see whether the login has failed. The ErrorMessage will contain more information regarding the error which occurred.

// MainPage.xaml.cs

var loginResult = await client.LoginAsync();

if (loginResult.IsError)
{
    Debug.WriteLine($"An error occurred during login: {loginResult.Error}")
}

Accessing the tokens

On successful login, the login result will contain the ID Token and Access Token in the IdentityToken and AccessToken properties respectively.

// MainPage.xaml.cs

var loginResult = await client.LoginAsync();

if (!loginResult.IsError)
{
    Debug.WriteLine($"id_token: {loginResult.IdentityToken}");
    Debug.WriteLine($"access_token: {loginResult.AccessToken}");
}

Obtaining the User Information

On successful login, the login result will contain the user information in the User property, which is a ClaimsPrincipal.

To obtain information about the user, you can query the claims. You can for example obtain the user's name and email address from the name and email claims:

// MainPage.xaml.cs

if (!loginResult.IsError)
{
    Debug.WriteLine($"name: {loginResult.User.FindFirst(c => c.Type == "name")?.Value}");
    Debug.WriteLine($"email: {loginResult.User.FindFirst(c => c.Type == "email")?.Value}");
}

The exact claims returned will depend on the scopes that were requested. For more information see @scopes.

You can obtain a list of all the claims contained in the ID Token by iterating through the Claims collection:

// MainPage.xaml.cs

if (!loginResult.IsError)
{
    foreach (var claim in loginResult.User.Claims)
    {
        Debug.WriteLine($"{claim.Type} = {claim.Value}");
    }
}
Use Auth0 for FREE