PROJETO PARA SISTEMAS WEB I

Peter Rizzon
SUMÁRIO
TRABALHANDO COM O C#
O PRIMEIRO PROGRAMA EM C#
VARIÁVEIS E TIPOS PRIMITIVOS
Esta é uma obra coletiva organizada por iniciativa e direção do CENTRO SU-
PERIOR DE TECNOLOGIA TECBRASIL LTDA – Faculdades Ftec que, na for-
5 ENTENDENDO A ESTRUTURA DE UMA ma do art. 5º, VIII, h, da Lei nº 9.610/98, a publica sob sua marca e detém os
6 APLICAÇÃO ASP.NET MVC NA PRÁTICA 24
direitos de exploração comercial e todos os demais previstos em contrato. É
9 CONVENÇÕES DE NOMES 27 proibida a reprodução parcial ou integral sem autorização expressa e escrita.

OPERAÇÕES COM VARIÁVEIS 10 SÍNTESE28

TIPOS PRIMITIVOS 10 CAMADA DE APRESENTAÇÃO - RAZOR 30
CENTRO UNIVERSITÁRIO UNIFTEC
ARMAZENANDO TEXTOS EM VARIÁVEIS 12 CAMADA DE APRESENTAÇÃO 31
Rua Gustavo Ramos Sehbe n.º 107. Caxias do Sul/ RS
COMENTÁRIOS12 PÁGINAS ESTÁTICAS E DINÂMICAS 31
SÍNTESE13 RAZOR32
SINTAXE E DECLARAÇÃO DE VARIÁVEIS RAZOR 32 REITOR
A PLATAFORMA .NET 15
Claudino José Meneguzzi Júnior
A ABORDAGEM .NET  16 CONDICIONAIS (IF E ELSE) 33
PRÓ-REITORA ACADÊMICA
CLR (COMMOM LANGUAGE RUNTIME)  17 LAÇOS DE REPETIÇÃO 34
Débora Frizzo
CTS (COMMON TYPE SYSTEM)  17 TEXTO E CÓDIGO 34
PRÓ-REITOR ADMINISTRATIVO
CLS (COMMON LANGUAGE SPECIFICATION)  17 COMENTÁRIOS34 Altair Ruzzarin
BCL (BASE CLASSE LIBRARY)  18 VIEWBAG E STROGLY TYPED VIEWS 34 DIRETOR DE ENSINO A DISTÂNCIA (EAD)

VISÃO GERAL DO ASP.NET 18 HTML HELPERS 36 Rafael Giovanella

COMPONENTES DE UMA APLICAÇÃO ASP.NET  19 ACTIONLINK HELPER 36

ASP.NET E AJAX  20 CHECKBOX37

Desenvolvido pela equipe de Criações para o Ensino a Distância (CREAD)
SÍNTESE20 TEXTBOX37
Coordenadora e Designer Instrucional
ASP.NET MVC 21 TEXTAREA37 Sabrina Maciel

MODEL22 RADIOBUTTON38 Diagramação, Ilustração e Alteração de Imagem

VIEW22 PASSWORD38 Igor Zattera, Julia Oliveira, Thaís Munhoz

CONTROLLER22 LAYOUTS38 Revisora

CONTEÚDO COMUM 38 Indiana Fochesatto

RECURSOS DA ESTRUTURA ASP.NET MVC 24
SUMÁRIO
Esta é uma obra coletiva organizada por iniciativa e direção do CENTRO SU-
PERIOR DE TECNOLOGIA TECBRASIL LTDA – Faculdades Ftec que, na for-
SÍNTESE40 ma do art. 5º, VIII, h, da Lei nº 9.610/98, a publica sob sua marca e detém os
CAMADA DE CONTROLE 44 direitos de exploração comercial e todos os demais previstos em contrato. É
ACTIONS45 proibida a reprodução parcial ou integral sem autorização expressa e escrita.
ACTIONRESULT45
PARÂMETROS47
CENTRO UNIVERSITÁRIO UNIFTEC
TEMPDATA48
Rua Gustavo Ramos Sehbe n.º 107. Caxias do Sul/ RS
ROTAS48
ADICIONANDO UMA ROTA 49
IMPORTANTE49 REITOR
ADICIONANDO PARÂMETROS NAS ROTAS 49 Claudino José Meneguzzi Júnior
SÍNTESE50 PRÓ-REITORA ACADÊMICA

VALIDAÇÃO55 Débora Frizzo

CONTROLLER57 PRÓ-REITOR ADMINISTRATIVO

VIEW58 Altair Ruzzarin

ANOTAÇÕES59 DIRETOR DE ENSINO A DISTÂNCIA (EAD)

VALIDAÇÃO NO LADO DO CLIENTE 60 Rafael Giovanella

SÍNTESE60
SESSÃO64 Desenvolvido pela equipe de Criações para o Ensino a Distância (CREAD)
IDENTIFICANDO OS NAVEGADORES 65 Coordenadora e Designer Instrucional
SESSÕES NO ASP.NET MVC 65 Sabrina Maciel
SESSIONMODE66 Diagramação, Ilustração e Alteração de Imagem
SÍNTESE67 Igor Zattera, Julia Oliveira, Thaís Munhoz
TRATAMENTO DE ERROS 71 Revisora

TRY-CATCH73 Indiana Fochesatto

CUSTOM ERRORS 74
HTTP ERRORS 74
APRESENTAÇÃO

Prezado, acadêmico! Seja bem-vindo à disciplina de Projeto para sistemas web II!

A internet nunca mais foi a mesma desde que Tim Berners-Lee propôs, em março de

1989, que a gerência do CERN adotasse um sistema de informações distribuído, baseado em

hipertexto, como solução para os problemas de comunicação da instituição. A CERN – La-

boratório Europeu para Física de Partículas – é uma das maiores instituições científicas do

mundo e seus laboratórios estão distribuídos por várias cidades localizadas em 19 países da

Europa. Berners-Lee demonstrou como a informação se perdia diariamente no CERN, um

ambiente que ele classificou como “um modelo em miniatura do resto do mundo em alguns

anos”. O sistema proposto, inicialmente chamado de Mesh, acabou por convencer seus ge-

rentes e foi implantado no CERN no ano seguinte, já com o nome de World Wide Web.

Berners-Lee estava certo quando definiu o CERN como uma miniatura do mundo. Hoje,

muitos anos depois, a internet não é mais a mesma. Atualmente, a internet é a World Wide

Web. Todos os serviços da internet se renderam ao poder da web.

A web evoluiu e ocupou todos os espaços, fazendo jus ao nome “World Wide”. As pá-

ginas deixaram de ser meras páginas e passaram a se comportar como aplicações. O brow-

ser evoluiu junto e passou a ser tratado como uma interface universal, capaz de oferecer ao

usuário acesso interativo e uniforme a programas remotos em diversas plataformas. E a web

deixou de ser um mero serviço, passando a ser uma enorme plataforma, estimulando a cria-

ção de novas linguagens e tecnologias.

PROJETO PARA SISTEMAS WEB I 4

 TRABALHANDO COM
O C#
Agora que já entendemos o funcionamento
da linguagem C#, vamos começar a desenvolver a primeira aplicação
utilizando o Visual Studio.

5
 SUMÁRIO

Nesta disciplina desenvolveremos todo o código utilizando o Visual Studio Comunity,

a versão gratuita da ferramenta de desenvolvimento de aplicações, que é distribuída pela

própria Microsoft. Apesar das explicações serem feitas com base na versão comunity, tudo

funcionará da mesma forma dentro das versões pagas da ferramenta.

O Visual Studio Comunity pode ser encontrado no site:

https://www.visualstudio.com/pt-br/downloads/

A versão que utilizaremos é a Visual Studio Comunity 2017.

Durante a instalação do Visual Studio, o .Net Framework também será automaticamente

instalado em sua máquina, então ela estará pronta executar as aplicações escritas em C#.

O PRIMEIRO PROGRAMA EM C# No canto esquerdo da janela do assistente de criação de novo projeto, podemos esco-

lher a linguagem de programação que desejamos utilizar, escolha a opção Visual C#. Como

Para criarmos um programa C# utilizando o Visual Studio precisamos inicialmente de tipo de projeto escolha a opção Windows Form Application, com isso estamos criando um

um novo projeto. novo projeto de interface gráfica utilizando o C#.

Dentro do Visual Studio 2017, aperte o atalho Ctrl + Shift + N para abrir o assistente de No canto inferior da janela, podemos escolher o nome do projeto além da pasta em que

criação de novo projeto. ele será armazenado. Utilizaremos OiMundo como nome desse novo projeto.

PROJETO PARA SISTEMAS WEB I 6

 SUMÁRIO

Agora dê um duplo clique no botão que acabamos de adicionar para programarmos o que deve

acontecer quando o botão for clicado. O Visual Studio abrirá o código do formulário. Não se preocupe

Queremos inicialmente colocar um botão no formulário que, quando cli- com todo o código complicado que está escrito nesse arquivo, entenderemos o significado de cada uma

cado, abrirá uma caixa de mensagem do Windows. dessas linhas mais a frente no curso.

using System; {
Para colocarmos o botão no formulário, precisamos abrir uma nova ja- using System.Collections.Generic; public Form1()
using System.ComponentModel; {
nela do Visual Studio chamada Toolbox, que fica no canto esquerdo da jane- using System.Data; InitializeComponent();
using System.Drawing; }
la do formulário. O Toolbox também pode ser aberto utilizando-se o atalho private void button1_Click(object sender, EventArgs e)
using System.Linq;
Ctrl + Alt + X . Dentro da janela do “Toolbox”, no grupo “Common Controls”, using System.Text; {
using System.Windows.Forms; }
clique no componente “Button” e arraste-o para o formulário. namespace form }
{ }
public partial class Form1 : Form

PROJETO PARA SISTEMAS WEB I 7

 SUMÁRIO

O trecho de código que nos interessa no momento é:

private void button1_Click(object sender, EventArgs e)
{
private void button1_Click(object sender, EventArgs e) MessageBox.Show(“Hello World”);
{ }
}

O código completo fica:

Todo código que for colocado dentro das chaves será executado quando o botão

for clicado. No clique do botão, queremos executar o comando que mostra uma caixa de
using System;
mensagens para o usuário.
using System.Collections.Generic;
using System.ComponentModel;
MessageBox.Show(mensagem) using System.Data;
using System.Drawing;
using System.Linq;
No C#, todo comando deve ser terminado pelo caractere “;”. Portanto, o código using System.Text;
para mostrar a caixa de mensagem fica da seguinte forma: using System.Windows.Forms;
namespace form
MessageBox.Show(mensagem); {
public partial class Form1 : Form
{
Queremos que, ao clicar no botão, a mensagem Hello World seja exibida em uma public Form1()
{
caixa de mensagens. Então, utilizaremos o seguinte código: InitializeComponent();
}
private void button1_Click(object sender, EventArgs e) private void button1_Click(object sender, EventArgs e)
{
{
MessageBox.Show(Hello World);
MessageBox.Show(“Hello World”);
}
}
}
Como a mensagem é somente um texto, o compilador do C# nos força a colocá-la }
entre aspas duplas. Portanto, o código do clique do botão ficará assim:

PROJETO PARA SISTEMAS WEB I 8

 SUMÁRIO

Não se preocupe com as linhas de código que não foram explicadas. Entenderemos o As variáveis guardam informações de um tipo específico. Podemos, por exemplo, guar-

que elas fazem durante o curso. dar um número inteiro representando o número da conta, um texto para representar o nome

do correntista ou um número real para representar o saldo atual da conta. Para utilizar uma
Aperte “F5” para executar o código do formulário. Ao clicar no “button1”, o resultado
variável, devemos primeiramente declará-la no texto do programa.
deve ser algo parecido com a imagem a seguir:

Na declaração de uma variável, devemos dizer seu tipo (inteiro, texto ou real, por exem-

plo) e, além disso, qual é o nome que usaremos para referenciá-la no texto do programa.

Para declarar uma variável do tipo inteiro que representa o número de uma conta, utiliza-

mos o seguinte código:

int numeroDaConta;

Repare no ; no final da linha. Como a declaração de uma variável é um comando da lin-

guagem C#, precisamos do ; para terminá-lo.

Além do tipo int (para representar inteiros), temos também os tipos double e float
VARIÁVEIS E TIPOS PRIMITIVOS
(para números reais), string (para textos), entre outros.

Na maioria dos programas que escrevemos, não estamos interessados em apenas mos-
Depois de declarada, uma variável pode ser utilizada para armazenar valores. Por
trar uma caixa de mensagens para o usuário, por exemplo. Queremos também armazenar e
exemplo, se estivéssemos interessados em guardar o valor 1 na variável numeroDaConta
processar informações.
que declaramos anteriormente, utilizaríamos o seguinte código:

Em um sistema bancário, por exemplo, estaríamos interessados em armazenar o saldo

numeroDaConta = 1;
de uma conta e o nome do correntista. Para armazenar esses dados, precisamos pedir para

o C# reservar regiões de memória que serão utilizadas para armazenar informações. Essas
Lê-se “numeroDaConta recebe 1”.
regiões de memória são conhecidas como variáveis.

PROJETO PARA SISTEMAS WEB I 9

 SUMÁRIO

Quando, no momento da declaração da variável, sabemos qual será seu valor, podemos utilizar Depois de realizar o saque, queremos mostrar para o usuário qual é o saldo atu-

a seguinte sintaxe para declarar e atribuir o valor para a variável. al da conta. Para mostrarmos essa informação, utilizaremos o MessageBox.Show:

double saldo = 100.0; MessageBox.Show(“O saldo da conta após o saque é: ” + saldo);

OPERAÇÕES COM VARIÁVEIS Veja que, no código do saque, estamos repetindo o nome da variável saldo

dos dois lados da atribuição. Quando temos esse tipo de código, podemos utilizar

Agora que já sabemos como guardar informações no programa, estamos interessados em executar uma abreviação disponibilizada pelo C#, o operador -= :

operações nesses valores. Pode ser interessante para um correntista saber qual será o saldo de sua conta
double saldo = 100.0;
após um saque de 10 reais. Para realizar essa operação, devemos subtrair 10 reais do saldo da conta: double valorDoSaque = 10.0;
saldo -= valorDoSaque;

double saldo = 100.0;

saldo = saldo - 10.0;
Quando o compilador do C# encontra o saldo -= valorDoSaque , essa linha é

traduzida para a forma que vimos anteriormente: saldo = saldo - valorDoSaque.

Nesse código, estamos guardando na variável saldo o valor da conta 100.0 (saldo antigo) me-
Além do -= , temos também os operadores += (para somas), *= (para multiplica-
nos 10.0 então seu valor final será de 90.0 . Da mesma forma que podemos subtrair valores, podemos
ções) e /= (para divisões).
também fazer somas (com o operador + ), multiplicações (operador * ) e divisões (operador / ).

TIPOS PRIMITIVOS
Podemos ainda guardar o valor do saque em uma variável:

double saldo = 100.0; Vimos que no C# toda variável possui um tipo, utilizamos o int quando que-
double valorDoSaque = 10.0;
saldo = saldo - valorDoSaque; remos armazenar valores inteiros e double para números reais. Agora vamos des-

cobrir quais são os outros tipos de variáveis do C#.

PROJETO PARA SISTEMAS WEB I 10

 SUMÁRIO

Tipo Tamanho Valores Possíveis int valor = 1;

bool 1 byte true e false long valorGrande = valor;

byte 1 byte 0 a 255

Nesse caso, como o tamanho de uma variável long é maior do que o de uma va-
sbyte 1 byte -128 a 127
riável int, o C# sabe que podemos copiar o seu conteúdo sem perder informações e,
short 2 bytes -32768 a 32767
por isso, esse é um código que compila sem nenhum erro.
ushort 2 bytes 0 a 65535

int 4 bytes -2147483648 a 2147483647

Agora vamos tentar copiar o int para uma variável do tipo short:
uint 4 bytes 0 to 4294967295

long 8 bytes -9223372036854775808L to 9223372036854775808L

int valor = 1;
ulong 8 bytes 0 a 18446744073709551615 short valorPequeno = valor;

float 4 bytes Números até 10 elevado a 38. Exemplo: 10.0f, 12.5f

double 8 bytes Números até 10 elevado a 308. Exemplo: 10.0, 12.33 Nesse código, tentamos copiar o conteúdo de uma variável maior para den-

decimal 16 bytes Números com até 28 casas decimais. Exemplo: 10.991m, 33.333m tro de uma de tamanho menor. Essa cópia pode ser perigosa pois o valor que está na
char 2 bytes Caracteres delimitados por aspas simples. Exemplo: ‘a’, ‘ç’, ‘o’ variável do tipo int pode não caber na variável short e, por isso, o compilador do C#

gera um erro de compilação quando tentamos fazer essa conversão.

Os tipos listados nessa tabela são conhecidos como tipos primitivos ou value types da lin-

guagem C#. Toda vez que atribuímos um valor para uma variável de um tipo primitivo, o C# copia
Para forçarmos o compilador do C# a fazer uma conversão perigosa, preci-
o valor atribuído para dentro da variável.
samos utilizar uma operação do C# chamada casting falando para qual tipo quere-

mos fazer a conversão.

Agora que conhecemos os tipos primitivos da linguagem C#, vamos ver como é que eles intera-

gem dentro de uma aplicação. Suponha que temos um código que declara uma variável do tipo inteiro int valor = 1;
e depois tenta copiar seu conteúdo para uma variável long: short valorPequeno = (short) valor;

PROJETO PARA SISTEMAS WEB I 11

 SUMÁRIO

ARMAZENANDO TEXTOS EM VARIÁVEIS COMENTÁRIOS

Além dos tipos primitivos, o C# também possui um tipo específico para armazenar textos. No Quando queremos documentar o significado de algum código dentro de um pro-

tipo string, podemos guardar qualquer valor que seja delimitado por aspas duplas, por exemplo: grama C#, podemos utilizar comentários. Para fazermos um comentário de uma li-

nha, utilizamos o // . Tudo que estiver depois do // é considerado comentário e, por

string mensagem = “Minha Mensagem”;
MessageBox.Show(mensagem); isso, ignorado pelo compilador da linguagem.

double saldo = 100.0; // Isso é um comentário e será ignorado pelo compilador

Podemos juntar o valor de duas variáveis do tipo string utilizando o operador + da lingua-

gem. A soma de strings é uma operação conhecida como concatenação.

string mensagem = “Olá ”; Muitas vezes precisamos escrever diversas linhas de comentários para, por
string nome = “victor”;
exemplo, documentar uma lógica complexa da aplicação. Nesses casos podemos uti-
MessageBox.Show(mensagem + nome);
lizar o comentário de múltiplas linhas que é inicializado por um /* e terminado pelo

*/ . Tudo que estiver entre a abertura e o fechamento do comentário é ignorado pelo

Esse código imprime o texto Olá victor em uma caixa de mensagens. Podemos utilizar a
compilador da linguagem:
concatenação para adicionar o conteúdo de qualquer variável em uma string:

/*
int idade = 25; Isso é um comentário
string mensagem = “sua idade é: ” + idade; de múltiplas linhas
MessageBox.Show(mensagem); */

PROJETO PARA SISTEMAS WEB I 12

 SUMÁRIO

SÍNTESE

Neste capítulo vimos que:

• Para o desenvolvimento de aplicações utilizando o C#, a Micro-

soft disponibiliza uma plataforma denominada Visual Studio.

• C# é uma linguagem fortemente tipada.

• Todas as variáveis e constantes têm um tipo, assim como cada

expressão que é avaliada como um valor.

• O compilador usa as informações de tipo para garantir que todas

as operações que são realizadas em seu código sejam fortemente

tipadas.

• O compilador insere as informações de tipo no arquivo executá-

vel como metadados. O CLR (Common Language Runtime) usa

metadados em tempo de execução para garantir mais segurança

de tipos quando aloca e recupera a memória.

PROJETO PARA SISTEMAS WEB I 13

EXERCÍCIOS SUMÁRIO

Faça o código dos exercícios do capítulo dentro de botões no formulário do projeto ini- Repare o (int) . Estamos “forçando” a conversão do double para um inteiro.

cial, cada exercício deve ficar na ação de um botão diferente.

Qual o valor de piQuebrado nesse caso?

a. 3.14 b. 0 c. 3
1. Crie 3 variáveis com as idades dos seus melhores amigos e/ou familiares. Em seguida, pe-

gue essas 3 idades e calcule a média delas. Exiba o resultado em um MessageBox.

4. No ensino, aprendemos a resolver equações de segundo grau usando a fórmula de

Bhaskara. A fórmula é assim:

2. O que acontece com o código abaixo?

int pi = 3.14; delta = b*b - 4*a*c;

a1 = (-b + raiz(delta)) / (2 * a);

a. O código compila, e “pi” guarda o número 3.

a2 = (-b - raiz(delta)) / (2 * a);

b. O código compila, e “pi” guarda 3.14 (inteiros podem guardar casas decimais).

Crie um programa com três variáveis inteiras, a, b, c , com quaisquer valores. De-
c. O código não compila, pois 3.14 não “cabe” dentro de um inteiro.
pois crie 3 variáveis double, delta, a1, a2, com a fór mula anterior.

3. Execute o trecho de código a seguir. O que acontece com ele?

Imprima a1 e a2 em um MessageBox.

double pi = 3.14;
int piQuebrado = (int)pi; Dica: Para calcular raiz quadrada, use Math.Sqrt(variavel). Não se esqueça que
MessageBox.Show(“piQuebrado = ” + piQuebrado);
não podemos calcular a raiz quadrada de números negativos.

PROJETO PARA SISTEMAS WEB I 14

A PLATAFORMA .NET
Iniciamos nossa jornada conhecendo os principais conceitos da
plataforma .NET.

15

O .NET Framework é um componente integral do Windows, que oferece suporte à
criação e execução de aplicativos e serviços web XML. É a tecnologia da Microsoft para
conectar informações, pessoas, sistemas e dispositivos através de software. Integrada
através da plataforma Microsoft, a tecnologia .NET fornece a habilidade de rapidamen-
te construir, instalar, gerenciar e conectar soluções com segurança em serviços web.
As soluções .NET permitem negócios para integrar seus sistemas rapidamente e,
de uma maneira mais ágil, ajudar a realizar a promessa da informação, em qualquer lu-
gar, a qualquer momento e em qualquer dispositivo.
O .NET Framework foi criado para atender alguns objetivos:
• Fornecer um ambiente de programação orientada a objetos consistentes, seja o có-
digo objeto armazenado e executado localmente, seja ele executado localmente,
mas distribuído pela internet (executado remotamente).
• Fornecer um ambiente da execução de código que minimiza conflitos de implanta-
ção e versionamento de software, muito comum no modelo antigo de componenti-
zação COM/COM+ (conhecido como “DLL hell”).
• Fornecer um ambiente de execução que promova a execução segura do código, in-
cluindo o código criado por terceiros.
• Fornecer um ambiente de execução que elimina os problemas de desempenho dos
ambientes interpretados ou com scripts.
SUMÁRIO
• Tornar a experiência do desenvolvedor consistente, através dos diversos tipos de aplicati-
vos, baseados no Windows e na web. O desenvolvedor pode usar qualquer linguagem su-
portada pelo .NET para escrever os programas, e notará muitas semelhanças ao escrever
código para dois ambientes bastante distintos, como o desktop e o web, devido à camada de
abstração provida pelo .NET.
• Criar todas as comunicações nas indústrias padrão, para garantir que códigos baseados no
.NET Framework possam se integrar a qualquer outro código. O programador pode reuti-
lizar facilmente um código já existente, ainda que esteja em outra linguagem, sem que ele
precise abrir mão da sua linguagem de preferência (e.g. o programador pode escrever um
programa em C# e utilizar componentes escritos em C#, VB para .NET sem problemas de
integração destes códigos).
A ABORDAGEM .NET
• Independência de linguagem de programação: permite a implementação do mecanismo
de herança, controle de exceções e depuração entre linguagens de programação diferentes.
• Reutilização de código legado: implica em reaproveitamento de código escrito usando ou-
tras tecnologias como COM, COM+, ATL, DLLs e outras bibliotecas existentes.
• Tempo de execução compartilhado: o “runtime” de .NET é compartilhado entre as diver-
sas linguagens que a suportam, significando que não existe um runtime diferente para cada
linguagem que implementa .NET.
PROJETO PARA SISTEMAS WEB I 16
 SUMÁRIO

• Sistemas autoexplicativos e controle de versões: cada peça de código .NET con- CTS (COMMON TYPE SYSTEM)
tém em si mesma a informação necessária e suficiente, de forma que o runtime

não precise procurar no registro do Windows mais informações sobre o programa O CTS, ou Sistema Comum de Tipos, que também faz parte do CLR, define os tipos suportados

que está sendo executado. Ele encontra essas informações no próprio sistema em por .NET e as suas características. Cada linguagem que suporta .NET tem, necessariamente, que

questão e sabe qual a versão a ser executada, sem acusar aqueles velhos conflitos suportar esses tipos. Apesar da especificação, não demanda que todos os tipos definidos no CTS

de incompatibilidade ao registrar DLLs no Windows. sejam suportados pela linguagem, podendo ser um subconjunto do CTS ou um superconjunto.

• Simplicidade na resolução de problemas complexos.

Um conjunto de classes básicas, que define todos os tipos, é implementado na CTS. Por

exemplo: um tipo Enum deve derivar da classe System. Enum e todas as linguagens devem im-
Para melhor entendermos tudo o que estudamos até aqui, vamos falar um pouco
plementar esse tipo dessa forma. Todo tipo deriva da classe Object, porque em .NET tudo é um
da arquitetura de .NET e os seus principais componentes.
objeto e, portanto, todos os tipos devem ter como raiz essa classe. É dessa forma que os diversos

tipos, nas diversas linguagens, são implementados, obedecendo às regras definidas no CTS.
CLR (COMMOM LANGUAGE RUNTIME)

Na .NET, e em C# consequentemente, todos os tipos derivam de uma raiz comum: a classe

O CLR, ou Tempo de Execução Compartilhado, é o ambiente de execução das apli-
Object. O que equivale dizer é que todos os tipos são objetos, por definição.
cações .NET. As aplicações .NET não são aplicações nativas do Windows, propriamente

ditas (apesar de executarem no ambiente Windows), razão pela qual o runtime Win32 não
CLS (COMMON LANGUAGE SPECIFICATION)
sabe como executá-las.

O Windows, ao identificar uma aplicação .NET, dispara o runtime .NET que, a partir O CLS, ou Especificação Comum da Linguagem, é um subconjunto do CTS, e define um

desse momento, assume o controle da aplicação no sentido mais amplo da palavra, por- conjunto de regras que qualquer linguagem que implemente a .NET deve seguir, a fim de que o

que dentre outras coisas, é ele quem vai cuidar do gerenciamento da memória por meio de código gerado, resultante da compilação de qualquer peça de software, escrita na referida lin-

um mecanismo chamado Garbage Collector (GC) ou Coletor de Lixo, ao qual falaremos mais guagem, seja perfeitamente entendido pelo runtime .NET.

adiante. Esse gerenciamento da memória torna os programas menos suscetíveis a erros.

PROJETO PARA SISTEMAS WEB I 17

 SUMÁRIO

Seguir essas regras é um imperativo porque, caso contrário, um dos grandes ga- Na BCL encontramos classes que contemplam desde um novo sistema de janelas a bibliote-

nhos do .NET, que é a independência da linguagem de programação e a sua interopera- cas de entrada/saída, gráficos, sockets, gerenciamento da memória, etc. Esta biblioteca de classes

bilidade, fica comprometido. é organizada hierarquicamente em uma estrutura conhecida como namespace. Ao desenvolver um

componente de software reusável, este precisa ser estruturado em um namespace, para que possa ser

Dizer que uma linguagem é compatível com o CLS significa que, mesmo quando usado a partir de um outro programa externo.

esta é sintaticamente diferente de qualquer outra que implemente .NET, semantica-

mente ela é igual, porque na hora da compilação será gerado um código intermedi- VISÃO GERAL DO ASP.NET
ário (e não código assembly dependente da arquitetura do processador), equivalente

para duas peças de código iguais, porém, escritas em linguagens diferentes. O ASP.NET é um conjunto de tecnologias para desenvolvimento web, que possibilita aos pro-

gramadores construir web site, aplicações web e web services XML. Pelo fato de o ASP.NET ser parte

É importante entender esse conceito, para não pensar que o código desen- do Framework .NET, você pode desenvolver aplicações web em qualquer uma das linguagens .NET.

volvido em C# não pode interagir com código desenvolvido em VB ou outras lin-

guagens, porque mesmo estas sendo diferentes, todas são compatíveis com o CLS. Um dos principais componentes do ASP.NET é o web form. Uma aplicação ASP.NET típica, con-

siste de um ou mais web form. Um web form, que é uma página onde o usuário visualiza em seu brow-

BCL (BASE CLASSE LIBRARY) ser, sendo dinâmica e processada no servidor, podendo acessar recursos. Também pode ser utilizada

para interagir com o usuário no navegador, utilizando código JavaScript ou AJAX.

Como era de se esperar, uma plataforma que promete facilitar o desenvol-

vimento de sistemas precisa ter uma biblioteca de classes básica, que alavanque a Em outras palavras, uma página HTML tradicional pode executar scripts no cliente para executar

simplicidade e a rapidez no desenvolvimento de sistemas. tarefas básicas. Já uma página ASP.NET web form pode também executar código ao lado do servidor, para

acessar banco de dados, gerar outros web forms ou fazer uso de dispositivos de segurança do servidor.

É este o objetivo da BCL (Biblioteca de Classes Base): oferecer ao desenvol-

vedor uma biblioteca consistente de componentes de softwares reutilizáveis, que O ASP.NET é independente do dispositivo que for usado para acessá-lo, permitindo ao programador

não apenas facilitem, mas também acelerem o desenvolvimento de sistemas. desenvolver web forms que poderão ser vistos em quaisquer dispositivos que tenham um navegador web.

PROJETO PARA SISTEMAS WEB I 18

 SUMÁRIO

O ASP.NET também faz uso do Visual Studio para construir e executar as apli- COMPONENTES DE UMA APLICAÇÃO ASP.NET
cações ASP.NET. Isso resulta em um processo de desenvolvimento simplificado, per-

mitindo testar a aplicação sem precisar criar um ambiente de hospedagem externo. Os componentes de uma aplicação ASP.NET incluem:

Estão embutido no ASP.NET, métodos de autenticação do tipo Windows ou for-

• web forms e páginas .aspx: os web forms fornecem a interface do usuário às aplicações web;
ms, que auxiliam o programador a manter sua aplicação e dados seguros. Cada apli-
• user controls, ou controles .ascx: os user controls fornecem a UI para funcionalidades espe-
cação ou site, disponibilizado em um servidor web, roda como um processo dentro
cíficas a serem reutilizadas em web forms diferentes;
do Internet Information Services (IIS).

• arquivos code-behind: o arquivo code-behind é associado ao web form que contém o código
O ASP.NET é também um ambiente de desenvolvimento web, que inclui fun-
Server-side para ele. Você também pode optar por criar uma página ASP.NET em único ar-
cionalidades para você desenvolver aplicações web com o mínimo de codificação,
quivo que contenha o HTML e o código fonte .NET;
em qualquer linguagem compatível com a CLR, incluindo Microsoft Visual Basic, C#,
• arquivos de configuração: são arquivos XML que definem a configuração da aplicação web
Microsoft JScript .NET, e J#.
no servidor. Cada aplicação web pode ter um ou mais arquivos. Já cada servidor web pode ter

somente um arquivo machine.config;

• global.asax: o arquivo Global.asax contém um código para responder eventos a nível de apli-

cação, que são acionados pelo ASP.NET como erros não tratados na aplicação;

• XML web service: permitem a aplicação enviar e receber dados de um XML web service;

• conexões a banco de dados: permitem a aplicação web transferir dados de fontes de dados;

• itens adicionais: arquivos adicionais que você inclui na aplicação web como arquivos HTML

para conteúdo estático, arquivos texto, arquivos XML, arquivos XSLT;

• CSS: arquivos que contêm folhas de estilo utilizadas no design da aplicação.

PROJETO PARA SISTEMAS WEB I 19

 SUMÁRIO

ASP.NET E AJAX

O ASP.NET também disponibiliza um framework livre, Microsoft AJAX, para

ser utilizado em aplicações interativas. O ASP.NET AJAX permite enviar, de for-

ma assíncrona, uma seção ou parte de uma página web ao servidor, e receber

uma resposta de forma a não distrair o usuário ou mesmo interromper o que ele

estava fazendo na página.

O ASP.NET AJAX pode ser usado em conjunto com o código server-side que,

automaticamente, geram código client-side JavaScript. O ASP.NET AJAX também

disponibiliza o AJAX Control Toolkit, que é uma coleção de controles client-side

interativos, juntamente com a biblioteca jQuery.

SÍNTESE

Neste capítulo apresentamos a plataforma .NET e trazemos uma breve des-

crição da linguagem ASP.NET.

Além disso, tivemos o primeiro contato com os conceitos de CLR, CTS, CLS e

BCL, apresentando os principais componentes que dão suporte ao Framework .NET.

Para finalizar, fizemos uma breve apresentação da linguagem ASP.NET, que

será o assunto principal desta disciplina.

PROJETO PARA SISTEMAS WEB I 20

 ASP.NET MVC
A estrutura ASP.NET MVC oferece uma alternativa ao padrão web forms
do ASP.NET para criar aplicações web.

21
 SUMÁRIO

O ASP.NET é uma tecnologia de desenvolvimento consolidada no mercado há alguns anos. Essa tec- Em aplicativos pequenos, o modelo, muitas vezes, é uma separa-

nologia se divide em dois grandes subtipos: o ASP.NET web forms e o ASP.NET MVC. Esse último é o gran- ção conceitual, em vez de física. Por exemplo, se o aplicativo apenas ler

de foco do nosso estudo. um conjunto de dados e enviá-lo para exibição, não terá uma camada de

modelo físico nem classes associadas. Nesse caso, o conjunto de dados

Essa tecnologia, basicamente, faz uso de um padrão de design, o MVC, implementado na forma de um assume a função de um objeto de modelo.

framework pela Microsoft, e é esse framework, com todos os seus recursos, o grande responsável pela criação

de excelentes aplicações web utilizando o padrão MVC. VIEW

O MVC é um padrão de arquitetura para o desenvolvimento de software, que visa separar as regras e As Views são componentes que exibem a Interface do Usuário (IU)

lógicas do negócio da apresentação em si, permitindo maior controle sobre a aplicação e possibilitando uma do aplicativo. Normalmente, esta IU é criada a partir dos dados do Mo-

manutenção isolada de ambos e maior segurança na aplicação. del. Um exemplo seria uma exibição de edição de uma tabela de produtos

mostrando caixas de texto, listas suspensas e caixas de seleção com base

O padrão MVC é responsável pela apresentação da aplicação, visando criar um código que não possui no estado atual de um objeto Product.

uma conexão forte entre as partes (loosely coupled). Essa é uma das bases do desenvolvimento de código atu-

al, e facilita muito a manutenção e adição de funcionalidades ao código, posteriormente. Dentro do padrão CONTROLLER
MVC há três elementos principais:

Os Controllers são os componentes que lidam com a interação do

MODEL usuário, trabalham com o modelo e, finalmente, selecionam uma View de

renderização que mostra essa IU. Em um aplicativo MVC, a View só mos-

Os Models são as partes do aplicativo que implementam a lógica para o domínio de dados do aplicativo. tra informações; o Controller manipula e responde à entrada e à interação

Muitas vezes, os objetos de modelo recuperam e armazenam o estado do modelo em um banco de dados. Por do usuário. Por exemplo, o Controller manipula valores de uma consulta,

exemplo, um objeto Product pode recuperar informações de um banco de dados, operar nele e, em seguida, passando esses valores ao Model, que, por sua vez, pode usar estes valo-

gravar informações atualizadas de volta em uma tabela de produtos, em um banco de dados do SQL Server. res para consultar o banco de dados.

PROJETO PARA SISTEMAS WEB I 22

 SUMÁRIO

A conexão flexível entre os três componentes principais de um aplicativo MVC também pro-

move o desenvolvimento paralelo. Por exemplo, um desenvolvedor pode trabalhar na exibição,

um segundo desenvolvedor pode trabalhar na lógica do controlador e um terceiro desenvolvedor

pode se concentrar na lógica de negócios do modelo.

VANTAGENS DE UMA APLICAÇÃO WEB BASEADA EM MVC

A estrutura ASP.NET MVC oferece as seguintes vantagens:

• torna mais fácil gerenciar a complexidade ao dividir o aplicativo em Model, View e Controller;

O padrão MVC ajuda a criar aplicativos que separam as diferentes camadas do

• não utiliza o ViewState nem web forms baseados no servidor. Isto torna a estrutura MVC ideal
aplicativo (lógica de entrada, lógica de negócio e lógica da IU), enquanto fornece um
para desenvolvedores que desejam controle completo sobre o comportamento do aplicativo;
acoplamento flexível entre esses elementos. O padrão especifica onde cada tipo de ló-

gica deve ficar localizado no aplicativo: • usa um padrão Front Controller, que processa as solicitações do aplicativo web através de

um único Controller. Isto permite desenvolver um aplicativo que suporta uma poderosa in-
• a lógica da IU fica na View;
fraestrutura de roteamento;

• a lógica de entrada fica no Controller;

• fornece um melhor suporte para desenvolvimento controlado por testes (TDD – Test Driven

Development);
• a lógica de negócios fica no Model.

• funciona bem com aplicativos web que são suportados por grandes equipes de desenvolve-
Essa separação ajuda a administrar a complexidade quando se cria uma aplicação,
dores, e com web designers que precisem de um grande grau de controle sobre o compor-
pois permite que se concentre em um aspecto da implementação por vez. Por exemplo,
tamento do aplicativo.
pode-se concentrar na exibição sem depender da lógica de negócios.

PROJETO PARA SISTEMAS WEB I 23

 SUMÁRIO

RECURSOS DA ESTRUTURA ASP.NET MVC • suporte abrangente para roteamento ASP.NET, poderoso componente de mapeamento de URL

que permite desenvolver aplicativos com URLs abrangentes e pesquisáveis. As URLs não pre-

A estrutura ASP.NET MVC fornece os seguintes recursos: cisam incluir extensões de nome de arquivo e são desenvolvidas para suportar padrões de de-

nominação de URLs, que funcionam bem para SEO (Search Engine Optimization – Otimização do

• separação de tarefas do aplicativo (lógica de entrada, lógica de negócio e Mecanismo de Pesquisa) e endereçamento REST (Representational State Transfer – Transferên-

lógica da IU), possibilitando testes usando o TDD. Todas as conexões na cia de Estado Representacional);

estrutura MVC são baseadas na interface e podem ser testadas usando ob-

jetos fictícios, que são objetos simulados que imitam o comportamento • suporte ao uso de marcação em arquivos de marcação de páginas ASP.NET (arquivos .aspx), de

dos objetos reais no aplicativo. Pode-se testar a unidade do aplicativo sem controle de usuário (arquivos .ascx) e de página mestra (arquivos .master) existentes como mo-

ter que executar os controladores em um processo ASP.NET, o que acelera delos de exibição. Pode-se usar recursos ASP.NET existentes com a estrutura ASP.NET MVC, como

e flexibiliza o teste da unidade; páginas mestras aninhadas, expressões em linha (<%= %>), controles de servidor declarativos,

modelos, vinculação de dados, localização e assim por diante;

• estrutura extensível e conectável. Os componentes da estrutura ASP.NET

MVC são desenvolvidos para serem facilmente substituídos ou personali- • suporte para recursos ASP.NET existentes. A estrutura ASP.NET MVC permite a utilização de re-

zados. É possível conectar o seu próprio mecanismo de exibição, política cursos como autenticação de formulários e autenticação do Windows, autorização de URLs, as-

de roteamento de URL, serialização de parâmetro ação-método e outros sociação e funções, caching de saída e dados, gerenciamento de estado de sessão e perfil, moni-

componentes. A estrutura ASP.NET MVC também suporta o uso dos mo- toramento de integridade, sistema de configuração e arquitetura de provedor.

delos de contêiner de DI (Dependency Injection – Injeção de Dependência) e

IOC (Inversion of Control – Inversão de Controle). A DI permite injetar obje- ENTENDENDO A ESTRUTURA DE UMA APLICAÇÃO ASP.NET MVC NA PRÁTICA
tos em uma classe, em vez de depender da classe para criar o objeto. A IOC

especifica que se um objeto requer outro objeto, os primeiros devem obter Para entendermos a estrutura de uma aplicação ASP.NET MVC, vamos começar criando um pro-

o segundo objeto de uma fonte exterior, como um arquivo de configuração; jeto desse tipo. O primeiro passo é a criação de uma “ASP.NET Web Application”.

PROJETO PARA SISTEMAS WEB I 24

 SUMÁRIO

Observando as Figuras 1 e 2, vamos escolher o template vazio, com a opção de diretó-

rios e referências para um projeto MVC. Repare, na figura, que existem diversos templates

que podem ser escolhidos, inclusive o MVC. Esse template traz uma série de elementos que

podem ser úteis em alguns casos. Para fins de exemplo, não iremos utilizá-lo, uma vez que

essa estrutura criada prejudica o entendimento dos recursos que o MVC Framework nos traz.

Figura 2 - Criando projeto MVC vazio

Clicando em OK, temos um projeto MVC com os diretórios e as referências criadas. Se

observarmos a nossa solução, veremos que estão lá os diretórios “Controllers”, “Models” e

“Views”, como mostra a Figura 2. Além disso, as referências necessárias também estão adi-

cionadas. Repare que o projeto não traz nenhum tipo de CSS, por exemplo, que seria criado no

caso do uso do template MVC. É possível notarmos, na figura, o arquivo RouteConfig.cs. Esse

Figura 1 - Criando projeto MVC vazio

arquivo é essencial para o MVC Framework, sendo responsável pelo roteamento da aplicação.

PROJETO PARA SISTEMAS WEB I 25

 SUMÁRIO

A Figura 3 ainda traz outros elementos que podemos notar. Um deles é o diretório

“App_Data”. Esse diretório precisa ser utilizado para guardar os dados privados da aplica-

ção, como bases de dados e arquivos XML. Essa nomeação de diretório garantirá que o IIS

(servidor) não utilizará o conteúdo do mesmo. Caso esses dados sensíveis estejam em outro

Figura 3 - Projeto inicial

lugar, há uma grande chance de problemas de segurança.

O projeto traz alguns arquivos básicos. O primeiro deles, Global.asax, é a classe de apli-

cação ASP.NET. Ele possui uma classe de code-behind (Global.asax.cs), onde devem ser regis-

tradas configurações de rotas ou qualquer código de inicialização e finalização da aplicação.

Vamos analisar o arquivo RouteConfig.cs. Note que há um método: RegisterRoutes(). Ba-
Além disso, é possível adicionarmos um código padrão para exceções que não foram controla-
sicamente, esse método é responsável pelo registro das rotas de nossa aplicação. Por padrão,
das. Esse arquivo é o mesmo (possui a mesma função) em projetos ASP.NET MVC ou web forms.
ele irá registrar uma rota para o controller “Home” e a view “Index”, conectando os dois. Esses
Outro deles é o arquivo “/Views/web.config”. Esse arquivo tem uma função similar ao diretório
dois elementos representam, por convenção, a página inicial da aplicação ASP.NET MVC. Note
“App_Data”: evitar que o conteúdo das views seja utilizado pelo IIS, garantindo que elas sejam
que esse arquivo está dentro do diretório “App_Start”. Esse diretório deve conter outros ele-
executadas por um Action Method (métodos especiais dos controllers utilizados para chamar as
mentos de configuração do núcleo da aplicação, como filtros.
views). Por fim, o arquivo Web.config é o arquivo de configuração de toda a aplicação.

Como podemos notar, projetos ASP.NET MVC possuem alguns elementos que são

tratados como convenções e outros como obrigações do desenvolvedor. Por exemplo, é

comum a utilização de um diretório “Content” para guardar os arquivos .css, imagens e

vídeos da aplicação, embora não seja obrigatório. Outros, como o diretório “App_Start”,

é utilizado para arquivos de inicialização da aplicação. Isso pode ser alterado pelo desen-

volvedor, mas exige um trabalho muito maior, além de um conhecimento mais profundo

da estrutura do projeto e do MVC Framework.

PROJETO PARA SISTEMAS WEB I 26

 SUMÁRIO

CONVENÇÕES DE NOMES Como podemos ver na Figura 4, ao adicionarmos o control-

ler, uma janela irá abrir. É interessante que o Visual Studio já nos

As convenções de nomes são muito importantes em projetos ASP.NET MVC, porque o MVC Framework utiliza um traz uma sugestão, indicando a utilização do sufixo “Controller”.

conceito chamado de convention over configuration, que significa “convenção sobre configuração”. Esse conceito diz A utilização desse sufixo é uma convenção dentro do ASP.NET

que o desenvolvedor não precisa, explicitamente, criar associações entre controllers e views, por exemplo, se ele seguir MVC, e evita a alteração de outras configurações. Com esse pa-

uma convenção de nomes. Caso essa convenção seja utilizada, o sistema irá entender e fazer a ligação entre eles. drão, o MVC Framework irá conectar o controller à view de mesmo

nome, automaticamente. Nesse caso, iremos criar um controller

Vamos realizar a criação de um controller em nossa aplicação exemplo. Ele estará no diretório “Controllers”, de chamado Default1Controller. Esse controller estará presente em

forma apropriada. Note, na Figura 4, que o Visual Studio novamente oferece uma série de templates para o controller. praticamente todos os projetos ASP.NET MVC criados.

A ideia é que algumas utilizações comuns dos mesmos sejam utilizadas com maior facilidade. Entretanto, estaremos

criando um controller vazio nesse momento.

Figura 5. Código do Controller

Vamos analisar o código mostrado na Figura 5. Esse é o

código de nosso Default1Controller, criado automaticamente.

Note que há um método de ação padrão, Index(), que está re-

tornando a view. Quando retornamos a view, podemos utilizar

o seu nome, algo como “return View (minhaView)”. Quando

PROJETO PARA SISTEMAS WEB I 27

 SUMÁRIO

isso não é definido explicitamente, a aplicação irá procurar pela view SÍNTESE
com o nome do método de ação, Index, nesse caso. É a essa conven-

ção de nomes que precisamos estar atentos. Para isso, criamos uma Neste capítulo vimos:

view comparada à Figura 6.

• O desenvolvimento de sistemas em camadas é uma

prática que prioriza a implementação de aplicações

em um formato bem estruturado, enfatizando a se-

paração dos diferentes componentes de uma apli-

cação em partes lógicas.

Figura 6. Criação da View

• Quando o processo de implementação é conduzido

de uma forma organizada e em conformidade com

boas práticas, a execução de atividades de imple-

mentação acontece, quase sempre, sem maiores

dificuldades; tais aspectos ainda continuam válidos

ao considerar tarefas que envolvam a manutenção

Note que os projetos ASP.NET MVC seguem uma série de conven- de funções preexistentes.

ções de nomes, e devemos segui-los de forma a termos projetos legíveis.

Além disso, evitamos ter que alterar uma série de configurações dentro • Em termos práticos, uma camada nada mais é do que

do projeto. O objetivo é que tenhamos uma aplicação flexível, baseada uma parte lógica que agrupa classes e outras estru-

em uma série de elementos como os que mostramos até o momento. turas que possuam um comportamento semelhante.

PROJETO PARA SISTEMAS WEB I 28

EXERCÍCIOS SUMÁRIO

1. Crie um projeto do tipo ASP.NET web application chamado

FTEC no Visual Studio. Utilize o template MVC.

2. Crie um controlador chamado Aula no projeto FTEC.

3. Crie uma página na aplicação, adicionando um arquivo cha-

mado Index.cshtml dentro da pasta Views\FTEC\.

PROJETO PARA SISTEMAS WEB I 29

 CAMADA DE
APRESENTAÇÃO -
RAZOR
O Razor é o view engine do ASP.NET MVC. Com ele podemos escrever
código C# nas views, a fim de estruturar as páginas que serão exibidas
para o usuário.

30
 SUMÁRIO

Uma aplicação web pode ser dividida em três camadas básicas: acesso a dados, Em resumo, o que esta camada deve definir é como estes dados serão apresentados para o

regras de negócio e visualização. O padrão MVC (Model-View-Controller) foca bas- usuário da aplicação.

tante nesta divisão, separando as responsabilidades dentro da aplicação web.

O contrário também é válido, onde a camada de apresentação coleta os dados que são infor-

Existem diversos estudos, padrões e boas práticas de desenvolvimento no pa- mados pelos usuários e os envia à camada de controle, que os usa para alterar a camada de mode-

drão MVC. A maioria dos esforços para uma boa codificação de software se concentra lo, caracterizando o padrão MVC.

na camada de controle e modelo. Por muito tempo foi assim, a camada de visualiza-

ção não evoluía tanto quanto as demais. PÁGINAS ESTÁTICAS E DINÂMICAS

Com o advento de tecnologias novas e robustas como o ASP.NET Razor, a cama- Na camada de apresentação de uma aplicação web podemos desenvolver dois tipos de pági-

da de visualização de dados de aplicações web dentro da plataforma .NET, mudou de nas: estáticas e dinâmicas.

um cenário não tão satisfatório para um novo cenário muito bom.

Uma página estática é desenvolvida via HTML e não permite muita interação e funciona-

Existem boas práticas que devemos seguir também no desenvolvimento de nos- lidades, com exceção de links. Estas páginas são muito fáceis de serem desenvolvidas, porém,

sas páginas da camada de apresentação, que nos ajudarão em futuras manutenções não apresentam grande utilidade, tanto para os desenvolvedores quanto para os visitantes,

das aplicações desenvolvidas. já que somente pode-se apresentar textos corridos, imagens e alguns conteúdos multimídia,

como áudios e vídeos.

CAMADA DE APRESENTAÇÃO
As páginas dinâmicas servem para adicionar funcionalidades e efeitos especiais. Para isso, é

A camada de apresentação é a responsável por apresentar as páginas de uma apli- necessário utilizar junto do HTML alguma outra linguagem de programação que possa prover es-

cação web. Os dados que devem ser apresentados na camada de apresentação são pro- tas funcionalidades extras, como PHP, JSP e ASP.NET. Essas páginas podem oferecer diversos re-

vidos pela camada de modelo, que envia informações para a camada de apresentação. cursos e efeitos, tornando-se muito mais complexas do que simples páginas estáticas com HTML.

PROJETO PARA SISTEMAS WEB I 31

 SUMÁRIO

RAZOR
Nota: devemos lembrar que o Razor não é uma nova linguagem de
programação, é simplesmente um novo modelo de desenvolvimento. O
Até a segunda versão do ASP.NET MVC, as páginas de uma aplicação poderiam ser que ocorre é que no back-end temos C# sendo executado.
desenvolvidas apenas em ASPX. A partir da terceira versão do framework, foi incluída uma

nova tecnologia, chamada Razor, para desenvolvermos estas páginas. SINTAXE E DECLARAÇÃO DE VARIÁVEIS RAZOR

O Razor é uma View Engine, uma forma de escrever visualizações em aplicações web.
Todas as expressões Razor devem, obrigatoriamente, iniciar com o caractere @. Toda
Esta tecnologia se caracteriza por ser simples, concisa e de fácil aprendizado, diferente-
a codificação Razor ficará dentro de um bloco {}. Ao utilizarmos o C#, a extensão do arqui-
mente do ASPX, onde precisamos de muito menos tags e scripts.
vo será “.cshtml”.

O Razor contribuiu tanto para a ferramenta Visual Studio, que View Engine passou a
Existem duas maneiras de declararmos variáveis em Razor, como veremos na Figura
ser padrão do framework a partir da versão três.
7. A primeira é num bloco de declaração único de variável, onde desejamos declarar apenas
A sintaxe ajuda a todos os desenvolvedores, tanto os sem experiência, que conse- uma variável, conforme a linha 7. Neste caso, declaramos e já iniciamos a variável site, para
guem aprender rapidamente e desenvolver as páginas, quanto os desenvolvedores expe- usá-la posteriormente na linha 11.
rientes, tornando-os mais produtivos.

Quando desejamos criar várias variáveis, podemos criar um bloco de comando múltiplo
Quando trabalhamos com a View Engine Razor, o que acontece na prática é um
Razor, através do @ e {}. Desta forma simplificamos a declaração e podemos declarar quan-
misto de códigos HTML com a sintaxe Razor. O servidor em primeira instância lê o có-
tas variáveis desejarmos dentro das chaves, conforme linhas 15 a 19. O acesso a elas é através
digo escrito e interpreta, primeiramente, o código Razor, para depois enviar a página
do bloco único, conforme linhas 24 a 27.
HTML para o navegador.

Para acessar as variáveis criadas é muito simples, basta adicionar o caractere @ segui-
Páginas web escritas utilizando a View Engine Razor têm a extensão (CSHTML),
do do nome da variável, quando estamos fora de um bloco Razor. Estando dentro do bloco (@
onde são misturadas tags HTML com scripts de servidor escritos em C# ou qualquer outra
{...}), o acesso é direto e não precisamos do @, conforme podemos ver na Figura 7.
linguagem de programação suportada pelo .NET.

PROJETO PARA SISTEMAS WEB I 32

 SUMÁRIO

@if ( numero == numeroDaFTEC )

{
<p>Chegou na FTEC!</p>
}
else
{
<p>Continue andando .</p>
}

<! -- ou -->
@{
int numero = 463;
if( numero == numeroDaFTEC )
{
<p>Chegou na FTEC!</p>
}
Figura 7 - Declaração de variáveis em Razor else
{
CONDICIONAIS (IF E ELSE) <p>Continue andando .</p>
}
Podemos utilizar os comandos de controle de fluxo if e else. }
Veja os exemplos.

PROJETO PARA SISTEMAS WEB I 33

 SUMÁRIO

LAÇOS DE REPETIÇÃO
ViewBag . HoraDoServidor = DateTime . Now . ToShortTimeString ();

Podemos criar laços utilizando o comando for.

Nesse código, criamos uma chave chamada HoraDoServidor e atribuímos um valor a

ela. Na camada de apresentação, os itens armazenados na ViewBag podem ser acessados fa-
@for ( int i = 0; i < 5; i ++)
{ cilmente através da sintaxe da Razor. Veja um exemplo.
<p>i = @i </p>
} A hora do servidor é @ViewBag . HoraDoServidor

A ViewBag oferece uma forma simples de transmitir dados da camada de controle à

TEXTO E CÓDIGO
camada de apresentação, mas apresentam algumas desvantagens. Por exemplo, como as
@if (x == “ nome “) chaves são adicionadas dinamicamente, não é possível garantir a existência delas em tempo
{
de compilação. Considere o código.
@:O nome da editora é @editora . Nome
}
double numero = new Random (). NextDouble ();
if( numero < 0.5)
COMENTÁRIOS {
ViewBag .X = “ FTEC “;
Podemos adicionar comentários nas páginas. }
else
@* Comentário *@ {
ViewBag .X = 10;
}
VIEWBAG E STROGLY TYPED VIEWS
Nesse código, o tipo do objeto associado à chave X depende do valor da variável núme-
A ViewBag é utilizada para transmitir dados da camada de controle à camada de ro, que é gerado aleatoriamente. Quando o valor gerado for menor do que 0.5, o tipo desse
apresentação. Para adicionar um item à propriedade ViewBag, devemos definir uma cha- objeto será string. Caso contrário, o tipo desse objeto será int. Suponha que a chave X seja
ve para esse item. Veja o código. utilizada na camada de apresentação.

PROJETO PARA SISTEMAS WEB I 34

 SUMÁRIO

Para definir o tipo do objeto esperado na camada de apresentação, podemos utilizar a

<p>@ViewBag .X. Lower () </p>
sintaxe da Razor. Veja o código.

O código apresentado não produz erros de compilação. Contudo, na execução, um

@model FTEC.Models.Faculdade
erro poderá ocorrer. O problema é que esse código supõe que o objeto associado à chave

X possui o método Lower(). Se na ação for acionado um número suficiente de vezes, em Podemos também utilizar o comando using para evitar a escrita dos nomes completos

algum momento isso não será verdade, e um erro de execução ocorrerá. das classes.

@using FTEC.Models
Além disso, recursos do Visual Studio, como IntelliSense (recurso para completar
@model Faculdade
código) ou refatoração, não podem ser aplicados com o uso da ViewBag.
Para acessar o objeto transmitido da camada de controle à camada de apresentação, de-

Uma alternativa à utilização da ViewBag é o recurso strongly typed views. Com esse vemos utilizar a propriedade Model. Observe o código a seguir.

recurso podemos fixar, em tempo de compilação, o tipo do objeto que será transferido da
@using FTEC.Models
camada de controle à camada de apresentação. Uma vez que o tipo desse objeto foi fixado, o @model Faculdade
<p>
compilador é capaz de verificar a validade do código, evitando eventuais erros de execução.
Nome : @Model . Nome<br />
Email : @Model . Email
O Visual Studio pode auxiliar o desenvolvimento da aplicação com os recursos de </p>
IntelliSense e de refatoração. Para utilizar strongly type views, o primeiro passo é, na
Se tentarmos acessar um método ou propriedade inexistentes, um erro de compilação
camada de controle, passar como parâmetro para o método View() um objeto do tipo
ocorrerá, pois agora o compilador conhece o tipo do objeto transmitido. Dessa forma, o códi-
esperado pela camada de apresentação.
go produz um erro de compilação.

@using FTEC.Models
public ActionResult Acao ()
@model Faculdade
{
<p>
Faculdade faculdade = new Faculdade { Nome = “ FTEC “, Email = “ ftec@ftec.com.br” };
Nome : @Model . Nome<br />
return View ( faculdade );
Telefone : @Model . Telefone
}
</p>

PROJETO PARA SISTEMAS WEB I 35

 SUMÁRIO

Observe que apenas um objeto pode ser transmitido da camada de controle à cama-
@Html.ActionLink (“ Lista de cursos “, “ Index “, “ Faculdade “)
da de apresentação através do recurso strongly type views. Com a utilização de ViewBag,

diversos objetos podem ser transmitidos. Note também, que os dois recursos podem ser
Se o formato da URL para acessar a ação Index do controlador Faculdade for alterado,
utilizados ao mesmo tempo.
o código indicado não precisa ser alterado.

HTML HELPERS
ACTIONLINK HELPER

A função das páginas CSHTML é gerar hipertexto XHTML para enviar aos navegadores
O helper ActionLink é utilizado para gerar os links das páginas de uma aplicação web.
dos usuários. Os arquivos .cshtml misturam tags XHTML com scripts de servidor escritos em
Esse helper pode ser utilizado de diversas maneiras. A forma mais simples de utilizá-lo é
C# (ou outra linguagem de programação suportada pelo .NET). Essa mistura pode prejudi-
passar a ele dois parâmetros: o texto e a ação associados ao link desejado. Nesse caso, o
car a legibilidade do código, em alguns casos. Além disso, a manutenção da aplicação pode
link gerado pelo helper ActionLink estará associado ao controlador correspondente à pá-
se tornar mais complexa.
gina na qual o link foi inserido.

Considere a criação de um link utilizando diretamente as tags HTML. @Html.ActionLink (“ TEXTO PARA O USUÁRIO “, “ ACTION “ )

<a href =”/Cursos/Index/”>Lista de cursos </a> Podemos definir o controlador desejado explicitamente. Para isso, é necessário passar

um terceiro parâmetro para o método ActionLink.

Se o formato da URL para acessar a ação Index do controlador Editora for alterado, o

código apresentado deverá ser modificado. Para facilitar a manutenção do código das pági-
@Html . ActionLink (“ TEXTO PARA O USUÁRIO “, “ ACTION “, “ CONTROLADOR “ )
nas CSHTML, o ASP.NET MVC oferece os chamados HTML helpers.

O helper ActionLink permite que parâmetros sejam adicionados nos links gerados. Para
A função de um HTML helper é encapsular um código XHTML. Por exemplo, para adi-
isso, é necessário passar um array como parâmetro.
cionar um link, podemos usar o método ActionLink do objeto HTML, ao invés de usar a tag
@Html.ActionLink (“ TEXTO PARA O USUÁRIO “, “ ACTION “, new { Inicio = 0, Final = 10 })
<a> do HTML diretamente. No código criamos um link à ação responsável por listar os cursos.

PROJETO PARA SISTEMAS WEB I 36

 SUMÁRIO

CHECKBOX O valor enviado através do checkbox inserido no formulário será armazenado na pro-

priedade “Aceito” do contrato enviado como parâmetro para a ação Cadastra(). Dessa for-
Podemos adicionar um checkbox em um formulário através do helper CheckBox.
ma, a classe Contrato deve possuir uma propriedade booleana chamada Aceito.

@Html.CheckBox (“ Aceito “, false )

public class Contrato
O código exposto produz o seguinte trecho de código HTML: {
public Boolean Aceito { get; set ; }
}
<input id=” Aceito “ name =” Aceito “ type =” checkbox “ value =” true “ />
<input name =” Aceito “ type =” hidden “ value =” false “ />

TEXTBOX
Considere o formulário a seguir:

@using ( Html . BeginForm (“ Cadastra “, “ Contrato “)) Uma caixa de texto pode ser adicionada através do helper TextBox.
{
@Html . CheckBox (“ Aceito “, false ) @Html.TextBox (“ Nome “, “ Digite o seu nome “)
<input type =” submit “ value =” Cadastra Contrato “/>
}
O código apresentado produz o seguinte trecho de código HTML:
Agora, considere a ação associada ao formulário criado no código anterior.
<input id=” Nome “ name =” Nome “ type =” text “ value =” Digite o seu nome “ />
public class ContratoController : Controller
{
// POST : / Contrato / Cadastra TEXTAREA
[ HttpPost ]
public ActionResult Cadastra ( Contrato contrato )
{ Uma caixa para textos maiores pode ser adicionada através do helper TextArea.
...
return View (); @Html.TextArea (“ Mensagem “, “ Digite uma mensagem “)
}
}

PROJETO PARA SISTEMAS WEB I 37

 SUMÁRIO

O código exibido produz o seguinte trecho de código HTML: O código apresentado produz o seguinte trecho de código HTML:

<textarea cols =”20” id=” Mensagem “ name =” Mensagem “ rows =”2”>

Digite uma mensagem <input id=” Password “ name =” Password “ type =” password “
</textarea> value =” senha “ />

RADIOBUTTON
LAYOUTS

Um botão do tipo radio pode ser adicionado através do helper RadioButton.

É comum que as páginas de uma aplicação web possuam conteúdo em

comum (por exemplo, um cabeçalho ou um rodapé). O conteúdo em comum

@Html.RadioButton (“ CidadeNatal “, “São Paulo “, true )
pode ser replicado em todas as páginas através do CTRL+C e CTRL+V.
@Html.RadioButton (“ CidadeNatal “, “ Natal “, false )
@Html.RadioButton (“ CidadeNatal “, “ Piracicaba “, false )

Essa não é uma boa abordagem, pois quando alguma alteração precisa

O código indicado produz o seguinte trecho de código HTML: ser realizada, todos os arquivos devem ser modificados. Também é comum

que as páginas de uma aplicação web possuam um certo padrão visual, sur-

<input checked =” checked “ id=” CidadeNatal “ name =” CidadeNatal “ type =” radio “ value =” São Paulo “ /> gindo o conceito de Layouts.
<input id=” CidadeNatal “ name =” CidadeNatal “ type =” radio “ value =” Natal “ />
<input id=” CidadeNatal “ name =” CidadeNatal “ type =” radio “ value =” Piracicaba “ />
CONTEÚDO COMUM

PASSWORD Tudo que é comum a todas as páginas de um determinado grupo pode

ser definido em um Layout. Dessa forma, qualquer alteração é facilmente

Uma caixa para senha pode ser adicionada através do helper Password. realizada modificando-se apenas um arquivo.

@Html . Password (“ Password “, “ senha “)

PROJETO PARA SISTEMAS WEB I 38

 SUMÁRIO

Por exemplo, suponha que toda página de uma aplicação web deva ter o mesmo título e a mes- Quando a página de edição de editoras é requisitada, o arquivo Edit.cshtml é

ma formatação. Podemos criar um Layout com o título desejado e com a referência ao arquivo CSS processado antes do arquivo FTECLayout.cshtml, o que permite definir o valor de

que define a formatação padrão. ViewBag.Title no arquivo Edit.cshtml e utilizá-lo no layout.

<! DOCTYPE html > Para definir o layout de Edit.cshtml, foi necessário armazenar o caminho
<html > completo do arquivo que define o layout na propriedade Layout. Este procedi-
<head >
<title >@ViewBag . Title </ title > mento não é muito prático, pois em cada página que deseja utilizá-lo, é neces-
@Styles.Render (“~/Content/css”) sário definir esta propriedade.
@Scripts.Render (“~/bundles/modernizr “)
</ head >
A partir da terceira versão do ASP.NET MVC, temos uma nova funcionalidade
<body >
que permite definir um layout padrão para todas as páginas, não havendo neces-
<div id=” header “>
@Html.ActionLink (“ Faculdades “, “ Index “, “ Faculdade “) sidade de definir a propriedade Layout em cada uma. Para isso, basta acrescentar-
@Html.ActionLink (“ Cursos “, “ Index “,” Curso “)
mos o arquivo _ViewStart.cshtml à pasta Views.
</ div >
@RenderBody ()
O _ViewStart.cshtml permite definirmos um código que será executa-
@Scripts.Render (“~/bundles/jquery “)
@Scripts.Render (“~/bundles/bootstrap “) do antes de cada página ser renderizada. Nesse arquivo podemos definir, por
@RenderSection (“scripts”, required:false ) exemplo, a propriedade Layout:
</ body >
</ html >
@{
Layout = “~/Views/Shared/FTECLayout.cshtml “;
Na definição apresentada no código anterior, utilizamos o método Render() das propriedades }
Styles e Scripts para adicionar conteúdo CSS e JavaScript. Na tag <title>, acrescentamos @ViewBag.

Title, para que cada página possa definir o seu próprio título. Por fim, o método RenderBody() indica Como este código é processado antes dos arquivos específicos de cada página,

onde o conteúdo definido em cada página será adicionado. não há mais necessidade de definir a propriedade Layout em cada arquivo específico.

PROJETO PARA SISTEMAS WEB I 39

 SUMÁRIO

SÍNTESE

Neste capítulo vimos:

• A camada de apresentação corresponde à

interface gráfica de um sistema.

• O Razor pode manipular coleções, fazer

chamadas a métodos com parâmetros,

trabalhar com arquivos, entre outras ta-

refas. Seu poder está justamente na ele-

gância e praticidade de inserir a lógica da

aplicação diretamente na camada de visu-

alização, criando uma forma rápida e sim-

ples de criar aplicativos dinâmicos.

PROJETO PARA SISTEMAS WEB I 40

EXERCÍCIOS SUMÁRIO

1. Crie um projeto do tipo ASP.NET web application chamado CamadaDeApresentacao no Visual 4. Altere o arquivo Index.cshtml do exercício anterior para imprimir uma mensagem a

Studio. Utilize o template MVC. partir de uma variável.

@{
2. Adicione um controller chamado Sorte no projeto CamadaDeApresentacao, utilizando o tem- ViewBag . Title = “ Index “;
plate EmptyMVC Controller. Nesse controlador, defina uma ação chamada Index. string mensagem = “ Olá! O seu número da sorte é “ + @
ViewBag . NumeroDaSorte ;
}
namespace CamadaDeApresentacao.Controllers
{
@for ( int i = 0; i < 10; i ++)
public class SorteController:Controller
{
{
<h2 >@mensagem </h2 >
public ActionResult.Index ()
}
{
Random random = new Random ();
ViewBag.NumeroDaSorte = random.Next ();
5. No projeto CamadaDeApresentacao, adicione um controlador chamado Relogio
return View ();
} utilizando o template EmptyMVCController. Nesse controlador, defina uma ação
} chamada Agora. Essa ação deve armazenar a data e o horário atual na ViewBag.
}

namespace CamadaDeApresentacao . Controllers

3. Adicione uma página associada à ação Index do controlador Sorte do projeto CamadaDeA- {
presentacao. public class RelogioController : Controller
{
@{ public ActionResult Agora ()
ViewBag . Title = “ Index “; {
} ViewBag . Agora = DateTime . Now. ToString (“dd/MM/
yyyy HH:mm:ss”);
@for ( int i = 0; i < 10; i ++) return View ();
{ }
<h2 >Olá ! O seu número da sorte é @ViewBag . NumeroDaSorte </h2 > }
} }

PROJETO PARA SISTEMAS WEB I 41

EXERCÍCIOS SUMÁRIO

6. Adicione uma página associada à ação Agora do controlador Relogio.

namespace CamadaDeApresentacao . Controllers
@{ {
ViewBag . Title = “ Agora “; public class AlunoController : Controller
} {
public ActionResult Detalhes ()
<h2 >Agora : @ViewBag . Agora </h2 > {
Aluno a = new Aluno {
AlunoID = 1,
7. Adicione uma entidade chamada Aluno na pasta Models do projeto Cama- Nome = “ Jonas Hirata “,
daDeApresentacao. Email = “ jonas@ftec.com.br”
};
return View (a);
namespace CamadaDeApresentacao . Models }
{ }
public class Aluno }
{
public int AlunoID { get; set ; }

public string Nome { get; set ; }
9. Adicione uma tela associada à ação Detalhes do controlador Aluno com o seguinte conteúdo.

public string Email { get ; set; }

}
} @model CamadaDeApresentacao.Models.Aluno
@{
ViewBag . Title = “ Detalhes “;
}
8. Adicione um controlador chamado Aluno utilizando o template Emp-

tyMVC Controller. Nesse controlador, defina uma ação para transmitir <h2>Detalhes</h2>
<p>AlunoID : @Model.AlunoID</p>
para a camada de apresentação um objeto da entidade Aluno. Utilize
<p>Nome : @Model.Nome</p>
strongly type views. <p>Email : @Model.Email</p>

PROJETO PARA SISTEMAS WEB I 42

EXERCÍCIOS SUMÁRIO

10. Adicione uma ação no controlador Aluno.

public ActionResult Lista ()

{
ICollection <Aluno > lista = new List <Aluno >() ;

for ( int i = 0; i < 5; i ++)

{
Aluno a = new Aluno {
AlunoID = i,
Nome = “ Aluno “ + i,
Email = “ Email “ + i
};
lista.Add (a);
}
return View ( lista );
}

11. Adicione uma tela associada à ação Lista do controlador Aluno com o seguinte conteúdo.

@model ICollection < CamadaDeApresentacao.Models.Aluno >

@{
ViewBag . Title = “ Lista “;
}

<h2 >Tabela de Aluno </h2 >

<table >
<tr >
<th >AlunoID </th >
<th >Nome </th >
<th >Email </th >
</tr >
@foreach (var a in @Model )
{
<tr >
<td >@a. AlunoID </td >
<td >@a. Nome </td >
<td >@a. Email </td >
</tr >
}
</ table >

PROJETO PARA SISTEMAS WEB I 43

 CAMADA DE
CONTROLE
A camada de controle é responsável por definir o comportamento da
aplicação, além de interpretar as ações do usuário e mapear as chamadas
do modelo.

44
 SUMÁRIO

No ASP.NET MVC as URLS são mapeadas para métodos (ações) em classes que defi- ACTIONS
nem os chamados controladores. As requisições enviadas pelos navegadores são proces-

sadas pelos controladores. Os controladores e as ações são elementos fundamentais de uma aplicação ASP.NET MVC.

Um controlador pode conter diversas ações, que são utilizadas para processar as requisições

O processamento realizado por um controlador, para tratar uma requisição, consis- realizadas pelos navegadores. Para criar uma ação é necessário definir um método public dentro

te, basicamente, em: da classe de um controlador.

• recuperar os dados enviados pelo usuário através de formulários;

Os parâmetros desse método podem ser utilizados para receber os dados enviados pelos

usuários através de formulários HTML. Esse método deve devolver um ActionResult, que será
• interagir com a camada de modelo;
utilizado pelo ASP.NET MVC para definir o que deve ser executado depois que a ação terminar.
• acionar a camada de apresentação para construir a página HTML, que deve ser enviada

para o usuário como resposta a sua requisição. Quando um usuário faz uma requisição HTTP através de um navegador, o ASP.NET

MVC verifica, na tabela de rotas, o controlador e a ação associados à URL da requisição reali-
Para que uma classe seja considerada um controlador, ela deve seguir algumas regras: zada. Essa tabela é definida no arquivo RouteConfig.cs e inicializada no arquivo Global.asax.

• o nome da classe deve ter o sufixo “Controller”;

Por padrão, quando criamos um projeto ASP.NET MVC no Visual Studio, uma rota com

o formato {controller}/{action}/{id} é adicionada na tabela de rotas.

• a classe deve implementar a interface System.Web.Mvc.IController ou herdar da classe

System.Web.Mvc.Controller.
ACTIONRESULT

Raramente, você definirá uma classe para criar um controlador implementando a in-
Quando uma ação termina, o método correspondente deve devolver um ActionResult.
terface IController. As classes que definem controladores derivam de Controller, incluindo
O valor devolvido indica para o ASP.NET MVC o que deve ser executado depois da ação. Veja
diversas propriedades e métodos herdados. Essas propriedades facilitam o processamento
uma lista com alguns tipos específicos de ActionResult que podem ser utilizados.
das requisições e a utilização dos recursos do ASP.NET MVC.

PROJETO PARA SISTEMAS WEB I 45

 SUMÁRIO

• ViewResult: devolve uma página da camada de apresentação. Considere o seguinte

return View ( editora );
exemplo.

É possível especificar o nome do arquivo que define a página de resposta e o objeto que
public class TesteController
{ deve ser transmitido à camada de apresentação, ao mesmo tempo.
public ActionResult Acao ()
{ return View (“ NomeDaView “, editora );
return View ();
}
• RedirectResult: redireciona o navegador para uma URL específica.
}

return Redirect (“ http://www.ftec.com.br”);

Considerando uma aplicação ASP.NETMVC em C# e Razor, o método View(), ao ser

chamado sem parâmetros, executará o seguinte processo para determinar qual arquivo deve • RedirectToAction: redireciona para outra ação da camada de controle.
ser utilizado na construção da página de resposta.
return RedirectToAction (“ OutraAction “, “ OutroController “);

1. Se o arquivo Views\Teste\Acao.cshtml existir, ele será utilizado.

• ContentResult: devolve texto.
2. Caso contrário, se o arquivo Views\Shared\Acao.cshtml existir, ele será utilizado.
return Content (“ Texto “,” text \ plain “);
3. Se nenhum desses arquivos existir, uma página de erro será devolvida.
• JsonResult: devolve um objeto no formato JSON.

Podemos especificar o nome do arquivo que define a página de resposta. Veja o exemplo.
return Json ( editora )

return View (“ NomeDaView “);

• JavaScriptResult: devolve código Javascript.
Além disso, podemos passar um objeto à camada de apresentação, que será utilizado nas

páginas fortemente tipadas. return JavaScript (“\$( ’\# divResultText ’). html (’ JavaScript Passed ’);”);

PROJETO PARA SISTEMAS WEB I 46

 SUMÁRIO

• FileResult: devolve dados binários. <html >

<head >
return File (@”c:\ relatorio .pdf “, “ application \ pdf “); <title >Cadastro de Editora </ title >
</ head >
<body >
• EmptyResult: devolve uma resposta vazia.
<form action =”/ Editoras / Salva “ method =” post “>
Nome : <input type =” text “ name =” nome “/>
return new EmptyResult (); Email : <input type =” text “ name =” email “/>
<input type =” submit “ />
</ form >
</ body >
PARÂMETROS </ html >

Os parâmetros enviados pelos usuários, através de formulários

No código indicado, criamos um formulário HTML com os parâmetros nome e e-mail. Esses parâmetros se-
HTML, podem ser recuperados por meio da propriedade Request.
rão recuperados na ação Salva, definida no código.

string nome = Request [“ Nome”]; [ HttpPost ]

public ActionResult Salva ( string nome , string email )
{
Esses parâmetros também podem ser recuperados através dos Editora editora = new Editora { Nome = nome , Email =
parâmetros da ação responsável pelo processamento da requisição email };
db. Editoras .Add ( editora );
HTTP realizada. Para isso, basta definir um parâmetro C# para cada
return View ();
parâmetro HTTP como mesmo nome. Veja o exemplo. }

PROJETO PARA SISTEMAS WEB I 47

 SUMÁRIO

O ASP.NET MVC também é capaz de montar objetos, com os valores dos parâmetros
[ HttpPost ]
HTTP enviados pelo usuário, e passá-los como argumento para as ações dos controladores. public ActionResult Salva ( Editora editora )
{
db.Editoras.Add( editora );
db.SaveChanges ();
[ HttpPost ]
TempData [“ Mensagem “] = “ Editora cadastrada com sucesso !”;
public ActionResult Salva ( Editora editora )
return RedirectToAction (“ Index “);
{
}
db.Editoras.Add ( editora );
return View ();
} Na camada de apresentação podemos recuperar os dados armazenados na proprie-

dade TempData.

As propriedades dos objetos recebidos como argumentos, nas ações dos controla-
Veja o código a seguir:
dores, precisam ter os mesmos nomes dos parâmetros HTTP, ignorando-se letras mai-

úsculas ou minúsculas. @if ( TempData [“ Mensagem “] != null )

{
<p>@TempData [“ Mensagem “]</p>
TEMPDATA
}

Ao efetuar um redirecionamento, uma nova requisição é realizada pelo navegador.

ROTAS
Nesta nova requisição não temos mais acesso aos dados e objetos da requisição anterior ao

redirecionamento. Caso haja a necessidade de preservar dados ao longo do redirecionamen-

Para acessar uma determinada ação da nossa aplicação, os usuários devem realizar
to, podemos utilizar a propriedade TempData.
uma requisição HTTP utilizando a URL correspondente à ação. Por exemplo, para acessar a

listagem de editoras, é necessário digitar na barra de endereço do navegador a URL http://

Por exemplo, ao cadastrar uma editora, podemos efetuar um redirecionamento para a tela
localhost:<PORTA_APP>/Editora/Index. Perceba que o nome do controlador e o nome da
de listagem de editoras. Na propriedade TempData, podemos acrescentar uma mensagem indi-
ação desejados fazem parte da URL. O formato dessas URLs é definido por rotas criadas no
cando o eventual sucesso da operação. Veja o exemplo.
arquivo RouteConfig.cs e carregadas no arquivo Global.asax.

PROJETO PARA SISTEMAS WEB I 48

 SUMÁRIO

O código mostra a rota padrão inserida nos projetos ASP.NET MVC. ADICIONANDO UMA ROTA

routes.MapRoute ( Para acrescentar uma rota, podemos utilizar o método MapRoute(). Suponha que a
name : “ Default “, listagem de editoras deva ser acessada através da URL http://localhost:<PORTA_APP>/
url : “{ controller }/{ action }/{ id}”,
Catalogo. Nesse caso, podemos adicionar uma rota no arquivo RoutesConfig.cs, como
defaults : new { controller = “ Home “, action = “ Index “, id = UrlParameter . Optional
} mostrado no exemplo.
);
routes.MapRoute (
name : “ Nova Rota “,
O primeiro argumento do método MapRoute é o nome da rota, o segundo é a expressão url : “ Catalogo “,
que define o formato da rota e o terceiro é o conjunto de valores padrão dos parâmetros da rota. defaults : new { controller = “ Editora “, action = “ Index “ }
);

A expressão que determina o formato da rota Default utiliza três parâmetros: con-
IMPORTANTE
troller, action e id. Dessa forma, se o usuário realizar uma requisição HTTP utilizando URL

http://localhost:<PORTA_APP>/Editora/Remove/1, o ASP.NET MVC, criará uma instância

As rotas são processadas na ordem em que foram inseridas. Portanto, é importante
do controlador Editora e executará o método Remove() passando o valor 1 como argumento.
definir as rotas mais específicas antes das rotas mais genéricas.

As rotas associam URLs e ações. Veja alguns exemplos de como as URLs serão proces-
ADICIONANDO PARÂMETROS NAS ROTAS
sadas de acordo com as regras de rotas:

Podemos acrescentar parâmetros às rotas. Por exemplo, na rota criada anteriormente,

para a listagem de editoras, poderíamos adicionar um parâmetro para limitar a quantidade

de editoras listadas.

PROJETO PARA SISTEMAS WEB I 49

 SUMÁRIO

Ao definir parâmetros opcionais, devemos utilizar parâmetros do

routes.MapRoute (
name : “ Nova Rota “, tipo nullable type nas ações, pois quando o parâmetro não estiver defi-
url : “ Catalogo /{ maximo }”,
nido na URL de uma requisição, o valor null será atribuído ao parâmetro
defaults : new { controller = “ Editora “, action = “ Index “ }
); da ação. Por exemplo, para os tipos int e double, devemos utilizar int? e

double?, respectivamente.

Por padrão, os parâmetros adicionados a uma rota são obrigatórios. Dessa forma, no exemplo apre-

sentado, a listagem de editoras só poderá ser acessada se o valor do parâmetro máximo for definido na URL SÍNTESE
da requisição. Por exemplo, http://localhost:<PORTA_APP>/Catalogo/20. Se uma requisição for realizada

para a URL http://localhost:<PORTA_APP>/Catalogo, um erro ocorrerá. Para mudar esse comportamento, Neste capítulo vimos:

podemos tornar o parâmetro máximo opcional. Veja o código a seguir.

• A estrutura de funcionamento das rotas e os vários recursos que elas

routes.MapRoute (
podem nos proporcionar, através de códigos de exemplos, e uma apli-
name : “ Nova Rota “,
url : “ Catalogo /{ maximo }”, cação, onde interagimos com os tipos de navegadores.
defaults : new { controller = “ Editora “, action = “ Index “,
maximo = UrlParameter . Optional }
); • Todo projeto de MVC ou Web API tem um Controller, que é o respon-

sável em receber a solicitação do cliente e efetuar o processamento.

Os parâmetros das rotas podem ser recuperados nas ações. Observe o exemplo. E todo Controller tem pelo menos uma Action, que é a ação (método)

a ser executada. Para isto, é preciso informar ao projeto qual o cami-

public ActionResult Index ( int? maximo )
{ nho, qual a classe e a Action, qual a rota que ele deve encontrar e pro-
// implementação cessar. Como toda solicitação parte de uma URL, dizemos que o con-
}
ceito de rota (Route) é exatamente o caminho que a URL deve seguir.

PROJETO PARA SISTEMAS WEB I 50

EXERCÍCIOS SUMÁRIO

1. Crie um projeto do tipo ASP.NET web application chamado CamadaDeControle no Visual 4. Adicione um controlador chamado Produto utilizando o template EmptyMVC Controller.

Studio. Utilize o template MVC.

namespace CamadaDeControle . Controllers
{
2. Adicione uma entidade chamada Produto na pasta Models do projeto CamadaDeControle. public class ProdutoController : Controller
{
public ActionResult Lista ()
namespace CamadaDeControle.Models
{ {
public class Produto FTECContext ctx = new FTECContext ();
{ return View ( ctx. Produtos );
[ HiddenInput ( DisplayValue = false )] }
public int ProdutoID { get ; set; }
[ HttpGet ]
[ Display ( Name =” Nome do Produto “)]
public string Nome { get; set ; } public ActionResult Cadastra ()
{
[ DataType ( DataType . MultilineText )] return View ();
[ Display ( Name =” Descrição do Produto “)] }
public string Descricao { get; set ; }
[ HttpPost ]
[ Display ( Name =” Preço do Produto “)]
public ActionResult Cadastra ( string nome , string descricao , double preco )
public double Preco { get; set ; }
} {
} Produto p = new Produto{
Nome = nome,
Descricao = descricao,
Preco = preco
3. Adicione um DbContext para registrar a entidade Produto e utilizar os recursos do Entity };
Framework. Crie uma classe chamada FTECContext na pastaModels.
FTECContext ctx = new FTECContext ();
ctx . Produtos . Add(p);
namespace CamadaDeControle . Models ctx . SaveChanges ();
{
public class FTECContext : DbContext
return RedirectToAction (“ Lista “);
{
public DbSet < Produto > Produtos { get ; set ; } }
} }
} }

PROJETO PARA SISTEMAS WEB I 51

EXERCÍCIOS SUMÁRIO

5. Adicione uma tela associada à ação Lista do controlador Produto com o seguinte conteúdo. 6. Adicione uma tela associada à ação Cadastra do controlador Produto com o seguinte

conteúdo.

@using CamadaDeControle.Models
@model CamadaDeControle.Models.Produto
@model IEnumerable <Produto >

@{ @{
ViewBag . Title = “ Lista “; ViewBag . Title = “ Cadastra “;
} }

<h2 >Lista </h2 >

<h2 >Cadastra </h2 >
<table >
<tr > @using ( Html.BeginForm ())
<th >@Html . DisplayNameFor (m => m. Nome )</th > {
<th >@Html . DisplayNameFor (m => m. Descricao )</th >
@Html.EditorFor (m => m. ProdutoID )
<th >@Html . DisplayNameFor (m => m. Preco )</th >
</tr > <div >@Html.LabelFor (m => m. Nome )</ div >
@foreach ( var produto in Model ) @Html.EditorFor (m => m. Nome )
{ <div >@Html.LabelFor (m => m. Descricao )</ div >
<tr > @Html.EditorFor (m => m. Descricao )
<td >@Html . DisplayFor (m => produto . Nome )</td >
<div >@Html.LabelFor (m => m. Preco )</ div >
<td >@Html . DisplayFor (m => produto . Descricao )</td >
<td >@Html . DisplayFor (m => produto . Preco )</td > @Html.EditorFor (m => m. Preco )
</tr >
} <div ><input type =” submit “ value =” Cadastrar “ /></ div >
</ table > }

PROJETO PARA SISTEMAS WEB I 52

EXERCÍCIOS SUMÁRIO

7. Altere a ação Cadastra do controlador Produto. 9. Modifique o arquivo Lista.cshtml da pasta Views/Produto.

namespace CamadaDeControle . Controllers

{ @using CamadaDeControle . Models
public class ProdutoController : Controller @model IEnumerable <Produto >
{
public ActionResult Lista ()
{ @{
FTECContext ctx = new FTECContext (); ViewBag . Title = “ Lista “;
return View ( ctx. Produtos ); }
}
[ HttpGet ]
public ActionResult Cadastra () <h2 >Lista </h2 >
{
return View (); @if ( ViewBag . Mensagem != null )
} {
[ HttpPost ]
public ActionResult Cadastra ( Produto p) <div >@ViewBag . Mensagem </ div >
{ }
FTECContext ctx = new FTECContext ();
ctx . Produtos . Add(p); <table >
ctx . SaveChanges ();
<tr >
return RedirectToAction (“ Lista “); <th >@Html . DisplayNameFor (m => m. Nome )</th >
} <th >@Html . DisplayNameFor (m => m. Descricao )</th >
} <th >@Html . DisplayNameFor (m => m. Preco )</th >
}
</tr >

8. Altere a ação Cadastra do controlador Produto. @foreach ( var produto in Model )

public ActionResult Cadastra ( Produto p) {
{ <tr >
FTECContext ctx = new FTECContext (); <td >@Html . DisplayFor (m => produto . Nome )</td >
ctx . Produtos . Add(p); <td >@Html . DisplayFor (m => produto . Descricao )</td >
ctx . SaveChanges ();
<td >@Html . DisplayFor (m => produto . Preco )</td >
ViewBag . Mensagem = “ Produto cadastrado com sucesso !”; </tr >
}
return RedirectToAction (“ Lista “); </ table >
}

PROJETO PARA SISTEMAS WEB I 53

EXERCÍCIOS SUMÁRIO

10. Altere novamente a ação Cadastra do controlador Produto.

public ActionResult Cadastra ( Produto p)

{
FTECContext ctx = new FTECContext ();
ctx.Produtos.Add(p);
ctx.SaveChanges ();

TempData [“ Mensagem “] = “ Produto cadastrado com sucesso !”;

return RedirectToAction (“ Lista “);
}

11. Altere a rota padrão do projeto CamadaDeControle. Para isso, modifique o arquivo Rou-

teConfig.cs da pasta App_Start.

routes.MapRoute (
name : “ Default “,
url : “{ controller }/{ action }/{ id}”,
defaults : new {
controller = “ Produto “,
action = “ Lista “,
id = UrlParameter . Optional
}
);

12. Adicione duas ações no controlador Produto para implementar a edição de produtos.

13. Modifique a página de listagem de produtos. Para isso, altere o arquivo Lista.cshtml da

pasta Views/Produto.

14. Adicione uma página associada à ação Editar do controlador Produto.

PROJETO PARA SISTEMAS WEB I 54

 VALIDAÇÃO
Através de atributos que definimos nas propriedades dos modelos
e ligando-as ao formulário, podemos criar validações quase
automaticamente.

55
 SUMÁRIO

Um dos principais requisitos necessários em uma aplicação web é o de segurança. Em algumas aplica-

ções, como as bancárias, pode ser o principal requisito. Por isso, a tecnologia utilizada para o desenvolvi-

mento de aplicações web deve oferecer o maior número de mecanismos de segurança, a fim de impedir que

usuários mal-intencionados possam burlar os sites, informar dados inválidos ou se passar por outra pessoa.

Outro ponto de importância em uma aplicação web é a questão da velocidade do site, pois não exis-

te nada mais desagradável para o usuário do que um site lento e que demora muito para responder, ou

simplesmente congela, sendo que, às vezes, chega até a travar o browser, forçando o usuário a reiniciar

o navegador. Certamente, quando isso ocorre, o usuário pensará duas vezes antes de entrar novamente,

além de provocar, às vezes, um efeito em cascata, quando ele comenta com outras pessoas da dificul-

dade de iteração com o site.

Não basta termos apenas uma aplicação web segura, também precisamos de agilidade. Podemos

aplicar formas mais rápidas e mais lentas de fazermos as validações, cabendo a nós decidir qual é a mais

adequada em cada cenário.

Uma validação no lado cliente é sempre mais rápida do que uma validação que precisa ir ao servidor.

Porém, isso não significa que não devemos ter validações no lado servidor, pois existem situações onde

não temos dados suficientes para realizarmos a validação no lado cliente. Ainda existe a possibilidade

de existir usuários que entendem um pouco de ambiente web e desativem o JavaScript do navegador,

de maneira que as validações no lado cliente parem de funcionar. PNão basta que os desenvolvedores

implementem validações no lado cliente; eles devem validar as informações também no lado servidor,

ainda que seja a mesma informação sendo avaliada mais de uma vez. Desta forma, se a validação do lado

cliente falhar, a do servidor não falha.

PROJETO PARA SISTEMAS WEB I 56

 SUMÁRIO

Por mais simples que sejam alguns sistemas web, eles sempre precisam de algum tipo Por isso, devemos planejar bem os tipos de informações que serão expostas antes de ini-

de validação, pois os usuários, muitas vezes, não têm atenção no preenchimento dos dados, ciar a validação. Por exemplo, é importante que campos numéricos sejam delimitados, evitan-

devendo nós, desenvolvedores, ficarmos atentos a isso. Usuários mais experientes podem do tanto a quebra de regras de negócio quanto a ultrapassagem dos limites aceitos pela base de

tentar usar mecanismos de SQL Injection, por exemplo, para ocasionar danos ao sistema. dados. Em alguns campos de texto, os caracteres especiais também devem ser negados, evitan-

do a inserção de dados maliciosos e informações inconsistentes para o fim a que se destinam.

Sempre devemos tentar prever os possíveis erros que poderão ser cometidos pelos

usuários, preparando o sistema para se comportar de forma a evitar danos ao seu funciona-
Essas validações são definidas no lado cliente e no lado do servidor: nos clientes,
mento, fazendo o tratamento de forma adequada, impedindo a entrada dos dados não de-
esssas validações fazem uso do JavaScript, e no servidor, são feitas utilizando a lingua-
sejados e orientando o usuário a tomar a ação correta ao submeter os dados no formulário.
gem de programação C#.

Existem algumas formas de prevenir os erros, usando máscaras para delimitar o for-
CONTROLLER
mato do campo ou labels indicando o que o campo espera. Ainda que esta segunda opção não

restrinja a inserção de valores no formato esperado, ela é importante para manter o usuário
O primeiro passo para implementar a validação dos parâmetros enviados através de
informado sobre o tipo de informação que está sendo requisitado em determinado campo,
formulários HTML é definir a lógica de validação na camada de controle.
evitando a ocorrência de erros não intencionais.

Alguns campos geralmente não são validados, por não serem considerados de pre- if ( editora . Nome == null || editora . Nome . Trim (). Length == 0)
{
enchimento obrigatório ou não serem utilizados com frequência. Esses campos podem se // Erro de Validação
mostrar uma brecha na segurança do site, portanto, a eles precisam ser dadas as devidas }

atenções no momento de planejar a sua validação. Um bom exemplo são campos de obser-

vação, que, a princípio, não são obrigatórios e, frequentemente, não é feito nenhum tipo de O segundo passo é definir mensagens informativas para enviar aos usuários. O ASP.
verificação neles, abrindo espaço para que sejam utilizados, por exemplo, para ataques XSS, NET MVC possui um objeto especializado no armazenamento de mensagens de erros de va-
injetando scripts na sua aplicação e prejudicando-a. lidação. Esse objeto pode ser acessado através da propriedade ModelState.

PROJETO PARA SISTEMAS WEB I 57

 SUMÁRIO

if ( editora . Nome == null || editora . Nome . Trim (). Length == 0) O ASP.NET MVC também pode adicionar mensagens no ModelState antes do controlador
{ ser chamado. Essas mensagens estão relacionadas a erros de conversão. Por exemplo, um campo
ModelState.AddModelError (“ Nome “, “O campo Nome é obrigatório “);
} que espera um número é preenchido com letras.

As mensagens são armazenadas no ModelState através do método AddModelError().

VIEW
Esse método permite que as mensagens sejam agrupadas logicamente, pois ele possui dois

parâmetros: o primeiro é o grupo da mensagem e o segundo é a mensagem.

As mensagens de erros de validação podem ser acrescentadas em uma página atra-
O código de validação pode ser colocado nos controladores, mais especificamente nas vés do método ValidationSummary() da propriedade HTML. É importante salientar que esse
ações. Se algum erro for encontrado, o fluxo de execução pode ser redirecionado para uma método adiciona todas as mensagens de erro.
página que mostre as mensagens informativas aos usuários. Normalmente, essa página é
@{
a mesma do formulário que foi preenchido incorretamente. O ModelState possui uma pro-
ViewBag . Title = “ Cadastro de Editora “;
priedade que indica se erros foram adicionados ou não. Essa propriedade chama-se IsValid. }

<h2 >Cadastro de Editora </h2 >

[ HttpPost ]
public ActionResult Salva ( Editora editora ) @using ( Html . BeginForm ()) {
{ @Html.ValidationSummary ()
if ( editora . Nome == null || editora . Nome . Trim (). Length == 0)
{ <br/>
ModelState.AddModelError (“ Nome “, “O campo Nome é obrigatório .”);
} @Html.LabelFor ( model => model.Nome )
if ( ModelState . IsValid ) @Html.EditorFor ( model => model.Nome )
{
db.Editoras.Add ( editora ); <br/>
TempData [“ mensagem “] = “A editora foi cadastrada com sucesso !”;
return RedirectToAction (“ Index “); @Html.LabelFor ( model => model . Email )
} @Html.EditorFor ( model => model . Email )
else
{ <br/>
return View (“ Cadastra “);
} <input type =” submit “ value =” Enviar “ />
} }

PROJETO PARA SISTEMAS WEB I 58

 SUMÁRIO

Podemos utilizar o método ValidationMessageFor() para mostrar somente as mensagens ANOTAÇÕES

de erro de validação de um determinado grupo. Para não mostrar erros dos grupos com o Va-

lidationSummary(), devemos passar como parâmetro o valor true. Nesse caso, apenas os erros As lógicas de validação também podem ser definidas através de anotações adicionadas

que não estão associados a um grupo específico serão apresentados pelo ValidationSummary(). nas classes de modelo. Dessa forma, essas lógicas não estariam mais nos controladores, o

que conceitualmente é o ideal, pois nos controladores só deveriam existir lógicas para con-

@{ trolar o fluxo da execução.

ViewBag . Title = “ Cadastro de Editora “;
}
REQUIRED
<h2 >Cadastro de Editora </h2 >

Uma das validações mais comuns é o campo obrigatório, podendo ser realizada atra-
@using ( Html . BeginForm ()) {
@Html . ValidationSummary ( true ) vés da anotação Required para propriedades do tipo string.

<br/> public class Editora

{
@Html.LabelFor ( model => model . Nome ) [ Required ]
@Html.EditorFor ( model => model . Nome ) public string Nome { get; set ;}
@Html.ValidationMessageFor ( model => model . Nome ) }

<br/>
ALTERANDO A MENSAGEM
@Html.LabelFor ( model => model . Email )
@Html.EditorFor ( model => model . Email )
As anotações de validação possuem mensagens padrão que podem ser alteradas atra-
@Html.ValidationMessageFor ( model => model . Email )
vés do atributo ErrorMessage.
<br/>

<input type =” submit “ value =” Enviar “ /> [ Required ( ErrorMessage =”O campo Nome é obrigatório “)]
} public string Nome { get ; set; }

PROJETO PARA SISTEMAS WEB I 59

 SUMÁRIO

VALIDAÇÃO NO LADO DO CLIENTE

As validações também podem ser realizadas nos navegadores para melhorar a interação

com os usuários. Antes da terceira versão do ASP.NET MVC, era necessário habilitar a validação

no lado do cliente através do método Html.EnableClientValidation(). A partir da terceira versão

do ASP.NET MVC, a validação no cliente está habilitada por padrão.

Para que a validação no lado cliente funcione corretamente, devemos acrescentar as bibliotecas

JavaScript necessárias. No ASP.NET MVC, basta acrescentar a seção de scripts nas páginas.

@section Scripts {
@Scripts . Render (“~/ bundles / jqueryval “)
}

SÍNTESE

Neste capítulo vimos:

• A validação de dados é um tópico essencial em muitas aplicações web, como formulários de

cadastro, de entrada de valores e informações pessoais.

• O ASP.NET tem um modelo de validação de dados composto de controles, que são declarados

na página e fazem todo este trabalho de forma quase automática e transparente.

• As validações de entrada são frequentemente usadas em conjunto com outros tipos de validação.

PROJETO PARA SISTEMAS WEB I 60

EXERCÍCIOS SUMÁRIO

1. Crie um projeto do tipo ASP.NET web application chamado Validacao no Visual Studio. Utilize o template MVC. 5. Adicione um controlador chamado Jogador utilizando o template

EmptyMVC Controller.

2. Adicione uma entidade chamada Jogador na pasta Models do projeto Validacao.

namespace Validacao.Models namespace Validacao.Controllers

{ {
public class Jogador public class JogadorController : Controller
{ {
[ HiddenInput ( DisplayValue = false )] public ActionResult Lista ()
public int JogadorID { get ; set; } {
FTECContext ctx = new FTECContext ();
public string Nome { get; set ; } return View ( ctx.Jogadores );
}
public int ? Numero { get; set ; }
[ HttpGet ]
public double ? Altura { get; set ; } public ActionResult Cadastra ()
} {
} return View ();
}

3. Adicione um DbContext para registrar a entidade Jogador e utilizar os recursos do Entity Framework. [ HttpPost ]
public ActionResult Cadastra ( Jogador j)
{
4. Crie uma classe chamada FTECContext na pasta Models. FTECContext ctx = new FTECContext ();
ctx . Jogadores .Add (j);
ctx . SaveChanges ();
namespace Validacao . Models
{ return RedirectToAction (“ Lista “);
public class FTECContext : DbContext }
{ }
public DbSet < Jogador > Jogadores { get ; set ; } }
}
}

PROJETO PARA SISTEMAS WEB I 61

EXERCÍCIOS SUMÁRIO

6. Adicione uma tela associada à ação Lista do controlador Jogador 7. Adicione uma tela associada à ação Cadastra do controlador Jo-
com o seguinte conteúdo. gador com o seguinte conteúdo.

@using Validacao.Models
@model IEnumerable <Jogador > @model Validacao . Models . Jogador

@{ @{
ViewBag.Title = “ Lista “;
ViewBag . Title = “ Cadastra “;
}
}

<h2 >Lista </h2 >

<h2 >Cadastra </h2 >
<table >
<tr>
@using ( Html.BeginForm ())
<th>@Html.DisplayNameFor (m => m.Nome )</th>
{
<th>@Html.DisplayNameFor (m => m.Numero )</th>
<th>@Html.DisplayNameFor (m => m.Altura )</th> <div >@Html.LabelFor (m => m.Nome )</ div >

</tr> @Html.EditorFor (m => m.Nome )

@foreach ( var jogador in Model ) <div >@Html.LabelFor (m => m.Numero )</ div >
{
@Html.EditorFor (m => m.Numero )
<tr>
<div >@Html.LabelFor (m => m.Altura )</ div >
<td>@Html.DisplayFor (m => jogador.Nome )</td>
<td>@Html.DisplayFor (m => jogador.Numero )</td> @Html.EditorFor (m => m.Altura )

<td>@Html.DisplayFor (m => jogador.Altura )</td>

</tr> <div ><input type =” submit “ value =” Cadastrar “ /></ div >
}
}
</table>

PROJETO PARA SISTEMAS WEB I 62

EXERCÍCIOS SUMÁRIO

8. Altere a ação Cadastra do controlador Jogador. Aplique algumas regras de validação.

[ HttpPost ]
public ActionResult Cadastra ( Jogador j)
{
if ( String . IsNullOrEmpty (j. Nome ))
{
ModelState . AddModelError (“ Nome “, “O nome do jogador é obrigatório “);
}
if (j. Numero == null || j. Numero <= 0 || j. Numero >= 100)
{
ModelState . AddModelError (“ Numero “, “O número do jogador deve ser maior que 0 e menor que 100 “);
}
if (j. Altura == null || j. Altura < 0)
{
ModelState . AddModelError (“ Altura “, “A altura do jogador não pode ser negativa “);
}

if ( ModelState . IsValid )
{
FTECContext ctx = new FTECContext ();
ctx.Jogadores .Add (j);
ctx.SaveChanges ();
eturn RedirectToAction (“ Lista “);
}
else
{
return View (“ Cadastra “, j);
}
}

9. Altere o formulário de cadastro de jogador. Para isso, modifique o arquivo Cadastra.cshtml da pasta Views/Jogador.

10. Altere a entidade Jogador acrescentando as anotações de validação.

11. Altere a ação Cadastra do controlador Jogador para a gravação dos dados do Jogador.

PROJETO PARA SISTEMAS WEB I 63

 SESSÃO
Uma sessão em ASP.NET permite que sejam armazenados e recuperados
valores para um usuário, enquanto este continua sua navegação na
aplicação.

64
 SUMÁRIO

Considere a aplicação de uma loja virtual. Nessa aplicação, os clientes A partir da segunda requisição, os navegadores devem enviar para a aplicação o identificador re-

selecionam os produtos desejados e os adicionam no seu carrinho de compra. cebido na primeira requisição. Desta maneira, a aplicação saberá qual é o navegador que está realizando

Cada cliente deve ter o seu próprio carrinho, para que os seus produtos não se uma requisição. Os navegadores podem enviar os seus respectivos identificadores de diferentes formas.

misturem com os produtos selecionados por outros clientes. A aplicação deve

armazenar o carrinho de um cliente até que a compra seja finalizada ou até ela As mais utilizadas são:

ter certeza que o cliente não precisa mais do carrinho.

Reescrita de URL: nesta abordagem, os identificadores são embutidos nos links e botões das pá-

Para resolver esse problema, podemos utilizar o conceito de Sessão. ginas da aplicação. Quando os links ou botões são clicados pelo usuário, o identificador é enviado para a

Para cada navegador conectado, o servidor manterá uma sessão aberta. Des- aplicação. Uma desvantagem é que todas as páginas devem ser geradas dinamicamente para adicionar o

sa forma, podemos separar os dados de cada usuário conectado. identificador em todos os links e botões.

IDENTIFICANDO OS NAVEGADORES Cookies: são arquivos contendo informações, gerados nos servidores e enviados para os navegadores. Os

navegadores armazenam os cookies localmente na máquina do usuário. Além disso, os navegadores enviam os

Para aplicar a ideia de Sessão, é necessário ter a capacidade de identi- cookies de volta para o servidor em todas as requisições. Os servidores podem armazenar os identificadores gera-

ficar o navegador que está requisitando a aplicação a cada requisição. Uma dos em cookies. Dessa forma, a cada requisição, o servidor receberá um cookie contendo o identificador.

primeira abordagem seria utilizar o endereço IP das máquinas para identifi-

car os navegadores. Porém, nessa abordagem, dois navegadores executando SESSÕES NO ASP.NET MVC
na mesma máquina não poderiam ser identificados individualmente.

No ASP.NET MVC, o objeto que representa uma sessão é um dicionário. Para armazenar informações,

Outra abordagem é deixar a cargo do servidor a criação de um identi- você deve adicionar uma chave e um valor na propriedade Session. Considere um objeto da classe Usuario

ficador único para cada navegador conectado. Quando um navegador faz a que agrupa as informações sobre um determinado usuário. O código a seguir é um exemplo de como po-

primeira requisição para a aplicação, o servidor deve gerar um identificador demos guardar esse objeto na sessão após a realização da autenticação do usuário.

único para esse navegador e enviá-lo na resposta HTTP.

PROJETO PARA SISTEMAS WEB I 65

 SUMÁRIO

public class LoginController : Controller public class LoginController : Controller

{ {
... ...
public ActionResult Login ( Cliente cliente ) public ActionResult Logout ()
{ {
... ...
Session [“ Cliente “] = cliente ; Session.Abandon ();
... ...
} }
} }

SESSIONMODE
Você pode adicionar qualquer tipo de valor na sessão. De forma análoga, para

resgatar as informações armazenadas, basta acessar a chave correspondente da pro-

O ASP.NET MVC disponibiliza quatro modos de sessão (SessionModes):
priedade Session. Veja o exemplo a seguir:

• InProc;
Cliente cliente = ( Cliente ) Session [“ Cliente “];
string saudacao = “Bem vindo “ + cliente . Nome ; • StateServer;

• SQLServer;
Quando um usuário deslogar, podemos eliminar a informação armazenada em

sua sessão. Para isso, podemos simplesmente remover todas as chaves do dicionário • Custom.
como no exemplo a seguir.

A diferença entre eles é o modo de armazenamento das sessões.

Session.RemoveAll ();

No modo InProc, todas as informações da sessão são armazenadas na memória do servidor. Esse
Contudo, o método RemoveAll() não elimina a sessão. Ele apenas remove os
é o modo mais simples e mais utilizado, e vem configurado como o padrão. Uma desvantagem desse
dados nela contidos. Para eliminá-la, você deve utilizar o método Abandon(). Ob-
modo é a possível sobrecarga de memória, se forem armazenadas muitas informações na sessão. Por
serve o exemplo a seguir:
isso, não é indicado para sistemas muito grandes, com muitos usuários navegando simultaneamente.

PROJETO PARA SISTEMAS WEB I 66

 SUMÁRIO

Outro problema é que o servidor da aplicação não pode ser desligado, pois a informa- Outra possibilidade é desabilitar o uso de cookie com o atributo cookieless. Neste caso

ção armazenada na memória será perdida. será utilizada a reescrita de URL.

< sessionState mode =” InProc “ cookieless =” true “/>

No modo StateServer, as informações são serializadas e enviadas para um servidor in-

dependente do servidor da aplicação. Isto possibilita que o servidor de aplicação possa ser SÍNTESE
reiniciado sem que as sessões sejam perdidas. Uma desvantagem é o tempo gasto para rea-

lizar a serialização e desserialização. Neste capítulo vimos:

• Os principais conceitos relacionados ao gerenciamento de Sessão do ASP.NET, as prin-

No modo SQLServer, as informações também são serializadas, mas são armazenadas
cipais configurações do ambiente de Sessão e como tirar melhor proveito dele.
em um banco de dados. Além de permitir que o servidor da aplicação seja reiniciado, este

modo possibilita um maior controle de segurança dos dados da sessão. Uma desvantagem
• O ambiente de Sessão do ASP.NET é extensível, permitindo que qualquer desenvolvedor
importante é que o processo é naturalmente lento.
crie seu próprio mecanismo para armazenamento dos dados da Sessão, possibilitando

outras formas de armazenamento além daquelas oferecidas nativamente pelo ASP.NET.

No modo Custom, todo o processo de identificação de usuários e armazenamento de

sessões pode ser personalizado.

Para selecionarmos alguns dos modos disponíveis, basta adicionarmos a tag <sessionS-

tate> dentro da tag <system.web>, no arquivo Web.Config da raiz de um projeto ASP.NET MVC.

< sessionState mode =” InProc “/>

Podemos personalizar nossa sessão, modificando alguns atributos da tag <sessionS-

tate>. Por exemplo, podemos determinar o tempo de timeout das sessões. Veja o exemplo.

< sessionState mode =” InProc “ timeout =”30”/>

PROJETO PARA SISTEMAS WEB I 67

EXERCÍCIOS SUMÁRIO

1. Crie um projeto do tipo ASP.NET Web Application chamado Sessao no Visual Studio. Utilize o template MVC.

2. Adicione uma entidade chamada Produto na pasta Models do projeto Sessao.

namespace Sessao . Models

{
public class Produto
{
public int ProdutoID { get ; set; }
public string Nome { get; set ; }
public double Preco { get ; set; }
}
}

3. Adicione uma classe chamada FTECContext na pasta Models, para registrar a entidade Produto e utilizar os

recursos do Entity Framework. Lembre-se de fazer com que sua classe herde da classe DbContext.
namespace Sessao . Models
{
public class FTECContext : DbContext
{
public DbSet < Produto > Produtos { get ; set ; }
}
}

4. Adicione uma classe chamada Carrinho na pastaModels do projeto Sessao.

namespace Sessao.Models
{
public class Carrinho
{
public List < Produto > Produtos { get ; set ; }

public Carrinho ()
{
this.Produtos = new List < Produto >() ;
}
}
}

PROJETO PARA SISTEMAS WEB I 68

EXERCÍCIOS SUMÁRIO

5. Altere a tela Index do controlador Produto de acordo com o código a seguir.

@model IEnumerable <Sessao.Models.Produto >

@{ ViewBag . Title = “ Index “;}

<h2 >Index </h2 >

@if ( TempData [“ Mensagem “] != null )

{
<div >@TempData [“ Mensagem “]</ div >
}

<p>
@Html.ActionLink (“ Create New “, “ Create “)
</p>
<table >
<tr >
<th >@Html.DisplayNameFor ( model => model.Nome )</th >
<th >@Html.DisplayNameFor ( model => model.Preco )</th >
<th ></th >
</tr >

@foreach (var item in Model ) {

<tr >
<td >@Html.DisplayFor ( modelItem => item.Nome )</td >
<td >@Html.DisplayFor ( modelItem => item.Preco )</td >
<td >
@Html.ActionLink (“ Edit “, “ Edit “, new { id= item.ProdutoID }) |
@Html.ActionLink (“ Details “, “ Details “, new { id= item ProdutoID }) |
@Html.ActionLink (“ Delete “, “ Delete “, new { id= item.ProdutoID }) |
@Html.ActionLink (“ Adicionar ao carrinho “, “ Adicionar “, “ Carrinho
“, new { id=item.ProdutoID }, null )
</td >
</tr >
}
</ table >

PROJETO PARA SISTEMAS WEB I 69

EXERCÍCIOS SUMÁRIO

6. Adicione um controlador chamado Carrinho utilizando o template Empty MVC Controller. Em seguida, altere-o de acordo com o código a seguir.

namespace Sessao.Controllers carrinho.Produtos.Add(p);

{
public class CarrinhoController : Controller TempData [“ Mensagem “] = “ Produto adicionado ao carrinho com sucesso !”;
{
public ActionResult Index () return RedirectToAction (“ Index “, “ Produto “);
{ }
return View ( this . PegaCarrinhoDaSessao ());
} public ActionResult Remover ( int idx = 0)
{
public ActionResult Cancelar () Carrinho carrinho = this . PegaCarrinhoDaSessao ();
{ carrinho . Produtos . RemoveAt (idx );
Session . Abandon ();
return RedirectToAction (“ Index “, “ Produto “); return RedirectToAction (“ Index “);
} }

public ActionResult Adicionar ( int id = 0) private Carrinho PegaCarrinhoDaSessao ()
{ {
FTECContext ctx = new FTECContext (); if ( Session [“ Carrinho “] == null )
Produto p = ctx.Produtos.Find (id); {
if (p == null ) Session [“ Carrinho “] = new Carrinho ();
{ }
return HttpNotFound (); return Session [“ Carrinho “] as Carrinho ;
} }
}
Carrinho carrinho = this.PegaCarrinhoDaSessao (); }

7. Adicione uma tela associada à ação Index do controlador Carrinho com o seguinte conteúdo.

@model Sessao . Models . Carrinho

@{
ViewBag . Title = “ Index “;
}
<h2 >Index </h2 >

@Html.ActionLink (“ Cancelar carrinho “, “ Cancelar “)

<ul >
@{
int i = 0;
foreach ( var produto in Model . Produtos )
{
<li >@produto . Nome ( @produto . Preco ) - @Html . ActionLink (“ Remover do carrinho “, “ Remover “, new { idx = i++ }) </li >
}
}
</ul >

PROJETO PARA SISTEMAS WEB I 70

 TRATAMENTO DE
ERROS
Tratar adequadamente os erros é uma característica fundamental de
uma aplicação web bem projetada.

71
 SUMÁRIO

As aplicações estão sujeitas a erros de várias naturezas. Por exemplo, erros podem

ser gerados pelo preenchimento incorreto dos campos de um formulário. Esse tipo de

erro é causado por falhas dos usuários. Nesse caso, é importante mostrar mensagens in-

formativas com o intuito de fazer o próprio usuário corrigir os valores preenchidos in-

corretamente. Por outro lado, há erros que não são causados por falhas dos usuários. Por

exemplo, um erro de conexão com o banco de dados. Nesses casos, é improvável que os

usuários possam fazer algo que resolva o problema, e mesmo que pudessem, provavel-

mente, não seria conveniente esperar que eles o fizessem.

Quando um erro desse tipo ocorre, o ASP.NET MVC cria uma página web com infor-

mações sobre o erro e a envia aos usuários. Para usuários locais, o ASP.NET MVC envia uma

página web com informações detalhadas do erro ocorrido, e para os usuários remotos, a pá-

gina web enviada não contém informações detalhadas.

Não é conveniente que os usuários recebam detalhes técnicos sobre os erros gerados

por falhas da aplicação. A primeira justificativa é que esses detalhes podem confundir os

usuários. A segunda justificativa é que esses detalhes podem expor alguma falha de segu-

rança da aplicação, deixando-a mais vulnerável a ataques.

PROJETO PARA SISTEMAS WEB I 72

 SUMÁRIO

TRY-CATCH
@{
Layout = null ;
Os erros de aplicação podem ser identificados através do comando }
try-catch, que podem ser colocados nos métodos que definem as ações dos
<! DOCTYPE html >
controladores. Ao identificar a ocorrência de um erro, os controladores po- <html >
dem devolver uma página web com alguma mensagem para o usuário. <head >
<title >Erro </ title >
</ head >
<body >
[ HttpPost ] <h2 >
public ActionResult Salva ( Editora editora ) Servidor com problemas
{ </h2 >
try <p>
{ Houve um problema em nosso servidor.<br/>
db.Editoras.Add( editora ); Por favor tente novamente dentro de alguns instantes.
} </p>
catch </ body >
{ </ html >
return View (“ Error “);
}
return RedirectToAction (“ Index “);
} As páginas de erro, que serão mostradas pelos controladores, teriam uma mensagem simples in-

formando que houve um erro na aplicação e que não é possível atender a requisição do usuário naquele

Podemos criar uma página Error.cshtml na pasta Views\Shared. Dessa momento. Inclusive, seria conveniente padronizar a página de erro. Em outras palavras, todos os contro-

forma, todo controlador poderá devolver essa página. ladores teriam que mostrar a mesma página.

PROJETO PARA SISTEMAS WEB I 73

 SUMÁRIO

CUSTOM ERRORS Por convenção, o ASP.NETMVC mantém uma página de erro padrão dentro da pasta Views\Shared

com o nome Error.cshtml. Vamos alterar este arquivo. O conteúdo da página de erro é basicamente HTML.

Utilizar o comando try-catch nos controladores, para lidar com os erros de

@{
aplicação, não é uma boa alternativa, pois o código do controlador fica mais com-
Layout = null ;
plexo. Além disso, haveria replicação de código nos controladores, pois, provavel- }
mente, a página de erro seria padronizada.
<! DOCTYPE html >
<html >
Para lidar com os erros de aplicação de uma maneira mais prática e fácil de <head >
<title >Erro </ title >
manter, podemos configurar o ASP.NETMVC para utilizar páginas de erro padrão.
</ head >
O primeiro passo é alterar o arquivo de configuração Web.config, acrescentando a <body >
<h2 >
tag <customErrors> dentro da tag <system.web>.
Servidor com problemas
</h2 >
<p>
...
Houve um problema no nosso servidor .<br/>
< customErrors mode =”On”>
Por favor tente novamente dentro de alguns instantes .
</ customErrors >
</p>
...
</ body >
</ html >

O atributo mode da tag <customErrors> pode assumir três valores:

HTTP ERRORS

On: a página de erro padrão será enviada para usuários locais e remotos.
Um dos erros mais conhecidos do HTTP é o 404, que ocorre quando o navegador faz uma
Off: a página de erro detalhada será enviada para usuários locais e remotos.
requisição para uma URL que não existe. Esse erro é gerado por falhas dos usuários, ao tentarem

RemoteOnly: a página de erro detalhada será enviada para os usuários locais digitar diretamente uma URL na barra de endereço dos navegadores, ou por links ou botões “que-

e a padrão para os remotos. brados” nas páginas da aplicação.

PROJETO PARA SISTEMAS WEB I 74

 SUMÁRIO

Quando o erro 404 ocorre, o ASP.NET MVC utiliza a página padrão, para erros de aplicação, De acordo com o código anterior, devemos definir um controlador chamado

configurada no Web.config através da tag <customErrors>. Porém, esse erro não deve ser consi- ErrorPage com uma ação chamada NotFound. Essa ação será acionada toda vez que o

derado um erro de aplicação, pois pode ser gerado por falhas do usuário. Ele também não deve ser erro 404 do HTTP ocorrer.

considerado um erro de usuário, pois pode ser gerado por falhas da aplicação. Consequentemente,

é comum tratar o erro 404 de maneira particular, criando uma página de erro específica para ele. namespace FTEC.Controllers
{
public class ErrorPageController : Controller
{
@{
public ActionResult NotFound ()
Layout = null ;
{
}
return View ();
}
<! DOCTYPE html >
}
<html >
}
<head >
<title >Arquivo não encontrado !</ title >
</ head >
<body >
<h2 >Esse arquivo não foi encontrado . Verifique se a url está correta .</h2 >
</ body >
</ html >

No arquivo de configuração, podemos especificar uma página web particular para o erro 404 ou

para os outros erros do HTTP.

...
< customErrors mode =”On”>
<error statusCode =”404 “ redirect =”~/ ErrorPage / NotFound “/>
</ customErrors >
...

PROJETO PARA SISTEMAS WEB I 75

EXERCÍCIOS SUMÁRIO

1. Crie um projeto do tipo ASP.NET web application chamado TratamentoDeErros no Visual Studio. Utilize o template MVC.

2. Crie um controlador Teste no projeto TratamentoDeErros, conforme o código a seguir.

namespace TratamentoDeErros . Controllers

{
public class TesteController : Controller
{
public ActionResult TestaErro ()
{
string [] nomes = new string [] { “ Jonas Hirata “, “ Rafael Cosentino “ };
string nome = nomes [2];
return View ();
}
}
}

3. Trate o erro do exercício anterior com o bloco try-catch e redirecione o usuário para uma tela com a seguinte mensa-

gem “Sistema Temporariamente Indisponível”.

4. Altere a ação TestaErro do controlador Teste.

...
public ActionResult TestaErro ()
{
try
{
string [] nomes = new string [] { “ Jonas Hirata “, “ Rafael Cosentino “ };
string nome = nomes [2];
return View ();
}
catch
{
return View (“ Error “);
}
}
...

PROJETO PARA SISTEMAS WEB I 76

EXERCÍCIOS SUMÁRIO

5. Altere o código do arquivo Error.cshtml da pasta Views\Shared conforme o código a seguir.

@{
Layout = null ;
}

<! DOCTYPE html >

<html >
<head >
<meta name =” viewport “ content =” width=device-width “ />
<title >Error </ title >
</ head >
<body >
<h2>Sistema Temporariamente Indisponível ...</h2>
</ body >
</ html >

6. Remova o bloco try-catch da ação TestaErro do controlador Teste que você adicionou no exercício anterior.

public ActionResult TestaErro ()

{
string [] nomes = new string [] { “ Jonas Hirata “, “ Rafael Cosentino “ };
string nome = nomes [2];
return View ();
}
...

7. Altere o arquivo Web.config, para configurar o ASP.NET MVC, para utilizar páginas de erro padrão.

...
<system.web >
< customErrors mode =”On”></ customErrors >
...
<system.web >
...

PROJETO PARA SISTEMAS WEB I 77

EXERCÍCIOS SUMÁRIO

8. Vamos definir uma página para ser exibida quando o erro 404 ocorrer. Crie um controlador chamado ErrorPage com uma ação

chamada NotFound.
namespace TratamentoDeErros.Controllers
{
public class ErrorPageController : Controller
{
public ActionResult NotFound ()
{
return View ();
}
}
}

9. Na pasta Views\ErrorPage do projeto Erros, adicione um arquivo chamado NotFound.cshtml com o seguinte conteúdo.

@{
Layout = null ;
}

<! DOCTYPE html >

<html >
<head >
<title >Arquivo não encontrado !</ title >
</ head >
<body >
<h2>Esse arquivo não foi encontrado . Verifique se a url está correta.</h2>
</ body >
</ html >

10. Altere o arquivo Web.Config para definir que, quando um erro 404 ocorrer, a página exibida deve ser aquela que acabamos de criar.

...
<system.web >
< customErrors mode =”On”>
<error statusCode =”404 “ redirect =”~/ ErrorPage/NotFound “/>
</ customErrors >
...
<system.web >
...

PROJETO PARA SISTEMAS WEB I 78