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.
Puedes usar App Engine para alojar un sitio web estático. Las páginas web estáticas pueden incluir tecnologías del lado del cliente, como HTML, CSS y JavaScript. Alojar un sitio estático en App Engine puede costar menos que usar un proveedor de hosting tradicional, ya que un entorno estándar de App Engine proporciona un nivel gratuito.
Los sitios alojados en App Engine se encuentran en el subdominio REGION_ID.r.appspot.com, como [my-project-id].uc.r.appspot.com. Después de que implementes el sitio, puedes asignar tu propio nombre de dominio al sitio web alojado en App Engine.
Antes de comenzar
Antes de alojar tu sitio web en App Engine:
Crea un proyecto nuevo de la consola de Google Cloud o recupera el ID del proyecto existente para usarlo:
Enumera los ID de los proyectos de la consola de Google Cloud
Desde la línea de comandos, ejecuta:
gcloud projects list
Crea un sitio web para alojar en Google App Engine
Estructura básica para el proyecto
En esta guía, se usa la siguiente estructura para el proyecto:
app.yaml: Establece la configuración de tu aplicación de App Engine
www/: Directorio para almacenar todos los archivos estáticos, como HTML, CSS, imágenes y JavaScript
css/: Directorio para almacenar hojas de estilo
style.css: Hoja de estilo básica que da formato al aspecto del sitio
images/: Directorio opcional para almacenar imágenes
index.html: Un archivo HTML que muestra contenido para el sitio web
js/: Directorio opcional para almacenar archivos de JavaScript
Otros directorios de recursos
Crea el archivo app.yaml
El archivo app.yaml es un archivo de configuración que le indica a App Engine cómo asignar URL a los archivos estáticos. En los pasos siguientes, agregarás controladores que cargarán www/index.html cuando un usuario visite tu sitio web, y todos los archivos estáticos se almacenarán en el directorio www y se llamarán desde allí.
Crea el archivo app.yaml en el directorio raíz de la aplicación:
Crea un directorio que tenga el mismo nombre que el ID del proyecto. Puedes encontrar el ID del proyecto en Console.
En el directorio que acabas de crear, crea un archivo con el nombre app.yaml.
Edita el archivo app.yaml y agrega el elemento handlers según los requisitos de tu sitio web. Por ejemplo, el archivo app.yaml para el entorno de ejecución de Python puede crearse de la siguiente manera:
Cuando implementes los archivos de la aplicación, el sitio web se subirá a App Engine. Para implementar la aplicación, ejecuta el siguiente comando desde el directorio raíz de tu aplicación donde se encuentra el archivo app.yaml:
gcloud app deploy
Marcas opcionales:
Incluye la marca --project para especificar un ID del proyecto alternativo de la consola de Google Cloud al que inicializaste como predeterminado en la CLI de gcloud. Ejemplo: --project [YOUR_PROJECT_ID]
Incluye el marcador -v para especificar un ID de versión; de lo contrario, se generará uno automáticamente. Ejemplo: -v [YOUR_VERSION_ID]
Para obtener más información sobre la implementación de la app desde la línea de comandos, consulta Implementa tu aplicación.
Visualiza tu aplicación
Para iniciar el navegador y ver la app en https://PROJECT_ID.REGION_ID.r.appspot.com, ejecuta el comando siguiente:
[[["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-04-21 (UTC)"],[[["\u003cp\u003eApp Engine can host static websites, including HTML, CSS, and JavaScript, potentially offering cost savings compared to traditional hosting due to its free tier.\u003c/p\u003e\n"],["\u003cp\u003eEach App Engine application is assigned a \u003ccode\u003eREGION_ID\u003c/code\u003e upon creation, which is included in the application's URL, formatted as \u003ccode\u003eREGION_ID.r.appspot.com\u003c/code\u003e.\u003c/p\u003e\n"],["\u003cp\u003eTo host a website, you need to create an \u003ccode\u003eapp.yaml\u003c/code\u003e configuration file to map URLs to your static files, and have a project directory to store the static files, including an \u003ccode\u003eindex.html\u003c/code\u003e file for the home page.\u003c/p\u003e\n"],["\u003cp\u003eDeploying the website involves using the \u003ccode\u003egcloud app deploy\u003c/code\u003e command from the application's root directory to upload the website content to App Engine.\u003c/p\u003e\n"],["\u003cp\u003eThe Region ID can be used to view your website in your browser by using the command \u003ccode\u003egcloud app browse\u003c/code\u003e, at \u003ccode\u003ehttps://PROJECT_ID.REGION_ID.r.appspot.com\u003c/code\u003e.\u003c/p\u003e\n"]]],[],null,["# Hosting a static website on App Engine\n\n\u003cbr /\u003e\n\n\u003cbr /\u003e\n\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/python/how-requests-are-routed#region-id). \nOK\n\nYou can use App Engine to host a static website. Static web pages\ncan contain client-side technologies such as HTML, CSS, and JavaScript. Hosting\nyour static site on App Engine can cost less than using a traditional\nhosting provider, as App Engine standard environment provides a free tier.\n\nSites hosted on App Engine are hosted on the\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`\nsubdomain, such as `[my-project-id].uc.r.appspot.com`. After you deploy your\nsite, you can map your own domain name to your App Engine hosted website.\n\nBefore you begin\n----------------\n\nBefore you can host your website on App Engine:\n\n1. Create a new Google Cloud console project or retrieve the project ID of\n an existing project to use:\n\n [Go to the Projects page](https://console.cloud.google.com/project)\n | **Tip:** You can retrieve a list of your existing project IDs with the [gcloud command line tool](#before_you_begin).\n2. Install and then initialize the Google Cloud CLI:\n\n [Download the SDK](/sdk/docs/install)\n\n### Listing your Google Cloud console project IDs\n\nFrom the command line, run: \n\n gcloud projects list\n\nOK\n\nCreating a website to host on Google App Engine\n-----------------------------------------------\n\n### Basic structure for the project\n\nThis guide uses the following structure for the project:\n\n- `app.yaml`: Configure the settings of your App Engine application.\n- `www/`: Directory to store all of your static files, such as HTML, CSS, images, and JavaScript.\n - `css/`: Directory to store stylesheets.\n - `style.css`: Basic stylesheet that formats the look and feel of your site.\n - `images/`: Optional directory to store images.\n - `index.html`: An HTML file that displays content for your website.\n - `js/`: Optional directory to store JavaScript files.\n - Other asset directories.\n\n### Creating the `app.yaml` file\n\nThe `app.yaml` file is a configuration file that tells App Engine how to\nmap URLs to your static files. In the following steps, you will add handlers\nthat will load `www/index.html` when someone visits your website, and all static\nfiles will be stored in and called from the `www` directory.\n\nCreate the `app.yaml` file in your application's root directory:\n\n1. Create a directory that has the same name as your project ID. You can find your project ID in the [Console](https://console.cloud.google.com/).\n2. In directory that you just created, create a file named `app.yaml`.\n3. Edit the `app.yaml` file and add the handlers element based on your website\n requirements. For example, `app.yaml` file for Python\n runtime may be created as follows:\n\n runtime: python39\n\n handlers:\n - url: /\n static_files: www/index.html\n upload: www/index.html\n\n - url: /(.*)\n static_files: www/\\1\n upload: www/(.*)\n\nMore reference information about the `app.yaml` file can be found in the\n[`app.yaml` reference documentation](/appengine/docs/standard/reference/app-yaml).\n\n### Creating the `index.html` file\n\nCreate an HTML file that will be served when someone navigates to the root page\nof your website. Store this file in your `www` directory. \n\n \u003chtml\u003e\n \u003chead\u003e\n \u003ctitle\u003eHello, world!\u003c/title\u003e\n \u003clink rel=\"stylesheet\" type=\"text/css\" href=\"/css/style.css\"\u003e\n \u003c/head\u003e\n \u003cbody\u003e\n \u003ch1\u003eHello, world!\u003c/h1\u003e\n \u003cp\u003e\n This is a simple static HTML file that will be served from Google App\n Engine.\n \u003c/p\u003e\n \u003c/body\u003e\n \u003c/html\u003e\n\nDeploying your application to App Engine\n----------------------------------------\n\nWhen you deploy your application files, your website will be uploaded to App\nEngine. To deploy your app, run the following command from within the root\ndirectory of your application where the `app.yaml` file is located: \n\n gcloud app deploy\n\nOptional flags:\n\n- Include the `--project` flag to specify an alternate Google Cloud console project ID to what you initialized as the default in the gcloud CLI. Example: `--project [YOUR_PROJECT_ID]`\n- Include the `-v` flag to specify a version ID, otherwise one is generated for you. Example: `-v [YOUR_VERSION_ID]`\n\nTo learn more about deploying your app from the command line, see\n[Deploying your application](/appengine/docs/standard/testing-and-deploying-your-app#deploying_your_application).\n\nViewing your application\n------------------------\n\nTo launch your browser and view the app at\n`https://`\u003cvar translate=\"no\"\u003ePROJECT_ID\u003c/var\u003e`.`\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`, run the\nfollowing command: \n\n gcloud app browse\n\nWhat's next\n-----------\n\n[Serve your App Engine hosted website from a custom domain](/appengine/docs/standard/mapping-custom-domains)."]]
