Desarrollo de Aplicaciones

Web con Bussines Server

Pages (BSP) en SAP

Expositor: Ing. Carlos Eduardo Flores Joseph

cefloresjoseph@hotmail.com

cflores@bizpartner.biz

Temario

Overview Bussines Server Pages

Arquitectura del SAP Web Aplicaction Server

Estructura de las aplicaciones BSP

BSP Extension (HTMLB)

BSP utilizando el Modelo Vista Controlador MVC

Interfaz Flex Utilizando BSP

Overview Bussines Server Pages

A partir de la versión 6.10, SAP inicio una

importante revisión de su tecnología. La

empresa rompió la tradicional capa de

aplicaciones base, para utilizar una nueva

tecnología de capa de aplicaciones para

servidores Web, donde el lenguaje nativo

será ABAP, y no utilizar servidores Web

externos o lenguajes de programación.

Overview Bussines Server Pages

El Web Application Server de SAP, nos

provee un modelo de programación basado

en páginas, con scripting del lado del

servidor, así como tecnología para desarrollar

aplicaciones web. Eso es Business Server

Pages.

Overview Bussines Server Pages

La ventaja que tiene el Scripting del lado

del servidor, es el acceso que nos permite a

Módulos de Funciones, Tablas de Base de

Datos y Objetos en ABAP.

La presentación está separada de la lógica,

lo cual nos permite implementar tecnología

Front-End.

Overview Bussines Server Pages

Podemos crear páginas HTML o BSP

utilizando ABAP o JavaScript.

Podemos tomar ventaja del Modelo MVC

(Modelo, Vista, Controlador).

El HTMLB es una librería que nos permite

no solo mejorar la visualización de nuestras

aplicaciones, sino también reducir el costo

de programación.

Arquitectura SAP WAS

Aplicaciones BSP con HTML

El BSP utiliza ABAP como lenguaje Script,

por lo tanto, necesita de un lenguaje

Markup para poder ser visualizado en un

browser de internet. En este caso,

utilizamos HTML.

El HTML es soportado por todos los

navegadores existentes en el mercado.

Estructura de las Aplicaciones BSP

Páginas con lógica de proceso

Las páginas definidas como “con lógica de

proceso” pueden implementar su propia

lógica de proceso, es decir, todo el código

necesario para la aplicación.

Es ejecutable y puede ser llamada a través

de una URL o llamada mediante

navegación por otras páginas.

…

<% %> Se utiliza para el

código ABAP.

<%= %> Se utiliza para

variables ABAP dentro del

código HTML.

De esta manera podemos

combinar ABAP y HTML sin

que el compilador intente

compilar código HTML como

ABAP o código ABAP como

código HTML.

Flujo de las Aplicaciones BSP

Eventos que se desencadena al

invocar a una pagina

BSP – Hola Mundo

BSP con otras tecnologías

Aplicación en JSP Aplicación en PHP

Ejemplo Aplicación BSP

Ejemplo Aplicación BSP

Ejemplo Aplicación BSP

Aplicación BSP - Browser

Aplicaciones con HTMLB

El HTMLB es una extensión del BSP, es

decir, son tags diseñados para encapsular

funcionalidades. Con lo cual la

programación es más rápida.

Está basado en componentes.

El HTMLB no es soportado por todos los

navegadores existentes en el mercado.

Ejemplo Aplicación BSP Ext.

Browser – IE 7

Imagen de Navegación

Browser – Chrome

No se muestra la imagen

de Navegación

Modelo Vista Controlador

El modelo MVC (Modelo-Vista-Controlador)

es un modelo por el cual podemos separar

en capas la lógica del negocio de la

información que se muestra al usuario.

Tenemos una capa para la conexión a la

Base de Datos (Modelo), otra para la

manipulación de datos (Controlador) y otra

para mostrar los datos (Vista).

Modelo Vista Controlador

Sus ventajas, son que es más ordenado,

más fácil de mantener y es reutilizable.

ABAP Class

based on

CL_BSP_CONTROLLER_2

ABAP Class

based on

CL_BSP_MODEL

BSP Page type

“View”

BSP usando MVC

Object Data Model

Para hacer la programación más sencilla en

BSP, el framework nos proporciona una

clase básica llamada CL_BSP_MODEL.

El Data Model sirve para interactuar con la

Base de Datos y proporcionar información

al Controller y a las Vistas.

Controlador

El Controlador es el encargado de llamar al

Data Model.

Se utiliza la clase básica

CL_BSP_CONTROLLER2.

Un controlador puede llamar a múltiples

vistas.

Responde a eventos provocando cambios

en el Data Model.

Vista

Maneja la interfaz gráfica de la aplicación.

Muestra la información obtenida en el Data

Model.

No puede modificar datos directamente.

Tiene que llamar a un Controlador.

Ejemplo Aplicación BSP MVC

Ejemplo Aplicación BSP MVC

ZCL_USUA

RIO_MOD

EL, es una

clase global

creado en la

SE24

Ejemplo Aplicación BSP MVC

BSP MVC – Browser IE 7

BSP MVC – Browser Chrome

Construyendo XML en BSP

XML en el

Browser

Leyendo XML desde Flex

Resultado en el Browser