Post on 06-Jun-2015
description
Tutorial DWRTutorial DWR
Configuração e usoConfiguração e usoPor Alexandre SoliPor Alexandre Soli
Passo 1 – FerramentasPasso 1 – Ferramentas
► A versão do DWR utilizada neste tutorial e a 2.0.5 (funciona A versão do DWR utilizada neste tutorial e a 2.0.5 (funciona com Java 1.3 em diante) e pode ser encontrada no link com Java 1.3 em diante) e pode ser encontrada no link abaixo:abaixo:
http://directwebremoting.org/dwr/downloadhttp://directwebremoting.org/dwr/download
► TOMCAT 5.5 como servidor webTOMCAT 5.5 como servidor web► Java 6Java 6► Eclipse 3.4.1Eclipse 3.4.1
Passo 2 – Criando o projeto Passo 2 – Criando o projeto exemploexemplo
► Dentro do Eclipse clique em File > New > Project e selecione Dentro do Eclipse clique em File > New > Project e selecione Dynamic Web ProjectDynamic Web Project
► Selecione Dynamic Web ProjectSelecione Dynamic Web Project
► Nomeie o projeto para tutorial-dwr e finalize o processo.Nomeie o projeto para tutorial-dwr e finalize o processo.
Passo 3 - ConfiguraçãoPasso 3 - Configuração
► Copie o jar do dwr para a pasta WEB-INF/libCopie o jar do dwr para a pasta WEB-INF/lib
► Nosso web.xml:Nosso web.xml:
<servlet><servlet> <servlet-name><servlet-name>dwrdwr-invoker</servlet-name> -invoker</servlet-name> <servlet-<servlet-
class>class>orgorg..directwebremotingdirectwebremoting..servletservlet.DwrServlet</servl.DwrServlet</servlet-class>et-class>
<init-param><init-param><param-name><param-name>configconfig</param-name></param-name><param-value>/WEB-INF/<param-value>/WEB-INF/dwrdwr..xmlxml</param-value></param-value></init-param></init-param><init-param><init-param><param-name>debug</param-name><param-name>debug</param-name><param-value>false</param-value><param-value>false</param-value></init-param></init-param> <load-on-startup>2</load-on-startup><load-on-startup>2</load-on-startup></servlet></servlet><servlet-mapping><servlet-mapping> <servlet-name><servlet-name>dwrdwr-invoker</servlet-name>-invoker</servlet-name> <url-pattern>/<url-pattern>/dwrdwr/*</url-pattern>/*</url-pattern></servlet-mapping></servlet-mapping>
► Crie um arquivo chamado dwr.xml dentro do diretório WEB-Crie um arquivo chamado dwr.xml dentro do diretório WEB-INF.INF.
► Conteudo do arquivo dwr.xmlConteudo do arquivo dwr.xml
<!DOCTYPE dwr PUBLIC "-//GetAhead Limited//DTD Direct Web Remoting 2.0//EN" "../config/dwr20.dtd">
<dwr><allow> <!-- Declaracao da classe que ira responder as requisicoes AJAX --><create creator="new" javascript="ExemploLookup"><param name="class" value="br.com.neoimage.ExemploLookup" /></create>
<!-- Utilizado para conversao de objetos javascript/java --><convert converter="bean" match="br.com.neoimage.usuario.Usuario"/>
</allow>
</dwr>
► Crie as classes ExemploLookup, Usuario e exemplo.jspCrie as classes ExemploLookup, Usuario e exemplo.jsp
Passo 4 – ExplicaçõesPasso 4 – Explicações
► Usuario - representa um usuário e contém apenas 2 atributos Usuario - representa um usuário e contém apenas 2 atributos e seus respectivos getters e setters.e seus respectivos getters e setters.
► ExemploLookup irá atuar como um serviço para as requisições ExemploLookup irá atuar como um serviço para as requisições AJAX.AJAX.
► Exemplo.jsp – contém a chamada javascript para nosso Exemplo.jsp – contém a chamada javascript para nosso serviço AJAX.serviço AJAX.
► Dwr.xml – contém a declaração de nosso serviço e da classe Dwr.xml – contém a declaração de nosso serviço e da classe Usuario.Usuario.
Passo 5 - CodificaçãoPasso 5 - Codificação► Classe UsuarioClasse Usuario
packagepackage br.com.neoimage.usuario; br.com.neoimage.usuario;
publicpublic classclass Usuario { Usuario {privateprivate String nome; String nome;privateprivate String sobrenome; String sobrenome;
publicpublic String getNome() { String getNome() {returnreturn nome; nome;
}}publicpublic voidvoid setNome(String nome) { setNome(String nome) {
thisthis.nome = nome;.nome = nome;}}publicpublic String getSobrenome() { String getSobrenome() {
returnreturn sobrenome; sobrenome;}}publicpublic voidvoid setSobrenome(String sobrenome) { setSobrenome(String sobrenome) {
thisthis.sobrenome = sobrenome;.sobrenome = sobrenome;}}}}
► Classe ExemploLookupClasse ExemploLookup
packagepackage br.com.neoimage; br.com.neoimage;importimport br.com.neoimage.usuario.Usuario; br.com.neoimage.usuario.Usuario;
publicpublic classclass ExemploLookup { ExemploLookup {
/**/** RespondeResponde as as requisiçõesrequisições AJAX AJAX vindasvindas dada páginapágina exemploexemplo..jspjsp A A entradaentrada:<convert converter="bean" :<convert converter="bean"
match="match="brbr..comcom..neoimageneoimage..usuariousuario..UsuarioUsuario"/>"/> dentrodentro do do dwrdwr..xmlxml permitepermite o o tráfegotráfego do do objetoobjeto entreentre o Java e o o Java e o javascriptjavascript. . */*/publicpublic String metodoExemplo(Usuario usuario) { String metodoExemplo(Usuario usuario) {String nomeCompleto = usuario.getNome() + " " + usuario.getSobrenome();String nomeCompleto = usuario.getNome() + " " + usuario.getSobrenome();
returnreturn nomeCompleto; nomeCompleto;}}}}
► Página exemplo.jspPágina exemplo.jsp
<html><html><!-- Imports <!-- Imports necessáriosnecessários parapara o DWR --> o DWR --><script src=<script src='dwr/engine.js''dwr/engine.js' type= type='text/javascript''text/javascript' ></script> ></script> <script src=<script src='dwr/util.js''dwr/util.js' type= type='text/javascript''text/javascript' ></script> ></script>
<!-- Import <!-- Import dada classeclasse ExemploLookup --> ExemploLookup --><script type=<script type='text/javascript''text/javascript' src= src='dwr/interface/ExemploLookup.js''dwr/interface/ExemploLookup.js'></script>></script>
<script language=<script language="javascript""javascript">>
varvar usuario = usuario = newnew Object(); Object(); // cria um objeto de comunicacao javascript/java// cria um objeto de comunicacao javascript/javausuario.nome = "Alexandre"; usuario.nome = "Alexandre"; // equivalente ao usuario.setNome// equivalente ao usuario.setNomeusuario.sobrenome = "Soli"; usuario.sobrenome = "Soli"; // equivalente ao usuario.setSobrenome// equivalente ao usuario.setSobrenome
// faz a chamada para o metodo -metodoExemplo- da classe ExemploLookup// faz a chamada para o metodo -metodoExemplo- da classe ExemploLookup// o obj usuario e passado como parametro// o obj usuario e passado como parametroExemploLookupExemploLookup..metodoExemplometodoExemplo(usuario, (usuario, functionfunction(data) {(data) {// todo codigo a seguir sera executado apos a resposta do metodo -// todo codigo a seguir sera executado apos a resposta do metodo -
metodoExemplo-metodoExemplo-alert(data); // data contém a resposta vinda do Java.alert(data); // data contém a resposta vinda do Java.
});});</script></script></html></html>
Passo 6 – Testando o Passo 6 – Testando o exemploexemplo
► Inicie o servidor e aponte para o endereçoInicie o servidor e aponte para o endereçohttp://localhost:8080/tutorial-dwr/exemplo.jsphttp://localhost:8080/tutorial-dwr/exemplo.jsp
► Ao ser carregada, a página irá mostrar uma mensagem com o Ao ser carregada, a página irá mostrar uma mensagem com o nome e sobrenome passados como parametros na pagina jsp.nome e sobrenome passados como parametros na pagina jsp.
var usuario = new Object(); var usuario = new Object(); usuario.nome = "Alexandre";usuario.nome = "Alexandre";usuario.sobrenome = "Soli"; usuario.sobrenome = "Soli";
► O serviço ExemploLookup irá interceptara chamada ao O serviço ExemploLookup irá interceptara chamada ao método metodoExemplo, fará a concatenação das variáveis e método metodoExemplo, fará a concatenação das variáveis e devolverá uma String.devolverá uma String.
publicpublic String metodoExemplo(Usuario usuario) { String metodoExemplo(Usuario usuario) {String nomeCompleto = usuario.getNome() + " " + usuario.getSobrenome();String nomeCompleto = usuario.getNome() + " " + usuario.getSobrenome();
returnreturn nomeCompleto; nomeCompleto;}}
► Página com a mensagem de resposta.Página com a mensagem de resposta.
Dúvidas ou comentários?Dúvidas ou comentários?
► Envie um email para Envie um email para alexandre.soli@gmail.comalexandre.soli@gmail.com
► Visite meu blog para mais dicas e tutoriasVisite meu blog para mais dicas e tutorias
http://alexandresoli.wordpress.comhttp://alexandresoli.wordpress.com