Test reCAPTCHA in a demo website

This document shows you how to deploy a demo website on Google Cloud, which is a sample website integrated with reCAPTCHA, to understand how reCAPTCHA works.

A demo website helps you do the following:

  • Understand your users' experience with reCAPTCHA.
  • Use as a reference to integrate reCAPTCHA in your own application.
  • Experiment with different frontend and backend approaches by editing the sample application source code.

You can deploy a demo website in one of the following languages: Java, Node.js, or Python.

For a Google Cloud project, you can deploy only one demo website at a time.

Before you begin

  1. In the Google Cloud console, on the project selector page, select or create a Google Cloud project.

    Go to project selector

  2. Enable the reCAPTCHA Enterprise API.

    Enable the API

  3. Make sure that you have the following role or roles on the project: reCAPTCHA Enterprise Admin, reCAPTCHA Enterprise Agent

    Check for the roles

    1. In the Google Cloud console, go to the IAM page.

      Go to IAM
    2. Select the project.
    3. In the Principal column, find all rows that identify you or a group that you're included in. To learn which groups you're included in, contact your administrator.

    4. For all rows that specify or include you, check the Role column to see whether the list of roles includes the required roles.

    Grant the roles

    1. In the Google Cloud console, go to the IAM page.

      Go to IAM
    2. Select the project.
    3. Click Grant access.
    4. In the New principals field, enter your user identifier. This is typically the email address for a Google Account.

    5. In the Select a role list, select a role.
    6. To grant additional roles, click Add another role and add each additional role.
    7. Click Save.

  4. If you have previously deployed a demo website, delete the relevant demo key.

Deploy a demo website

  1. In the Google Cloud console, go to the demo website page.

    Go to demo website

  2. In the Language list, select a language.

    The entire deployment process might take about 1 minute.

  3. If prompted, authorize Cloud Shell to make calls using your credentials.

  4. To navigate to your new demo Key details page, click View site.

  5. To view the demo website, in the Frontend card, click View sample web page.

    The demo website opens in a separate tab.

  6. To learn the patterns for integrating reCAPTCHA with your website, click through the examples.

  7. If you want to make changes to the demo website, do the following:

    1. In the Key details page, click Edit source.
    2. In the Cloud Shell Editor, find the required files in the Explorer and edit them as required.

      The saved changes to the source code get reloaded into the demo website.

    Don't close the Cloud Shell Editor because it closes Cloud Shell and stops the demo website.

What's next