Organiza tus páginas con colecciones
Guarda y categoriza el contenido según tus preferencias.
ID de región
REGION_ID es un código abreviado que Google asigna en función de la región que eliges cuando creas la app. El código no corresponde a un país ni a una provincia, aunque algunos ID de región puedan parecer similares a los códigos de país y provincia que se suelen usar. En el caso de las apps creadas después de febrero de 2020, REGION_ID.r se incluye en las URL de App Engine. En el caso de las apps existentes creadas antes de esta fecha, el ID de región es opcional en la URL.
Para usar Firebase Authentication con tu servicio web, agrega Firebase a tu proyecto de Google Cloud y establece la configuración de autenticación.
Agrega Firebase a tu proyecto de Google Cloud existente con la herramienta Agregar proyecto en Firebase console.
También puedes optar por usar una cuenta de Firebase con un nombre diferente, que no esté asociado con el proyecto de Google Cloud existente.
Habilita la autenticación de proveedores de inicio de sesión en Firebase console. Para este servicio web, habilitarás Correo electrónico/Contraseña (Email/Password) y Google como proveedores de inicio de sesión:
Haz clic en Compilar > Autenticación (Authentication) > Método de inicio de sesión (Sign-in method).
En Proveedores de inicio de sesión, selecciona Correo electrónico/Contraseña.
Habilita el botón Activar (Enable) para usar la autenticación con correo electrónico y contraseña, y haz clic en Guardar (Save).
A fin de que Firebase realice la autenticación de manera correcta, el dominio debe tener autorización para los redireccionamientos de OAuth. Para autorizar tu dominio, haz lo siguiente:
En Dominios autorizados en la página Configuración, haz clic en Agregar dominio.
Ingresa el dominio de la app en App Engine, sin incluir el prefijo http://:
PROJECT_ID.
REGION_ID.r.appspot.com
donde PROJECT_ID es el ID de tu proyecto deGoogle Cloud .
Agrega Firebase a tu servicio web
Para agregar Firebase al servicio web, copia el fragmento de código personalizado del proyecto de Firebase y los archivos JavaScript y CSS en el servicio web:
En la página de descripción general del proyecto, debajo del texto Get started by adding Firebase to your app, selecciona Web. Si ya agregaste una app al proyecto, es posible que no veas este texto. En su lugar, navega a la página Descripción general del proyecto > Configuración del proyecto > General de la app existente, desplázate hacia abajo y selecciona Agregar app.
Una vez que se registre la app, se mostrará un fragmento de código personalizado. Copia el contenido del fragmento. Si luego quieres volver a ver este fragmento de código, navega a la página de Configuración del proyecto de la app de Firebase.
Completa los siguientes pasos para actualizar el archivo templates/index.html:
Agrega las siguientes líneas a la etiqueta <head>:
Agrega el fragmento de código personalizado a la etiqueta <body>.
Para este instructivo, puedes agregar el código en la parte superior del cuerpo, ya que el único contenido en templates/index.html es un ejemplo de los servicios de Firebase. En el entorno de producción, te recomendamos agregar el fragmento de código en la parte inferior del cuerpo, pero antes de usar cualquier servicio de Firebase.
El código personalizado se verá similar a este fragmento ficticio:
Reemplaza el TODO en el fragmento anterior por la siguiente etiqueta de secuencia de comandos para habilitar el componente de autenticación de Firebase:
Ahora que agregaste Firebase a tu proyecto de Google Cloud y a tu servicio web, estás listo para agregar código a tu servicio web a fin de habilitarlo y, así, autenticar usuarios.
[[["Fácil de comprender","easyToUnderstand","thumb-up"],["Resolvió mi problema","solvedMyProblem","thumb-up"],["Otro","otherUp","thumb-up"]],[["Difícil de entender","hardToUnderstand","thumb-down"],["Información o código de muestra incorrectos","incorrectInformationOrSampleCode","thumb-down"],["Faltan la información o los ejemplos que necesito","missingTheInformationSamplesINeed","thumb-down"],["Problema de traducción","translationIssue","thumb-down"],["Otro","otherDown","thumb-down"]],["Última actualización: 2025-09-04 (UTC)"],[[["\u003cp\u003eThe \u003ccode\u003eREGION_ID\u003c/code\u003e is a Google-assigned code based on the region selected during app creation, which is included in App Engine URLs for apps created after February 2020.\u003c/p\u003e\n"],["\u003cp\u003eFirebase can be added to a Google Cloud project to enable user authentication for a personalized web service experience.\u003c/p\u003e\n"],["\u003cp\u003eAdding Firebase to your Google Cloud project involves using the Firebase console to add your project, enabling authentication sign-on providers like Email/Password and Google, and authorizing your domain for OAuth redirects.\u003c/p\u003e\n"],["\u003cp\u003eAdding Firebase to a web service involves copying a customized code snippet, JavaScript, and CSS files from the Firebase console into the service's \u003ccode\u003eindex.html\u003c/code\u003e file, ensuring the Firebase Authentication component is properly included.\u003c/p\u003e\n"],["\u003cp\u003eTo continue, you have to add code to your web service that will enable user authentication.\u003c/p\u003e\n"]]],[],null,["# Add Firebase to your web service\n\n### Region ID\n\nThe \u003cvar translate=\"no\"\u003eREGION_ID\u003c/var\u003e is an abbreviated code that Google assigns\nbased on the region you select when you create your app. The code does not\ncorrespond to a country or province, even though some region IDs may appear\nsimilar to commonly used country and province codes. For apps created after\nFebruary 2020, \u003cvar translate=\"no\"\u003eREGION_ID\u003c/var\u003e`.r` is included in\nApp Engine URLs. For existing apps created before this date, the\nregion ID is optional in the URL.\n\nLearn more\n[about region IDs](/appengine/docs/standard/python3/how-requests-are-routed#region-id). \nOK\n\n\u003cbr /\u003e\n\n| **Note:** If you are deploying a new Python web service to Google Cloud, we recommend getting started with [Cloud Run](/run/docs/quickstarts/build-and-deploy/deploy-python-service).\n\nAdd Firebase to your Google Cloud project, configure your authentication\nsettings, and then add Firebase to your web service.\n\nAdding Firebase to your web service enables you to authenticate users\nso that you can give each user a personalized experience.\n\nBefore you begin\n----------------\n\nIf you have completed all the previous steps in this guide, skip this section.\nOtherwise, complete one of the following:\n\n- Start from [Build a Python 3 App](/appengine/docs/standard/python3/building-app)\n and complete all the steps leading up to this one.\n\n- If you already have a\n [Google Cloud project](/appengine/docs/standard/python3/building-app/creating-gcp-project),\n you can continue by downloading a copy of the web service:\n\n 1. Download the sample application repository using\n [Git](https://git-scm.com/):\n\n git clone https://github.com/GoogleCloudPlatform/python-docs-samples\n\n Alternatively, you can [download the sample](https://github.com/GoogleCloudPlatform/python-docs-samples/archive/master.zip) as a zip\n file and then extract it.\n 2. Navigate to the directory that contains a copy of the files from the\n previous step:\n\n cd python-docs-samples/appengine/standard_python3/building-an-app/building-an-app-1\n\nAdd Firebase to your Google Cloud project\n-----------------------------------------\n\nTo use Firebase authentication with your web service, add\nFirebase to your Google Cloud project and configure your authentication\nsettings.\n\n1. Add Firebase to your existing Google Cloud project using the\n **Add project** tool in the [Firebase console](https://console.firebase.google.com/).\n\n You can also choose to use a Firebase account with a different name, not\n associated with your existing Google Cloud project.\n2. Enable the authentication sign-on providers in the\n [Firebase console](https://console.firebase.google.com/). For this\n web service, you will enable **Email/Password** and **Google** sign-in\n providers:\n\n 1. Click **Build** \\\u003e **Authentication** \\\u003e **Sign-in method**.\n\n 2. Under **Sign-in providers** , select **Email/Password**.\n\n 3. Toggle the **Enable** button to use email and password authentication,\n and click **Save**.\n\n | **Tip:** For more information about enabling other providers, see the \"Before you begin\" sections of the [Google](https://firebase.google.com/docs/auth/web/google-signin), [Facebook](https://firebase.google.com/docs/auth/web/facebook-login), [Twitter](https://firebase.google.com/docs/auth/web/twitter-login), and [GitHub](https://firebase.google.com/docs/auth/web/github-auth) guides on Firebase.\n3. For Firebase to authenticate properly, your domain needs to be authorized\n for OAuth redirects. To authorize your domain:\n\n 1. Select **Build** \\\u003e **Authentication** \\\u003e **Settings**.\n\n 2. Under **Authorized domains** on the **Settings** page, click **Add Domain**.\n\n 3. Enter the domain of your app on App Engine, excluding the\n `http://` prefix:\n\n \u003cvar translate=\"no\"\u003ePROJECT_ID\u003c/var\u003e.\n \u003cvar translate=\"no\"\u003e\u003ca href=\"#appengine-urls\" style=\"border-bottom: 1px dotted #999\" class=\"devsite-dialog-button\" data-modal-dialog-id=\"regional_url\" track-type=\"progressiveHelp\" track-name=\"modalHelp\" track-metadata-goal=\"regionalURL\"\u003eREGION_ID\u003c/a\u003e\u003c/var\u003e`.r.appspot.com`\n where \u003cvar translate=\"no\"\u003ePROJECT_ID\u003c/var\u003e is the ID of your\n Google Cloud project.\n\nAdd Firebase to your web service\n--------------------------------\n\nTo add Firebase to your web service, copy your Firebase project's custom code\nsnippet, JavaScript and CSS files into your web service:\n\n1. Go to the [Firebase console](https://console.firebase.google.com/) and select your project.\n\n2. From the project overview page, under the text **Get started by adding\n Firebase to your app** , select **web** . If you already have an app added to\n the project, you may not see this text; instead, navigate to the\n **Project Overview** \\\u003e **Project settings** \\\u003e **General**\n page of your existing app, scroll down, and select **Add app**.\n\n3. Once the app is registered, a customized code snippet will be displayed. Copy\n the contents of the snippet. To see this code snippet again later, navigate\n to the **Project settings** page for your Firebase app.\n\n4. Update your `templates/index.html` file by completing the following:\n\n 1. Add the following lines to the `\u003chead\u003e` tag:\n\n \u003cscript src=\"https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.js\"\u003e\u003c/script\u003e\n \u003clink type=\"text/css\" rel=\"stylesheet\" href=\"https://www.gstatic.com/firebasejs/ui/6.0.1/firebase-ui-auth.css\" /\u003e\n\n 2. Add your customized code snippet to the `\u003cbody\u003e` tag.\n\n For this tutorial, you can add the code to the top of the body, since the\n only content in `templates/index.html` is an example of Firebase\n services. In your production environment, we recommend that you add the\n code snippet to the bottom of the body, but before you use any Firebase\n services.\n\n Your custom code will look similar to this mock snippet: \n\n \u003c!-- MOCK SNIPPET: DO NOT COPY --\u003e\n \u003c!-- The core Firebase JS SDK is always required and must be listed first --\u003e\n \u003cscript src=\"https://www.gstatic.com/firebasejs/7.14.5/firebase-app.js\"\u003e\u003c/script\u003e\n\n \u003c!-- TODO: Add SDKs for Firebase products that you want to use\n https://firebase.google.com/docs/web/setup#available-libraries --\u003e\n\n \u003cscript\u003e\n var config = {\n apiKey: \"\u003cAPI_KEY\u003e\",\n authDomain: \"\u003cPROJECT_ID\u003e.firebaseapp.com\",\n databaseURL: \"https://\u003cDATABASE_NAME\u003e.firebaseio.com\",\n projectId: \"\u003cPROJECT_ID\u003e\",\n storageBucket: \"\u003cBUCKET\u003e.appspot.com\",\n messagingSenderId: \"\u003cSENDER_ID\u003e\",\n };\n firebase.initializeApp(config);\n \u003c/script\u003e\n\n 3. Replace the TODO in the snippet above with the following script tag to\n enable the Authentication component of Firebase:\n\n \u003cbr /\u003e\n\n ```\n \u003cscript src=\"https://www.gstatic.com/firebasejs/7.8.0/firebase-auth.js\"\u003e\u003c/script\u003e\n \n ```\n\n \u003cbr /\u003e\n\n These script addresses are documented in the [Firebase UI for Web\n documentation](https://firebaseopensource.com/projects/firebase/firebaseui-web/).\n 4. Replace the rest of the body with the following code, which you will use\n later in this guide to display authenticated user data:\n\n \u003cdiv id=\"firebaseui-auth-container\"\u003e\u003c/div\u003e\n\n \u003cbutton id=\"sign-out\" hidden=true\u003eSign Out\u003c/button\u003e\n\n \u003cdiv id=\"login-info\" hidden=true\u003e\n \u003ch2\u003eLogin info:\u003c/h2\u003e\n {% if user_data %}\n \u003cdl\u003e\n \u003cdt\u003eName\u003c/dt\u003e\u003cdd\u003e{{ user_data['name'] }}\u003c/dd\u003e\n \u003cdt\u003eEmail\u003c/dt\u003e\u003cdd\u003e{{ user_data['email'] }}\u003c/dd\u003e\n \u003cdt\u003eLast 10 visits\u003c/dt\u003e\u003cdd\u003e\n \t{% for time in times %}\n \u003cp\u003e{{ time['timestamp'] }}\u003c/p\u003e\n {% endfor %} \u003c/dd\u003e\n \u003c/dl\u003e\n {% elif error_message %}\n \u003cp\u003eError: {{ error_message }}\u003c/p\u003e\n {% endif %}\n \u003c/div\u003e\n\nNext Steps\n----------\n\nNow that you've added Firebase to your Google Cloud project and your web\nservice, you're ready to add code to your web service to enable it to\nauthenticate users."]]
