Transcript MoreLab - Mobility Research Lab
Cliente Ligero en .NET
Tema 4 – ASP.NET
http://paginaspersonales.deusto.es/dipina/MasterISW/
Dr. Diego Lz. de Ipiña Gz. de Artaza
http://paginaspersonales.deusto.es/dipina (Personal) http://www.morelab.deusto.es
(Research Group) http://www.smartlab.deusto.es
http://www.ctme.deusto.es
(Research Lab) (Cátedra de Telefónica Móviles) http://www.tecnologico.deusto.es
(Tecnológico-Fundación Deusto)
ASP.NET
Sucesor de Microsoft a la popular plataforma ASP para el desarrollo de aplicaciones web Configuración:
Atención: Si no funciona, re-registrar ASP.NET bajo IIS: aspnet_regiis.exe -i 2/126
Ejemplo HTML: simple.html
Hola mundo
3/126
Ejemplo Petición HTTP
GET /simple.html HTTP/1.1
Accept: */* Accept-Language: en-us Accept-Encoding: gzip, deflate If-Modified-Since: Wed, 24 Oct 2001 14:12:36 GMT If-None-Match: "50b0d3ee955cc11:a78" User-Agent: Mozilla/4.0.(compatible; MSIE.6.0; Windows NT 5.1) Host: www.wintellect.com
Connection: Keep-Alive [blank line] 4/126
Ejemplo Respuesta HTTP
HTTP/1.1 200 OK Server: Microsoft-IIS/5.0
Date: Wed, 24 Oct 2001 14:12:37 GMT Content-Type: text/html Accept-Ranges: bytes Last-Modified: Wed, 24 Oct 2001 14:00:53 GMT ETag: "d02acf81975cc11:a78" Content-Length: 46 [blank line]
Hola mundo 5/126ASP.NET vs. ASP
Active Server Pages (ASP) ofrecen un simple modelo de programación en el que se puede combinar código fuente y de marcado Provee una serie de objetos prefabricados como Request Response y El código fuente se suele realizar normalmente con VBScript, popular con programadores Visual Basic.
Este código se coloca entre los delimitadores ‘ <% ’ y ‘ %> ’ 6/126
Ejemplo ASP
Hello ASP Application
7/126ASP.NET
Los ficheros ASP.NET tienen extensión aspx .
El código en un ASP.NET es muy similar al de ASP con las siguientes diferencias:
La lógica de la página está codificada en C# o VB.NET. El código es compilado cuando la petición de la página es recibida y se cachea para ser reutilizada La directiva <%@Import Namespace=“...”%> permite importar espacios de nombres y utilizar el poder de la framework .NET
8/126
Ejemplo ASP.NET
<%@ Page Language="C#"%> <%@ Import Namespace="System.Web.UI"%>
Hello ASP.NET Application
9/126La clase System.Web.UI.Page
En el anterior listado encontramos la línea: string firstName = this.Request.Form[“firstName”]; El this en esta sentencia es una referencia a una instancia de System.Web.UI.Page
, objeto que representa a una página ASP.NET
Los objetos Request y Response propiedades de la clase Page de ASP son ahora El siguiente ejemplo muestra algunas de las propiedades de Request 10/126
Usando Page.Request
Page.Response
I y
<%@ Page Language="C#" Debug="true"%>
Page Properties
<% dumpProps(); %> 11/126Usando Page.Request
Page.Response
II y
12/126
Recuperando Datos de Formularios con Request
Propiedades:
RequestType : Usando GET recuperaríamos los datos de QueryString Control=Valor&Control=Valor Usando POST de la propiedad Form Request.Form["Direccion"] La propiedad Params incluye además de los datos de un formulario, las cookies y las variables del servidor 13/126
Formulario ASP.NET
Un elemento FORM en el que no aparece ni action method Estos atributos son substituidos por runat="server" ni Indica que el motor ASP.NET debe procesar el contenido del formulario Controles asp:TextBox , asp:Button y similares Los formularios ASP.NET facilitan el desarrollo de páginas dinámicas Podemos acceder a los elementos del formulario directamente ( Nombre.Text
), en vez de a través de QueryString o Params .
14/126
Ciclo de Vida del Objeto Page
Cuando una petición HTTP es recibida ASP.NET responde creando y devolviendo una página Este proceso genera varios eventos La clase Page contiene varios métodos heredados de System.Web.UI.Control
que se pueden utilizar para manejar estos eventos: OnInit OnLoad página inicialización requerida por la página ejecuta acciones comunes a cada petición HTTP de un OnPreRender visualice para hacer cualquier cosa antes que la página se OnUnload sirve para realizar tareas como desconectarse de una base de datos cuando la página se descarga 15/126
Manejando Eventos de Página
<%@ Page Language="C#" Debug="true" %>
Page Events...
16/126Creando un Directorio Virtual I
1.
2.
Creamos el directorio virtual ejemplosASP.NET
: Hacemos doble click en Herramientas Administrativas Doble click en Internet Information Services 17/126
Creando un Directorio Virtual II
3.
Creamos el directorio virtual ejemplosASP.NET
: Hacemos clic con el botón derecho del ratón en Default Web Site y luego seleccionamos New Virtual Directory 4.
Seleccionamos el directorio donde vamos a dejar los fichero accesibles por el contexto ‘ ejemplosASP.NET
’ 18/126
Web Forms y Server Controls
Un Web Form es un formulario con el atributo runat="server" que hace que se procese en la parte servidora Un Server Control es un control que también tiene el atributo runat="server" Tanto los web forms como los server controls son procesados en el servidor y generan HTML y JavaScript que son enviados al navegador 19/126
Ejemplo Web Form I
<%@ Page Language="C#" Debug="true" %> 20/126
Ejemplo Web Form II
Hello Web Form
21/126Ejemplo Web Form III
Puntos de interés:
Declaración del formulario mediante
En vez de usar HTML usamos etiquetas asp como:22/126
Ejemplo Web Form IV
23/126
Ejemplo Web Form V
Los controles del servidor preservan su valor a través de peticiones HTTP Lo hacen guardando las propiedades en un variable de nombre __VIEWSTATE El valor de __VIEWSTATE es una cadena de caracteres codificada en base-64.
Los controles generan eventos que pueden ser tratados por handlers. Por ejemplo:
Codificación Base 64
Subconjunto de 64 caracteres ASCII que permiten a grupos de 6 bits ser representados por un carácter El proceso de codificación representa grupos de 24 bits de entrada (3 bytes de entrada) como un string de salida con 4 bytes de salida (2^6)
Referencia: http://en.wikipedia.org/wiki/Base64
25/126
System.Web.UI.WebControls y System.Web.UI.HtmlControls
El espacio de nombres System.Web.UI.WebControls
montón de controles, entre ellos: Button Calendar CheckBoxList DataGrid DataList DropDownList Label Panel define un Etc.
En System.UI.HtmlControls
como HtmlAnchor uno-a-uno con la etiqueta HTML equivalente, p.e., HtmlTable y HtmlTable se definen una serie de controles que definen una correspondencia HtmlAnchor y 26/126
System.Web.UI.WebControls y System.Web.UI.HtmlControls
Al insertar usando el Toolbox de Visual Studio.NET controles HTML obtenemos: Al insertar web controls obtenemos:
Propiedades Interesantes de los WebControls
Estilo Visual Height y Width Backcolor y ForeColor BorderColor , BorderStyle y BorderWidth Propiedades de comportamiento Enabled Visible AccessKey TabIndex ReadOnly Generación de Eventos AutoPostBack Indica si el control ha de producir automáticamente una nueva solicitud al servidor 28/126
Mantenimiento de Estado en Controles
La propiedad EnableViewState determina si un control ASP.NET debe mantener su estado entre solicitudes
Su valor por defecto es True
El campo oculto __VIEWSTATE es el mecanismo utilizado por ASP.NET para conservar estado
29/126
Usando el Control Calendar
.aspx --> <%@ Page Language="C#" Debug="true" %>
Calendar ASP.NET Application
30/126Usando el Control Calendar
31/126
Usando el Control DataGrid I
<%@ Page Language="C#" %> <%@ Import Namespace="System.Data" %> <%@ Import Namespace="System.Data.SqlClient" %> 32/126
Usando el Control DataGrid II
DataGrid ASP.NET Application
33/126Usando el Control DataGrid III
Usando el Control DataGrid III
35/126
Usando DataGrid IV
Una pregunta frecuente suele ser cómo añadir un hiperlink a una de las celdas de un DataGrid:
http://msdn.microsoft.com/library/default.asp?url=/librar y/en us/vbcon/html/vbtskaddinghyperlinkcolumnstodatagrid webcontrol.asp
36/126
Usando DataGrid V
<%@ Page language="c#" Codebehind="WebForm1.aspx.cs" AutoEventWireup="false" Inherits="DataGridWithHyperlink.WebForm1" %>
Usando el control HtmlTable I
<%@ Page Language="C#" Debug="true" %> <%@ Import Namespace="System"%> <%@ Import Namespace="System.Web.UI"%> 38/126
Usando el control HtmlTable II
HtmlTable Example
39/126Usando el control HtmlTable I
La propiedad de una página IsPostBack es falsa cuando un formulario se carga por primera vez Obsérvese cómo programáticamente podemos ir creando la tabla:
HtmlTable HtmlRow HtmlCell 40/126
Controles de Usuario
Podemos crear tres tipos de controles:
Pagelets Fragmentos de código HTML que pueden reutilizarse como si de componentes se tratara Controles simples Derivados de System.Web.UI.Control
Controles compuestos Reutilizan uno o más controles ya existentes Los especializan 41/126
Creación de Pagelets
Es un conjunto de marcas HTML alojadas en un archivo independiente y que se pueden reutilizar Podemos personalizar ese contenido a través de propiedades Se alojan en ficheros con extensión .ascx
Contienen marcado:
Distributed.NET
Tendremos que registrar este fragmento, le damos un nombre y le asociamos un prefijo, en todos los .aspx donde queramos utilizar este control <%@ Register TagPrefix="DN" TagName=“Firma“ Src=“Firma.ascx" %> 42/126Creación de Pagelets
<%@ Register TagPrefix="DN" TagName= " Firma " Src= " Firma.ascx
“ %> Si en lugar de tener un archivo .ascx, tuviéramos un control alojado en un ensamblado, substituiríamos src por Assembly Después podríamos incluir el pagelet en cualquier otra página utilizando:
Pagelets con propiedades
¿Cómo personalizar un pagelet?
Tan sencillo como declarar variables públicas Ejemplo:
<%=Text%>
Pagelets con propiedades
A continuación incluiríamos el siguiente fragmento en el .aspx donde incluir esta cabecera <%@ Register TagPrefix="DN" TagName= "Cabecera" Src= "Cabecera.ascx" %> Y en el código del .aspx podríamos crear entradas como:
Creando Controles Web de Usuario con Pagelets
Permite encapsular dos o más elementos de interfaz en un control reusable Podemos incluso reutilizar formularios web en controles de usuario Podemos ensamblar formularios agrupando componentes personalizados reutilizables Pasos conversión web form -> user control: Guardar el formulario con extensión .ascx
Eliminar todas las sentencias ,
,The UserColor Control
50/126Colorform.aspx
II
51/126
Custom Controls
Se diferencian de los controles de usuario en que su código se aloja ya compilado en un ensamblado de tipo DLL Usamos la opción de proyecto Web Control Library Visual Studio.NET para crear un WebControlLibrary1 de A continuación añadimos el proyecto WebApplicationUsingCustomControl Podemos utilizar la paleta de controles para añadir el custom control creado Lo mejor es heredar nuestros controles de clases que derivan de System.Web.UI.Control
como System.Web.UI.WebControls.WebControl
52/126
Custom Control Cabecera de nuevo
Podemos o bien reimplementar el método Render() de WebControl que renderiza el contenido de un control O mejor redefinir los métodos:
AddAttributesToRender() contenidos y atributos RenderContents() base de Render agrega nuevos invoca a la implementación 53/126
Creando un Control Compuesto con Código
No genera su interfaz, se basa en otros controles ya existentes Los controles se añaden al control de usuario en el método CreateChildControls()
54/126
Creando un Control Compuesto con Código
public class WebCustomControl1 : Control, INamingContainer { private TextBox euros, pesetas; protected override void CreateChildControls() { this.euros = new TextBox(); this.pesetas = new TextBox(); euros.Text = "0"; euros.AutoPostBack = true; euros.TextChanged += new EventHandler(Euros_TextChanged); pesetas.Text = "0"; pesetas.AutoPostBack = true; pesetas.TextChanged += new EventHandler(Pesetas_TextChanged); } this.Controls.Add(this.euros); this.Controls.Add(new LiteralControl("€
")); this.Controls.Add(this.pesetas); this.Controls.Add(new LiteralControl("Pts")); private void Euros_TextChanged(object sender, EventArgs e) { pesetas.Text = (Math.Round(Convert.ToDouble(euros.Text) * 166.386)).ToString(); } } private void Pesetas_TextChanged(object sender, EventArgs e) { euros.Text = (Math.Round(Convert.ToDouble(pesetas.Text) / 166.386)).ToString(); } 55/126
Validando la Entrada de Datos
La plataforma Web Forms provee una selección de controles de validación que sirven para: Validar la entrada de datos Mostrar mensajes de error al usuario Todos los controles de validación agregados a una página ASP.NET pasan a formar parte de la colección Validators , que es de sólo lectura ValidatorCollection es el tipo de la colección Los validadores derivan todos de BaseValidator Para poner en marcha la validación se invoca el método Validate() de Page De manera directa A través de los controles con la propiedad CausesValidation 56/126
Validando la Entrada de Datos
Los controles de validación proporcionados son: RequiredFieldValidator CompareValidator propiedad de otro control compara una entrada con un valor o la RangeValidator RegularExpressionValidator corresponda con una expresión regular requiere que una entrada se CustomValidator entrada en un rango de valores validación propietaria codificada por usuario ValidationSummary muestra un resumen de errores de validación para todos los controles de validación en una página 57/126
Validando la Edad I
<%@ Page Language="C#" Debug="true" %>
Validando la Edad III
Los controles utilizados tienen las siguientes propiedades en común: controlToValidate ( ageTextBox ) especifica el control a validar errorMessage permite el texto de error a visualizar enableClientScript genera JavaScript si el cliente lo display static los controles de validación son invisibles por defecto, crea espacio para visualizar el error Si cualquier validación es falsa asigna el valor false IsValid .
a 60/126
Validaciones Complejas
Mediante RegularExpressionValidator CustomValidator y RegularExpressionValidator ValidationExpression tiene la propiedad donde colocaremos una expresión regular Podemos crear nuestra propia función de validación con CustomValidator Habrá que codificarla en JavaScript y añadirla como un elemento script de HTML Propiedad esencial ClientValidationFunction 61/126
Validaciones Complejas
HTTP Request Count
<% dumpReqs(); %> 67/126Creando un Módulo HTTP Propietario IV
68/126
Creando un Manejador HTTP I
A diferencia de un módulo HTTP, un HTTP handler está diseñado para procesar la petición completamente, y devolver un resultado al navegador Información extra sobre HTTP Modules y Handlers puede encontrarse en: http://support.microsoft.com/default.aspx?scid=kb;EN-US;307985#2 Necesario crear una clase que implementa la interfaz IHttpHander Para instalar el HttpHandler
:
Creando un Manejador HTTP II
// file : custhttphandlers.cs
// compile : csc /t:library custhttphandlers.cs
using System.Web; namespace CustomHttpHandlers { public class HelloHandler : IHttpHandler { public void ProcessRequest(HttpContext hc) { hc.Response.Write("Hello, World!"); } } } public bool IsReusable { get { return true; } } 70/126
Creando un Manejador HTTP III
71/126
Haciendo Debugging de Aplicaciones ASP.NET
Para encontrar problemas en el código de un ASP.NET, éste ofrece dos niveles de testeo: Page-level tracing Utiliza la siguiente directiva: <%@ Page Language=“C#” Trace=“true”%> Para insertar tus propios fragmentos de trace usar las sentencias: Trace.Write
y Trace.Warn
Application-level tracing, modificando web.config
72/126
Tracing a Nivel de Página I
<%@ Page Language="C#" Trace="True" %> 73/126