Integrating captcha into a .NET MAUI application

Integrating captcha into a .NET MAUI application

19 February 2023

.NET MAUI/Xamarin

Buy Me A Coffee

Hello and welcome to the most bot-resistant article in the world!

Today we are talking about captcha. Captcha is a security mechanism used to prevent automated programs or bots from accessing a website or application. It presents a challenge that is difficult for bots to solve but easy for humans to complete, thus ensuring that only human users can access the application.

Integrating a captcha in a .NET MAUI application is relatively easy and can be accomplished in a few simple steps. However there are multiple ways how it can be done, so in this article, we will look at two different approaches.

.NET for Android

If your target platform is Android, you can use the Google SafetyNet SDK to integrate a captcha in your application.

Register Google reCAPTCHA for your application

  1. Open Google reCAPTCHA website: https://www.google.com/recaptcha/admin/create

  2. Fill label and choose reCAPTCHA v2 type, then reCAPTCHA Android subtype.

Android reCAPTCHA setup

  1. Copy the Site key and Secret key to the clipboard.

Integrate Google reCAPTCHA in your application

The first step you need to do is add the Google SafetyNet SDK to your project.

Add the next code to your csproj file:

The second step is to add a code to call the Google reCAPTCHA popup:

Android SafetyNet

With this approach, you get an implementation provided by Google designed specifically for native applications.

It works with both .NET MAUI and .NET MAUI Blazor apps but only on Android.

.NET MAUI solution

If you want to use the same solution for all platforms or want to use another captcha provider, you can use the WebView.

Register a captcha for your website

There are several captcha providers available that you can use for your .NET MAUI application. Some of the most popular ones include Google reCAPTCHA and hCaptcha. Each provider has its own set of features, advantages, and disadvantages, so it's important to choose one that best suits your application's needs.

  1. Open Google reCAPTCHA website: https://www.google.com/recaptcha/admin/create

  2. Fill label and choose reCAPTCHA v2 type, then "I'm not a robot" Checkbox subtype.

.NET MAUI reCAPTCHA setup

  1. Add "0.0.0.0" to the list of domains.

  2. Copy the Site key and Secret key to the clipboard.

Integrate a captcha in your application

If your application is .NET MAUI Blazor, you can add the next code to your index.html. If you use .NET MAUI, you need to upload the next code to your website (most captcha providers do not allow to use of a captcha on localhost).

The next step is to add a WebView to your page and load the page with a captcha.

Here we subscribe to the UrlLoading event to get the captcha token.

The final step is to validate the captcha token.

Windows

Conclusion

Integrating a captcha in a .NET MAUI application can help enhance security by preventing bots from accessing the application. By following the steps outlined above, you can easily add a captcha to your .NET MAUI application and provide an extra layer of security for your users.

The full code can be found on GitHub.

Buy Me A Coffee

Related:

Drag and Drop any content to a .NET MAUI application

The article demonstrates how to add drop functionality to easily move content from the operating system to the .NET MAUI application.

Interactive app tutorial in .NET MAUI

Add interactive app tutorial in .NET MAUI using CommunityToolkit.Maui Popup.

An unhandled error has occurred. Reload

🗙