1 / 16

Ajax y el framework DWR

Ajax y el framework DWR. Juan Fernández Rodríguez uo67775@uniovi.es. AJAX: Asynchronous JavaScript & XML. Técnica de desarrollo Web para crear aplicaciones Web Interactivas

maddy
Download Presentation

Ajax y el framework DWR

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Ajax y el framework DWR Juan Fernández Rodríguez uo67775@uniovi.es

  2. AJAX: Asynchronous JavaScript & XML • Técnica de desarrollo Web para crear aplicaciones Web Interactivas • Las aplicaciones se ejecutan en el navegador del usuario y mantienen una comunicación asíncrona con el servidor en background

  3. AJAX: Asynchronous JavaScript & XML • Ajax engloba varias tecnologías • XHTML y CSS para la presentación • DOM para mostrar e interactuar con la información dinámica • XMLHttpRequest para el intercambio de datos asíncronamente

  4. AJAX vs BASIC WEB APPS

  5. Síncrono vs. Asíncrono

  6. Aplicaciones Ajax

  7. DWR: Easy Ajax for Java • Librería Open Source escrita en Java • Compuesta por dos partes • Un Servlet en el servidor que procesa peticiones y envía respuestas • JavaScript en el cliente, que envía las peticiones y actualiza dinámicamente las páginas

  8. DWR: Esquema

  9. DWR: Configuración del servidor (web.xml) … <servlet> <servlet-name>dwr-invoker</servlet-name> <display-name>DWR Servlet</display-name> <servlet-class>uk.ltd.getahead.dwr.DWRServlet</servlet-class> … </servlet> <servlet-mapping> <servlet-name>dwr-invoker</servlet-name> <url-pattern>/dwr/*</url-pattern> </servlet-mapping> …

  10. DWR: Exportar objetos Java (dwr.xml) • Mapeo de tipos: etiqueta <convert> • Clases a exportar: etiqueta <create> … <dwr> <allow> <convert converter="bean" match="es.princast.framework.core.vo.PropertyBean"/> <create creator="session" javascript="MunicipiosController" class="es.princast.sampleapp.web.dwr.MunicipiosController"> </create> </allow> </dwr> …

  11. DWR en el cliente • STUB del cliente • Motor DWR engine.js (facilidades de llamada a métodos remotos) • Funciones agrupadas por los métodos de cada clase exportada nombreclase.js (el servlet DWRServlet los genera al vuelo utilizando la configuración de dwr.xml)

  12. DWR en el cliente (II) • Ej: Si se exporta la clase public class Foo { public String doFoo() { return "foo"; } } • En el fichero “foo.js” se encontrará la función “function Foo.doFoo()” (en el cliente), permite acceder al método doFoo() de la clase Foo (en el servidor) • Para realizar llamadas a métodos del servidor, basta con utilizar las funciones de las librerias “interface”. No es necesario invocar ninguna función del fichero engine.js.

  13. DWR en el cliente (III) • Utilidades para actualizar DHTML: • Proporciona una biblioteca de funciones “util.js” para manipular código DHTML que permiten actualizar sus contenidos como • addOptions / removeOptions • addRows / removeRows • getValue / setValue • Etc.

  14. DWR: Java Script Asíncrono • Llamada síncrona: ¡ERROR! … data = FooRemoteClass.fooMethod(); //Llamada remota con DWR alert("Datos recibidos: "+data); ... • Llamada asíncrona: ¡OK! ... data = FooRemoteClass.fooMethod(processData); ... function processData(data) { alert("Datos recibidos: "+data); }

  15. DWR: Actualización de la Vista • Ej.: actualizar el contenido de un DIV • Cliente: <script languaje="JavaScript"> ... FooRemoteClass.getContenidoDiv(loadDiv); ... function loadDiv(data){ DWRUtil.setValue("divId", data); } </script> <body> ... <div id="divId"></div> </body> • Servidor public String getContenidoDIv() throws ServletException, IOException{ return ExecutionContext.get().forwardToString("/contenidoDiv.jsp"); }

  16. Conclusiones • PROS • Interactividad • CONTRAS • Usabilidad: botón atrás, marcadores/favoritos • Tiempos de respuesta: sin feedback claro y tiempos cortos de respuesta. Los usuarios pueden experimentar esperas “incomprensibles”. Recomendado el uso de feedback’s visuales • Accesibilidad: usuarios con navegadores de texto, hablados, sin JavaScript etc. Los desarrolladores necesitan implementar opciones fallback para usuarios de otras plataformas

More Related