Poder disponer de videos dentro de nuestra aplicación es muy fácil de implementar, sólo es necesario contar con las URL de los videos que queremos mostrar.
Por ejemplo, yo tengo mi canal de YouTube, donde tengo entre otros videos un set de 7 videos donde explico cómo instalar Apex 4.2 en un entorno local de desarrollo y me gustaría mostrar esos videos en una aplicación Apex.
Para ello es necesario que obtenga la URL del video para ser embebido dentro de una región de tipo PL/SQL en Apex.
Además quiero tener un elemento de tipo Select List para que al seleccionar el video se muestre en la región.
Para ello vamos a crear una tabla que albergue el ID, nombre y URL de cada video.
Podemos ingresar al SQLPlus o desde el Taller de SQL de Apex para crear la tabla:
CREATE TABLE DEMO_VIDEO
(
ID NUMBER(5,0),
NOMBRE VARCHAR2(200),
URL VARCHAR2(255)
);
Ingresamos los 7 registros que conforman la información de los 7 videos.
Insert into DEMO_VIDEO (ID,NOMBRE,URL) values (1,'Descargar Base de Datos 11g Express (Instalación Oracle APEX 1 de 7)','https://www.youtube.com/embed/b7YjCWFWqc8?list=PLE0DpxcmvcA2gToSwyJ4lb4scZNq4yXd4');
Insert into DEMO_VIDEO (ID,NOMBRE,URL) values (2,'Descargar Oracle APEX (Instalación Oracle APEX 2 de 7) ','https://www.youtube.com/embed/O6ivdMFA-uQ?list=PLE0DpxcmvcA2gToSwyJ4lb4scZNq4yXd4');
Insert into DEMO_VIDEO (ID,NOMBRE,URL) values (3,'Instalar BD Oracle 11g Express Edition (Instalación Oracle APEX 3 de 7)','https://www.youtube.com/embed/qbibCOZJG8E?list=PLE0DpxcmvcA2gToSwyJ4lb4scZNq4yXd4');
Insert into DEMO_VIDEO (ID,NOMBRE,URL) values (4,'Creando Tablespace para APEX (Instalación Oracle APEX 4 de 7)','https://www.youtube.com/embed/U1jNLuM32j0?list=PLE0DpxcmvcA2gToSwyJ4lb4scZNq4yXd4');
Insert into DEMO_VIDEO (ID,NOMBRE,URL) values (5,'Instalar APEX 4.2 (Instalación Oracle APEX 5 de 7)','https://www.youtube.com/embed/yCEhUnFpyj4?list=PLE0DpxcmvcA2gToSwyJ4lb4scZNq4yXd4');
Insert into DEMO_VIDEO (ID,NOMBRE,URL) values (6,'Configuraciones del EPG - (Instalación Oracle APEX 6 de 7)','https://www.youtube.com/embed/5wTMut6Uj9U?list=PLE0DpxcmvcA2gToSwyJ4lb4scZNq4yXd4');
Insert into DEMO_VIDEO (ID,NOMBRE,URL) values (7,'Instalar APEX en Español - (Instalación Oracle APEX 7 de 7)','https://www.youtube.com/embed/5XfO5CDL35E?list=PLE0DpxcmvcA2gToSwyJ4lb4scZNq4yXd4');
Creamos una página en blanco que la llamaremos Video.
Crear elemento de Página
Para seleccionar el video que queremos mostrar en la páginas vamos a crear un elemento de página de tipo Lista de Selección.
Hacemos clic con el botón derecho del mouse sobre Regiones y seleccionamos Crear Elemento de Página.
En la sección Identificación
- Nombre: PX_VIDEO (donde X es el número de página)
- Tipo: Lista de Selección
- En la sección Etiqueta
- Etiqueta: Video
- En la sección Configuración
- Acción de Página al Seleccionar: Submit Page
- En la sección Lista de Valores
- Lista de Valores: Consulta SQL
select NOMBRE as display_value, URL as return_value
from DEMO_VIDEO
order by ID
- Mostrar Valores Nulos: No
- Hacer clic en el botón Guardar
Crear Región de Contenido Dinámico
Para mostrar el video seleccionado vamos a crear una región de tipo contenido dinámico PL/SQL.
Hacemos clic con el botón derecho del mouse sobre Regiones y seleccionamos Crear Región y la llamaremos “Videos Instalación de Oracle Apex 4.2”.
- En Origen, ingresamos el siguiente código PL/SQL
begin
sys.htp.p('<iframe width="900" height="500" src="'||:P2_VIDEO||'" frameborder="0" allowfullscreen>');
sys.htp.p('</iframe>');
end;
- En Apariencia seleccionamos en plantilla: Standard.
Permitir iframe en nuestra aplicación apex
Nos dirigimos a Componentes Compartidos, en la sección seguridad, seleccionamos Atributos de Seguridad. En la ficha Seguridad del Explorador, seleccionamos Incluir en Marcos: Permitir del Mismo Origen y hacemos clic en el botón Aplicar Cambios.
En la ayuda de Apex (signo de interrogación) podemos ver cuando usar este atributo:
Utilice este atributo para controlar si se permite que el navegador para mostrar las páginas de su aplicación dentro de un marco:
Utilice este atributo para controlar si el explorador puede mostrar las páginas de su aplicación en un marco:
- Denegar: la página no se puede mostrar en un marco, independientemente del sitio que lo esté intentando.
- Permitir del Mismo Origen: la página solo se puede mostrar en un marco del mismo origen que la propia página.
- Permitir: la página se puede mostrar en cualquier marco.
Esta opción de visualización de páginas en marcos puede ser utilizada de forma incorrecta mediante "clickjacking" (secuestro de clics). En este caso, el usuario no autorizado utiliza varias capas para engañar a un usuario para que haga clic en un botón o enlace a otra página cuando en realidad intentaba hacer clic en la página del nivel superior. Es decir, el usuario no autorizado secuestra los clics (o las pulsaciones de teclas) que van a la página y las redirecciona a otra.
Las páginas del cuadro de diálogo se suelen mostrar dentro de un iframe, lo que no funcionaría normalmente con el valor de atributo "Denegar". El atributo Permitir Embeber en Marco de una plantilla de página del cuadro de diálogo define si se debe utilizar "Permitir del Mismo Origen" en lugar de "Denegar" para páginas que utilizan dicha plantilla. Para protegerse frente al secuestro de clics, Application Express utiliza un total de control específico de la página en las URL de página del cuadro de diálogo.
Nota: esta función necesita exploradores actuales que soporten la variable de respuesta de cabecera HTTP "X-Frame-Options".
Ver Resultados
Al ejecutar la aplicación podemos ver que el video se muestra en la región dinámica PL/SQL y tenemos el elemento de selección que nos permite seleccionar el video que queremos mostrar.
Hasta Pronto!