Sign up for an{" "}
Auth0 account
{" "}
or{" "}
console.log("log in")}>
log in
{" "}
to your existing account to integrate directly with your own tenant.
;
};
export const sections = [{
id: "configure-auth0",
title: "Configure Auth0"
}, {
id: "install-the-auth0-sdk",
title: "Install the Auth0 SDK"
}, {
id: "platform-specific-configuration",
title: "Platform specific configuration"
}, {
id: "instantiate-the-auth0client",
title: "Instantiate the Auth0Client"
}, {
id: "add-login-to-your-application",
title: "Add login to your application"
}, {
id: "add-logout-to-your-application",
title: "Add logout to your application"
}, {
id: "show-user-profile-information",
title: "Show user profile information"
}];
Auth0 allows you to add authentication to almost any application type quickly. This guide demonstrates how to
integrate Auth0, add authentication, and display user profile information in any .NET MAUI application using the
Auth0 SDKs for [MAUI](https://www.nuget.org/packages/Auth0.OidcClient.MAUI/).
The MAUI SDK supports Android, iOS, macOS, and Windows. Continue reading for platform-specific
configuration.
To use Auth0 services, you’ll need to have an application set up in the Auth0 Dashboard. The Auth0 application is
where you will configure how you want authentication to work for the project you are developing.
### Configure an application
Use the interactive selector to create a new Auth0 application or select an existing application that represents
the project you want to integrate with. Every application in Auth0 is assigned an alphanumeric, unique client ID
that your application code will use to call Auth0 APIs through the SDK.
Any settings you configure using this quickstart will automatically update for your Application in the [Dashboard](https://manage.auth0.com/#/), which is where you
can manage your Applications in the future.
If you would rather explore a complete configuration, you can view a sample application instead.
### Configure Callback URLs
A callback URL is a URL in your application that you would like Auth0 to redirect users to after they have
authenticated. If not set, users will not be returned to your application after they log in.
If you are following along with our sample project, set this to `myapp://callback`.
### Configure Logout URLs
A logout URL is a URL in your application that you would like Auth0 to redirect users to after they have logged
out. If not set, users will not be able to log out from your application and will receive an error.
If you are following along with our sample project, set this to `myapp://callback`.
Auth0 provides a [MAUI](https://www.nuget.org/packages/Auth0.OidcClient.MAUI/) SDK to simplify the process of implementing Auth0 authentication in MAUI
applications.
Use the NuGet Package Manager (Tools -> Library Package Manager -> Package Manager Console) to install the
`Auth0.OidcClient.MAUI` package.
Alternatively, you can use the NuGet Package Manager Console (`Install-Package`) or the
`dotnet` CLI (`dotnet add`).
```
Install-Package Auth0.OidcClient.MAUI
```
```
dotnet add package Auth0.OidcClient.MAUI
```
You need some platform-specific configuration to use the SDK with Android and Windows.
### Android
Create a new Activity that extends `WebAuthenticatorCallbackActivity`:
```cs lines
[Activity(NoHistory = true, LaunchMode = LaunchMode.SingleTop, Exported = true)]
[IntentFilter(new[] { Intent.ActionView },
Categories = new[] { Intent.CategoryDefault, Intent.CategoryBrowsable },
DataScheme = CALLBACK_SCHEME)]
public class WebAuthenticatorActivity : Microsoft.Maui.Authentication.WebAuthenticatorCallbackActivity
{
const string CALLBACK_SCHEME = "myapp";
}
```
The above activity will ensure the application can handle the `myapp://callback` URL when Auth0
redirects back to the Android application after logging in.
### Windows
To make sure it can properly reactivate your application after being redirected back to Auth0, you need to do two
things:
* Add the corresponding protocol to the `Package.appxmanifest`. In this case, this is set to
`myapp`, but you can change this to whatever you like (ensure to update all relevant Auth0 URLs as
well).
```xml lines
```
* Call `Activator.Default.CheckRedirectionActivation()` in the Windows-specific
`App.xaml.cs` file.
```cs lines
public App()
{
if (Auth0.OidcClient.Platforms.Windows.Activator.Default.CheckRedirectionActivation())
return;
this.InitializeComponent();
}
```
To integrate Auth0 into your application, instantiate an instance of the `Auth0Client` class, passing
an instance of `Auth0ClientOptions` that contains your Auth0 Domain, Client ID and the required Scopes.
Additionally, you also need to configure the `RedirectUri` and `PostLogoutRedirectUri` to
ensure Auth0 can redirect back to the application using the URL(s) configured.
```cs lines
using Auth0.OidcClient;
var client = new Auth0Client(new Auth0ClientOptions {
Domain = "dev-gja8kxz4ndtex3rq.us.auth0.com",
ClientId = "mz9iNEIo2PHu7oeh8QRt19ndTyyCIgai",
RedirectUri = "myapp://callback",
PostLogoutRedirectUri = "myapp://callback",
Scope = "openid profile email"
});
```
By default, the SDK will leverage Chrome Custom Tabs for Android, ASWebAuthenticationSession for iOS and macOS
and use your system's default browser on Windows.
##### Checkpoint
Your `Auth0Client` should now be properly instantiated. Run your application to verify that:
* The `Auth0Client`is instantiated correctly in the `MainPage`.
* Your application is not throwing any errors related to Auth0.
Now that you have configured your Auth0 Application and the Auth0 SDK, you need to set up login for your project.
To do this, you will use the SDK’s `LoginAsync()` method to create a login button that redirects users
to the Auth0 Universal Login page.
```cs lines
var loginResult = await client.LoginAsync();
```
If there isn't any error, you can access the `User`, `IdentityToken`,
`AccessToken` and `RefreshToken` on the `LoginResult` returned from
`LoginAsync()`.
##### Checkpoint
You should now be able to log in or sign up using a username and password.
Click the login button and verify that:
* Your application redirects you to the Auth0 Universal Login page.
* You can log in or sign up.
* Auth0 redirects you to your application.
Users who log in to your project will also need a way to log out. Create a logout button using the SDK’s
`LogoutAsync()` method. When users log out, they will be redirected to your Auth0 logout endpoint,
which will then immediately redirect them back to the logout URL you set up earlier in this quickstart.
```cs lines
await client.LogoutAsync();
```
##### Checkpoint
Run your application and click the logout button, verify that:
* Your application redirects you to the address you specified as one of the Allowed Logout URLs in your
Application Settings.
* You are no longer logged in to your application.
Now that your users can log in and log out, you will likely want to be able to retrieve the [profile information](https://auth0.com/docs/users/concepts/overview-user-profile)
associated with authenticated users. For example, you may want to be able to display a logged-in user’s name or
profile picture in your project.
The Auth0 SDK for MAUI provides user information through the `LoginResult.User` property.
## Next Steps
Excellent work! If you made it this far, you should now have login, logout, and user profile information running in your application.
This concludes our quickstart tutorial, but there is so much more to explore. To learn more about what you can do with Auth0, check out:
* [Auth0 Dashboard](https://manage.auth0.com/dashboard/us/dev-gja8kxz4ndtex3rq) - Learn how to configure and manage your Auth0 tenant and applications
* [auth0-oidc-client-net SDK](https://github.com/auth0/auth0-oidc-client-net) - Explore the SDK used in this tutorial more fully
* [Auth0 Marketplace](https://marketplace.auth0.com/) - Discover integrations you can enable to extend Auth0’s functionality
```cs MainPage.xaml.cs lines highlight={3-10}
public partial class MainPage : ContentPage
{
Auth0Client client = new Auth0Client(new Auth0ClientOptions
{
Domain = "dev-gja8kxz4ndtex3rq.us.auth0.com"
ClientId = "mz9iNEIo2PHu7oeh8QRt19ndTyyCIgai",
RedirectUri = "myapp://callback",
PostLogoutRedirectUri = "myapp://callback",
Scope = "openid profile email"
});
public MainPage()
{
InitializeComponent();
}
private async void OnLoginClicked(object sender, EventArgs e)
{
var extraParameters = new Dictionary();
var audience = ""; // FILL WITH AUDIENCE AS NEEDED
if (!string.IsNullOrEmpty(audience))
extraParameters.Add("audience", audience);
var result = await client.LoginAsync(extraParameters);
DisplayResult(result);
}
private async void OnLogoutClicked(object sender, EventArgs e)
{
BrowserResultType browserResult = await client.LogoutAsync();
if (browserResult != BrowserResultType.Success)
{
ErrorLabel.Text = browserResult.ToString();
return;
}
LogoutBtn.IsVisible = false;
LoginBtn.IsVisible = true;
HelloLabel.Text = $"Hello, World!";
ErrorLabel.Text = "";
}
private void DisplayResult(LoginResult loginResult)
{
if (loginResult.IsError)
{
ErrorLabel.Text = loginResult.Error;
return;
}
var user = loginResult.User;
var name = user.FindFirst(c => c.Type == "name")?.Value;
var email = user.FindFirst(c => c.Type == "email")?.Value;
var picture = user.FindFirst(c => c.Type == "picture")?.Value;
LogoutBtn.IsVisible = true;
LoginBtn.IsVisible = false;
HelloLabel.Text = $"Hello, {loginResult.User.Identity.Name}";
ErrorLabel.Text = "";
}
}
```
```cs MainPage.xaml.cs lines highlight={25}
public partial class MainPage : ContentPage
{
Auth0Client client = new Auth0Client(new Auth0ClientOptions
{
Domain = "dev-gja8kxz4ndtex3rq.us.auth0.com"
ClientId = "mz9iNEIo2PHu7oeh8QRt19ndTyyCIgai",
RedirectUri = "myapp://callback",
PostLogoutRedirectUri = "myapp://callback",
Scope = "openid profile email"
});
public MainPage()
{
InitializeComponent();
}
private async void OnLoginClicked(object sender, EventArgs e)
{
var extraParameters = new Dictionary();
var audience = ""; // FILL WITH AUDIENCE AS NEEDED
if (!string.IsNullOrEmpty(audience))
extraParameters.Add("audience", audience);
var result = await client.LoginAsync(extraParameters);
DisplayResult(result);
}
private async void OnLogoutClicked(object sender, EventArgs e)
{
BrowserResultType browserResult = await client.LogoutAsync();
if (browserResult != BrowserResultType.Success)
{
ErrorLabel.Text = browserResult.ToString();
return;
}
LogoutBtn.IsVisible = false;
LoginBtn.IsVisible = true;
HelloLabel.Text = $"Hello, World!";
ErrorLabel.Text = "";
}
private void DisplayResult(LoginResult loginResult)
{
if (loginResult.IsError)
{
ErrorLabel.Text = loginResult.Error;
return;
}
var user = loginResult.User;
var name = user.FindFirst(c => c.Type == "name")?.Value;
var email = user.FindFirst(c => c.Type == "email")?.Value;
var picture = user.FindFirst(c => c.Type == "picture")?.Value;
LogoutBtn.IsVisible = true;
LoginBtn.IsVisible = false;
HelloLabel.Text = $"Hello, {loginResult.User.Identity.Name}";
ErrorLabel.Text = "";
}
}
```
```cs MainPage.xaml.cs lines highlight={32}
public partial class MainPage : ContentPage
{
Auth0Client client = new Auth0Client(new Auth0ClientOptions
{
Domain = "dev-gja8kxz4ndtex3rq.us.auth0.com"
ClientId = "mz9iNEIo2PHu7oeh8QRt19ndTyyCIgai",
RedirectUri = "myapp://callback",
PostLogoutRedirectUri = "myapp://callback",
Scope = "openid profile email"
});
public MainPage()
{
InitializeComponent();
}
private async void OnLoginClicked(object sender, EventArgs e)
{
var extraParameters = new Dictionary();
var audience = ""; // FILL WITH AUDIENCE AS NEEDED
if (!string.IsNullOrEmpty(audience))
extraParameters.Add("audience", audience);
var result = await client.LoginAsync(extraParameters);
DisplayResult(result);
}
private async void OnLogoutClicked(object sender, EventArgs e)
{
BrowserResultType browserResult = await client.LogoutAsync();
if (browserResult != BrowserResultType.Success)
{
ErrorLabel.Text = browserResult.ToString();
return;
}
LogoutBtn.IsVisible = false;
LoginBtn.IsVisible = true;
HelloLabel.Text = $"Hello, World!";
ErrorLabel.Text = "";
}
private void DisplayResult(LoginResult loginResult)
{
if (loginResult.IsError)
{
ErrorLabel.Text = loginResult.Error;
return;
}
var user = loginResult.User;
var name = user.FindFirst(c => c.Type == "name")?.Value;
var email = user.FindFirst(c => c.Type == "email")?.Value;
var picture = user.FindFirst(c => c.Type == "picture")?.Value;
LogoutBtn.IsVisible = true;
LoginBtn.IsVisible = false;
HelloLabel.Text = $"Hello, {loginResult.User.Identity.Name}";
ErrorLabel.Text = "";
}
}
```
```cs MainPage.xaml.cs lines highlight={55-58}
public partial class MainPage : ContentPage
{
Auth0Client client = new Auth0Client(new Auth0ClientOptions
{
Domain = "dev-gja8kxz4ndtex3rq.us.auth0.com"
ClientId = "mz9iNEIo2PHu7oeh8QRt19ndTyyCIgai",
RedirectUri = "myapp://callback",
PostLogoutRedirectUri = "myapp://callback",
Scope = "openid profile email"
});
public MainPage()
{
InitializeComponent();
}
private async void OnLoginClicked(object sender, EventArgs e)
{
var extraParameters = new Dictionary();
var audience = ""; // FILL WITH AUDIENCE AS NEEDED
if (!string.IsNullOrEmpty(audience))
extraParameters.Add("audience", audience);
var result = await client.LoginAsync(extraParameters);
DisplayResult(result);
}
private async void OnLogoutClicked(object sender, EventArgs e)
{
BrowserResultType browserResult = await client.LogoutAsync();
if (browserResult != BrowserResultType.Success)
{
ErrorLabel.Text = browserResult.ToString();
return;
}
LogoutBtn.IsVisible = false;
LoginBtn.IsVisible = true;
HelloLabel.Text = $"Hello, World!";
ErrorLabel.Text = "";
}
private void DisplayResult(LoginResult loginResult)
{
if (loginResult.IsError)
{
ErrorLabel.Text = loginResult.Error;
return;
}
var user = loginResult.User;
var name = user.FindFirst(c => c.Type == "name")?.Value;
var email = user.FindFirst(c => c.Type == "email")?.Value;
var picture = user.FindFirst(c => c.Type == "picture")?.Value;
LogoutBtn.IsVisible = true;
LoginBtn.IsVisible = false;
HelloLabel.Text = $"Hello, {loginResult.User.Identity.Name}";
ErrorLabel.Text = "";
}
}
```
Sign up for an{" "}
Auth0 account
{" "}
or{" "}
console.log("log in")}>
log in
{" "}
to your existing account to integrate directly with your own tenant.