ARTECLABGeoServer 3 — De cero a producciónClase 8
1 / 11
Módulo 7 · Clase 8 ·

Proyecto Final:
IDE Municipal

PostGIS + GeoServer + OpenLayers — todo integrado en un visor web real

⏱ 2 horas🏆 Clase final👨‍💻 Daniel Quisbert
La clase final
Lo que construiremos hoy
🏗️
Arquitectura completa
PostGIS (datos y consultas) → GeoServer 3 (servicios OGC) → OpenLayers (visor web) = IDE Municipal funcionando.
1
Publicar las capas del proyecto final
5 capas: zonificación, salud, educación, vialidad, hidrografía.
2
Aplicar estilos y configurar seguridad
WMS público para visualización, WFS restringido para descarga.
3
Construir el visor web con OpenLayers
Control de capas, GetFeatureInfo con popup y WMTS para el mapa base.
4
Presentar el proyecto
5 minutos por estudiante: capas, estilo, filtro CQL más interesante.
🗺️
ide-municipal-final.jpg
Vista final del visor IDE Municipal con capas activas
DQ
Daniel Quisbert
ARTECLAB · danielquisbert.com
Paso 1 de 3
Publicación final
y seguridad
Checklist de producción antes de abrir al público
Checklist de producción
Antes de publicar tu GeoServer al mundo
✓
Contraseña admin cambiada
admin/geoserver es la primera combinación que intentan los bots.
✓
CORS configurado (Jetty 12, no web.xml)
El visor web necesita acceso CORS para hacer peticiones al GeoServer.
✓
GeoWebCache activado para capas base
Seed de los primeros 12 niveles de zoom del mapa base.
✓
Roles y restricciones configurados
WMS público · WFS solo autenticados · Admin solo tú.
✓
GEOSERVER_LOG_LOCATION configurado
Variable de entorno (GS3 ya no acepta configurarlo desde la UI).
✓
Backup del Data Directory
Copia de /opt/geoserver_data/ en almacenamiento externo.
⚠️
GeoServer 3 — cambios de migración
Si vienes de GS 2.x: H2 eliminado → migrar a PostGIS. CORS en web.xml ya no funciona. GEOSERVER_LOG_LOCATION solo por variable de entorno. Keycloak → extensión OIDC.
Paso 2 de 3
Visor web
con OpenLayers
Conectar el mapa al GeoServer
OpenLayers + GeoServer
Estructura del visor web
Capa WMS desde GeoServer en OpenLayers
const zonificacion = new ol.layer.Tile({ source: new ol.source.TileWMS({ url: 'http://servidor:8080/geoserver/geoserver3_curso/wms', params: { LAYERS: 'geoserver3_curso:zonificacion', TILED: true, FORMAT: 'image/png', TRANSPARENT: true }, serverType: 'geoserver' // ⚠ NO incluir crossOrigin aquí — las teselas se cargan como img }), opacity: 0.8 });
⚠️
Error frecuente en OpenLayers + GeoServer
Incluir crossOrigin: 'anonymous' en TileWMS causa errores si el servidor no responde con los headers CORS correctos. Las teselas se cargan como <img>, no como XHR.
Interactividad
GetFeatureInfo — popup al hacer clic
Implementación completa
map.on('singleclick', function(evt) { const viewRes = map.getView().getResolution(); const url = zonificacion.getSource().getFeatureInfoUrl( evt.coordinate, viewRes, 'EPSG:3857', { INFO_FORMAT: 'application/json' } ); if (url) { fetch(url) .then(r => r.json()) .then(data => { if (data.features.length > 0) { const props = data.features[0].properties; mostrarPopup(evt.coordinate, props); } }); } });
✓
La capa debe tener "Queryable" activado en GeoServer para responder a GetFeatureInfo.
Paso 3 de 3
Presentación
del proyecto
5 minutos por estudiante
Evaluación final
Criterios del proyecto IDE Municipal
CriterioPuntos¿Qué se evalúa?
Publicación de capas30%5 capas mínimo con metadatos completos
Estilos SLD aplicados20%Al menos 2 estilos propios (no los por defecto)
PostGIS funcionando20%Store PostGIS + al menos 1 vista SQL publicada
Visor web operativo20%GetFeatureInfo + control de capas visible
Presentación10%Claridad, estructura y dominio del tema
🎯
Lo que cada estudiante debe mostrar
URL del GetCapabilities · Vista previa en OpenLayers · Filtro CQL más interesante que usaron · Un problema que resolvieron solos.
Cierre del curso
Lo que aprendiste en 8 clases
✓ Fundamentos
Arquitectura GeoServer, servicios OGC, jerarquía WS→Store→Layer
✓ Instalación
Java 17, Tomcat 11, WAR, systemd, Data Directory
✓ PostGIS + ogr2ogr
PostGIS en VM, importar Shapefiles, ogr2ogr, conexión con GeoServer
✓ Publicación
Workspaces, Stores, Layers vectoriales y raster
✓ Estilos
SLD, CSS, simbología categorizada, etiquetas, raster
✓ PostGIS
Base de datos espacial, vistas SQL, WFS-T
✓ OGC + CQL
WMS/WFS/WMTS, filtros espaciales, GeoWebCache
✓ IDE Real
PostGIS + GeoServer + OpenLayers en producción
Fin del Curso ·

¡Felicitaciones!
Eres un GeoServer pro.

Publicar mapas, servir datos y construir IDEs — ahora lo haces tú.

Cuestionario Final — Clase 8
12 preguntas · Evaluación del curso completo
Ir al cuestionario →
🌐 danielquisbert.com 📘 geoserver-pro.danielquisbert.com 📱 flutter-gis.danielquisbert.com