Obtén más información sobre cómo entregar de forma segura contenido estático, como archivos HTML, CSS, además de imágenes del entorno estándar de Google App Engine.
Antes de comenzar
Configura tu entorno de programación y crea tu proyecto de App Engine.
Si utilizas un nombre del dominio personalizado para tu sitio web, sigue las instrucciones a fines de agregar un dominio personalizado a tu proyecto.
Cómo entregar a una página web
App Engine puede entregar contenido estático como páginas HTML y recursos multimedia como imágenes. El contenido estático es todo lo que no se ejecutará como JSP o Servlets.
El siguiente ejemplo es una página HTML básica que muestra un mensaje de bienvenida.
<!DOCTYPE html>
<html>
<head>
<title>The App Engine Blog</title>
</head>
<body>
<h1>Welcome to the App Engine Blog</h1>
<p>This is being served by App Engine!</p>
</body>
</html>
Dónde ubicar tus archivos estáticos
Debes ubicar los archivos entregados estáticos dentro del directorio webapp
de tu app. Puedes usar carpetas, pero recuerda que todos los URI y las rutas de acceso a archivos están relacionados con el directorio webapp
.
Después de elegir una ubicación para los archivos estáticos, debes definir su ubicación en el archivo appengine-web.xml
mediante el elemento <static-files>
.
En el siguiente ejemplo, con una configuración appengine-web.xml
básica se consideran todos los archivos HTML del directorio webapp
como archivos estáticos.
<appengine-web-app xmlns="http://appengine.google.com/ns/1.0">
<threadsafe>true</threadsafe>
<runtime>java8</runtime>
<static-files>
<include path="/**.html" >
</include>
</static-files>
</appengine-web-app>
Puedes tener varios elementos <include path>
que hagan referencia a diferentes directorios y tipos de archivo. A continuación, ampliamos el ejemplo anterior:
<static-files>
<include path="/**.html" >
</include>
<include path="/images/**.jpg" >
</include>
</static-files>
Ahora todos los archivos con la extensión .jpg
en el directorio webapp/images/
se tratarán como archivos estáticos.
En el ejemplo anterior, si quisiéramos mostrar logo.jpg
del directorio webapp/images
, la etiqueta <img>
tendría el URI de origen <img src="/images/logo.jpg">
.
Fuerza HTTPS para todo el contenido estático
Aunque App Engine admite entregar contenido mediante HTTP o HTTPS, debes usar HTTPS. Para configurar URL seguras, debes agregar un elemento <security-constraint>
al web.xml
de tu proyecto. A continuación, se muestra un <security-constraint>
de ejemplo:
<security-constraint>
<web-resource-collection>
<web-resource-name>blog</web-resource-name>
<url-pattern>/*</url-pattern>
</web-resource-collection>
<user-data-constraint>
<transport-guarantee>CONFIDENTIAL</transport-guarantee>
</user-data-constraint>
</security-constraint>
Mediante <transport-guarantee>CONFIDENTIAL</transport-guarantee>
, todas las solicitudes se redireccionan de forma automática al URI de HTTPS del contenido estático.
Implementa en App Engine
Puedes implementar tu aplicación en App Engine con Maven.
Ve al directorio raíz de tu proyecto y escribe lo siguiente:
mvn package appengine:deploy -Dapp.deploy.projectId=PROJECT_ID
Reemplaza PROJECT_ID por el ID del proyecto de Google Cloud. Si tu archivo pom.xml
ya especifica tu ID del proyecto, no necesitas incluir la propiedad -Dapp.deploy.projectId
en el comando que ejecutas.
Luego de que Maven implemente tu aplicación, escribe lo siguiente para abrir una pestaña del navegador web de forma automática en tu nueva aplicación:
gcloud app browse
Próximos pasos
Los archivos estáticos se pueden utilizar para entregar imágenes, hojas de estilo en cascada y contenido HTML estático a través de App Engine. Para ampliar tus conocimientos, puedes consultar cómo manejar los datos del usuario a través de formularios de HTML.