Introdução ao Java Server Pages - JSP

Veja neste artigo uma apresentação dos fundamentos do JSP, Java ServerPages que, integrado ao HTML, permite dar mais dinamismo à páginas web.

Por que eu devo ler este artigo: Este artigo apresenta os conceitos básicos de JSP, bem como a utilização da linguagem para a programação web dinâmica, todo o desenvolvimento feito neste artigo foi testado utilizando o Servidor Tomcat.

Com a evolução da Internet, surgiram novas necessidades. Negócios passaram a existir de forma on-line, meios de comunicação, fazem uso constante desta poderosa ferramenta que é a Internet. Mas como esta tecnologia chegou a este ponto?


Guia do artigo:

No inicio a Internet era estática, a falta de interatividade imperava, foi quando surgiu o CGI, a tecnologia CGI criava interatividade ao ambiente, mas não tornava simples o seu desenvolvimento. Entre as tecnologias de CGI mais utilizadas, destaca-se o PERL, linguagem poderosa, utilizada até hoje para administração de servidores. O grande problema de se desenvolver um CGI, além do desempenho, era a sua complexidade, a solução para simplificar o desenvolvimento WEB e passar para uma nova fase, surgiram as linguagens server-side scripts como ASP, PHP e JSP. Estas linguagens tornaram o desenvolvimento web mais ágil, simples e prático. Além de possuir um maior desempenho de aplicação, em um meio que a velocidade é essencial, isto garantiu o sucesso das novas linguagens de scripts.

Introdução ao JSP

JSP é o acrônimo para Java Server Pages, uma linguagem criada pela SUN gratuita, JSP é uma linguagem de script com especificação aberta que tem como objetivo primário a geração de conteúdo dinâmico para páginas da Internet. Podemos ao invés de utilizar HTML para desenvolver páginas Web estáticas e sem funcionalidade, utilizar o JSP para criar dinamismo. É possível escrever HTML com códigos JSP embutidos. Como o HTML é uma linguagem estática, o JSP será o responsável por criar dinamismo. Por ser gratuita e possuir especificação aberta possui diversos servidores que suportam a linguagem, entre eles temos: Tomcat, GlassFish, JBoss, entre outros. O JSP necessita de servidor para funcionar por ser uma linguagem Server-side script, o usuário não consegue ver a codificação JSP, pois esta é convertida diretamente pelo servidor, sendo apresentado ao usuário apenas codificação HTML.

Uma pagina JSP possui extensão .jsp e consiste em uma página com codificação HTML e com codificação Java, inserida entre as tag´s <% e %>, denominada scriptlets e funcionando da seguinte forma: o servidor recebe uma requisição para uma página JSP, interpreta esta página gerando a codificação HTML e retorna ao cliente o resultado de sua solicitação. A página JSP que foi interpretada pelo servidor não precisa ser compilada como aconteceria com um servlet java por exemplo, esta tarefa é realizada em tempo real pelo servidor. É necessário apenas desenvolver as páginas JSP e disponibilizá-las no Servlet Container (Tomcat, por exemplo). O trabalho restante será realizado pelo servidor que faz a compilação em tempo de uso transformando o jsp em bytecode.

Assim, pode-se definir o JSP como uma tecnologia que provê uma maneira simples e prática de desenvolver aplicações dinâmicas baseadas em web, sendo independente de Plataforma de Sistema Operacional.

Tecnologia Client-side e Server-side

A internet foi concebida de forma a funcionar como cliente X servidor, ou seja, temos um cliente que é o navegador web (browser) e o servidor http(web). Existem, na tecnologia disponível para Web, duas classificações de tecnologia, uma que funciona do lado do cliente ou Client-side e uma que funciona do lado do servidor ou Server-side.

Client-side – lado do cliente

O cliente-side de uma aplicação é o local onde ela é processada, ou seja, no caso da web, executa no navegador do cliente que é o responsável por interagir com o Servidor HTTP. Entre as tecnologias cliente-side temos o HTML que é executado no navegador, o CSS é outra tecnologia cliente que serve para formatar paginas HTML, há ainda o javascript que permite desenvolver ou ampliar o poder ao lado do cliente.

Server-side

Server-side, por sua vez, é o termo que representa o conjunto de tecnologias em que os processos são interpretados/processados diretamente no servidor, retornando como resultado a codificação client-side. Quando um cliente web(navegador) acessa uma página web, uma solicitação é enviada ao servidor através do protocolo http para que o servidor envie a resposta. O Servidor além de rodar os aplicativos, o lado servidor também é um repositório de páginas estáticas, que serão enviados ao cliente quando solicitado. Supondo que haja uma página JSP, esta será processada pelo servidor e encaminhado uma resposta ao cliente (Navegador).

Benefícios do JSP

O objetivo da linguagem JSP não é só o desenvolvimento de páginas dinâmicas para Internet. Com ela é possível desenvolver sistemas inteiros para Internet. Além disso, existem diversos benefícios em se utilizar a linguagem JSP.

Custo

O JSP não tem custo de licença. Isto significa que pode ser utilizado em qualquer máquina, para qualquer número de usuários sem violar nenhum direito autoral. Claro que isto depende do servidor escolhido, o Tomcat é um servidor livre, licenciado sob a licença da Apache Foundation, de alta qualidade e sem custo de licenciamento.

JSP é embutido no HTML

O JSP é simples de se utilizar, podendo gerar o HTML ou ainda estar embutido dentro do HTML, como no exemplo a seguir:

<html> <head> <title> Pagina JSP Ola Mundo</title> </head> <body> <h1> <% out.println("Ola Mundo"); %> </h1> </body> </html>
Listagem 1. Exemplo de código JSP embutido no HTML

Outras vantagens da linguagem

Além do custo e da integração perfeita com o HTML, é possível ainda, citar os seguintes benefícios da linguagem:

Tomcat

O JSP por ser uma linguagem Server-Side como visto anteriormente, necessita de um servidor para o seu funcionamento.

O Apache Tomcat foi desenvolvido pela Apache Software Foundation, o Tomcat é um servlet container de código aberto, ou seja, uma aplicação que interpreta e processa servlets (java servlets) e JSP (Java Server Pages). O servidor esta disponível livremente na Internet sem a necessidade de pagamento de licenciamento e está disponível no endereço http://tomcat.apache.org para diversas plataformas, entre elas o Windows, Linux, Solaris etc. Recomenda-se o download da versão 7 do servidor. A instalação é simples, basta seguir o seu passo a passo. O desenvolvedor deve fazer a instalação completa do servidor para seu sistema operacional.

Com o Tomcat instalado pode-se iniciar o desenvolvimento JSP. Para iniciar o desenvolvimento deve-se criar um diretório easyjava em C:\Program Files (x86)\Apache Software Foundation\Tomcat 7.0\webapps (no Windows) e /usr/java/apache-tomcat-7.0 (no Linux)”. No diretório easyjava deve-se criar os diretórios src, web, WEB-INF e WEB-INF/lib.

Utilizaremos, inicialmente, apenas o jsp, mas em artigos futuros criaremos servlets para ampliar a capacidade de nossa aplicação web, por isso criamos a estrutura completa de diretórios Tomcat.

Desenvolvimento JSP na Prática

Para iniciar o trabalho com JSP, criaremos o primeiro arquivo de exemplo, do Artigo JSP. Para manter o padrão, criaremos um arquivo hello word/ola mundo.

No diretório (pasta) easyjava, com seu editor favorito notepad, vi, emacs etc., o desenvolver deve criar o arquivo ola.jsp com o seguinte conteúdo:

<html> <head> <title> Pagina JSP Ola Mundo</title> </head> <body> <h1> <% out.println("Ola Mundo"); %> </h1> </body> </html>
Listagem 2. Programa Olá Mundo

Salve o arquivo e abra o navegador de sua preferência e digite: http://127.0.0.1:8080/easyjava/ola.jsp, conforme a Figura 1.

Figura 1. Resultado da exibição do código alo mundo

O resultado é a exibição de uma página com o texto Ola Mundo. No código da página será exibido apenas HTML e não JSP. Para o teste, clique com o botão direito na tela e mande exibir o código fonte como na listagem 2.

<html> <head> <title> Pagina JSP Ola Mundo</title> </head> <body> <h1> Ola Mundo </h1> </body> </html>
Listagem 3. Programa Olá Mundo

Vamos entender o que foi feito na listagem 1, todo script jsp está entre as tag´s <% %>, a linha out.println("Ola Mundo") é responsável por escrever o texto que está entre aspas, sendo convertido para a exibição em HTML de Ola Mundo, isto por que o comando out.println é responsável por escrever na tela, ou seja, escreve em HTML um conteúdo, e neste caso é Ola Mundo. Conteúdos de texto devem estar entre aspas, como visto no exemplo. Observe que a exibição no cliente não há nenhum código JSP, pois foi processado no servidor, outro ponto importante é que o JSP segue o padrão do Java, ou seja, ao final de cada linha temos um ;.

Prosseguimos, agora, para os estudos do JSP. Inicialmente, abordaremos o seu funcionamento. O JSP, assim como o PHP, pode ser utilizado dentro do HTML, a página JSP, na verdade, é uma pagina HTML, mas quando for necessário utilizar codificação JSP que deve estar entre as tag´s <% código jsp %>, o servidor trata de converter para HTML para responder a solicitação do usuário.

Na codificação JSP, têm-se algumas diretivas, as quais são utilizadas para informações especiais dentro de páginas, sendo dividido em três tipos:

Agora, vamos incrementar um pouco mais nossa aplicação ola mundo, exibindo a data atual.

<%@page contentType="text/html" import="java.util.Date, java.text.*" pageEncoding="ISO-8859-1"%> <html> <head> <title> Pagina JSP Ola Mundo</title> </head> <body> <h1> <% out.println("Ola Mundo"); %> <br> <%=new Date()%> </h1> </body> </html>
Listagem 4. Programa Ola Mundo melhorado

Ao abrir no navegador o resultado será a exibição do ola mundo e da data e hora atual, conforme a Figura 2.

Figura 2. Resultado da codificação a listagem 4

Em conjunto com a diretiva @page, temos os atributos listados na tabela 1.

Atributos Descrição
Language Define a linguagem de script que será utilizado no JSP. A única linguagem suportada é JAVA.
Extends Define o nome da classe que essa página JSP deve herdar. Geralmente esse atributo não é informado, sendo deixado a cargo do Servlet Container se preocupar com isso.
Import Permite a página JSp importar pacotes e classes que serão utilizados pela página.
Session Define se a página fará uso de sessão, o valor padrão é true.
Buffer Define o tamanho do buffer da página em KB, caso não seja definido a saída não será buferizada.
autoFlush Este atributo, se definido como true, faz com que o buffer da página JSP seja finalizado caso atinja o limite.
isThereadSafe Se o atributo for definido como true, a página não implementa a interface SingleThreadeModel. O valor padrão é true.
Info Retorna o resultado do método getServletInfo().
errorPage Define o caminho relativo a uma página de erro, caso ocorra uma exceção.
contentType Informa o tipo de saída do documento. O valor default é text/html.
isErrorPage Informa se a página é uma página de erro.
pageEncoding Define o caracter enconding da página.
Tabela 1. Atributos da diretiva @page

Veja que no exemplo anterior, foi criado a linha: <%@page contentType="text/html" import="java.util.Date, java.text.*" pageEncoding="ISO-8859-1"%>, indicando que será importado as bibliotecas java.util.Date e java.text.*, além disso foi definido o pageEncoding como ISO-8859-1.

No exemplo anterior utilizamos a exibição completa da data utilizando <%=new Date()%>. O desenvolvedor deve evitar o uso do out.println, utilizando diretamente o =new Date(). O new Date fez uma chamada direta à classe Date, disponível em java.util.Date. Este é motivo da importação. Para dar andamento à aplicação aperfeiçoaremos a codificação conforme a listagem 3.

<%@page contentType="text/html" import="java.util.*, java.text.*" pageEncoding="ISO-8859-1"%> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>JSP Page</title> </head> <body> <h1>Hello World!</h1> <% int dia = Integer.parseInt((new SimpleDateFormat("dd")) .format(new Date())); out.println("<br>Hoje é dia" + dia); %> </body> </html>
Listagem 5. Programa Ola Mundo melhorado

O resultado será exibido conforma a Figura 3.

Figura 3. Resultado da execução da listagem 3.

Desta vez foi declarado uma variável do tipo int para armazenar a data. A declaração de variáveis no JSP é idêntica ao java: têm-se o tipo, o nome e os dados que serão armazenados. O escopo de uma variável deste tipo é o arquivo em que foi declarado, ou seja, os outros arquivos não têm informações sobre a variável declarada aqui. Os tipos de dados suportados pelo JSP são:

Para trabalhar com o tipo String que armazena textos é necessário incluir a java.lang.String.

Também fizemos uso de conversão de tipo Integer.parseInt, para converter o tipo string, vinda do objeto data para Inteiro. Desta forma pode-se armazenar o dia em uma variável com o tipo inteiro(int).

Outras conversões:

Utilizamos anteriormente a saída out.println, este é um tipo de objeto implícito. Esses objetos recebem o nome de implícito por não necessitar serem instanciados para a sua utilização. Eles podem ser acessados diretamente na página. Os objetos implícitos que podem ser acessados em páginas JSP são:

Objetos Descrição
Out Método do tipo Writter, utilizado para exibir dados na página. (exemplo: out.println(“Ola Mundo”);
Request Objeto permite acesso a parâmetros enviados pelo cliente, pelo método HTTP (GET ou POST).
Response Permite acesso à resposta que será enviada ao usuário.
Session Acesso a sessões.
application Objeto que referencia a classe ServletContext e permite que sejam armazenados valores, ao quais serão compartilhados por toda aplicação, por meio dos métodos setAttribute e getAttribute.
Config Objeto utilizado para a leitura de parâmetros de inicialização.
exception Permite que as páginas JSP sejam definidas como páginas de erros.
pageContext Objeto que é um ponto de acesso a muitos atributos da página.
Page Semelhante a referência this utilizada em classes java.
Tabela 2. Objetos implícitos que podem ser acessados em páginas JSP

Operadores:

Os operadores são utilizados para realizar ações sobre um ou mais valores. Os operadores são classificados em grupos no JSP assim como em quase todas as linguagens de programação. Os operadores têm preferência devido a prioridade como acontece na matemática.

Operadores de comparação:

Concatenadores

Operadores aritméticos

Operadores de Incremento e decremento

Estrutura de programação:

Condicional if

O if(se) é responsável pela tomada de decisão dentro da codificação jsp, possuindo o seguinte formato:

If(condição){ Codificação se verdadeiro;} else {Condificação se falso;}

Podendo ainda ser complementado da com outros if´s, da seguinte forma:

If(condição){ Codificação se verdadeiro;} else if(condição) {Condificação se a segunda condição for verdadeira;} else {Codificação se a segunda condição for falsa;}

Vamos criar um exemplo utilizando o que já sabemos, complementando ainda mais nosso Ola Mundo.

<%@page contentType="text/html" import="java.util.*, java.text.*" pageEncoding="ISO-8859-1"%> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>JSP Page</title> </head> <body> <% out.println("<h1>Hello World!</h1>"); int dia = Integer.parseInt((new SimpleDateFormat("dd")).format(new Date())); int mes = Integer.parseInt((new SimpleDateFormat("M")).format(new Date())); int ano = Integer.parseInt((new SimpleDateFormat("yyyy")).format(new Date())); if(mes==1){ out.println("Hoje é " + dia + " de Janeiro de " + ano); }else if(mes==02){ out.println("Hoje é " + dia + " de Fevereiro de " + ano); }else if(mes==3){ out.println("Hoje é " + dia + " de Março de " + ano); }else if(mes==4){ out.println("Hoje é " + dia + " de Abril de " + ano); }else if(mes==5){ out.println("Hoje é " + dia + " de Maio de " + ano); }else if(mes==6){ out.println("Hoje é " + dia + " de Junho de " + ano); }else if(mes==7){ out.println("Hoje é " + dia + " de Julho de " + ano); }else if(mes==8){ out.println("Hoje é " + dia + " de Agosto de " + ano); }else if(mes==9){ out.println("Hoje é " + dia + " de Setembro de " + ano); }else if(mes==10){ out.println("Hoje é " + dia + " de Outubro de " + ano); }else if(mes==11){ out.println("Hoje é " + dia + " de Novembro de " + ano); }else if(mes==12){ out.println("Hoje é " + dia + " de Dezembro de " + ano); } %> </body> </html>
Listagem 6. Programa Ola Mundo condicional if

Além da condição if, têm-se a condição switch, a qual é semelhante ao if, porém para cada comparação deve existir uma instrução break.

switch(atributo/variável) {case valor:instrução;break; case valorn:instrução;break;default:instrução para valor padrão;}

A seguir, apresenta-se um exemplo semelhando ao do if, porém utilizando o switch.

<%@page contentType="text/html" import="java.util.*, java.text.*" pageEncoding="ISO-8859-1"%> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>JSP Page</title> </head> <body> <% out.println("<h1>Hello World!</h1>"); int dia = Integer.parseInt((new SimpleDateFormat("dd")).format(new Date())); int mes = Integer.parseInt((new SimpleDateFormat("M")).format(new Date())); int ano = Integer.parseInt((new SimpleDateFormat("yyyy")).format(new Date())); switch(mes){ case 1: out.println("Hoje é " + dia + " de Janeiro de " + ano); break; case 2: out.println("Hoje é " + dia + " de Fevereiro de " + ano); break; case 3: out.println("Hoje é " + dia + " de Março de " + ano); break; default: out.println("Ola"); } %> </body> </html>
Listagem 7. Programa Ola Mundo condicional switch

Existem, ainda, outras instruções como laços/repetições, as quais serão abordadas em próximo artigo. Agora, para dar andamento, trataremos sobre o funcionamento das funções.

A função/método contêm códigos, que serão executados quando a função/método for chamado.

Acesso tipo nome(parâmetro){Código da função;}. Os tipos de acesso serão tratados em no próximo artigo. Iniciando o desenvolvimento de uma página JSP com mais recursos e detalhes, utiliza-se a inclusão de páginas e um formulário como exemplo. Adotando o que já foi aprendido, vamos criar um arquivo topo, que armazenará o conteúdo a ser exibido no topo do nosso site. Este arquivo terá o nome topo.jsp.

<%! public String fncMES(int mes) { String retorno =""; switch(mes){ case 1: retorno="Janeiro";break; case 2: retorno="Fevereiro";break; case 3: retorno="Março";break; case 4: retorno="Abril";break; case 5: retorno="Maio";break; case 6: retorno="Junho";break; case 7: retorno="Julho";break; case 8: retorno="Agosto";break; case 9: retorno="Setembro";break; case 10: retorno="Outubro";break; case 11: retorno="Novembro";break; case 12: retorno="Dezembro";break; } return retorno; } %> <h1> Pagina JSP </h1> <h4> <% int mes = Integer.parseInt(new SimpleDateFormat("M").format(new Date())); int dia = Integer.parseInt(new SimpleDateFormat("dd").format(new Date())); int ano = Integer.parseInt(new SimpleDateFormat("yyyy").format(new Date())); out.println("Hoje é dia " + dia + " de " + fncMES(mes) + " de " + ano); %></h4>
Listagem 8. Programa topo.jsp

O topo.jsp utiliza o switch em uma função chamada fncMES (Função Mês) para exibir o mês, como já feito com o o if anteriormente. Agora, crie o arquivo rodape.jsp. Este vai ter o conteúdo do rodapé da página. Nesta página, insira apenas o seguinte texto.

A seguir, criaremos o index.jsp, que vai unir os dois arquivos. Criaremos, ainda, um formulário e enviar para uma página em que vamos tratar os dados recebidos, validando-os.

<%@page contentType="text/html" import="java.util.*, java.text.*" pageEncoding="ISO-8859-1"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>JSP Page</title> </head> <body> <%@include file="topo.jsp"%> <form action="trataform.jsp" method="post"> Nome:<input type="text" name="txtnome"/><br> E-Mail:<input type="text" name="txtemail"/><br> Data de Nascimento:<input type="text" name="txtdtnasc"/><br> <input type="submit" value="Enviar"/> </form> <%@include file="rodape.jsp"%> </body> </html>
Listagem 9. Programa index.jsp

Aqui temos a utilização do @include para incluir os arquivos jsp que criamos. Também criamos um formulário para enviar dados para uma página que vamos ainda criar. O nome da pagina será trataform.jsp. Para isso, utilizamos o método de envio de dados post.

<%@page contentType="text/html" import="java.util.*, java.text.*, java.lang.String" pageEncoding="ISO-8859-1"%> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1"> <title>JSP Page</title> </head> <body> <%@include file="topo.jsp"%> Dados do formulario<br> <% String nome = request.getParameter("txtnome"); if(nome=="") out.println("Nome não foi digitato"); else out.println("Seu nome é " + nome); %> <br>E-Mail: <%=request.getParameter("txtemail")%><br> Data de Nascimento: <%=request.getParameter("txtdtnasc")%><br> <%@include file="rodape.jsp"%> </body> </html>
Listagem 10. Programa trataform.js

Aqui foi utilizado o request.getParameter, que é o método responsável por receber os dados do formulário. Ele recebe pelo nome do campo que foi criado. Neste caso os dados serão armazenados dentro da variável nome, que é um tipo string. Utilizamos o if para verificar se o nome foi digitado.

Conclusões

Esta foi a uma breve introdução sobre a linguagem Server-side JSP e de como criar páginas web dinâmicas de forma prática e simples. Em próximos artigos, será abordado como se conectar a banco de dados para criar uma página dinâmica de notícias até a utilização de JSTL.


Referências

  • Página principal do Tomcat
  • Tudo sobre a JSP, Fernando Anselmo, Visual Books, 2005: Livro trata sobre JSP e sobre a utilização de JSTL

Saiu na DevMedia!

  • Série sobre Levantamento de Requisitos: Nesta série, falamos sobre as técnicas, como conduzir uma reunião com o cliente e gerar os documentos mínimos necessários para o levantamento dos requisitos do software. Confira!

Saiba mais sobre Java ;)

  • Cursos de Java: Torne-se um programador Java completo. Aqui você encontra cursos sobre as mais ferramentas e frameworks do universo Java. Aprenda a desenvolver sites e web services com JSF, Jersey, Hibernate e mais.

Artigos relacionados