Universidad Autónoma de Baja Californiailluminatus.bizhat.com/uabc-live.net/sesion6.pdfComo crear...

CCéélulalula AcadAcadéémicamicaUABCUABC--Live .netLive .net

Universidad Universidad AutAutóónomanoma de Baja Californiade Baja CaliforniaFacultadFacultad de de CienciasCiencias QuQuíímicasmicas e e IngenierIngenierííaa

http://uabc-live-net.spaces.live.com/

SesiSesióón No. 6n No. 6

IntroducciIntroduccióón al desarrollo de n al desarrollo de aplicaciones Web con aplicaciones Web con

ASP.NETASP.NET

Expositor:

Carlos Alberto Cabrera González ([email protected])

Fecha: 26 de Octubre de 2006

Estrella 2Estrella 2IntroducciIntroduccióón al desarrollo de n al desarrollo de

aplicaciones Web con aplicaciones Web con ASP.NETASP.NET

Programa Microsoft Desarrollador Cinco

Estrellas

Programa Microsoft Programa Microsoft Desarrollador Cinco Desarrollador Cinco

EstrellasEstrellas

ObjetivoObjetivo

ConocerConocer los los elementoselementos involucradosinvolucrados en el en el desarrollodesarrollo de de unauna aplicaciaplicacióónn web con Visual web con Visual Studio 2005 y la Studio 2005 y la plataformaplataforma Microsoft .NET, Microsoft .NET, presentandopresentando laslas novedadesnovedades introducidasintroducidas al al respectorespecto en la en la nuevanueva versiversióónn 2.02.0

PrerrequisitosPrerrequisitosHaber cursado y aprobado el mHaber cursado y aprobado el móódulo dulo correspondiente a la Estrella 1 del correspondiente a la Estrella 1 del programa Desarrollador 5 Estrellasprograma Desarrollador 5 Estrellas

Para realizar los ejercicios y ver los Para realizar los ejercicios y ver los ejemplos de cejemplos de cóódigo adjunto necesita:digo adjunto necesita:

Herramienta de DesarrolloHerramienta de DesarrolloMS Visual Studio 2005 MS Visual Studio 2005 óóMS Visual Web Developer 2005 Express MS Visual Web Developer 2005 Express

Base de DatosBase de DatosMS SQL 2005 Express MS SQL 2005 Express EditionEdition

Temario Temario (1/2)(1/2)

IntroducciIntroduccióón a n a ASP.NETASP.NETFormularios Web (Formularios Web (WebWeb Forms)Forms)ConfiguraciConfiguracióónnAutenticaciAutenticacióónnComo mantener el estado en una Como mantener el estado en una aplicaciaplicacióón Webn Web


Master Master PagesPagesThemesThemes y y SkinsSkinsNavegaciNavegacióónnAcceso a DatosAcceso a DatosCompilaciCompilacióón e Instalacin e InstalacióónnComo crear una Como crear una aplicacionaplicacion Web en Visual Web en Visual Studio 2005Studio 2005ReferenciasReferencias

TemarioTemario

IntroducciIntroduccióón a n a ASP.NETASP.NETAplicaciones WebAplicaciones WebASP.NETASP.NETServidor WebServidor Web

Formularios Web (Formularios Web (WebWeb Forms)Forms)ConfiguraciConfiguracióónnAutenticaciAutenticacióónnComo mantener el estado en una aplicaciComo mantener el estado en una aplicacióón n webweb

Aplicaciones Web Aplicaciones Web –– ASP.NETASP.NET

Una aplicaciUna aplicacióón n webweb es un conjunto de pes un conjunto de pááginas HTML que ginas HTML que se transmiten por medio del protocolo HTTP de un servidor se transmiten por medio del protocolo HTTP de un servidor al cliente y viceversa, brindando distintas funcionalidades al cliente y viceversa, brindando distintas funcionalidades a un usuario finala un usuario final..

ASP.NETASP.NET es un es un ““MarcoMarco”” ((frameworkframework) para programar ) para programar aplicaciones aplicaciones webweb, de un modo similar al que se , de un modo similar al que se programan las aplicaciones programan las aplicaciones windowswindows. El componente . El componente principal son los Web Forms (formularios principal son los Web Forms (formularios webweb) que ) que permiten, entre otras cosas, separar la interfaz del usuario permiten, entre otras cosas, separar la interfaz del usuario de la funcionalidad de la aplicacide la funcionalidad de la aplicacióónn..

Aplicaciones Web Aplicaciones Web -- Servidor Servidor WebWeb

Un servidor Un servidor webweb es un sistema informes un sistema informáático tico conectado a una red, donde se almacenan las conectado a una red, donde se almacenan las ppááginas, imginas, imáágenes, etc. (que forman una genes, etc. (que forman una aplicaciaplicacióón n webweb) disponibles para ser visitadas por ) disponibles para ser visitadas por los usuarios de la red.los usuarios de la red.

Internet Internet InformationInformation Server (IIS)Server (IIS), es el servidor , es el servidor Web de Microsoft que corre sobre plataformas Web de Microsoft que corre sobre plataformas Windows. Los servicios que ofrece son: FTP, Windows. Los servicios que ofrece son: FTP, SMTP, NNTP y HTTP/HTTPS SMTP, NNTP y HTTP/HTTPS

Hypertext Transfer Protocol Hypertext Transfer Protocol (HTTP)(HTTP)

Uno de los protocolos mUno de los protocolos máás importantes de s importantes de InternetInternetHTTP define como los navegadores y los HTTP define como los navegadores y los servidores Web se comunican uno con otroservidores Web se comunican uno con otroEsta basado en texto y es transmitido sobre Esta basado en texto y es transmitido sobre conexiones TCPconexiones TCP

Funcionamiento de HTTPFuncionamiento de HTTP

www.cursoaspnet.com

IP = 66.45.26.25

http://www.cursoaspnet.com/inicio.html

IP=66.45.26.25 Puerto: 80

inicio.html<html><body>Bienvenidos al Curso ASP.NET</body></html>

Internet DNSServidor

Cliente

HTTP Request

HTTP Response

PaginaPagina solicitadasolicitada

inicio.html<html>

<body>Bienvenidos al Curso ASP.NET

</body></html>

HTTP RequestHTTP RequestGET /inicio.html HTTP/1.1Accept: */*Accept-Language:...Accept-Encoding:...If-Modified-Since:...If-None-Match:...User-Agent: Mozilla/4.0...Host: www.cursoaspnet.comConnection: Keep-Alive[blank line]

HTTP ResponseHTTP ResponseHTTP/1.1 200 OKServer: Microsoft-IIS/5.0Date: ...Content-Type: text/htmlAccept-Ranges: bytesLast-Modified: ...ETag: ...Content-Length: 46[blank line]<html><body>Bienvenidos al Curso ASP.NET</body></html>

HTML FormsHTML FormsEn el corazEn el corazóón de toda aplicacin de toda aplicacióón Web genuina n Web genuina estestáán los HTML n los HTML FormsFormsUn HTML Un HTML FormForm es la porcies la porcióón de un documento n de un documento HTML que aparece entre las etiquetas HTML que aparece entre las etiquetas <<formform></></formform>>

Suma.html<html>

<body><form><input type="text" name="op1" />+<input type="text" name="op2" /><input type="submit" value=" = " />

</form></body>

</html>

HTML Forms (Cont.)HTML Forms (Cont.)Un botUn botóón n submitsubmit (<(<inputinput typetype==““submitsubmit””>) juega un >) juega un

rol especial en un HTML rol especial en un HTML FormForm::

Cuando es pulsado, el navegador envCuando es pulsado, el navegador envíía el HTML a el HTML FormForm

junto con cualquier entrada de datos del usuario al junto con cualquier entrada de datos del usuario al

servidor Webservidor Web

CCóómo el HTML mo el HTML FormForm es enviado, dependeres enviado, dependeráá del del

atributo atributo MethodMethod del del formform::

Si el atributo Si el atributo MethodMethod del del formform no estno estáá presentepresente o tiene el o tiene el

valor valor GETGET, el navegador enviar, el navegador enviaráá al servidor un comando al servidor un comando

HTTP GETHTTP GET

Si el atributo Si el atributo MethodMethod del del formform tiene el valor tiene el valor POSTPOST, el , el

navegador enviarnavegador enviaráá al servidor un comando al servidor un comando HTTP POSTHTTP POST

HTML Forms (Cont.)HTML Forms (Cont.)Method = GET<form method=“get">. . .</form>

GET /suma.html?op1=2&op2=2 HTTP/1.1...

Connection: Keep-Alive[blank line]

El navegador envia los datos ingresados como una cadena de consulta

Method = POST<form method=“post">. . .</form>

POST /suma.html HTTP/1.1..

Content-Type: ...Content-Length: 11[blank line]op1=2&op2=2

El navegador envia los datos ingresados en el cuerpode la solicitud HTTP

Cualquiera sea el método utilizado, es decir GET o POST, cuando un form es enviado al servidor, decimos que se produjo un POSTBACK

Procesamiento en el ServidorProcesamiento en el ServidorConstruir la parte del cliente es Construir la parte del cliente es ““ffáácilcil””, s, sóólo es lo es HTMLHTML

La parte difLa parte difíícil es la construccicil es la construccióón de la ln de la lóógica del gica del

lado del servidor. lado del servidor. ““Algo en el servidorAlgo en el servidor””, tiene que , tiene que

interpretar las entradas del usuario enviadas junto interpretar las entradas del usuario enviadas junto

con el con el formform y generar la correspondiente salida. y generar la correspondiente salida. Suma.html<html><body><form><input type="text" name="op1" />+<input type="text" name="op2" /><input type="submit" value=" = " /></form>

</body></html>

Suma.html<html><body><form>

<input type="text" name="op1“ value=“2”/>+<input type="text" name="op2“ value=“2”><input type="submit" value=" = " />4

</form></body>

</html>Antes del procesamientoAntes del procesamientoAntes del procesamiento

Después del procesamientoDespuDespuéés del procesamientos del procesamiento

Procesamiento en el ServidorProcesamiento en el ServidorExisten varias tecnologExisten varias tecnologíías de procesamiento:as de procesamiento:

CGICGI ((CommonCommon GatewayGateway InterfaceInterface))Define una API de bajo nivelDefine una API de bajo nivelPopular en entornos UNIX, no tanto en WindowsPopular en entornos UNIX, no tanto en Windows

ISAPIISAPI (Internet Server (Internet Server ApplicationApplication ProgrammingProgramming InterfaceInterface))Son DLL Windows que Son DLL Windows que ““correncorren”” bajo IIS. Escritas en C++bajo IIS. Escritas en C++Mejor Mejor performanceperformance que CGIque CGI

ASPASP (Active Server (Active Server PagesPages))Simple soluciSimple solucióón: n: HTMLHTML + + ScriptScript del lado del servidordel lado del servidorProgramadas en Programadas en JScriptJScript o o VBScriptVBScript

Objetos intrObjetos intríínsecos que abstraen detalles de bajo nivel de HTTP. nsecos que abstraen detalles de bajo nivel de HTTP. Objetos Objetos RequestRequest y y ResponseResponsePermite usar ADO (Permite usar ADO (ActiveXActiveX Data Data ObjectObject) para acceso a datos) para acceso a datos

ASP.NETASP.NETASP.NETASP.NET es el es el frameworkframework de programacide programacióón n webwebdentro de .NETdentro de .NET

Permite desarrollar aplicaciones Web con un Permite desarrollar aplicaciones Web con un modelo modelo ““similarsimilar”” al utilizado para aplicaciones al utilizado para aplicaciones WindowsWindows

El componente fundamental de El componente fundamental de ASP.NETASP.NET es el es el WebFormWebForm

Independencia del cliente (navegador, Independencia del cliente (navegador, S.OS.O., ., dispositivo fdispositivo fíísico, etc.)sico, etc.)

Permite utilizar cualquier lenguaje .NETPermite utilizar cualquier lenguaje .NET

Permite desarrollar Servicios Web XMLPermite desarrollar Servicios Web XML

ASP.NET ASP.NET -- VentajasVentajas

La La ““parte ejecutableparte ejecutable”” de una aplicacide una aplicacióón n ASP.NETASP.NET es COMPILADAes COMPILADA

ImplementaciImplementacióón y actualizacin y actualizacióón de las n de las aplicaciones sin reiniciar el servidor!aplicaciones sin reiniciar el servidor!

Acceso a toda la .NET Acceso a toda la .NET ClassClass LibraryLibrary

Independiente del lenguaje de programaciIndependiente del lenguaje de programacióónn

EncapsulamientoEncapsulamiento de funcionalidad a travde funcionalidad a travéés s de controles de servidor y controles de de controles de servidor y controles de usuariousuario

ASP.NET ASP.NET –– VentajasVentajas (Cont.)(Cont.)

Permite usar Permite usar ADO.NETADO.NET para acceso a datospara acceso a datos

Soporta XML, Hojas de estilo CSS, etc.Soporta XML, Hojas de estilo CSS, etc.

DetecciDeteccióón automn automáática del navegador cliente, tica del navegador cliente,

generando el lenguaje de marcas soportado generando el lenguaje de marcas soportado

por el mismopor el mismo

Mecanismo de Mecanismo de CachingCaching incorporado para incorporado para

ppááginas completa o partes de la misma ginas completa o partes de la misma

frecuentemente solicitadasfrecuentemente solicitadas

ComponentesComponentes de de unauna aplicaciaplicacióónnASP.NETASP.NET

WebForms (Formularios Web) Uno o más archivos con extensión .aspx

Archivos Code-BehindArchivos asociados a WebForms que contienen código del lado del servidor (Ej. VB.NET, C#, etc.)

Archivos de configuración con formato XMLUn archivo Web.config por c/aplicaciónUn único archivo Machine.config por servidor

Global.asaxEventos a nivel de aplicación

WebFormsWebForms (Formularios Web) (Formularios Web) Uno o mUno o máás archivos con extensis archivos con extensióón n ..aspxaspx

Archivos Archivos CodeCode--BehindBehindArchivos asociados a Archivos asociados a WebFormsWebForms que contienen que contienen ccóódigo del lado del servidor (Ej. digo del lado del servidor (Ej. VB.NETVB.NET, , C#C#, etc.), etc.)

Archivos de configuraciArchivos de configuracióón con formato XMLn con formato XMLUn archivo Un archivo Web.configWeb.config por c/aplicacipor c/aplicacióónnUn Un úúnico archivo nico archivo Machine.configMachine.config por servidorpor servidor

Global.asaxGlobal.asaxEventos a nivel de aplicaciEventos a nivel de aplicacióónn


Directorio BIN

Contiene el assembly de la aplicación (Ej.: MiAplic.dll)

Cero o más assemblies (Componentes externos)

Enlaces a Servicios Web XML

Permiten a la aplicación ASP.NET enviar y recibir datos desde Servicios Web

Directorio BINDirectorio BIN

Contiene el Contiene el assemblyassembly de la aplicacide la aplicacióón (Ej.: n (Ej.: MiAplic.dllMiAplic.dll))

Cero o mCero o máás s assembliesassemblies (Componentes externos)(Componentes externos)

Enlaces a Servicios Web XMLEnlaces a Servicios Web XML

Permiten a la aplicaciPermiten a la aplicacióón n ASP.NETASP.NET enviar y recibir enviar y recibir datos desde Servicios Webdatos desde Servicios Web


Servicios Web

Cliente

Internet

WebForm1.aspx.vb

WebForm1.aspx

WebForm2.aspx.vb

WebForm2.aspx

Global.asax

Web.config

Out

put C

ache

Comp.Comp.Comp.Comp.

BIN

Database

ASP.NET Web Server

Las Las aplicacionesaplicaciones Web ASP.NET + IISWeb ASP.NET + IIS

IIS es el servidor Web de la plataforma Windows

Las aplicaciones Web solo pueden existir en una ubicación que es publicada por IIS como un Directorio Virtual

Directorio Virtual: es un recurso compartido identificado por un alias y que representa una ubicación física en el servidor

El famoso http://localhost hace referencia al directorio raíz del servidor web

Por default, http://localhost “apunta” a C:\Inetpub\wwwroot

IIS es el servidor Web de la plataforma WindowsIIS es el servidor Web de la plataforma Windows

Las aplicaciones Web solo pueden existir en una Las aplicaciones Web solo pueden existir en una ubicaciubicacióón que es publicada por IIS como un n que es publicada por IIS como un Directorio VirtualDirectorio Virtual

Directorio VirtualDirectorio Virtual:: es un recurso compartido es un recurso compartido identificado por un alias y que representa una identificado por un alias y que representa una ubicaciubicacióón fn fíísica en el servidorsica en el servidor

El famoso El famoso httphttp://://localhostlocalhost hace referencia al hace referencia al directorio radirectorio raííz del servidor z del servidor webweb

Por Por defaultdefault, , httphttp://://localhostlocalhost ““apuntaapunta”” a a C:C:\\InetpubInetpub\\wwwrootwwwroot

Las Las aplicacionesaplicaciones Web ASP.NET + IISWeb ASP.NET + IIS

VS.NET por default crea las aplicaciones webbajo el directorio raíz, ej.:

MiAplicacion

Virtual:http://localhost/MiAplicacion

Física:C:\Inetpub\wwwroot\MiAplicacion

Podemos usar IIS para definir un directorio virtual donde alojar nuestras aplicaciones Web, diferente al predeterminado

VS.NETVS.NET por por defaultdefault crea las aplicaciones crea las aplicaciones webwebbajo el directorio rabajo el directorio raííz, ej.:z, ej.:

MiAplicacionMiAplicacion

Virtual:Virtual:httphttp://://localhostlocalhost//MiAplicacionMiAplicacion

FFíísica:sica:C:C:\\InetpubInetpub\\wwwrootwwwroot\\MiAplicacionMiAplicacion

Podemos usar IIS para definir un directorio Podemos usar IIS para definir un directorio virtual donde alojar nuestras aplicaciones virtual donde alojar nuestras aplicaciones Web, diferente al predeterminadoWeb, diferente al predeterminado

EstructuraEstructura de de laslas aplicacionesaplicaciones WebWeb

El “perímetro” de una aplicación Web es determinada por su estructura de directorios

Comienza por su directorio raíz, el cual contiene:

La página o WebForm de inicio

El archivo de configuración Web.config

El directorio BIN

El perímetro de la aplicación termina en su último directorio o cuando se encuentra el directorio raíz de otra aplicación Web

El El ““perperíímetrometro”” de una aplicacide una aplicacióón Web es n Web es determinada por su estructura de directoriosdeterminada por su estructura de directorios

Comienza por su directorio raComienza por su directorio raííz, el cual z, el cual contiene:contiene:

La pLa páágina o gina o WebFormWebForm de iniciode inicio

El archivo de configuraciEl archivo de configuracióón n Web.configWeb.config

El directorio El directorio BINBIN

El perEl períímetro de la aplicacimetro de la aplicacióón termina en su n termina en su úúltimo directorio o cuando se encuentra el ltimo directorio o cuando se encuentra el directorio radirectorio raííz de otra aplicaciz de otra aplicacióón Web n Web

Visual Studio 6.0Visual InterDev 6.0IIS 5.0SQL Server 2000ASPASP

Visual Studio .NET 2002.NET Framework 1.0ASP.NET 1.0ASP.NET 1.0

Visual Studio .NET 2003.NET Framework 1.1IIS 6.0ASP.NET 1.1ASP.NET 1.1

Visual Studio 2005Visual Web Developer Express Edition.NET Framework 2.0SQL Server 2005ASP.NET 2.0ASP.NET 2.0

Visual Studio “Orcas”.NET Framework “Orcas”ASP.NET ASP.NET ““OrcasOrcas””

2000 2001 2002 2003 20042000 2001 2002 2003 2004 2005 2006 y 2005 2006 y mmááss

PlataformaPlataforma de de desarrollodesarrollo Web Web Microsoft en el Microsoft en el tiempotiempo


IntroducciIntroduccióón a n a ASP.NETASP.NET

Formularios Web (Formularios Web (WebWeb Forms)Forms)GeneralidadesGeneralidadesControles WebControles WebEventos de un formulario Eventos de un formulario webwebCiclo de Vida de un formulario Ciclo de Vida de un formulario webweb

ConfiguraciConfiguracióónnAutenticaciAutenticacióónnComo mantener el estado en una aplicaciComo mantener el estado en una aplicacióón n webweb

Formulario Web Formulario Web ((ASP.NETASP.NET webweb formform))Es una pEs una páágina expresada en lenguaje de marcas que gina expresada en lenguaje de marcas que es compilada y ejecutada dines compilada y ejecutada dináámicamente en el micamente en el servidor para generar la salida solicitada por el cliente servidor para generar la salida solicitada por el cliente (explorador (explorador óó dispositivo).dispositivo).

CodeCode BehindBehindEs el cEs el cóódigo que se ejecuta del lado del servidor para digo que se ejecuta del lado del servidor para lograr el comportamiento deseado en un formulario lograr el comportamiento deseado en un formulario webweb..

PartialPartial ClassClassUn nuevo concepto, que es aplicado en Un nuevo concepto, que es aplicado en ASP.NETASP.NET para para vincular las pvincular las pááginas ginas aspxaspx (la interfaz del usuario) con (la interfaz del usuario) con su su CodeCode BehindBehind (comportamiento).(comportamiento).

WebFormsWebForms -- GeneralidadesGeneralidades

Controles de ServidorControles de ServidorComponentes que se ejecutan en el lado Componentes que se ejecutan en el lado del servidordel servidorEncapsulan partes de la Encapsulan partes de la interfaceinterface de de usuariosusuariosPoseen el atributo Poseen el atributo runatrunat==““serverserver””Mantienen su Mantienen su ““estadoestado”” entre entre postbackspostbacks al al servidor servidor –– ViewStateViewStatePoseen un modelo de objetos comPoseen un modelo de objetos comúúnn

Ej.: todos tienen las propiedades Ej.: todos tienen las propiedades IdId y y TextText

Generan HTML especifico segGeneran HTML especifico segúún el n el browserbrowserclientecliente

Tipos de Controles de ServidorTipos de Controles de Servidor

Por default, los elementos HTML no son accesibles desde código del lado del servidor

Agregando runat=“server” y el atributo id, se convierten en Controles de Servidor HTML

Por Por defaultdefault, los , los elementos HTML no son elementos HTML no son accesibles desde caccesibles desde cóódigo digo del lado del servidordel lado del servidor

Agregando Agregando runatrunat==““serverserver”” y el y el atributo atributo idid, se convierten , se convierten en Controles de Servidor en Controles de Servidor HTMLHTML

Controles de Controles de Servidor HTMLServidor HTML

Controles de Controles de Servidor WebServidor Web

Conocidos como WebControlsSolo accesibles del lado del servidorMuchos tipos

IntrínsecosValidación“Ricos”Del tipo lista de datos

No tienen una relación 1:1 con elem. HTML

Conocidos como Conocidos como WebControlsWebControlsSolo accesibles del lado Solo accesibles del lado del servidordel servidorMuchos tiposMuchos tipos

IntrIntríínsecosnsecos

ValidaciValidacióónn““RicosRicos””

Del tipo lista de datosDel tipo lista de datos

No tienen una relaciNo tienen una relacióón n 1:1 con 1:1 con elemelem. HTML. HTML

Equivalencias de ControlesEquivalencias de Controles

BotBotóón HTML n HTML ““clcláásicosico”” (No es de Servidor)(No es de Servidor)

Control de Servidor HTMLControl de Servidor HTML

Control de Servidor WebControl de Servidor Web

<INPUT type="button" value="Buscar">

<INPUT type="button" value="Buscar"id="cmdBuscar" runat="server" NAME="button1">

<asp:Button id="cmdBuscar" runat="server"Text="Buscar"/>

Controles de Servidor Controles de Servidor -- EjemplosEjemplos

<select size="5"> </select><select size="5"> </select><<asp:listboxasp:listbox>><input type=text><input type=text><<asp:textboxasp:textbox>><table> </table><table> </table><<asp:tableasp:table>>

<input type=<input type=radiobuttonradiobutton>><<asp:radiobuttonasp:radiobutton>><div> </div><div> </div><<asp:panelasp:panel>><span> </span><span> </span><<asp:labelasp:label>>

<asp <asp linkButtonlinkButton>><input type=image><input type=image><<asp:imagebuttonasp:imagebutton>><<imgimg srcsrc="="……">"><<asp:imageasp:image>><a <a hrefhref="="……"> </a>"> </a><<asp:hyperlinkasp:hyperlink>><input type=checkbox><input type=checkbox><<asp:checkboxasp:checkbox>><input type=submit><input type=submit><<asp:buttonasp:button>>

HTML HTML equivalenteequivalenteWebControlWebControl

Son elementos ocultos que validan las entradas de datos contra algún patrón

El proceso de validación puede ser llevado en:Cliente

El browser cliente debe soportar lenguaje script

Le da al usuario un feedback inmediato

Reduce el número de postbacks

Servidor

Repite la validación del lado del cliente

Permite validar contra datos almacenados por ej. en una base de datos

Son elementos ocultos que validan las entradas Son elementos ocultos que validan las entradas de datos contra algde datos contra algúún patrn patróónn

El proceso de validaciEl proceso de validacióón puede ser llevado en:n puede ser llevado en:ClienteCliente

El El browserbrowser cliente debe soportar lenguaje cliente debe soportar lenguaje scriptscript

Le da al usuario un feedback inmediatoLe da al usuario un feedback inmediato

Reduce el nReduce el núúmero de mero de postbackspostbacks

ServidorServidor

Repite la validaciRepite la validacióón del lado del clienten del lado del cliente

Permite validar contra datos almacenados por ej. en Permite validar contra datos almacenados por ej. en una base de datosuna base de datos

Controles de Servidor Controles de Servidor -- ValidaciValidacióónn

ASP.NET proporciona 6 controlesRequiredFieldValidator. Valor requerido.

CompareValidator. Valida contra un valor constante o contra otro control.

RangeValidator. Valor dentro de un rango de tipos.

RegularExpressionValidator. Valida contra un patrón o expresión regular.

CustomValidator. Lógica de validación proporcionada por nosotros.

ValidationSummary. No es un validador, sino que muestra mensajes de error “agrupados”.

ASP.NETASP.NET proporciona 6 controlesproporciona 6 controlesRequiredFieldValidatorRequiredFieldValidator. Valor requerido.. Valor requerido.

CompareValidatorCompareValidator. Valida contra un valor constante o . Valida contra un valor constante o contra otro control.contra otro control.

RangeValidatorRangeValidator. Valor dentro de un rango de tipos.. Valor dentro de un rango de tipos.

RegularExpressionValidatorRegularExpressionValidator. Valida contra un patr. Valida contra un patróón o n o expresiexpresióón regular.n regular.

CustomValidatorCustomValidator. L. Lóógica de validacigica de validacióón proporcionada n proporcionada por nosotros.por nosotros.

ValidationSummaryValidationSummary. No es un . No es un validadorvalidador, sino que , sino que muestra mensajes de error muestra mensajes de error ““agrupadosagrupados””..


En el lado del servidor se puede determinar si TODAS las validaciones fueron exitosas mediante Page.IsValid

Muy importante!

La propiedad IsValid NO está disponible en los eventos Init ni Load del WebForm

En el lado del servidor se puede determinar En el lado del servidor se puede determinar si TODAS las validaciones fueron exitosas si TODAS las validaciones fueron exitosas mediante mediante Page.IsValidPage.IsValid

Muy importante! Muy importante!

La propiedad La propiedad IsValidIsValid NO estNO estáá disponible en los disponible en los eventos eventos InitInit ni ni LoadLoad del del WebFormWebForm


Controles con lógica de IU compleja encapsulados de forma sencilla

Ejemplos:

AdRotator. Permite mostrar anuncios publicitarios (banners) de una secuencia predeterminada o aleatoria.

Calendar. Permite disponer de un calendario altamente personalizable.

Controles con lControles con lóógica de IU compleja gica de IU compleja encapsulados de forma sencillaencapsulados de forma sencilla

Ejemplos:Ejemplos:

AdRotatorAdRotator. Permite mostrar anuncios . Permite mostrar anuncios publicitarios (publicitarios (bannersbanners) de una secuencia ) de una secuencia predeterminada o aleatoria.predeterminada o aleatoria.

CalendarCalendar. Permite disponer de un calendario . Permite disponer de un calendario altamente altamente personalizablepersonalizable..

Controles de Servidor Controles de Servidor –– Controles Controles ““RicosRicos””

Controles de UsuarioControles de UsuarioSimplifican la reutilizaciSimplifican la reutilizacióón de cn de cóódigo y digo y componentes de la IU dentro de las componentes de la IU dentro de las aplicaciones Web aplicaciones Web ASP.NETASP.NETSon del servidor definidos en un archivo Son del servidor definidos en un archivo ..ascxascxContienen HTML pero NO los Contienen HTML pero NO los tagstags <HTML>, <HTML>, <BODY> o <FORM><BODY> o <FORM>

Contiene tambiContiene tambiéén cn cóódigo en digo en VB.NETVB.NET o o C#C#

<%@ Control Language="vb" %><%@ Control Language="vb" %>

<%@ Control Language=<%@ Control Language=““cscs" %>" %>

WebForm2.aspx

FARMACIA

¿¿Por quPor quéé usar Controles de Usuario?usar Controles de Usuario?

Son Son autocontenidosautocontenidosPueden ser utilizados mPueden ser utilizados máás de una vezs de una vezPueden estar escritos en diferentes Pueden estar escritos en diferentes lenguajeslenguajes

WebForm1.aspx

FARMACIA

UserControl.ascx

FARMACIA

Agregando Controles de UsuarioAgregando Controles de Usuario

Para usar un control de usuario en un Para usar un control de usuario en un WebFormWebForm se usa la directiva se usa la directiva @Register@Register

Dentro del Dentro del WebFormWebForm......

Podemos acceder y crear propiedades Podemos acceder y crear propiedades como con cualquier otro control u objetocomo con cualquier otro control u objeto

<%@Register TagPrefix="<%@Register TagPrefix="ucuc" " TagName="TagName="encabezadoencabezado" Src="" Src="header.ascxheader.ascx" %>" %>

<<uc:encabezadouc:encabezado id=id=““Enc1Enc1”” runatrunat==““serverserver””> > </</uc:encabezadouc:encabezado>>

Eventos en un Eventos en un WebFormWebForm (1/4)(1/4)

ServerCliente Web

Analiza el mensajeevento

manejador

mensaje

respuesta

Llama al manejador apropiado

Modelo de Eventos Web Modelo de Eventos Web FormForm


•• Eventos del lado del servidorEventos del lado del servidorCuando se trabaja con controles Cuando se trabaja con controles ASP.NETASP.NET, estos generan , estos generan eventos en el servidor para responder a las peticiones del eventos en el servidor para responder a las peticiones del usuario, produciusuario, produciééndose ndose PostBackPostBack..

•• PostBackPostBackA instancias de un formulario A instancias de un formulario webweb mostrado en el cliente mostrado en el cliente cada evento sucedido en cada evento sucedido en éél genera un POST hacia el l genera un POST hacia el servidor y una respuesta. Este ida y vuelta dentro de un servidor y una respuesta. Este ida y vuelta dentro de un mismo formulario mismo formulario webweb se llama se llama postbackpostback..

•• ViewView StateStateEs un mecanismo que permite mantener el estado de los Es un mecanismo que permite mantener el estado de los controles del formulario controles del formulario webweb entre entre postbackspostbacks. El estado . El estado de los controles viaja en el de los controles viaja en el viewview statestate por cada por cada postbackpostback..(ver diapositiva 36)(ver diapositiva 36)


DeclaraciDeclaracióón de eventos en un control del lado del cliente:n de eventos en un control del lado del cliente:

<asp:Button ID="btnEjemplo" runat="server" Text="Aceptar" onclick="btnEjemploClick" />

AtenciAtencióón del evento en el servidor ( n del evento en el servidor ( codecode behindbehind ))

Ejemplo en Ejemplo en C#C#::protected void btnEjemploClick(object sender, EventArgs e){

if (!string.IsNullOrEmpty(txtEjemplo.Text)){

lblEjemplo.Text = txtEjemplo.Text;}

}


AtenciAtencióón del evento en el servidor ( n del evento en el servidor ( codecode behindbehind ) .) .

Ejemplo en Visual Basic:Ejemplo en Visual Basic:

Protected Sub btnEjemploClick(ByVal sender As Object, _ ByVal e As EventArgs)If Not String.IsNullOrEmpty(txtEjemplo.Text) Then

lblEjemplo.Text = txtEjemplo.TextEnd If

End Sub

Ciclo de vida de un Ciclo de vida de un WebFormWebFormSucesos mas importantes del ciclo de vida de una pSucesos mas importantes del ciclo de vida de una páágina:gina:

InicializaciInicializacióón de objetosn de objetosCarga Carga ViewView StateStateProcesa datos del postProcesa datos del postCarga de la pCarga de la pááginaginaEventos Post BackEventos Post BackGraba Graba ViewView StateStateRenderRenderUnLoadUnLoad


IntroducciIntroduccióón a n a ASP.NETASP.NETFormularios Web Formularios Web ((WebWeb Forms)Forms)

ConfiguraciConfiguracióónnConceptos principalesConceptos principalesAccediendo desde el cAccediendo desde el cóódigo al digo al web.configweb.config

AutenticaciAutenticacióónnComo mantener el estado en una aplicaciComo mantener el estado en una aplicacióón n webweb

Conceptos principales Conceptos principales (1/2)(1/2)

Archivo Archivo Web.ConfigWeb.ConfigEs un archivo Es un archivo xmlxml, donde se guarda , donde se guarda informaciinformacióón de configuracin de configuracióón comn comúún a toda la n a toda la aplicaciaplicacióón como ser: cadenas de conexin como ser: cadenas de conexióón, tipo n, tipo de autenticacide autenticacióón, etc.n, etc.

Arquitectura de configuraciArquitectura de configuracióón jern jeráárquicarquicaEl archivo de configuraciEl archivo de configuracióón posee una n posee una estructura jerestructura jeráárquica (rquica (xmlxml) que permite una ) que permite una lectura rlectura ráápida y facilita su modificacipida y facilita su modificacióón.n.

Conceptos principales Conceptos principales (2/2)(2/2)

Secciones y grupos de seccionesSecciones y grupos de seccionesEn En ASP.NETASP.NET 2.0 se incorporan nuevos grupos de 2.0 se incorporan nuevos grupos de secciones, como por ejemplo secciones, como por ejemplo ““connectionStringsconnectionStrings””. . Facilitando de este modo el acceso a las conexiones Facilitando de este modo el acceso a las conexiones de datos y simplificando el cde datos y simplificando el cóódigo.digo.

Herramientas administrativasHerramientas administrativasSnapSnap--in de MMC para in de MMC para ASP.NETASP.NETHerramienta de administraciHerramienta de administracióón del sitio n del sitio webweb (Web (Web SiteSiteAdministrationAdministration ToolTool) )

Accediendo desde el cAccediendo desde el cóódigo al digo al web.configweb.config (1/2)(1/2)

Secciones configuraciSecciones configuracióón mn máás simpless simples<configuration> <connectionStrings>

<add name="northwind" connectionString="server=(local);database=Northwind;IntegratedSecurity=SSPI" providerName="System.Data.SqlClient" />

</connectionStrings> </configuration>

Accediendo desde el cAccediendo desde el cóódigo al digo al web.configweb.config (2/2)(2/2)

SqlConnection connection = new SqlConnection( ConfigurationManager.ConnectionStrings["ADVENTUREWORKSConnectionString"].ConnectionString);

Acceso de lectura/escritura a especificaciones de Acceso de lectura/escritura a especificaciones de configuraciconfiguracióónn..Ejemplo en Ejemplo en C#C#::

Dim connection As SqlConnection = New _ SqlConnection(ConfigurationManager.ConnectionStrings( _ "ADVENTUREWORKSConnectionString").ConnectionString)

Ejemplo en Visual BasicEjemplo en Visual Basic


IntroducciIntroduccióón a n a ASP.NETASP.NETFormularios Web Formularios Web ((WebWeb Forms)Forms)

ConfiguraciConfiguracióónn

AutenticaciAutenticacióónnGeneralidadesGeneralidadesTipos de AutenticaciTipos de Autenticacióón n AutenticaciAutenticacióón por Formulariosn por FormulariosControles de Controles de LoginLogin

Como mantener el estado en una aplicaciComo mantener el estado en una aplicacióón n webweb

GeneralidadesGeneralidades

¿¿QuQuéé es Autenticacies Autenticacióón?n?Es el mecanismo que permite afirmar que la Es el mecanismo que permite afirmar que la persona que esta ingresando al sistema es persona que esta ingresando al sistema es quien dice ser.quien dice ser.

¿¿CCóómo Funciona?mo Funciona?Se aceptan las credenciales ingresadas por el Se aceptan las credenciales ingresadas por el usuario (usuario (usuariousuario –– contrasecontraseñña) y se validan a) y se validan contra una base de datos, el sistema operativo, contra una base de datos, el sistema operativo, un servicio un servicio webweb, u otro mecanismo definido , u otro mecanismo definido segsegúún el tipo de autenticacin el tipo de autenticacióón.n.

Tipos de AutenticaciTipos de AutenticacióónnBasada en WindowsBasada en Windows

Basada en Windows e IISBasada en Windows e IISLa solicitud de la pLa solicitud de la páágina pasa por IISgina pasa por IISSi IIS valida exitosamente la credencial, entonces se Si IIS valida exitosamente la credencial, entonces se devuelve la pdevuelve la páágina solicitadagina solicitada

Basada en FormulariosBasada en FormulariosLas solicitudes no autenticadas son Las solicitudes no autenticadas son redireccionadasredireccionadas a a un formulario de un formulario de loginloginDespuDespuéés de validar la credencial se envs de validar la credencial se envíía al cliente una a al cliente una cookiecookie de autenticacide autenticacióónn

Basada en Microsoft Basada en Microsoft PassportPassportServicio de autenticaciServicio de autenticacióón centralizadon centralizadoPassportPassport es un Web es un Web ServiceService

Configurando la autenticaciConfigurando la autenticacióónn

<system.web> <authentication mode="Forms">

<forms loginUrl="login.aspx"></forms></authentication><authorization>

<deny users="?"/></authorization>

</system.web>

AutenticaciAutenticacióón por Formulariosn por FormulariosLa autenticaciLa autenticacióón por formularios se utiliza n por formularios se utiliza para validar a los usuarios contra bases de para validar a los usuarios contra bases de datos relaciones, Servicios Web, etc.datos relaciones, Servicios Web, etc.

¿¿CCóómo funciona?mo funciona?Si las credenciales son vSi las credenciales son váálidas, lidas, ASP.NETASP.NET graba graba un ticket de autenticaciun ticket de autenticacióón en la n en la cookiecookie que que contiene la identidad del usuario.contiene la identidad del usuario.

Si el usuario es anSi el usuario es anóónimo, nimo, redireccionaredirecciona las las peticiones a una ppeticiones a una páágina predeterminada para gina predeterminada para validar las credenciales del usuariovalidar las credenciales del usuario..

Cliente solicita una página

Autorizado

Autenticación basada en Formulario

NOAutenticado Autenticado

Form de Login(Usuario ingresasus credenciales)

Autenticado

Cookie de autenticación

Autorizado

NOAutenticado

Acceso Denegado

PáginaSegura

solicitada

IIS

Usuario

ClaveCarlos

***********Aceptar

11 22

33

4466

5577

AutenticaciAutenticacióón por Formulariosn por Formularios

Controles de Controles de LoginLogin (1/2)(1/2)

Control Log InControl Log In<asp:Login ID="Login1" runat="server“

CreateUserUrl="~/CrearUsuario.aspx"CreateUserText="Nuevo Usuario“RememberMeText="Recordar mi usuario" BackColor="#F7F6F3" BorderColor="#E6E2D8" BorderPadding="4" BorderStyle="Solid" BorderWidth="1px"

Font- Names="Verdana" Font-Size="0.8em" ForeColor="#333333" > <TitleTextStyle BackColor="#5D7B9D" Font-Bold="True" Font-Size="0.9em" ForeColor="White" />

<InstructionTextStyle Font-Italic="True" ForeColor="Black" /><TextBoxStyle Font-Size="0.8em" /><LoginButtonStyle BackColor="#FFFBFF" BorderColor="#CCCCCC" BorderStyle="Solid"

BorderWidth="1px" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#284775"/>

</asp:Login>

Ejemplo del controlEjemplo del control

Controles de Controles de LoginLogin (2/2)(2/2)

Control de CreaciControl de Creacióón de Usuariosn de Usuarios<asp:CreateUserWizard ID=“createUserWizard" runat="server"

CreateUserButtonText="Crear Usuario"CompleteSuccessText="Usuario Creado"

ContinueButtonText="Finalizar"ContinueDestinationPageUrl="~/Default.aspx“

FinishDestinationPageUrl="~/Default.aspx“><WizardSteps>

<asp:CreateUserWizardStep ID=“createUserWizardStep" runat="server">

</asp:CreateUserWizardStep><asp:CompleteWizardStep ID=“completeWizardStep" runat="server"

Title="Usuario Creado“AllowReturn="true">

</asp:CompleteWizardStep></WizardSteps>

</asp:CreateUserWizard>


Temario Temario (1/2)(1/2)IntroducciIntroduccióón a n a ASP.NETASP.NETFormularios Web (Formularios Web (WebWeb Forms)Forms)ConfiguraciConfiguracióónnAutenticaciAutenticacióónn

Como mantener el estado en una Como mantener el estado en una aplicaciaplicacióón n webweb

GeneralidadesGeneralidadesGlobal.asaxGlobal.asaxEstado de la aplicaciEstado de la aplicacióónnEstado de la sesiEstado de la sesióónnViewView StateState

GeneralidadesGeneralidadesLas pLas pááginas ginas htmlhtml de una aplicacide una aplicacióón n webweb se transmiten por se transmiten por medio del protocolo HTTP, como se mencionmedio del protocolo HTTP, como se mencionóó anteriormente. anteriormente. Este protocolo es un protocolo Este protocolo es un protocolo ““sin estadosin estado””..AsAsíí, una vez que el usuario ingreso datos en el navegador, , una vez que el usuario ingreso datos en el navegador, si si no se mantiene el estadono se mantiene el estado mediante algmediante algúún mecanismo, n mecanismo, se se pierden los datos ingresadospierden los datos ingresados..Por este motivo, Por este motivo, ASP.NetASP.Net proporciona mecanismos para proporciona mecanismos para mantener el estado de sus variables a travmantener el estado de sus variables a travéés de las distintas s de las distintas peticiones de ppeticiones de pááginas.ginas.Entre estos mecanismos se encuentran:Entre estos mecanismos se encuentran:

ApplicationApplication StateState : mecanismo de almacenamiento global accesible : mecanismo de almacenamiento global accesible desde todas las pdesde todas las pááginas de la aplicaciginas de la aplicacióón Webn WebSessionSession StateState : mecanismo de almacenamiento limitado a la sesi: mecanismo de almacenamiento limitado a la sesióón n actual del navegadoractual del navegadorViewView StateState :Mantiene valores entre m:Mantiene valores entre múúltiples solicitudes a la misma ltiples solicitudes a la misma ppááginagina

AdministraciAdministracióón de estadosn de estados

ContraseñaTania

Ingresar

*******

Login.aspx Login.aspx

Hola Tania

Inicio.aspx

Ingrese sus datosde inicio de sesión

Tania

Ingresar

*******

Hola

Inicio.aspx

Nombre

Contraseña

Sin Adm. De Estados

Con Adm. De Estados

Olvide quien esUd!

Ingrese sus datosde inicio de sesión

Nombre

Tipos de administraciTipos de administracióón de n de estadoestado

QueryQuery stringsstringsInformaciInformacióón anexada al final de la n anexada al final de la URLURL

DatabaseDatabaseEn algunos casos se utiliza una En algunos casos se utiliza una Base de Datos para guardar la Base de Datos para guardar la informaciinformacióón de estadon de estado

ViewStateViewStateMantiene valores entre mMantiene valores entre múúltiples ltiples solicitudes a la misma psolicitudes a la misma pááginagina

SessionSession statestateInformaciInformacióón disponible n disponible úúnicamente para un usuario de nicamente para un usuario de una sesiuna sesióón especn especííficafica

CookiesCookiesArchivos de texto que guardan Archivos de texto que guardan informaciinformacióón de estado en la PC n de estado en la PC clientecliente

ApplicationApplication statestateInformaciInformacióón disponible para n disponible para todos los usuarios de la todos los usuarios de la aplicaciaplicacióón Web.n Web.

Del lado del clienteDel lado del clienteDel lado del servidorDel lado del servidor

ApplicationApplication StateState es un mecanismo de es un mecanismo de almacenamiento global accesible desde almacenamiento global accesible desde todas las ptodas las pááginas de la aplicaciginas de la aplicacióón Webn WebSeesionSeesion StateState estestáá limitada a la sesilimitada a la sesióón n actual del actual del browserbrowserLas sesiones Las sesiones ASP.NETASP.NET se identifican con se identifican con una cadena de caracteres ASCII y se guarda una cadena de caracteres ASCII y se guarda como una como una CookieCookie en el clienteen el cliente

SessionID

Variables deSession y Application

AdministraciAdministracióón de estados n de estados --ServidorServidor

CookiesCookies para mantener el estado:para mantener el estado:TemporariasTemporariasPersistentesPersistentes

Problema: el usuario puede borrarlas o Problema: el usuario puede borrarlas o deshabilitarlasdeshabilitarlasProblemas de seguridadProblemas de seguridadEspacio limitado a almacenar no mEspacio limitado a almacenar no máás de s de 4KB4KB

Cookie

AdministraciAdministracióón de estados n de estados --ClienteCliente

Global.asaxGlobal.asax

Administra eventos a nivel de aplicaciAdministra eventos a nivel de aplicacióón y n y sesisesióón.n.

Los eventos referentes a la manutenciLos eventos referentes a la manutencióón n del estado de aplicaciones del estado de aplicaciones webweb, son:, son:

Application_StartApplication_Start

Application_EndApplication_End

Session_StartSession_Start

Session_EndSession_End

Estado de la aplicaciEstado de la aplicacióónn(1/2)(1/2)

Permite almacenar informaciPermite almacenar informacióón a nivel de aplicacin a nivel de aplicacióón, n, comcomúún a todas las sesiones. Esta informacin a todas las sesiones. Esta informacióón se n se almacena en una coleccialmacena en una coleccióón llamada n llamada ApplicationApplication..

El acceso a esta informaciEl acceso a esta informacióón se realiza mediante el n se realiza mediante el objeto introbjeto intríínseco nseco ““ApplicationApplication””

Ejemplo en Ejemplo en C#C#

protected void Application_Start() { DataSet ds = new DataSet(); try {

FileStream fs = newFileStream(Server.MapPath("schemadata.xml"), FileMode.Open,FileAccess.Read);

StreamReader reader = new StreamReader(fs);ds.ReadXml(reader);

}finally { fs.Close(); }DataView view = new DataView(ds.Tables[0]); Application["Sucursal"] = view;

}

Estado de la aplicaciEstado de la aplicacióónn(2/2)(2/2)


Sub Application_Start(ByVal sender As Object, ByVal e As _ EventArgs)Dim ds As DataSet = New DataSetTry

Dim fs As FileStream = New _FileStream(Server.MapPath("schemadata.xml"), _FileMode.Open, FileAccess.Read)

Dim reader As StreamReader = New StreamReader(fs)ds.ReadXml(reader)

Finallyfs.Close

End TryDim view As DataView = New DataView(ds.Tables(0)) Application("Sucursal") = view

End Sub

CAW3

Diapositiva 70

CAW3 finallyCarlos Walzer, 12/2/2005

Estado de la sesiEstado de la sesióón n (1/2)(1/2)

Una sesiUna sesióón es una interaccin es una interaccióón entre un navegador y un servidor n entre un navegador y un servidor webweb (comprende varios (comprende varios RequestsRequests a lo largo del tiempo)a lo largo del tiempo)Es posible almacenar informaciEs posible almacenar informacióón n úúnicamente relevante para nicamente relevante para una sesiuna sesióón. n. El acceso a esta informaciEl acceso a esta informacióón se realiza mediante el objeto n se realiza mediante el objeto intrintríínseco nseco ““SessionSession””

Ejemplo Ejemplo C#C#

Protected void Session_Start( object sender, EventArgs e ) { //...try

{conn = new SqlConnection( ConfigurationManager.ConnectionStrings["ADVENTUREWORKSConnectionString"].ConnectionString);command.Connection = conn;conn.Open();object result = command.ExecuteScalar();Session["codigo"] = result;

}finally {conn.Close();

}}

Estado de la sesiEstado de la sesióón n (2/2)(2/2)


Sub Application_Start(ByVal sender As Object, ByVal e As _ EventArgs)

Dim ds As DataSet = New DataSetDim command As SqlCommand = New SqlCommand( _

"Select codigo From clientes Where name = " & nombre )Try

conn = New SqlConnection( _ ConfigurationManager.ConnectionStrings( _ "ADVENTUREWORKSConnectionString").ConnectionString)command.Connection = connconn.Open()Dim result As Object = command.ExecuteScalar()Session("codigo") = result

Finallyconn.Close()

End TryEnd Sub

ViewView StateState

Mantiene el estado de los controles, entre Mantiene el estado de los controles, entre postbackpostback de una pde una páágina.gina.

El El ViewView StateState se implementa mediante un se implementa mediante un campo oculto en el campo oculto en el htmlhtml generado y viaja en generado y viaja en cada POSTcada POST


Master Master PagesPagesGeneralidadesGeneralidadesPPááginas Maestrasginas MaestrasPPááginas de Contenidoginas de Contenido

ThemesThemes y y SkinsSkinsNavegaciNavegacióónnAcceso a DatosAcceso a DatosCompilaciCompilacióón e Instalacin e InstalacióónnComo crear un sitio WebComo crear un sitio WebReferenciasReferencias

GeneralidadesGeneralidadesLogran herencia visual para las pLogran herencia visual para las pááginas Webginas WebPermite manejar Permite manejar ááreas comunes de un sitio de reas comunes de un sitio de manera consistente manera consistente En En ASP.NETASP.NET 1.1, el problema de la herencia visual 1.1, el problema de la herencia visual implicabaimplicaba

Copiar & PegarCopiar & PegarIncludesIncludesHerencia + Herencia + UserUser ControlsControls

Se basan en Se basan en TemplatesTemplates (Master (Master PagePage) y en ) y en ppááginas de contenido (ginas de contenido (ContentContent PagePage). ). Permiten incluir menPermiten incluir menúús, encabezados, s, encabezados, navegaciones, etc.navegaciones, etc.

PPááginas Maestrasginas MaestrasEn lugar de la directiva En lugar de la directiva @Page@Page, utiliza la directiva , utiliza la directiva @Master@Master::

Se trata como cualquier formulario Se trata como cualquier formulario webweb, con la , con la extensiextensióón .master, y debe incluir el siguiente n .master, y debe incluir el siguiente control:control:

<%@ Master Language="C#“CodeFile="MasterPage.master.cs" Inherits="MasterPage" %>

<asp:contentplaceholder id="contenedor" runat="server“>contenido por defecto

</asp:contentplaceholder>

PPááginas de contenidoginas de contenidoAl crear un pAl crear un páágina de contenido, hay que elegir la gina de contenido, hay que elegir la ppáágina maestra. La directiva gina maestra. La directiva @page@page de la pde la páágina gina serseríía:a:

No repiten los No repiten los tagstags de la pde la páágina maestra, pero se gina maestra, pero se pueden acceder desde el cpueden acceder desde el cóódigo.digo.

Debe contener el controlDebe contener el control

<%@ Page Language="C#" MasterPageFile="~/MasterPage.master" CodeFile="Default.aspx.cs" Inherits="_Default" Title="Home" %>

<asp:Content ID="cntDefault" ContentPlaceHolderID="contenedor"Runat="Server"> contenido de la página </asp:Content>

TemarioTemarioMaster Master PagesPages

ThemesThemes y y SkinsSkinsGeneralidadesGeneralidadesEjemplo del contenido de un Ejemplo del contenido de un ““SkinSkin””

NavegaciNavegacióónnAcceso a DatosAcceso a DatosCompilaciCompilacióón e Instalacin e InstalacióónnComo crear un sitio WebComo crear un sitio WebReferenciasReferencias

ThemesThemes y y SkinsSkins -- GeneralidadesGeneralidadesSkinsSkins: : Son definiciones de formato y estilos que se Son definiciones de formato y estilos que se aplican a los controles de servidor y se guardan en aplican a los controles de servidor y se guardan en archivos de extensiarchivos de extensióón .n .skinskin

ThemesThemes: Son : Son ““paquetespaquetes”” de de SkinsSkins, tambi, tambiéén pueden n pueden contener hojas de estilo en cascada e imcontener hojas de estilo en cascada e imáágenes genes asociados.asociados.

ASP.NETASP.NET 2.0 incluye una nueva carpeta virtual para la 2.0 incluye una nueva carpeta virtual para la organizaciorganizacióón de los temas (n de los temas (APP_ThemesAPP_Themes).).

Se pueden configurar a nivel de maquina (en el Se pueden configurar a nivel de maquina (en el machinemachineconfigconfig) a nivel de aplicaci) a nivel de aplicacióón (en el n (en el web.configweb.config) o bien a ) o bien a nivel de pnivel de páágina, dentro de la directiva gina, dentro de la directiva PagePage..

Contenido de un archivo Contenido de un archivo SkinSkin

<asp:LoginName runat="server" BorderWidth="1"BorderColor="#FF9900"ForeColor="navy"Font-Names="verdana" />

Los archivos *.Los archivos *.skinskin contienen declaraciones contienen declaraciones de estilo y formato de los controles de de estilo y formato de los controles de ASP.NETASP.NET

TemarioTemarioMaster Master PagesPagesThemesThemes y y SkinsSkins

NavegaciNavegacióónnMenMenúúControl de navegaciControl de navegacióónn

Acceso a DatosAcceso a DatosCompilaciCompilacióón e Instalacin e InstalacióónnComo crear un sitio WebComo crear un sitio WebReferenciasReferencias

NavegaciNavegacióón n -- MenMenúú<asp:menu id="Menu"

datasourceid="SiteMapDataSource1“ disappearafter="500"staticdisplaylevels="2" staticsubmenuindent="20" orientation="Vertical"

font-names="Trebuchet MS, Arial" DynamicMenuItemStyle-Width="150"Width="150“ runat="server"> <staticmenuitemstyle backcolor="RoyalBlue" forecolor="WhiteSmoke" horizontalpadding="5" verticalpadding="2" /><statichoverstyle backcolor="CornflowerBlue" forecolor="White" borderstyle="Solid" borderwidth="1px" /><dynamicmenuitemstyle backcolor="RoyalBlue" forecolor="WhiteSmoke" horizontalpadding="5" verticalpadding="2" /><dynamichoverstyle backcolor="CornflowerBlue" forecolor="White" borderstyle="Solid" borderwidth="1px" />

</asp:menu>


Control de NavegaciControl de Navegacióónn

Este control esta basado en el modelo de Este control esta basado en el modelo de proveedores. (Se configura el proveedor en el proveedores. (Se configura el proveedor en el web.configweb.config))

A diferencia de otros controles de navegaciA diferencia de otros controles de navegacióón no n no posee una propiedad posee una propiedad ““DataSourceDataSource””..

Al proveedor se le configura el archivo (Al proveedor se le configura el archivo (xmlxml) que ) que posee el mapa del sitio, por ejemplo:posee el mapa del sitio, por ejemplo:

siteMapFilesiteMapFile="="web.sitemapweb.sitemap" "

TemarioTemarioMaster Master PagesPagesThemesThemes y y SkinsSkinsNavegaciNavegacióónn

Acceso a DatosAcceso a DatosControles de enlace a datosControles de enlace a datosControles visualizadores de datosControles visualizadores de datos

CompilaciCompilacióón e Instalacin e InstalacióónnComo crear un sitio Web con Visual Studio 2005Como crear un sitio Web con Visual Studio 2005ReferenciasReferencias

Controles de enlace de DatosControles de enlace de DatosPermiten realizar el enlace entre un control que Permiten realizar el enlace entre un control que muestra datos (muestra datos (gridviewgridview, , detailsviewdetailsview, , etcetc) y la ) y la llóógica que los administragica que los administra

Control Control ObjectDataSourceObjectDataSourceEnlaza los controles con una clase de la capa de Enlaza los controles con una clase de la capa de negocios.negocios.

Control Control SqlDataSourceSqlDataSourceEnlaza los controles con una base de datos Enlaza los controles con una base de datos relacional.relacional.

Control Control XmlDataSourceXmlDataSourceEnlaza los controles con datos en formato Enlaza los controles con datos en formato xmlxml..

Controles visualizadores Controles visualizadores (1/2)(1/2)

DataGridViewDataGridView<asp:GridView ID="GridView1" runat="server" DataSourceID="SqlDataSource1"

DataKeyNames="ProductID" AllowPaging="True" AllowSorting="True"><Columns>

<asp:CommandField DeleteText="Excluir“ CancelText="Cancelar“UpdateText="Atualizar" EditText="Editar"/>

<asp:BoundField ReadOnly="True" HeaderText="Cod" DataField="ProductID"/><asp:BoundField HeaderText="Produto" DataField="ProductName"/><asp:BoundField HeaderText="Estoque" DataField="UnitsInStock"

DataFormatString="{0:n0}"/></Columns>

</asp:GridView><asp:SqlDataSource ID="SqlDataSource1" runat="server"

ConnectionString="<%$ ConnectionStrings:myConnection %>"UpdateCommand="UPDATE [Products] SET [ProductName] = @ProductName "SelectCommand="SELECT [ProductID], [ProductName] … FROM [Products]"InsertCommand="INSERT INTO [Products] ([ProductName] ..."DeleteCommand="DELETE FROM [Products] WHERE [ProductID] ...">

</asp:SqlDataSource>

Controles visualizadores Controles visualizadores (2/2)(2/2)

<asp:FormView ID="FormView1" runat="server" DataSourceID="ObjectDataSource1“><ItemTemplate><asp:Label ID="CaptionLabel" runat="server" Text='<%# Eval("Caption") %>' /><br /> <asp:Image ID="Image1" runat="server" ImageUrl='<%# Eval("FileName", "images/{0}") %>'

/> <br /> <asp:HyperLink ID="HyperLink1" Text=“Volver" NavigateUrl='<%# Eval( "AlbumID", "PhotosDataList.aspx?ID={0}") %>' runat="server" />

</ItemTemplate> </asp:FormView>

DetailsViewDetailsView

FormViewFormView

<asp:DetailsView AutoGenerateRows="False" DataKeyNames="au_id" DataSourceID="SqlDataSource3" HeaderText="Author Details" ID="DetailsView1" runat="server" Width="275px"><Fields> <asp:BoundField DataField="au_id" HeaderText="au_id" SortExpression="au_id" />

<asp:BoundField DataField="au_lname" HeaderText="au_lname" /><asp:CheckBoxField DataField="contract" HeaderText="contract" />

</Fields> </asp:DetailsView>

TemarioTemarioMaster Master PagesPagesThemesThemes y y SkinsSkinsNavegaciNavegacióónnAcceso a DatosAcceso a Datos

CompilaciCompilacióón e Instalacin e InstalacióónnGeneralidadesGeneralidadesCompilaciCompilacióón Dinn Dináámicamica

Como crear un sitio Web con Visual Studio 2005Como crear un sitio Web con Visual Studio 2005ReferenciasReferencias

CompilaciCompilacióón e Instalacin e Instalacióón n --GeneralidadesGeneralidades

CompilaciCompilacióón dinn dináámica de:mica de:AspxAspx, , asmxasmx, , ascxascxVbVb, , cscs, , resxresxSSóólo es necesario poner los archivos en los directorios lo es necesario poner los archivos en los directorios especespecííficosficos

PrecompilaciPrecompilacióónn e implementacie implementacióón sin cn sin cóódigo digo fuentefuente

Aspnet_compiler.exeAspnet_compiler.exe precompila sitios y los instala sin precompila sitios y los instala sin el cel cóódigo fuentedigo fuente

CompilaciCompilacióón dinn dináámicamica

vroot

App_Code

CS

VB

WSDL

XSD

RESX

RESOURCE

Los archivos se compilan dinámicamente en el primer acceso

App_LocalResources

TemarioTemario

Master Master PagesPagesThemesThemes y y SkinsSkinsNavegaciNavegacióónnAcceso a DatosAcceso a DatosCompilaciCompilacióón e Instalacin e Instalacióónn

Como crear un sitio Como crear un sitio webweb con Visual con Visual Studio 2005Studio 2005

GeneralidadesGeneralidadesCreaciCreacióón y Acceso a Proyectosn y Acceso a Proyectos

ReferenciasReferencias

GeneralidadesGeneralidades

Independencia de IISIndependencia de IISVisual Studio 2005 Visual Studio 2005 invluyeinvluye el el ASP.NETASP.NET DevelopmentDevelopmentServerServer, un servidor de HTTP local que permite trabajar , un servidor de HTTP local que permite trabajar en una PC de desarrollo sin tener instalado IIS en una PC de desarrollo sin tener instalado IIS (Microsoft Internet (Microsoft Internet InformationInformation Server)Server)

FrontFront PagePage Server Server ExtensionsExtensionsLas extensiones de servidor de Las extensiones de servidor de FrontFront PagePage no son no son necesarias, ahora se puede seleccionar el directorio necesarias, ahora se puede seleccionar el directorio donde se van a alojar las pdonde se van a alojar las pááginas del sitio y comenzar ginas del sitio y comenzar a desarrollar.a desarrollar.

CreaciCreacióón y Acceso a Proyectosn y Acceso a ProyectosFile File SystemSystem

Permite desarrollar un sitio en cualquier carpeta de la Permite desarrollar un sitio en cualquier carpeta de la PC.PC.

IIS LocalIIS LocalPermite desarrollar localmente una aplicaciPermite desarrollar localmente una aplicacióón n webweb en en un directorio virtual de IIS.un directorio virtual de IIS.

Sitio FTPSitio FTPPermite editar y modificar proyectos Permite editar y modificar proyectos webweb remotos remotos utilizando el protocolo FTP.utilizando el protocolo FTP.

Sitio RemotoSitio RemotoSe puede sincronizar el proyecto de desarrollo local con Se puede sincronizar el proyecto de desarrollo local con la aplicacila aplicacióón instalada en produccin instalada en produccióón.n.

TemarioTemarioMaster Master PagesPagesThemesThemes y y SkinsSkinsNavegaciNavegacióónnAcceso a DatosAcceso a DatosCompilaciCompilacióón e Instalacin e InstalacióónnComo crear un sitio Web con Visual Studio 2005Como crear un sitio Web con Visual Studio 2005

ReferenciasReferencias

Referencias Referencias (1/2)(1/2)

Tutorial de ASP.NET 2.0http://www.ASP.NET/Tutorials/quickstart.aspxEstado de la Aplicaciónhttp://www.microsoft.com/spanish/msdn/comunidad/mtj.net/voices/art175.aspCall Backhttp://msdn.microsoft.com/msdnmag/issues/05/01/CuttingEdge/default.aspxSitio Oficial de ASP.NEThttp://www.ASP.NET

Referencias Referencias (2/2)(2/2)

Ciclo de Vida http://msdn2.microsoft.com/en-us/library/ms178472.aspxWeb Partshttp://msdn.microsoft.com/msdnmag/issues/05/09/WebParts/default.aspxModelo de Proveedoreshttp://msdn.microsoft.com/ASP.NET/default.aspx?pull=/library/en-us/dnaspp/html/ASPNETProvMod_Intro.aspLibro: Introducing Microsoft ASP.NET 2.0Autor: Dino Espositohttp://www.microsoft.com/mspress/books/6962.asp

Universidad Autónoma de Baja Californiailluminatus.bizhat.com/uabc-live.net/sesion6.pdfComo crear...

Documents

Transcript of Universidad Autónoma de Baja Californiailluminatus.bizhat.com/uabc-live.net/sesion6.pdfComo crear...