ogramación - CETis No. 7 · 2015-02-19 · 2.2.1 Funciones para trabajar con arreglos 40 ......
56
< > Programación 1
Transcript of ogramación - CETis No. 7 · 2015-02-19 · 2.2.1 Funciones para trabajar con arreglos 40 ......
< > Programación
1
< > Programación
2
Somos una empresa 100% mexicana, con más de 20 años de experiencia siendo el Cen-
tro líder de Capacitación en informática.
Hoy en día, tener las mejores herramientas es sólo una parte del todo lo que signi-
fica que conviene siempre estar en permanente capacitación.
Grupo Eduit ha establecido un programa integrado capaz de identificar y perso-
nalizar las necesidades de los diferentes niveles educativos del país manteniéndose en
cada paso como asesor y colaborador, generando un “programa conforme a sus necesi-
dades”.
MisiónSatisfacer las necesidades de capacitación en tecnologías de informática a través de
programas de entrenamiento de calidad, siendo siempre una empresa a la vanguardia.
VisiónSer líder de soluciones de capacitación a nivel internacional.
< > Programación
3
1 Contenido
1 Aplicaciones Web 7
1.1 Introducción a ASP.NET 7
1.1.1 Páginas Web / Formularios Web 7
1.1.2 Controles HTML 7
1.1.3 Controles Web. 9
1.1.4 Componentes de las aplicaciones Web 10
1.1.5 Ciclo de vida de las aplicaciones Web 10
1.1.6 Herramientas de desarrollo 10
1.2 Desarrollo de aplicaciones Web 11
1.2.1 Crear Formas Web 11
1.2.2 AgregaryconfigurarcontrolesdeservidorenFormasWeb 16
1.2.3 Trabajar con archivos de código adjunto 21
1.2.4 Manejo de eventos 21
1.2.5 Controles de validación 22
1.2.6 Depuración en aplicaciones web 23
1.3 Acceso a datos desde aplicaciones web 23
< > Programación
4
1.3.1 Introducción a ADO.NET 23
1.3.2 Controles de acceso a datos 23
1.3.3 Administrar información de la base de datos desde una aplicación web 24
2 Introducción a PHP 27
2.1 Sintaxis Básica de PHP 27
2.1.1 Declaración y uso de variables 28
2.1.2 Operadores 29
2.1.3 Estructuras de control 32
2.1.4 Arreglos 37
2.1.5 Funciones 38
2.1.6 Incluir funciones en un script 39
2.2 Librerías de PHP 40
2.2.1 Funciones para trabajar con arreglos 40
2.2.2 Funciones para trabajar con cadenas 41
2.2.3 Funciones para trabajar con fecha y hora 42
2.3 Creación de Formularios con PHP 43
2.3.1 Elementos de un formulario 43
2.3.2 Validación de datos en un formulario 47
< > Programación
5
3 Desarrollo de Aplicaciones Web para dispositivos móviles 49
3.1 Introducción 49
3.1.1 Características de las aplicaciones para dispositivos móviles 49
3.2Formularios Web con emuladores de dispositivos para móviles 50
3.2.1 Formularios Web para Móviles 50
3.2.2 Redirección y detección de dispositivos móviles 52
3.3 Desarrollo de aplicaciones Web para dispositivos móviles 53
3.3.1 Consideraciones de diseño 53
3.3.2 Diseño de la interface 54
• Conocer los componentes y el ciclo de vida de las aplicaciones ASP.NET.
• Realizar interfaces Web utilizando los diversos componentes que conforman una aplicación web ASP.NET.
• Identificar los componentes principales de ADO.NET y como enlazarlos con aplicaciones web.
< > Programación
7
1 Aplicaciones Web
1.1 Introducción a ASP.NET
ASP.NET es una tecnología gratuita que permite a los programadores crear páginas web dinámicas, desde websites personales hasta aplicaciones web empresariales.
1.1.1 Páginas Web / Formularios Web
Las formularios Web son el corazón y el alma de ASP.NET. Las formularios Web son los elementos de in-terfaz de usuario (UI), que dan a las aplicaciones web de su apariencia. Son similares a los Windows Forms ya que proporcionan propiedades, métodos y eventos de los controles que se colocan sobre ellos.
Las formularios Web están formados por dos componentes: la parte visual (el archivo ASPX), y el código detrás de la forma, que reside en un archivo de clase independiente como se observa en al figura 1.1.
Figura 1.1
1.1.2 Controles HTML
Los Controles HTML imitan a los elementos HTML reales que usarías si estuvieras utilizando Front Page o cualquier otro editor HTML para dibujar la interfaz de usuario. Puedes usar los elementos HTML estándar en Formularios Web
Por ejemplo, si deseas crear un cuadro de texto, debería escribir:
<input type=”text” id=txtFirstName size=25>
< > Programación
8
Si está utilizando Visual Studio. NET, elije un TextField de control de la caja de herramientas HTML y dibu-ja el control que desea en la página HTML.
Controles HTML disponibles en ASP.NET
Control Descripción Ejemplos de Formularios WebBotón Un botón normal que se puede utilizar
para responder a eventos de Clic<input type=button runat=ser-ver>
Botón Restablecer Restablece todos los elementos de for-mulario a un valor predeterminado
<input type=reset runat=server>
Botón Un botón normal que se puede utilizar para responder a eventos de Clic
<input type=button runat=ser-ver>
Enviar Hace automáticamente un POST de los datos del formulario a una página espe-cificada
<input type=submit runat=ser-ver>
Campo de texto Proporciona al usuario un campo de en-trada en un formulario HTML
<input type=text runat=server>
Área de texto Se utiliza para la entrada de varias líneas en un formulario HTML
<input type=textarea runat=ser-ver>
Campo de archivo Coloca un campo de texto y un botón de búsqueda en un formulario y permite al usuario seleccionar un archivo de su máquina
<input type=file runat=server>
Campo de contraseña Un área de entrada de un formulario HTML, todos los caracteres escritos en este campo se muestran como asteris-cos
<input type=password runat=-server>
CheckBox Proporciona al usuario una casilla de ve-rificación que puede activar o desactivar
<input type=checkbox runat=ser-ver>
Radio Botón Se utiliza dos o más en un formulario, y permite al usuario elegir uno de los controles
<input type=radio runat=server>
Tabla Permite presentar la información en un formato de tabla
<table runat=server> </ table>
Imagen Muestra una imagen en un formulario HTML
<img src=”FileName” runat=ser-ver>
ListBox Muestra una lista de elementos para el usuario. . Si hay más elementos de los que caben dentro de este límite, una barra de desplazamiento se agrega auto-máticamente a este control.
<seleccionar size=2 runat=ser-ver> </ select>
< > Programación
9
1.1.3 Controles Web.
Los controles de servidor Web ASP.NET son objetos de páginas Web ASP.NET que se ejecutan cuando se solicita la página y representan el formato en un explorador. Muchos controles de servidor Web son simi-lares a elementos HTML conocidos, como botones y cuadros de texto. Sin embargo, otros controles abar-can un comportamiento complejo, por ejemplo un control de calendario o los controles que administran conexiones de datos.
Las propiedades que figuran en la siguiente tabla se aplican a todos los controles de servidor Web que se deriven de la clase WebControl. Los controles de servidor Web que no heredan de la clase WebControl incluyen Literal, PlaceHolder, Repeater y Xml.
1.1.3.1 Propiedades de controles Web
Propiedad Descripción
AccessKey
Tecla de método abreviado del control (AccessKey). Esta propiedad especifica una sola letra o un solo número que el usuario puede presionar mientras presiona la tecla ALT. Por ejemplo, especifique “K” si desea que el usuario presione ALT+K para obtener acceso al control. Las teclas de método abreviado se admiten únicamente en Microsoft Internet Explorer 4.0 y versiones posteriores.
Attributes
Colección de atributos adicionales del control no definidos por una propiedad pú-blica pero que también se han de representar. Cualquier atributo no definido por el control de servidor Web se agrega a esta colección. Esto permite utilizar un atributo HTML que el control no admite directamente.
BackColorColor de fondo del control. La propiedad BackColor se puede establecer mediante identificadores de color HTML estándar: el nombre de un color (“black” o “red”) o un valor RGB expresado con formato hexadecimal (“#ffffff”).
BorderColorColor del borde del control. La propiedad BorderColor se puede establecer median-te identificadores de color HTML estándar: el nombre de un color (“black” o “red”) o un valor RGB expresado con formato hexadecimal (“#ffffff”).
BorderWidth Ancho, en píxeles, del borde del control si existe.
BorderStyle
Estilo del borde del control, si existe. Algunos valores posibles son:
• NotSet• None• Dotted• Solid• Double
CssClass Clase de hojas de estilos en cascada (CSS) que se va a asignar al control.
< > Programación
10
1.1.4 Componentes de las aplicaciones Web
En las páginas Web ASP.NET, la programación de la interfaz de usuario se divide en dos partes: el compo-nente visual y el lógico. Es la división entre la parte visible de una página y el código que se oculta detrás y que interactúa con ella.
El elemento visual está compuesto por un archivo que contiene el marcado estático como HTML o con-troles de servidor ASP.NET o ambos. La página Web ASP.NET funciona como un contenedor del texto y los controles estáticos que se desea mostrar.
La lógica de las páginas Web ASP.NET se compone del código creado para interactuar con la página. El códi-go puede residir en un bloque de script en la página o en una clase independiente. Si el código está en un archivo de clase independiente, a este archivo se le conoce como archivo de código subyacente. El código del archivo de código subyacente se puede escribir en Visual Basic, Visual C#, Visual J# o JScript .NET.
Las páginas Web ASP.NET se compilan en un archivo de biblioteca de vínculos dinámicos (.dll). La primera vez que un usuario examina la página .aspx con el explorador, ASP.NET genera automáticamente un archivo de clase .NET que representa a la página y la compila.
El archivo .dll se ejecuta en el servidor y genera dinámicamente la salida HTML para su página.
1.1.5 Ciclo de vida de las aplicaciones Web
En aplicaciones web, a diferencia de las tradicionales de escritorio, nos encontramos con una dificultad adicional a la hora de controlar en ambiente.
Tanto el software como el hardware cliente cambian sin previo aviso. Es fundamental en función de esta complejidad, encontrar marcos de referencia adecuados.
La existencia de estándares y componentes web estandarizados sin duda ayuda, pero no es suficiente, por lo que el proceso de adecuación se vuelve continuo.
1.1.6 Herramientas de desarrollo
El Kit de desarrollo de software (SDK) de Windows incluye varias herramientas que puede utilizar al desa-rrollar sitios Web ASP.NET.
• Herramienta Registro de IIS en ASP.NET (Aspnet_regiis.exe).- Permite que un programa adminis-trador o de instalación actualice las asignaciones de secuencias de comandos de una aplicación ASP.NET para que señalen a la versión de la ISAPI de ASP.NET asociada a la herramienta. Esta herramienta también se puede utilizar para mostrar el estado de todas las versiones de ASP. NET instaladas, registrar la versión de ASP.NET que se corresponde con la herramienta, crear directorios de secuencias de comandos de cliente y realizar otras operaciones de configuración.
• Complemento MMC para ASP.NET
< > Programación
11
1.1.6.1 Herramienta Registro de IIS en ASP.NET (Aspnet_regiis.exe)
Cuando se ejecutan varias versiones de .NET Framework simultáneamente en un único equipo, la versión de las API de servidor de Internet (ISAPI) de ASP.NET asignada a una aplicación ASP.NET determina qué versión de Common Language Runtime (CLR) se utiliza para la aplicación.
La herramienta Registro de IIS en ASP.NET (Aspnet_regiis.exe) permite que un programa administrador o de instalación pueda actualizar fácilmente las asignaciones de secuencias de comandos de una aplicación ASP.NET para que señalen la versión de ISAPI (API de servidor de Internet) de ASP.NET asociada a la herra-mienta. Esta herramienta también se puede utilizar para mostrar el estado de todas las versiones de ASP. NET instaladas, para registrar la versión de ASP.NET que se corresponde con la herramienta, para crear directorios de secuencias de comandos de cliente y para realizar otras operaciones de configuración.
1.1.6.2 Complemento MMC para ASP.NET
MMC aloja herramientas administrativas que puede utilizar para administrar equipos, servicios, otros com-ponentes del sistema y redes. Se puede agregar una o varias de estas herramientas administrativas, deno-minados complementos, a la consola para administrar una aplicación Web.
La herramienta Complemento de ASP.NET para Microsoft Management Console (MMC) proporciona una interfaz de usuario (UI) única para configurar servidores Web y las aplicaciones que alojan. Incluye varios cuadros de diálogo que permiten administrar características específicas, como por ejemplo, control de errores personalizado o autenticación de usuario.
1.2 Desarrollo de aplicaciones Web
1.2.1 Crear Formas Web
1.2.1.1 Para crear un sitio web del sistema de archivos
1. Abra Microsoft Visual Studio o Microsoft Visual Web Developer Express.
2. En el menú Archivo, haga clic en Nuevo sitio Web.
a. Aparecerá el cuadro de diálogo Nuevo sitio web tal y como se muestra en la Figura 1.2:
< > Programación
12
Figura 1.2
3. En Plantillas instaladas, haga clic en Visual Basic o en C# y, a continuación, seleccione Sitio web ASP.NET.
a. Cuando se crea un proyecto de sitio web, se especifica una plantilla. Cada plantilla crea un proyecto web que contiene diferentes archivos y carpetas. En este tutorial, creará un sitio web basado en la plantilla Sitio web ASP.NET, que crea archivos y carpetas que nor-malmente se usan en sitios web ASP.NET.
4. En el cuadro Ubicación web, seleccione Sistema de archivos y, a continuación, escriba el nombre de la carpeta en la que desea guardar las páginas del sitio web.
a. Por ejemplo, escriba el nombre de carpeta C:\BasicWebSite.
5. Haga clic en Aceptar.
Visual Studio crea un proyecto web que incluye la funcionalidad preintegrada para el diseño (una página maestra, las páginas de contenido About.aspx y Default.aspx y una hoja de estilos en cascada), para Ajax (archivos de script de cliente) y para la autenticación (pertenencia de ASP.NET). Cuando se crea una nueva página, Visual Web Studio muestra de forma predeterminada la página en la vista Código, donde se pueden ver los elementos HTML de la página. En la Figura 1.3 se muestra la vista Código fuente de una página web.
< > Programación
13
Figura 1.3
1.2.1.2 Para agregar una página al sitio Web
1. Cierre la página Default.aspx. Para ello, haga clic con el botón secundario en la pestaña que mues-tra el nombre del archivo y, a continuación, haga clic en Cerrar.
2. En el Explorador de soluciones, haga clic con el botón secundario en el sitio web, (por ejemplo, C:\BasicWebSite) y, a continuación, haga clic en Agregar nuevo elemento.
Se abrirá el cuadro de diálogo Agregar nuevo elemento. En la figura 1.4 se muestra un ejemplo del cuadro de diálogo Agregar nuevo elemento:
< > Programación
14
Figura 1.4
3. En la lista de plantillas, seleccione Formulario Web Forms.
4. En el cuadro Nombre, escriba FirstWebPage.
a. Cuando creó el proyecto de sitio web, especificó un lenguaje predeterminado basado en la plantilla de proyecto que seleccionó. Sin embargo, cada vez que se crea una página o un componente nuevo para el sitio web, se puede seleccionar el lenguaje de programación para esa página o componente. Puede utilizar diferentes lenguajes de programación en el mismo sitio Web.
5. Desactive la casilla Colocar el código en un archivo independiente.
a. A continuación crearemos una página de un sólo archivo con código y HTML en la misma página. El código para las páginas ASP.NET se puede ubicar en la página o en un archivo de clase independiente.
6. Haga clic en Agregar.
Visual Studio crea la nueva página y la abre.
< > Programación
15
1.2.1.3 Para agregar texto a la página
1. En la parte inferior de la ventana de documento, haga clic en la ficha Diseño para pasar a la vista Diseño.
a. La Vista de diseño muestra la página en la que se está trabajando en modo WYSIWYG. En este momento, no hay texto ni controles en la página, por lo que está en blanco, aparte de una línea discontinua que forma un rectángulo. Este rectángulo representa un elemento div en la página.
2. Haga clic en el interior del rectángulo formado por la línea discontinua.
3. Escriba “Welcome to Visual Web Developer” y, a continuación, presione ENTRAR dos veces.
La Figura 1.5 muestra el texto que escribió en la Vista de diseño.
Figura 1.5
4. Cambie a la vista Código fuente.
Puede ver el código HTML que ha creado escribiendo en la Vista de diseño, como se muestra en la Figura 1.6.
< > Programación
16
Figura 1.6
1.2.2 AgregaryconfigurarcontrolesdeservidorenFormasWeb
Ahora agregará controles de servidor a la página. Los controles de servidor, entre los que se incluyen botones, etiquetas, cuadros de texto y otros controles familiares, proporcionan las funciones típicas de procesamiento de formularios para las páginas Web ASP.NET. Sin embargo, puede programar los controles con código que se ejecuta en el servidor, no el cliente.
Agregará a la página un control Button, un control TextBox y un control Label y escribirá código para con-trolar el evento Click para el control Button.
< > Programación
17
1.2.2.1 Para agregar controles a la página
1. Haga clic en la pestaña Diseño para cambiar a la Vista de diseño.
2. Sitúe el punto de inserción al final del texto “Welcome to Visual Web Developer” y presione EN-TRAR al menos cinco veces para ampliar el espacio del cuadro del elemento div.
3. En el Cuadro de herramientas, expanda el grupo Estándar.
4. Arrastre un control TextBox hasta la página y colóquelo en el centro del cuadro del elemento div con el texto “Welcome to Visual Web Developer” en la primera línea.
5. Arrastre un control Button hasta la página y colóquelo a la derecha del control TextBox.
6. Arrastre un control Label hasta la página y colóquelo en una línea independiente debajo del con-trol Button.
7. Sitúe el punto de inserción encima del control TextBox y, a continuación, escriba el texto “Escriba su nombre:”.
8. Este texto HTML estático es el título del control TextBox. Puede mezclar HTML estático y controles de servidor en la misma página. La Figura 1.7 muestra cómo aparecen los tres controles en la Vista de diseño.
Figura 1.7
< > Programación
18
1.2.2.2 Para establecer las propiedades de los controles
1. Seleccione el control Button y después, en la ventana Propiedades, establezca Text en Display Name. El texto que escribió aparece en el botón en el diseñador, tal y como se muestra en la Figura 1.8.
Figura 1.8
2. Cambie a la vista Código fuente.
En la vista Código, se muestra el código HTML de la página, incluidos los elementos que Visual Studio ha creado para los controles de servidor. Los controles se declaran utilizando sintaxis de tipo HTML, con la excepción de que las etiquetas utilizan el prefijo asp: e incluyen el atributo runat=”server”.
Las propiedades del control se declaran como atributos. Por ejemplo, cuando estableció la pro-piedad Text del control Button en el paso 1, en realidad estableció el atributo Text del marcado del control.
Observe que todos los controles están dentro de un elemento form, que también tiene el atributo runat=”server”. El atributo runat=”server” y el prefijo asp: de las etiquetas de los con-troles marcan los controles para que ASP.NET los procese en el servidor cuando se ejecuta la página. El código que se encuentra fuera de los elementos <form runat=”server”> y <script runat=”server”> se envía sin cambios al explorador; este es el motivo por el que el código ASP.NET debe estar dentro de un elemento cuya etiqueta de apertura contiene el atributo runa-t=”server”.
3. Sitúe el punto de inserción detrás de asp:Label en la etiqueta <asp:Label> y, a continuación, presione la BARRA ESPACIADORA.
Aparece una lista desplegable que muestra las propiedades que se pueden establecer para un control Label. Esta característica, denominada IntelliSense, ayuda en la vista Código fuente con la sintaxis de los controles de servidor, los elementos HTML y otros elementos de la página. La Figura 1.9 muestra la lista desplegable de IntelliSense para el control Label.
< > Programación
19
Figura 1.9
4. Seleccione ForeColor y, a continuación, escriba un signo igual y comillas (=”).
IntelliSense muestra una lista de colores.
5. Seleccione un color para el texto del control Label. Asegúrese de seleccionar un color suficien-temente oscuro para que se pueda leer el texto sobre un fondo de color blanco.
El atributo ForeColor se completa con el color que ha seleccionado, incluidas las comillas de cierre.
1.2.2.3 Para agregar un controlador de eventos de botón predeterminado
1. Cambie a la Vista de diseño.
2. Haga doble clic en el control Button.
Visual Studio cambia a la vista Código y crea un esquema del controlador de eventos para el evento prede-terminado del control Button, es decir, el evento Click.
3. Dentro del controlador, escriba Label1 seguido de un punto (.).
< > Programación
20
Cuando se escribe un punto después de Label, Visual Studio muestra una lista de los miembros disponibles para el control Label, tal como se muestra en la Figura 1.10.
Figura 1.10
4. Complete el controlador de eventos Click para el botón de manera que tenga el aspecto mos-trado en el ejemplo de código siguiente
C#
protected void Button1_Click(object sender, System.EventArgs e)
{
Label1.Text = TextBox1.Text + “, welcome to Visual Studio!”;
}
5. Desplácese hasta el elemento <asp:Button>. Observe que el elemento <asp:Button> tiene aho-ra el atributo onclick=”Button1_Click”.
< > Programación
21
Este atributo enlaza el evento Click del botón al método controlador que codificó en el paso anterior.
Los métodos de control de eventos pueden tener cualquier nombre; el nombre que se ve es el nombre predeterminado creado por Visual Studio. Lo importante es que el nombre utilizado para el atributo onclick debe coincidir con el nombre de un método de la página.
1.2.3 Trabajar con archivos de código adjunto
1.2.4 Manejo de eventos
Cuando trabajas con controles de servidor en una página Web ASP.NET, mucha de la lógica de la página implica responder a los eventos provocados por controles.
Una característica importante de ASP.NET es que permite programar páginas Web utilizando un modelo basado en eventos similar al de las aplicaciones de cliente.
Sólo que los eventos producidos por los controles de servidor ASP.NET funcionan de manera diferente a los eventos de las páginas HTML tradicionales. La diferencia se basa principalmente en la separación existente entre el propio evento y el lugar donde se controla el evento.
En las aplicaciones basadas en cliente, los eventos se producen y controlan en el cliente y en las páginas Web ASP.NET, los eventos asociados a los controles de servidor se originan en el cliente (explorador) pero los controla la página ASP.NET en el servidor Web.
ASP.NET controla la tarea de capturar, transmitir e interpretar el evento. Al crear controladores de eventos en una página Web ASP.NET, no es necesario saber capturar la información del evento y hacer que esté disponible para el código. En cambio, se pueden crear controladores de eventos casi de la misma forma que en un formulario de cliente tradicional.
1.2.4.1 Conjunto de eventos para controles de servidor y páginas
Debido a que los eventos de controles de servidor ASP.NET requieren un viaje de ida y vuelta al servidor para procesarse, pueden afectar al rendimiento de una página.
Por lo tanto, los controles de servidor ofrecen un conjunto limitado de eventos, normalmente sólo de tipo clic.
Los eventos que tienen lugar con frecuencia (y que pueden provocarse sin que el usuario lo sepa), como onmouseover, no se pueden usar en los controles de servidor.
Los controles de servidor ASP.NET siguen pudiendo llamar a los controladores de cliente para esos eventos.
< > Programación
22
1.2.4.2 Argumentos de eventos
Los eventos de los controles y de páginas ASP.NET siguen un modelo de .NET Framework estándar para los métodos de controladores de eventos.
Todos los eventos pasan dos argumentos: un objeto que representa al objeto que ha provocado el evento, y un objeto evento que contiene la información específica del evento. El segundo argumento suele ser de tipo EventArgs, pero para algunos controles es de un tipo específico de dicho control.
Por ejemplo, para un control ImageButton de servidor Web, el segundo argumento es de tipo ImageClic-kEventArgs, que incluye información sobre las coordenadas donde el usuario ha hecho clic.
1.2.5 Controles de validación
Los controles de validación proporcionan un mecanismo fácil de utilizar para todos los tipos comunes de validación estándar (por ejemplo, probar fechas válidas o valores comprendidos en un intervalo), además de otras formas para proporcionar validación escrita personalizada.
Se pueden utilizar con cualquier control que se coloque en una página Web ASP.NET, incluidos los contro-les HTML y de servidor Web.
Estos controles llevan a cabo la validación (Validation controls) en el servidor. También es posible validar en el cliente gracias a código JavaScript y, en muchas ocasiones, ello puede ser válido para nuestros pro-pósitos, pero la validación en el servidor es necesaria para tareas más complejas en las que la seguridad adquiere mayor importancia, y Asp .NET tiene un mecanismo sencillo para realizarla.
Los Validation controls de Asp .NET permiten:
• Capturar y validar cualquier cosa enviada por el usuario desde un formulario Web
• Personalizar los avisos de error cuando los datos no pasan la validación
• Escribir validaciones personalizadas de acuerdo a nuestras preferencias
Todos los Validation controls son controles Web, se ejecutan en el servidor y generan HTML que es enviado al cliente. La sintaxis básica es similar en todos aunque hay diferencias en las propiedades que admiten, según el tipo de control.
1.2.5.1 Utilizar controles de validación
Los controles de validación más comunes son los siguientes:
CompareValidator: Compara un control de entrada de datos con otro, un valor fijo, un tipo de datos o un archivo. Por ejemplo, este control puede utilizarse para campos de verificación de contraseñas.
CustomValidator: Nos permite escribir nuestro propio código para crear la expresión de validación. Por ejemplo, este control puede utilizarse para verificar que el valor es un número primo.
< > Programación
23
RangeValidator: Verifica que la entrada de datos de usuario esta entre dos valores o los valores de otros controles de entrada de datos. Por ejemplo, este control puede utilizarse para verificar que la entrada del usuario coincide con el intervalo de edad esperado.
RegularExpressionValidator: Verifica que la entrada coincide con un modelo definido por una expresión habilitar. Este control de validación permite comprobar secuencias predecibles de caracteres, como núme-ros de la seguridad social, direcciones electrónicas, número de teléfono y códigos postales.
RequiredFieldValidator: Comprueba si se ha introducido un valor en un control. Es el único control de validación que requiere un valor.
ValidationSummary: Muestra un resumen de todos los errores de validación para todos los controles de validación de la página. Este control se ubica normalmente cerca del botón Submit para proporcionar res-puesta inmediata sobre el estado de entrada de datos de la página.
1.2.6 Depuración en aplicaciones web
Depurar las aplicaciones Web de ASP.NET es similar a depurar un formulario Windows Forms o cualquier otra aplicación para Windows porque ambos tipos de aplicación implican controles y eventos. No obstante, hay también diferencias básicas entre ambos tipos de aplicación:
El seguimiento del estado es más complejo en una aplicación Web.
En una aplicación para Windows, el código que se va a depurar está principalmente en un solo lugar; en una aplicación Web, el código puede estar en el cliente y en el servidor. El código de ASP.NET está comple-tamente en el servidor, si bien también puede haber código de JavaScript o Visual Basic en el cliente.
1.3 Acceso a datos desde aplicaciones web
1.3.1 Introducción a ADO.NET
ADO.NET es un conjunto de componentes del software que pueden ser usados por los programadores para acceder a datos y a servicios de datos. Es una parte de la biblioteca de clases base que están incluidas en el Microsoft .NET Framework.
Es comúnmente usado por los programadores para acceder y para modificar los datos almacenados en un Sistema Gestor de Bases de Datos Relacionales, aunque también puede ser usado para acceder a datos en fuentes no relacionales.
1.3.2 Controles de acceso a datos
La mayoría de las aplicaciones Web ASP.NET implican el acceso a datos. Muchas aplicaciones recogen datos para almacenarlos en una base de datos o en un archivo y, a menudo, se basan en información procedente de los usuarios.
Puesto que los datos originales pueden proceder de orígenes que no son de confianza (ya que la informa-
< > Programación
24
ción se almacena en un formato permanente) y hay que asegurarse de que los usuarios no autorizados no puedan obtener acceso al origen de datos directamente, es necesario prestar especial atención a los problemas de seguridad relacionados con el acceso a datos.
Aunque se puede mejorar la seguridad de la aplicación siguiendo las buenas prácticas en materia de co-dificación y configuración, también es importante mantener actualizado el servidor Web con las últimas actualizaciones de seguridad de Microsoft Windows e Internet Information Services (IIS), así como las ac-tualizaciones de seguridad de Microsoft SQL Server o cualquier otro software de base de datos.
1.3.2.1 Proteger el acceso a un origen de datos
Las secciones siguientes proporcionan información sobre cómo ayudar a proteger diferentes aspectos del acceso a datos.
1.3.2.2 Cadenas de conexión
Para conectar con una base de datos, se necesita una cadena de conexión. Puesto que las cadenas de co-nexión pueden contener datos confidenciales, se deben seguir estas instrucciones:
• No almacenes cadenas de conexión en ninguna página. Almacénelas en el archivo Web.config del sitio.
• No almacenes cadenas de conexión como texto sin formato. Para proteger la conexión al servidor de bases de datos, se recomienda cifrar la información de la cadena de conexión del archivo de configuración mediante la configuración protegida. Conexión a bases de datos
1.3.3 Administrar información de la base de datos desde una aplicación web
Si es posible, conéctate a una instancia de SQL Server utilizando la seguridad integrada en lugar de un nombre de usuario explícito y una contraseña. De esta forma, se evita la posibilidad de comprometer la integridad de la cadena de conexión y de exponer el identificador de usuario y la contraseña.
Se recomienda que te asegures de que la identidad del proceso (por ejemplo, la agrupación de aplica-ciones) que está ejecutando ASP.NET sea la cuenta de proceso predeterminada o una cuenta de usuario restringida.
En los casos en los que distintos sitios Web conectan con diversas bases de datos de SQL Server, puede que no resulte práctico utilizar la seguridad integrada. Por ejemplo, en los sitios de alojamiento Web, se suele asignar a cada cliente una base de datos de SQL Server diferente, pero todos utilizan el servidor Web como usuarios anónimos. En estos casos, debe utilizar credenciales explícitas para conectarse a una instancia de SQL Server.
< > Programación
25
1.3.3.1 Permisos de base de datos de SQL Server
Se recomienda asignar los privilegios mínimos al identificador de usuario que se utiliza para la conexión a las bases de datos de SQL Server usadas en la aplicación.
1.3.3.2 Restringir las operaciones de SQL
Los controles enlazados a datos pueden admitir una gran variedad de operaciones con datos como selec-ción, inserción, eliminación y actualización de registros en las tablas de datos. Se recomienda configurar los controles de datos para realizar la funcionalidad mínima necesaria de la página o aplicación. Por ejemplo, si un control no debe permitir a los usuarios que eliminen datos, no incluya una consulta Delete con un control de origen de datos y no permita eliminación en el control.
1.3.3.3 SQL Server Express
Para asociar un proceso a una base de datos de SQL Server Express (archivo .mdf), debe tener permisos de administrador. En general, esta es la razón por la que las bases de datos de SQL Server Express no son prácticas para la creación de sitios Web, ya que el proceso de ASP.NET no se ejecuta (ni se debe ejecutar) con privilegios administrativos. Por consiguiente, utilice las bases de datos de SQL Server Express sólo en los siguientes casos:
Como base de datos de prueba al desarrollar la aplicación Web. Cuando estés listo para implementar la aplicación, puede transferir la base de datos de SQL Server Express a una instancia de producción de SQL Server.
Utilízalas si estás ejecutando un sitio Web que permita la suplantación y pueda controlar los privilegios del usuario suplantado. En la práctica, esta estrategia es conveniente si la aplicación se está ejecutando en una red de área local (no en un sitio Web público).
Almacena el archivo .mdf en la carpeta App_Data del sitio porque el contenido de la carpeta no se devolve-rá para enviar solicitudes HTTP. También debes asignar la extensión .mdf a ASP.NET en IIS y al controlador HttpForbiddenHandler en ASP.NET mediante el siguiente elemento en el archivo Web.config del sitio:
“<httpHandlers>”
“ <add verb=”*” path=”*.mdf” type=”System.Web.HttpForbiddenHandler” />”
“</httpHandlers>”
• Conocer las capacidades básicas del lenguaje de programación PHP.
• Conocer la sintaxis del lenguaje, tipos de datos y su manejo en PHP, operadores y expresiones, estructuras de control y funciones.
• Trabajar con pequeñas funciones que permitan manipular datos.
• Realizar aplicaciones web sencillas centradas en el uso de formularios.
< > Programación
27
2 Introducción a PHP
PHP (acrónimo de PHP: Hypertext Preprocessor) es un lenguaje de código abierto especialmente adecua-do para desarrollo web y que puede ser incrustado en HTML.
PHP nos permite embeber sus pequeños fragmentos de código dentro de la página HTML y realizar deter-minadas acciones de una forma fácil y eficaz, combinando lo que ya sabemos del desarrollo HTML.
Es decir, con PHP escribimos scripts dentro del código HTML.
2.1 Sintaxis Básica de PHP
2.1.3.1 Etiquetas de PHP
Cuando PHP interpreta un archivo, busca las etiquetas de apertura y cierre, que son:
<?php inicializa
?> finaliza la interpretación del código.
Este mecanismo permite a PHP ser incrustado en todo tipo de documentos, ya que todo lo que esté fuera de las etiquetas de PHP será ignorado por el intérprete.
Ejemplo
<?php
echo “Hola mundo”;
// ... más código
echo «Última sentencia»;
// el script finaliza aquí sin etiqueta de cierre de PHP
< > Programación
28
2.1.3.2 Separación de instrucciones
PHP requiere que las instrucciones terminen en punto y coma al final de cada sentencia.
<?php
echo ‘Esto es una prueba’;
?>
<?php echo ‘Esto es una prueba’ ?>
<?php echo ‘Hemos omitido la última etiqueta de cierre’;
Nota: La etiqueta de cierre de un bloque de PHP es opcional al final de un archivo
2.1.1 Declaración y uso de variables
En PHP las variables se representan con un signo de dólar seguido por el nombre de la variable. El nombre de la variable es sensible a minúsculas y mayúsculas.
Un nombre de variable válido tiene que empezar con una letra o un carácter de subrayado seguido de cual-quier número de letras, números y caracteres de subrayado.
Ejemplo:
<?php
$var1 = ‘Roberto’;
$Var2 = ‘Juan’;
echo “$var1, $Var2”; // imprime “Roberto, Juan”
$4site = ‘aun no’; // inválido; comienza con un número
$_4site = ‘aun no’; // válido; comienza con un carácter de subrayado
$täyte = ‘mansikka’; // válido; ‘ä’ es ASCII (Extendido) 228
?>
< > Programación
29
2.1.2 Operadores
Los operadores se pueden agrupar de acuerdo con el número de valores que toman.
Los operadores unarios toman sólo un valor, por ejemplo ! (el operador lógico de negación) o ++ (el ope-rador de incremento). Los operadores binarios toman dos valores, como los familiares operadores aritmé-ticos + (suma) y - (resta), y la mayoría de los operadores de PHP entran en esta categoría. Finalmente, hay sólo un operador ternario, “? :”, el cual toma tres valores y podríamos interpretarlo de la forma siguiente:
condición ? valorSiEsVerdadero : valorSiEsFalso
Un ejemplo sería:
<?php
$mensaje = ($dinero > 10) ? ‘Me puedo ir al cine!’ : ‘Me tengo que quedar en casa’;
?>
2.1.2.1 Operadores aritméticos
Ejemplo Nombre Resultado-$a Negación Opuesto de $a$a + $b Suma Suma de $a y $b$a - $b Resta Resta de $a y $b$a * $b Multiplicación Multiplicación de $a y $b$a / $b División División de $a y $b$a % $b Módulo Residuo de $a dividido entre $b
El operador de división (“/”) devuelve un valor flotante a menos que los dos operandos sean int (o strings que se conviertan a int) y los números sean divisibles, en cuyo caso será devuelto un valor int.
Los operandos del módulo se convierten en int (por extracción de la parte decimal) antes del procesamien-to.
El resultado del operador módulo % tiene el mismo signo que el dividendo — es decir, el resultado de $a % $b tendrá el mismo signo que $a. Por ejemplo:
<?php
echo (5 % 3).”\n”; // muestra 2
echo (5 % -3).”\n”; // muestra 2
echo (-5 % 3).”\n”; // muestra -2
< > Programación
30
echo (-5 % -3).”\n”; // muestra -2
?>
2.1.2.2 Operadores de asignación
El operador básico de asignación es “=”. Se podría inclinar a pensar primero que es como un “igual a”. No lo es. Realmente significa que el operando de la izquierda se establece con el valor de la expresión de la derecha (es decir, “se define como”).
El valor de una expresión de asignación es el valor asignado. Es decir, el valor de “$a = 3” es de 3. Esto permite hacer algunas cosas intrincadas:
<?php
$a = ($b = 4) + 5; // ahora $a es igual a 9 y $b se ha establecido en 4.
?>
2.1.2.3 Operadores bit a bit
Los operadores bit a bit permiten la evaluación y la manipulación de bits específicos dentro de un integer.
Ejemplo Nombre Resultado$a & $b AND (Y) Los bits que están activos en am-
bos $a y $b son activados$a | $b OR (O inclusivo) Los bits que están activos ya sea
en $a o $b son activados$a ^ $b XOR (O exclusivo) Los bits que están activos en $a
o en $b , pero no en ambos son activados
~ $a NOT (No) Los bits que están activos en $a son desactivados y viceversa
$a << $b SHIFT LEFT (desplazamiento a la izquierda)
Desplaza los bits de $a, $b pasos a la izquierda (cada paso quiere decir “multiplicar por dos”)
$a >> $b SHIFT RIGHT (desplazamiento a la derecha)
Desplaza los bits de $a, $b pasos a la derecha (cada paso quiere decir “dividir por dos”)
< > Programación
31
2.1.2.4 Operadores de comparación
Los operadores de comparación, como su nombre lo indica, permiten comparar dos valores. Puede tam-bién estar interesado en ver las tablas de comparación de tipos, ya que muestran ejemplos de las varias comparaciones relacionadas con tipos.
Ejemplo Nombre Resultado$a == $b Igual TRUE si $a es igual a $b después de la manipulación
de tipos$a === $b Idéntico TRUE si $a es igual a $b, y son del mismo tipo$a != $b Diferente TRUE si $a no es igual a $b después de la manipula-
ción de tipos$a <> $b Diferente TRUE si $a no es igual a $b después de la manipula-
ción de tipos$a != =$b No idéntico TRUE si $a no es igual a $b, o si no son del mismo
tipo$a < $b Menor que TRUE si $a es estrictamente menor que $b$a > $b Mayor que TRUE si $a es estrictamente mayor que $b
$a <= $b Menor o igual que TRUE si $a es menor o igual que $b$a >= $b Mayor o igual que TRUE si $a es mayor o igual que $b
Si se compara un número con un string o la comparación implica strings numéricos, entonces cada string es convertido en un número y la comparación realizada numéricamente. Estas reglas también se aplican a la sentencia switch. La conversión de tipo no tiene lugar cuando la comparación es === o !== ya que esto involucra comparar el tipo así como el valor.
Ejemplo:
<?php
var_dump(0 == “a”); // 0 == 0 -> true
var_dump(“1” == “01”); // 1 == 1 -> true
var_dump(“10” == “1e1”); // 10 == 10 -> true
var_dump(100 == “1e2”); // 100 == 100 -> true
switch (“a”) {
case 0:
echo “0”;
break;
< > Programación
32
case “a”: // nunca alcanzado debido a que “a” ya ha coincidido con 0
echo “a”;
break;
}
?>
2.1.3 Estructuras de control
Todo script PHP está construido en base a una serie de sentencias. Una sentencia puede ser una asigna-ción, una llamada de función, un ciclo, una sentencia condicional o incluso una sentencia que no hace nada (una sentencia vacía). Las sentencias generalmente finalizan con un punto y coma.
Adicionalmente, las sentencias pueden agruparse en un conjunto de sentencias, encapsulándolas entre corchetes. Un grupo de sentencias es una sentencia por sí misma también.
2.1.3.1 if
Permite la ejecución condicional de fragmentos de código. PHP dispone de una estructura if que es similar a la de C:
if (expr)
sentencia
la expresión es evaluada a su valor booleano. Si la expresión se evalúa como TRUE, PHP ejecutará la sen-tencia y si se evalúa como FALSE la ignorará.
El siguiente ejemplo mostraría a es mayor que b si $a es mayor que $b:
<?php
if ($a > $b) {
echo “a es mayor que b”;
}
?>
< > Programación
33
A menudo se desea tener más de una sentencia para ser ejecutada condicionalmente. Por supuesto, no hay necesidad de envolver cada sentencia con una cláusula if. En cambio, se pueden agrupar varias senten-cias en un grupo de sentencias.
Por ejemplo, este código mostraría a es mayor que b si $a es mayor que $b y entonces asignaría el valor de $a a $b:
<?php
if ($a > $b) {
echo “a es mayor que b”;
$b = $a;
}
?>
2.1.3.2 else
Con frecuencia si deseas ejecutar una sentencia si una determinada condición se cumple y una sentencia diferente si la condición no se cumple. Esto es para lo que sirve else. El else extiende una sentencia if para ejecutar una sentencia en caso que la expresión en la sentencia if se evalúe como FALSE.
Por ejemplo, el siguiente código deberá mostrar a es mayor que b si $a es mayor que $b y a NO es mayor que b en el caso contrario:
<?php
if ($a > $b) {
echo “a es mayor que b”;
} else {
echo “a NO es mayor que b”;
}
?>
La sentencia else sólo es ejecutada si la expresión if es evaluada como FALSE.
< > Programación
34
2.1.3.3 elseif / else if
elseif, como su nombre lo sugiere, es una combinación de if y else. Del mismo modo que else, extiende una sentencia if para ejecutar una sentencia diferente en caso que la expresión if original se evalúe como FALSE.
Sin embargo, a diferencia de else, esa expresión alternativa sólo se ejecutará si la expresión condicional del elseif se evalúa como TRUE.
Por ejemplo, el siguiente código debe mostrar a es mayor que b, a es igual que b o a es menor que b:
<?php
if ($a > $b) {
echo “a es mayor que b”;
} elseif ($a == $b) {
echo “a es igual que b”;
} else {
echo “a es menor que b”;
}
?>
Puede haber varios elseif dentro de la misma sentencia if. La primera expresión elseif (si hay alguna) que se evalúe como TRUE sería ejecutada. En PHP también se puede escribir ‘else if’ (en dos palabras) y el com-portamiento sería idéntico al de ‘elseif’ (en una sola palabra).
La sentencia elseif es ejecutada solamente si la expresión if precedente y cualquiera de las expresiones elseif precedentes son evaluadas como FALSE, y la expresión elseif actual se evalúa como TRUE.
2.1.3.4 while
Los ciclos while son el tipo más sencillo de ciclo en PHP. La forma básica de una sentencia while es:
while (expr)
sentencia
El significado de una sentencia while es simple. Le dice a PHP que ejecute las sentencias anidadas, mientras que la expresión while se evalúe como TRUE. El valor de la expresión es verificado cada vez al inicio del ciclo, por lo que incluso si este valor cambia durante la ejecución de las sentencias anidadas, la ejecución no se detendrá hasta el final de la iteración (cada vez que PHP ejecuta las sentencias contenidas en el ciclo es una iteración).
< > Programación
35
A veces, si la expresión while se evalúa como FALSE desde el principio, las sentencias anidadas no se eje-cutarán ni siquiera una vez.
Al igual que con la sentencia if, se pueden agrupar varias instrucciones dentro del mismo ciclo while ro-deando un grupo de sentencias con corchetes, o utilizando la sintaxis alternativa:
while (expr):
sentencias
...
end while;
Los siguientes ejemplos son idénticos y ambos presentan los números del 1 al 10:
<?php
/* ejemplo 1 */
$i = 1;
while ($i <= 10) {
echo $i++; /* el valor presentado sería $i antes del incremento (post-incremento) */
}
/* ejemplo 2 */
$i = 1;
while ($i <= 10):
echo $i;
$i++;
endwhile;
?>
< > Programación
36
2.1.3.5 do-while
Los ciclos do-while son muy similares a los ciclos while, excepto que la expresión verdadera es verificada al final de cada iteración en lugar de al principio. La diferencia principal con los ciclos while es que está garantizado que corra la primera iteración de un ciclo do-while (la expresión verdadera sólo es verificada al final de la iteración), mientras que no necesariamente va a correr con un ciclo while regular (la expresión verdadera es verificada al principio de cada iteración, si se evalúa como FALSE justo desde el comienzo, la ejecución del ciclo terminaría inmediatamente).
Hay una sola sintaxis para ciclos do-while:
<?php
$i = 0;
do {
echo $i;
} while ($i > 0);
?>
El ciclo de arriba se ejecutaría exactamente una sola vez, ya que después de la primera iteración, cuando la expresión verdadera es verificada, se evalúa como FALSE ($i no es mayor que 0) y termina la ejecución del ciclo.
2.1.3.6 for
Los ciclos for son los más complejos en PHP. Se comportan como sus homólogos en C#. La sintaxis de un ciclo for es:
for (expr1; expr2; expr3)
sentencia
La primera expresión (expr1) es evaluada (ejecutada) una vez incondicionalmente al comienzo del ciclo.
En el comienzo de cada iteración, se evalúa expr2. Si se evalúa como TRUE, el ciclo continúa y se ejecutan la(s) sentencia(s) anidada(s). Si se evalúa como FALSE, finaliza la ejecución del ciclo.
Al final de cada iteración, se evalúa (ejecuta) expr3.
Cada una de las expresiones puede estar vacía o contener múltiples expresiones separadas por comas. En expr2, todas las expresiones separadas por una coma son evaluadas, pero el resultado se toma de la última parte. Que expr2 esté vacía significa que el ciclo debería ser corrido indefinidamente (PHP implícitamente lo considera como TRUE, como en C).
< > Programación
37
Ejemplo. Muestra los números del 1 al 10:
<?php
for ($i = 1; $i <= 10; $i++) {
echo $i;
}
2.1.4 Arreglos
Un arreglo es realmente un mapa ordenado. Un mapa es un tipo de datos que asocia valores con claves.
Este tipo es optimizado para varios usos diferentes; puede ser usado como una matriz real, una lista (vec-tor), una tabla asociativa (una implementación de un mapa), diccionario, colección, pila, cola, y posible-mente más. Ya que los valores de un arreglo pueden ser otros arreglos, árboles y también son posibles arreglos multidimensionales.
Sintaxis:
Especificación con array()
Un arreglo puede ser creado usando el constructor del lenguaje array(). Éste toma un cierto número de parejas clave => valor como argumentos.
array(
clave => valor,
clave2 => valor2,
clave3 => valor3,
...
)
La coma después del elemento del arreglo es opcional y se puede omitir. Esto normalmente se hace para arreglos de una sola línea, esto es, es preferible array(1, 2) que array(1, 2, ).
Por otra parte, para arreglos multilínea, la coma final se usa comúnmente, ya que permite la adición sen-cilla de nuevos elementos al final.
Ejemplo #1: Un arreglo simple
<?php
$array = array(
“foo” => “bar”,
“bar” => “foo”,
);
< > Programación
38
2.1.5 Funciones
La función podría ser definida como un conjunto de instrucciones que explotan ciertas variables para rea-lizar una tarea más o menos elemental.
PHP basa su eficacia principalmente en este tipo de elemento. Una gran librería que crece constantemen-te, a medida que nuevas versiones van surgiendo, es complementada con las funciones de propia cosecha dando como resultado un sinfín de recursos que son aplicados por una simple llamada.
Las funciones integradas en PHP son muy fáciles de utilizar. Tan sólo hemos de realizar la llamada de la forma apropiada y especificar los parámetros y/o variables necesarios para que la función realice su tarea.
Lo que puede parecer ligeramente más complicado, pero que resulta sin lugar a dudas muy práctico, es crear nuestras propias funciones. De una forma general, podríamos crear nuestras propias funciones para conectarnos a una base de datos o crear los encabezados o etiquetas meta de un documento HTML. Para una aplicación de comercio electrónico podríamos crear por ejemplo funciones de cambio de una moneda a otra o de cálculo de los impuestos a añadir al precio de artículo. En definitiva, es interesante crear funcio-nes para la mayoría de acciones más o menos sistemáticas que realizamos en nuestros programas.
Un esqueleto típico de una función es:
function outputcol($strCadena, $strColor) {
// Saca una cadena con el color deseado
Echo(“<FONT COLOR=”#$strColor”>$strCadena</FONT>”);
}
Y se llama con:
outputcol(“Rojo”, “FF0000”);
outputcol(“Verde”, “00FF00”);
Dando el resultado:
<FONT COLOR=”#FF0000”>Rojo</FONT>
<FONT COLOR=”#00FF00”>Verde</FONT>
< > Programación
39
2.1.6 Incluir funciones en un script
Un script es un conjunto de instrucciones generalmente almacenadas en un archivo de texto que deben ser interpretados línea a línea en tiempo real para su ejecución, se distinguen de los programas, pues de-ben ser convertidos a un archivo binario ejecutable para correrlos.
Los scripts pueden estar embebidos en otro lenguaje para aumentar las funcionalidades de este, como es el caso los scripts PHP o Javascript en código HTML.
Aquí daremos el ejemplo de creación de una función que, llamada al comienzo de nuestro script, nos crea el encabezado de nuestro documento HTML y coloca el título que queremos a la página:
< ?
function hacer_encabezado($titulo)
{
$encabezado=”<html><head>t<title>$titulo</title></head>”;
echo $encabezado;
}
?>
Esta función podría ser llamada al principio de todas nuestras páginas de la siguiente forma:
$titulo=”Mi web”;
hacer_encabezado($titulo);
De esta forma automatizamos el proceso de creación de nuestro documento. Podríamos por ejemplo in-cluir en la función otras variables que nos ayudasen a construir la etiquetas meta y de esta forma, con un esfuerzo mínimo, crearíamos los encabezados personalizados para cada una de nuestras páginas. De este mismo modo nos es posible crear cierres de documento o formatos diversos para nuestros textos como si se tratase de hojas de estilo que tendrían la ventaja de ser reconocidas por todos los navegadores.
Por supuesto, la función ha de ser definida dentro del script ya que no se encuentra integrada en PHP sino que la hemos creado nosotros.
< > Programación
40
2.2 Librerías de PHP
2.2.1 Funciones para trabajar con arreglos
Algunas de las funciones más utilizadas y útiles con respecto a arreglos son:
2.2.1.1 array_diff
Muestra las diferencias entre un arreglo y otro:
$a = array( “hola”, “adios”, “como” );
$b = array( “hola”, “va”, “como” );
$dif = array_diff( $a, $b );
print_r($dif);
mostrará algo asi:
Array
(
[1] => “adios”
)
2.2.1.2 array_search
Buscará un valor específico en un arreglo y devuelve el índice si lo encuentra, por ejemplo:
$a = array( 0 => “Justi”, 1 => “Thor”, 2 => “Debi” );
$key = array_search(’Debi’, $a);
La variable $key va a tener valor 2.
< > Programación
41
2.2.1.3 in_array
Es similar a la anterior pero en lugar de devolver el indice de la coincidencia, devuelve true o false.
Por ejemplo:
if ( in_array( “Justi”, $a ) ) {
$cuerso = “php”;
}
A continuación mostramos una lista de otras funciones:
Sort(): Nos permite ordenar los elementos de un array de un orden numérico o alfabético del siguiente modo: Primero los números, luego signos de puntuación y finalmente las letras.
Asort(): Nos permite ordenar el array de índice de texto manteniendo el valor de sus índices.
Rsort(): Igual que la función sort() con la diferencia de que el ordenamiento es a la inversa de dicha fun-ción.
Arsort(): Idem que asort() con la diferencia de que el ordenamiento es en forma descendente.
Ksort(): Ordena el arreglo de acuerdo con su índice.
Krsort(): Opera de manera idéntica a la explicada anteriormente pero ordena el array de acuerdo a su índice con orden inverso.
Shuffle(): Función que nos permite mezclar los elementos de un array.
Range(): Con esta función definimos rapidamente un array definiendo un rango de elementos entre los dos parámetros de inicio y de fin.
2.2.2 Funciones para trabajar con cadenas
A continuación le mostramos una lista de las 10 funciones más utilizadas con cadenas:
Strtolower(string): Nos permite convertir una cadena a minúsculas, por ejemplo tenemos un libro de visi-tas donde no aceptamos mayúsculas, solo debemos usar esta función y pasará automáticamente todo el texto a minúsculas.
Trim(string): Elimina los espacios en blanco al final y al inicio de una cadena. En caso de que solo quera-mos borrar los espacios al principio de la cadena usamos itrim() y en caso de que sea al final usaremos la
< > Programación
42
función chop(), esto sirve para por ejemplo cuando se crea un usuario que el mismo no pueda contener espacios ni al principio ni al fin del mismo.
Strlen(string): Función muy útil ya que nos permite saber la cantidad de caracteres que tiene una cadena con lo cual podríamos saber si supera el largo deseado.
Chr(valor ascii): Recibe como parámetro un carácter ascii y devuelve su equivalente.
Substr(“cadena original”, inicio_a_extraer, largo_a_extraer): Esta función nos permitirá extraer parte de una cadena la cual le es pasada como parámetro.
Ereg(“busqueda”, “cadena”): Esta función nos permite buscar una cadena dentro de otra cadena y nos devolverá verdadero en caso de encontrarla por lo cual su utilización viene acompañada de un if.
Eregi(“busqueda”, “cadena”): Igual que la anterior pero esta función no hace diferencias entre mayúsculas y minúsculas.
Ereg_replace(“busqueda”, “reemplazo”, “cadena”): Esta función nos permite buscar una cadena dentro de otra y reemplazarla por la que hemos definido como segundo parámetro.
Eregi_replace(“busqueda”, “reemplazo”, “cadena”): Funciona como la anterior pero no diferencia entre mayúsculas y minúsculas.
Split(“separador”, “cadena”): Nos permite separar una cadena de caracteres con el valor que le pasamos como parámetro de separador.
2.2.3 Funciones para trabajar con fecha y hora
Algunas de las funciones más utilizadas son las siguientes:
checkdate — Validar una fecha gregoriana.
date_default_timezone_get — Obtiene la zona horaria predeterminada usada por todas las funciones de fecha/hora en un script.
date_default_timezone_set — Establece la zona horaria predeterminada usada por todas las funciones de fecha/hora en un script.
< > Programación
43
2.3 Creación de Formularios con PHP
Otra de las características más importantes de PHP es que gestiona formularios HTML. El concepto básico que es importante entender es que cualquier elemento de los formularios estará disponible automática-mente en su código PHP.
Ejemplo #1 Un formulario HTML simple
<form action=”accion.php” method=”post”> <p>Su nombre: <input type=”text” name=”nombre” /></p> <p>Su edad: <input type=”text” name=”edad” /></p> <p><input type=”submit” /></p> </form>
2.3.1 Elementos de un formulario
2.3.1.1 TEXT
Introduzca la cadena a buscar:
<INPUT TYPE=”text” NAME=”cadena” VALUE=”valor por defecto” SIZE=”20”> <?PHP print ($cadena); //print ($_REQUEST [‘cadena’]); ?>
El resultado dell código anterior se puede ver en la figura 2.1.
Figura 2.1
< > Programación
44
2.3.1.2 RADIO
<INPUT TYPE=”radio” NAME=”titulacion” VALUE=“II“ CHECKED>I.Informática<INPUT TYPE=”radio” NAME=”titulacion” VALUE=”ITIG”>I.T.I. Gestión<INPUT TYPE=”radio” NAME=”titulacion” VALUE=”ITIS”>I.T.I. Sistemas<?PHP print ($titulacion); //print ($_REQUEST [‘titulacion’]);?>El resultado dell código anterior se puede ver en la figura 2.2.
Figura 2.2
2.3.1.3 CHECKBOX
<INPUT TYPE=”checkbox” NAME=”extras[]” VALUE=”garaje” CHECKED>Garaje <INPUT TYPE=”checkbox” NAME=”extras[]” VALUE=”piscina”>Piscina <INPUT TYPE=”checkbox” NAME=”extras[]” VALUE=”jardin”>Jardín <?PHP $n = count ($extras); for ($i=0; $i<$n; $i++) print (“$extras[$i]<BR>\n”); //foreach ($_REQUEST[‘extras’] as $extra) //print (“$extra<BR>\n”); ?>
El resultado dell código anterior se puede ver en la figura 2.3.
Figu 2.3
< > Programación
45
2.3.1.4 BUTTON
<INPUT TYPE=”button” NAME=”nueva” VALUE=”Añadir una más”>
<?PHP if ($nueva) print (“Se va a añadir una nueva”); //if ($_REQUEST [‘nueva’]) //print (“Se va a añadir una nueva”); ?>
El resultado dell código anterior se puede ver en la figura 2.4.
Figura 2.4
2.3.1.5 FILE
<FORM ACTION=”procesa.php” METHOD=”post“ ENCTYPE=”multipart/form-data”> <INPUT TYPE=”file” NAME=”fichero”></FORM>
El resultado dell código anterior se puede ver en la figura 2.5.
Figura 2.5
< > Programación
46
2.3.1.6 PASSWORD
Contraseña: <INPUT TYPE=”password” NAME=”clave”>
<?PHP print ($clave); //print ($_REQUEST [‘clave’]);?>
El resultado dell código anterior se puede ver en la figura 2.6.
Figura 2.6
2.3.1.7 SUBMIT
<INPUT TYPE=”submit” NAME=”enviar” VALUE=”Enviar datos”>
<?PHP if ($enviar) print (“Se ha pulsado el botón de enviar”); //if ($_REQUEST [‘enviar’]) //print (“Se ha pulsado el botón de enviar”);?>
El resultado dell código anterior se puede ver en la figura 2.7.
Figura 2.7
< > Programación
47
2.3.2 Validación de datos en un formulario
Toda la información proveniente de un formulario debe considerarse por norma como contaminada, y hay que validarla antes de darla por buena y procesarla
La validación de datos se hace verdaderamente importante para cualquier proyecto, ya que así impe-dimos que los usuarios que hagan uso del software tengan menos posibilidad de cometer errores en el traspaso de datos.
La validación de datos se hace de distintas formas, pero también hay distintos tipos, por ejemplo, lo pri-mero que tenemos que validar es si el usuario ingresó o no datos, luego validamos los tipos de datos que el usuario introduzca en los formularios.
Lo más eficiente es mostrar los errores sobre el propio formulario para facilitar su corrección. Procedi-miento:
si se ha enviado el formulario:
si hay errores:
Mostrar formulario con errores
si no:
Procesar formulario
fsi
si no:
Mostrar formulario
Fsi
Este procedimiento se puede resumir para que sólo haya que mostrar una vez el formulario, bien con los valores por defecto o con los valores introducidos, y con los errores en su caso:
si se ha enviado el formulario:
validar datos
fsi
si se ha enviado el formulario y no hay errores:
Procesar formulario
si no:
Mostrar formulario con valores por defecto o ya enviados
fsi
• Conocer las capacidades de los dispositivos móviles y los tipos de aplicación adecuadas para dichos dispositivos.
• Comprender las características que conforman una aplicación web destinada a ambientes móviles.
• Conocer las mejores prácticas en el ciclo de desarrollo de aplicaciones web para dispositivos móviles.
< > Programación
49
3 Desarrollo de Aplicaciones Web para dispositivos móviles
3.1 Introducción
Una aplicación móvil es un software escrito para dispositivos móviles que realiza una tarea específica, como un juego, un calendario, un reproductor de música, etc.
Se define como nativa aquella aplicación específicamente diseñada para ejecutarse en el sistema opera-tivo de un dispositivo y en el firmware de la máquina, y que, por lo general, tiene que ser adaptada para distintos dispositivos.
Una aplicación Web o una aplicación de navegador, en cambio, es aquella en la cual la totalidad o algunas partes de los programas se descargan de la Web cada vez que se ejecuta. Por lo general, se puede acceder desde todos los dispositivos móviles con capacidad Web.
Para aplicaciones web para móviles, sin embargo, el interés de desarrolladores surgió sólo en los dos últi-mos años, específicamente después de la implementación exitosa por parte de Google de las aplicaciones basadas en HTML 5. Naturalmente, los sitios Web móviles habían existido mucho antes, por ejemplo, Portales WAP.
En cuanto a los motivos para preferir una aplicación nativa a una Web, la mayoría de los desarrolladores de aplicaciones nativas argumentan que la interfaz de usuario es superior y las oportunidades comerciales que ofrece por ejemplo, el iPhone App Store, son mejores.
3.1.1 Características de las aplicaciones para dispositivos móviles
• Mayor compatibilidad con diferentes modelos y sistemas operativos.
• No es necesario distribuir ni instalar ninguna aplicación.
• Podemos utilizar la aplicación en sistemas operativos propietarios que no permiten la instalación de aplicaciones Stand-alone.
• Podemos realizar cálculos y algoritmos complejos dado que la ejecución se realiza en el servidor.
• Se puede trabajar con gran cantidad de información.
< > Programación
50
3.2 Formularios Web con emuladores de dispositivos para móviles
3.2.1 Formularios Web para Móviles
Cuando se diseña un formulario que queremos que sea sencillo de usar en un móvil es útil aplicar la máxi-ma “Más es menos”, porque cuanto menor y más objetivo sea el formulario, más contentos estarán tus usuarios.
1.- Minimizar la entrada de texto
Como decíamos, cuanto menos texto haya que escribir, mucho mejor. Existen muchas veces opciones al-ternativas a un campo de texto, como cajas de selección, botones de radio, “sliders”, etc. En muchos casos sólo nos servirá colocar un campo de texto y tampoco debe significar un problema, pero al menos sí de-bemos minimizar el número de campos donde tener que escribir datos con el incómodo teclado virtual. Un claro ejemplo de este detalle es utilizar “datepickers”, para seleccionar una fecha en un calendario, en lugar de escribirla a mano.
2.- Minimizar el número de campos
Cuanto menor sea el número de campos del formulario como en la figura 3.1, también más satisfecho es-tará el usuario. En general, si hay campos prescindibles, se quitan y punto.
Figura 3.1
< > Programación
51
3.- Utilizar campos input del HTML5
En HTML5 existen diversos tipos nuevos de campos INPUT que pueden ayudarnos a mejorar la interfaz de entrada de datos en los formularios. Existen campos para selección de colores, fechas, meses, números, rangos, URL, email, etc. Estos campos muchas veces se implementan con ligeras diferencias en el nave-gador a los campos INPUT de texto de toda la vida, por ejemplo cambiando cosas como el “layout” del teclado virtual, para que muestre unas teclas u otras, dependiendo del tipo de campo y del dato que se supone tiene que introducirse en él.
4.- Alinear etiquetas arriba
Al lado de cada campo de formulario se suele colocar un texto explicativo que sirve para saber qué infor-mación se debe colocar en el campo, al que en inglés se le llama “label” y que se traduciría por etiqueta. Ese texto debe aparecer al lado del campo, pero debido al tamaño reducido de las pantallas de móviles, se recomendaría colocarlo en la parte de arriba del campo, en lugar de al lado, como se suele hacer en formularios habitualmente.
5.- Eliminar contenido accesorio
A veces los formularios para webs de escritorio tienen elementos accesorios para ayudar a rellenar el for-mulario, como “tips” que se activan al situarse sobre determinados campos o enlaces que pueden abrir capas flotantes o “pop-ups” para explicar ciertas informaciones. Generalmente, todos esos contenidos accesorios son prescindibles en formularios para móviles y los podemos eliminar sin ningún reparo.
6.- Evitar formularios multicolumna
Por motivos similares al de colocar las etiquetas arriba (poco espacio en las pantallas de los móviles), tam-bién es buena idea organizar los formularios en una única columna. Pero es que además, en este caso, los formularios de varias columnas a menudo son menos claros en el sentido de saber el orden en el que se supone que la información debe escribirse.
7.- Recordar datos introducidos anteriormente
En la medida de lo posible, siempre será de utilidad que nuestro sitio web sea lo suficientemente inteligen-te como para no solicitar datos que ya conocemos de antemano. Por ejemplo, si se le pidió al usuario el nombre en algún momento, es bueno introducirlo ya en el campo nombre del formulario, en vez de hacer que lo vuelva a escribir. Otro ejemplo: si es la segunda vez que se rellena ese formulario, determinados campos que se supone que no van a variar, aparecerán con el mismo texto introducido anteriormente. Para conseguir esto tendrás que utilizar algún lenguaje de programación, como Javascript en el lado del cliente o PHP en el lado del servidor, porque los formularios HTML de manera predeterminada no implementan esta funcionalidad.
< > Programación
52
8.- Obtener automáticamente los datos que se pueda
Existen diversas tecnologías asociadas al HTML5 que nos pueden ofrecer información del usuario de ma-nera automática y que, en la medida de lo posible, debemos utilizar para minimizar la entrada de datos por parte del usuario. El más claro ejemplo es la geolocalización, que nos permitiría averiguar dónde está físicamente ese usuario. De modo que, en vez de obligarle a escribir datos como su país, ciudad, etc. pode-mos ofrecer que el propio dispositivo defina su localización.
9.- Uso inteligente de los campos INPUT con autocompletar
Cuando debemos utilizar un campo INPUT para entrada de datos, algo que a veces es incluso más indicado que otras alternativas, siempre que sea posible se debe usar la función de autocompletar. Por ejemplo, pensemos en un campo país, que tiene más de 150 posibilidades. Podríamos hacerlo en un elemento SE-LECT, para que el usuario no tenga que teclear el nombre del país, pero puede ser incluso más cómodo un campo INPUT, en el que escribiendo una o dos letras ya proponga países que las contengan.
10.- Opción para ver la clave escrita en los campos “password”
Los campos donde escribir claves a menudo son un problema por los errores tipográficos, tan habituales en los teclados virtuales. No es mala idea crear un botón o algún elemento que nos permita ver escrita en texto plano la clave que el usuario ha escrito en un campo password. Eso debe ser una opción para el usuario, es decir, que si el usuario no la selecciona, el campo password, debe ocultar la clave escrita para mayor seguridad.
3.2.2 Redirección y detección de dispositivos móviles
Esta opción permite que el diseño de la página web se visualice correctamente en dispositivos móviles, re-direccionando automáticamente a los navegadores de los dispositivos móviles para que entren direc-tamente a la versión diseñada específicamente para estos, y que los navegadores de las PC´s de escritorio entren al sitio normal. Permite que el diseño de la página web se visualice correctamente en dispositivos móviles
< > Programación
53
3.3 Desarrollo de aplicaciones Web para dispositivos móviles
3.3.1 Consideraciones de diseño
Cuando se trata de diseñar un sitio web para móviles es necesario diseñar la aplicación para que pueda hacerse uso en dispositivos de diferentes compañías. Uno de los problemas más comunes experimentados por los diseñadores que trabajan en dispositivos móviles es el conocer cuáles son las proporciones reales de la pantalla de un dispositivo móvil (Figura 3.2).
El iPhone es de 320 píxeles de ancho por 480 píxeles de alto.
Muchos dispositivos de Nokia N-Series son 240 píxeles de ancho por 320 píxeles de alto.
Los dispositivos más nuevos a menudo apoyan un modo apaisado donde la anchura y la altura se invierte de forma espontánea.
Los dispositivos de Nokia más populares disponen de pantallas que van de 176 por 208 píxeles hasta 352 por 416 píxeles.
Las resoluciones de pantalla Blackberry variar desde 160 x 160 píxeles hasta a 324 x 352 píxeles.
Figura 3.2
< > Programación
54
3.3.2 Diseño de la interface
Existen muchos modelos de dispositivos, es posible agrupar muchos dispositivos con un ancho de pantalla similar (Figura3.3) y acabar con cinco grupos con diferentes anchos de pantalla:
Figura 3.3.
NOTA: Las medidas de una pantalla siempre se miden en diagonal y la unidad de medida
es la pulgada
• tiny: 84px, 96px, 101px, 128px, 130px, 132px
• pequeña: 160px, 176px
• medio: 208px, 220px, 240px
• grande: 320px, 360px, 480px o superior (Figura 3.4)
• escritorio: 800px o superior
< > Programación
55
Figura 3.4
Estas agrupaciones son arbitrarias, y los requisitos de un proyecto pueden dictar un conjunto muy dife-rente. Por ejemplo 320 pixeles para el Iphone y poco más de 240 pixeles para navegadores móviles más recientes y 128 pixeles para dispositivos más antiguos. La definición de las agrupaciones de dispositivos realmente se reduce a los objetivos y las necesidades del proyecto.
Cada dispositivo tiene capacidades diferentes, no todos soportan CSS avanzado, manipulación del DOM y JavaScript. Antes de hacer las agrupaciones comentadas anteriormente, debemos asegurarnos que los dispositivos móviles son compatibles con las tecnologías que ofrecerá el proyecto Web.
www.grupoeduit.com
01 800 808 62 40
