Curso PHP Advanced and Ajax

Transcripción

1 Curso PHP Advanced and Ajax 2012

2 Unidad VI Formato de Datos y Tipos 2012

3 Sockets 2012

4 Definición Definición 1: Socket designa un concepto abstracto por el cual dos programas (posiblemente situados en computadoras distintas) pueden intercambiar cualquier flujo de datos, generalmente de manera fiable y ordenada Definición 2: Un socket es un punto final de un enlace de comunicación de dos vías entre dos programas que se ejecutan a través de la red

5 Sockets Un Socket queda definido por: Una dirección IP Un protocolo de transporte Un número de puerto El cliente y el servidor deben ponerse de acuerdo sobre el protocolo que utilizarán

6 Sockets Para conectar un proceso X con un proceso Y en otra maquina, el proceso X deberá crear un Socket con la dirección IP del proceso Y También, como en una máquina, existe más de un proceso, se deberá indicar en que puerto atiende el proceso Y Los sockets tienen que ver con la comunicación entre procesos - Inter-Communication Process (IPC)

7 Sockets en PHP La extensión socket de PHP, implementa una interfaz de bajo nivel para las funciones de comunicación de sockets basadas en los populares sockets de BSD, proporcionando la posibilidad de actuar tanto como servidor como cliente del socket Link:

8 Funciones de Socket en PHP

9 Algunas funciones importantes

20 Ejemplo - Código

21 Ejemplo - Respuesta

22 Socket Cliente/Servidor

23 Web Service 2012

24 Web Service Definición 1 Definición 1: Un Web Service está basado en estándares, es una entidad de software independiente del lenguaje, que acepta solicitudes formateadas de otras entidades de software o máquinas remotas a través de protocolos de comunicación produciendo respuestas específicas

25 Web Service Definición 2 Definición 2: Un servicio web (en inglés, Web service) es una tecnología que utiliza un conjunto de protocolos y estándares que sirven para intercambiar datos entre aplicaciones Distintas aplicaciones de software desarrolladas en lenguajes de programación diferentes, y ejecutadas sobre cualquier plataforma, pueden utilizar los servicios web para intercambiar datos en redes

26 Web Service Definición 2 La interoperabilidad se consigue mediante la adopción de estándares abiertos Las organizaciones OASIS y W3C son los comités responsables de la arquitectura y reglamentación de los servicios Web Para mejorar la interoperabilidad entre distintas implementaciones de servicios Web se ha creado el organismo WS-I, encargado de desarrollar diversos perfiles para definir de manera más exhaustiva estos estándares

27 Web Service La mayoría de los WS no tienen una GUI

28 Estándares empleados en los WS Web Services Protocol Stack XML SOAP (Simple Object Access Protocol) o XML-RPC (XML Remote Procedure Call): Protocolos sobre los que se establece el intercambio. HTTP, FTP o SMTP WSDL UDDI WS-Security REST Es un estilo

29 Beneficios de los Web Service Bajo acoplamiento: Cada servicio existe independiente de los demás servicios Facilidad de Integración Reutilización de servicios

30 Arquitectura de los WS Un sistema básico de WS tiene dos participantes: Un productor de servicio (provider) Un consumidor de servicio (requester) El provider presenta la interfaz y la implementación del servicio y el requester usa el Web Service

31 Arquitectura de WS En un sistema más sofisticado de WS existen 3

32 Web Service Los Web Services permiten a las organizaciones intercambiar datos sin necesidad de conocer los detalles de sus respectivos Sistemas de Información Algunos de los protocolos más utilizados para implementar WS en la mayoría de los lenguajes son: XML SOAP WSDL UDDI

33 Web Service XML es usado para describir los datos SOAP se ocupa para la transferencia de los datos WSDL se emplea para describir los servicios disponibles UDDI se ocupa para conocer cuales son los servicios disponibles. Es un directorio distribuido que opera en la Web que permite a las empresas publicar sus Web Services, para que otras empresas conozcan y utilicen los Web Services que publican, opera de manera análoga a las páginas amarillas

34 Web Service

35 Web Service en PHP Para manejar Web Service en PHP, se ofrecen las siguientes extensiones OAuth: OAuth es un protocolo de autorización basado en HTTP SCA: Permite crear componentes reutilizables SOAP: La extensión SOAP se puede utilizar para escribir servidores y clientes SOAP X.commerce: Para aplicaciones de E-commerce XML-RPC: Estas funciones se pueden usar para escribir servidores y clientes XML-RPC Link:

36 SOAP La extensión SOAP tiene los siguientes elementos: Funciones SOAP Clase SoapClient Clase SoapServer Clase SoapFault Clase SoapHeader Clase SoapParam Clase SoapVar

37 Para programar WS en PHP Paso 1: Para implementear un cliente SOAP en PHP necesitas primero de todo es activar la clase SOAP CLIENT de PHP. Puedes comprobar haciendo un "phpinfo ();" para comprobar que está activo Paso 2: Averigua si el WSDL (web service description language) está incluido en el ENDPOINT. El WSDL es un descriptor que se utiliza para componer el mensaje que mandes a través de PHP en el formato XML correcto. El ENDPOINT es una URL que identifica la ubicación del servicio (ej.

38 Para programar WS en PHP Paso 2 : Casos posibles 2.1 El WSDL está incluido en el ENDPOINT. Cuando este descriptor se obtiene automáticamente al acceder al ENDPOINT. Se accede a él a través de la sintaxis: ENDPOINT?wsdl ej El WSDL no está incluido en el ENDPOINT. Tendrás un archivo con extensión.wsdl que habrá que subir a tu servidor para luego llamarlo en PHP

39 Para programar WS en PHP Paso 3: Tienes que conocer las funciones a utilizar y el tipo de valor que devuelven. El valor devuelto será un array con una estructura que deberás conocer. Hay una función que puedes invocar para mostrar todas las funciones disponibles: $client = new SoapClient(PARAMETROS-DEL- SERVIDOR); print_r($client-> getfunctions());

40 Ejemplo WSDL

41 Ejemplo Servidor

42 Ejemplo Cliente

43 Salida

44 Cómo generar el WSDL Con IDE s (Eclipse, Zend Studio) Con Bibliotecas de PHP como PHP WSDL Generator ( )

45 Ejemplo de WSDL - PHP WSDL Generator Link:

46 Unidad VII AJAX 2012

47 AJAX El término AJAX se presentó por primera vez en el artículo "Ajax: A New Approach to Web Applications" publicado por Jesse James Garrett el 18 de Febrero de AJAX = Asynchronous JavaScript and XML AJAX no es un lenguaje de programación, es una forma de utilizar estándares existentes

48 AJAX Ajax no es una tecnología en sí mismo. En realidad, se trata de varias tecnologías independientes que se unen de formas nuevas y sorprendentes

49 AJAX Ajax es el arte de intercambiar datos con el servidor y actualizar ciertas partes de la página web, sin la necesidad de recargar toda la página En las aplicaciones web tradicionales, las acciones del usuario en la página desencadenan llamadas al servidor. Una vez procesada la petición del usuario, el servidor devuelve una nueva página HTML al navegador del usuario (da una sensación de poca continuidad - no crea una buena sensación al usuario) Sin hago muchas peticiones el uso es molesto

50 AJAX AJAX permite mejorar completamente la interacción del usuario con la aplicación, evitando las recargas constantes de la página, ya que el intercambio de información con el servidor se produce en un segundo plano Las aplicaciones construidas con AJAX eliminan la recarga constante de páginas mediante la creación de un elemento intermedio entre el usuario y el servidor. La nueva capa intermedia de AJAX mejora la respuesta de la aplicación, ya que el usuario nunca se encuentra con una ventana del navegador vacía esperando la respuesta del servidor

51 AJAX Las peticiones HTTP al servidor se sustituyen por peticiones JavaScript que se realizan al elemento encargado de AJAX Las peticiones más simples no requieren intervención del servidor, por lo que la respuesta es inmediata. Si la interacción requiere una respuesta del servidor, la petición se realiza de forma asíncrona mediante AJAX. En este caso, la interacción del usuario tampoco se ve interrumpida por recargas de página o largas esperas por la respuesta del servidor

52 AJAX

53 AJAX El intercambio de datos con el servidor se hace en segundo plano Las aplicaciones AJAX son independientes de la plataforma y el navegador

54 AJAX AJAX se basa en la utilización de un objeto, el objeto XMLHttpRequest El objeto XMLHttpRequest es utilizado para intercambiar datos con el servidor en segundo plano XMLHttpRequest es soportado por la mayoría de los navegadores modernos (el objeto esta incorporado en los navegadores) En IE5 y IE6 usa el objeto ActiveX

55 Objeto XMLHttpRequest El objeto XMLHttpRequest posee los siguientes métodos: open: Inicializa la solicitud setrequestheader: Tipo MIME de la solicitud send: Envía la solicitud sendasbinary: Envía datos binarios abort: Aborta una solicitud enviada getresponseheader: Obtiene el texto de la cabecera HTTP getallresponseheaders: Texto de las cabeceras para solicitudes multi-parte

56 Objeto XMLHttpRequest Algunas (no todas) propiedades del objeto: status: El status HTTP de la respuesta a una solicitud. statustext: El texto de respuesta del servidor. readystate: El estado de la solicitud. responsetext: El texto de la respuesta a una solicitud. responsexml: La respuesta como un objeto DOM, basado en XML Referencias Especificación del W3C para el objeto XMLHttpRequest:

57 Métodos importantes Método open(metodo,url,async) Descripción Especifica el tipo de solicitud, la url y si la solicitud será realizada de manera asíncrona o no method: El tipo de solicitud: GET or POST url: la ubicación del archivo en el servidor async: true (asynchronous) or false (synchronous) send(string) Ejemplo: Envia la solicitud en segundo plano al servidor. Solo se utiliza el parámetro string cuando el método es post

58 Consideraciones de los parámetros de open El parámetro url hace referencia a un archivo del servidor Este tipo de archivo puede ser cualquier tipo de archivo:.txt.xml.asp.php etc

59 Consideraciones de los parámetros de open El tercer parámetro de open índice la sincroneidad de la solicitud Enviar solicitudes asíncronas mejora la usabilidad de la aplicación Muchas de las tareas que se realizan en el servidor consumen mucho tiempo. Antes de AJAX esto hacia que las aplicaciones se congelarán hasta que se devolvía la respuesta Con AJAX, JS no tiene que esperar la respuesta del servidor, sino que puede: Ejecutar otros scripts mientras espera la respuesta del servidor Tratar las respuestas cuando estas lleguen

60 Consideraciones de los parámetros de open Async=true, especifica que una función se ejecuta cuando la respuesta está lista Async=false, no es recomendado, pero para una pequeña cantidad de solicitudes esta bien. JS no se continua ejecutando hasta que la respuesta del servidor este lista

61 GET o POST GET es más simple y rápido que POST y suele ser utilizado en la mayoría de los casos Se suele utilizar POST para: Para actualizar un archivo o una BD Enviar una gran cantidad de datos al servidor (POST no tiene limitaciones) Enviar una entrada de usuario con caracteres especiales, POST es más robusto y seguro que GET

62 GET

63 POST

64 AJAX Como práctica se estila realizar llamadas AJAX con GET para realizar consultas Y llamadas AJAX con POST para modificar la información en el servidor Podemos disparar solicitudes AJAX mediante eventos realizados por el usuario Podemos ver maneras de asociar manejadores de eventos que implementan funcionalidades DOM nivel 2

65 Respuestas del servidor Para obtener la respuesta del servidor se pueden utilizar las siguientes propiedades del objeto XMLHttpRequest responsetext Obtiene la respuesta como un string responsexml Obtiene la respuesta como XML

66 Respuestas del servidor Otra opción común es retornar valores en formato JSON JSON (JavaScript Object Notation) es una notación para serializar objetos, nativa a JS Cuando retornamos valores en formato JSON, podemos evaluarlo (usando la función JS eval ), el cual carga el objeto en memoria Podemos acceder posteriormente a sus propiedades como cualquier otro objeto

67 Respuestas del servidor El Content-type para utilizar JSON es: application/json Un objeto JSON es una cadena, rodeada por { y } Ejemplos: { nombre : Omar, apellido : Esgaib, edad :20} { club : Libertad, hijos :[ lmp, rr, grn ]} Para retornar JSON desde PHP podemos sencillamente retornarno con echo (rodear cada línea entre comillas)

68 El evento onreadystatechange Cuando una solicitud al servidor es enviada, se suele querer realizar ciertas acciones basadas en la respuesta El evento onreadystatechange es lanzando cada vez que la propiedad readystate cambia La propiedad readystate almacena el estado del XMLHttpRequest Existen tres propiedades importantes del objeto XMLHttpRequest: onreadystatechange readystate status

69 Propiedades Objeto XMLHttpRequest No se llamó a open No se llamó a send Se llamó a send No se bajó toda la respuesta del server Solicitud completada

70 Propiedades Objeto XMLHttpRequest En el evento onreadystatechange, se especifica lo que sucederá cuando la respuesta del servidor esté lista para ser procesada Cuando el readystate sea igual a 4 y el estatus sea 200, la respuesta está lista Listado de los códigos de status HTTP:

71 Se pueden utilizar callback Function Una función callback es una función que es pasada como parámetro a otra función

72 Resumen Resumen, lado cliente: Crear páginas HTML normales Asociar eventos JS a los elementos HTML que disparen solicitudes AJAX utilizando XMLHttpRequest Procesar solicitud mediante una función callback En caso de error, avisar al usuario En caso de éxito, tratar la respuesta Resumen, lado servidor: Escribir métodos PHP que reciban una solicitud Procesar solicitud Emitir respuesta. Debe incluir el Content-type correcto de acuerdo al tipo de objeto que debemos retornar

73 Primera Aplicación en AJAX

74 Segunda Aplicación en AJAX Se quiere realizar una aplicación con AJAX que realice lo siguiente: Se posee un input text, donde el usuario completa un nombre A medida que el usuario va insertando caracteres, el sistema debe sugerirle un nombre que tenga las letras que el usuario haya tecleado (esto las obtiene de algún repositorio o archivo) o indicarle que no hay sugerencias

75 Tercera Aplicación en Ajax Se tiene una BD con una tabla Se posee un campo de texto en el cual introducimos una palabra (campo nombre en la tabla clubes) Se tiene que verificar en la BD si esa palabra existe y traer el resultado

76 Herramienta de Desarrollo Una aplicación de gran utilidad para observar el comportamiento y debuggear aplicaciones AJAX es el Firebug Es una consola que permite inspeccionar cualquier elemento CSS, HTML, JS, solicitudes síncronas y asíncronas, etc.; realizadas desde el navegador Se instala como agregado a Firefox Una vez instalado el Firebug, debemos habilitarlo, y al navegar a través de cualquier página podemos inspeccionar sus propiedades

77 Firebug

78 Firebug Además el Firebug tiene una utilidad excelente para trabajar con objetos JS Es de extrema utilidad cuando trabajamos con librerías JS que poseen gran cantidad de métodos y atributos, y que deseamos inspeccionar Esta utilidad es la función console.log() Recibe como parámetro texto, variable, un objeto, cualquier cosa; lo inspecciona e imprime Se puede utilizar en cualquier bloque JS

79 Firebug

80 Frameworks Javascript - JQUERY 2012

81 Frameworks - Definición En general, con el término framework, nos estamos refiriendo a una estructura software compuesta de componentes personalizables e intercambiables para el desarrollo de una aplicación En otras palabras, un framework se puede considerar como una aplicación genérica incompleta y configurable a la que podemos añadirle las últimas piezas para construir una aplicación concreta

82 Objetivos Los objetivos principales que persigue un framework son: Acelerar el proceso de desarrollo Reutilizar código ya existente Promover buenas prácticas de desarrollo como el uso de patrones

83 Framework Web Un framework Web, por tanto, podemos definirlo como un conjunto de componentes (clases genéricas, clases, interfaces, archivos, etc) que componen un diseño reutilizable que facilita y agiliza el desarrollo de sistemas Web Algunos componentes comunes son: Authenticación Mail Paginador MVC Validación Barcode Log Captcha Form Login Etc

84 Frameworks de JS Los principales frameworks de JS son: script.aculo.us ( Prototype ( Moo Tools ( jquery ( MochiKit ( Rialto ( Dojo Toolkit ( Ext Js ( Spry Framework (

85 jquery Página Oficial:

86 jquery jquery es una librería rápida y de concisa de Javascript que simplifica el manejo de eventos, animaciones e interacciones AJAX para el rapid Web development jquery está diseñado para cambiar el modo en que uno programa Javascript jquery es: Bastante completo Fácil de aprender y simplifica la programación Javascript Buena documentación Muchos ejemplos de código Buena comunidad en diferentes idiomas Entre otras características

87 jquery - Instalación Se baja el código de la biblioteca Se añade en el script LISTO!!!!!!!!!

88 jquery El propósito de jquery es hacer que la utilización se JS sea mucho más sencilla jquery simplifica las llamadas Ajax y la manipulación de DOM jquery contiene las siguientes características Manipulación HTML/DOM Manipulación CSS Métodos de eventos HTML Efectos y animaciones Ajax Utilidades

89 jquery Muchas compañías grandes utilizan jquery Google Microsoft IBM Netflix

90 jquery Ejemplo sencillo

91 jquery Ejemplo sencillo

92 Sintaxis jquery Con jquery podemos seleccionar elementos HTML y realizar acciones sobre ellos La sintaxis jquery está hecha a medida para seleccionar un elemento y realizar una acción sobre él $ - signo para acceder a jquery (selector) para encontrar los elementos HTML Una acción jquery, para realizarla sobre el elemento

93 Sintaxis jquery jquery usa la sintáxis de selectores de CSS Es recomendable que todos los métodos jquery estén dentro del evento document ready, esto permite que nada se ejecute antes de que se cargue completamente la página

94 Selectores jquery Algunos ejemplos

95 Algunos ejemplos de Eventos jquery

96 Ajax con jquery

97 Unidad IX Aspectos Finales 2012

98 Herramientas de Desarrollo en PHP 2012

99 Herramientas de Apoyo al desarrollo IDE (Eclipse, Aptana, Zend Studio) Usar Debugger (Zend Debugger, Xdebug) Usar Zend Server y su interfaz administrativa Usar PHPUnit para testeos unitarios (hay que acostumbrarse a programar) Usar phpdocumentator (para generar documentaciones Web y autocompletado en el IDE) PHP Beautifier (para seguir estándares de programación) Smarty Uso de plantillas Usar Sistemas de Tracking (Mylin, Trac, Mantis) Usar Sistemas de Versionamiento (GIT, GITHUB, SVN, CVS) Clientes Administradores de BD (pgadminiii, phpmyadmin, phppgadmin, etc) Firebug (depurador de lado cliente) Usar PECL Usar PEAR

100 Herramientas de Apoyo al desarrollo Link:

101 Bibliografía 2012

102 Bibliografía Jansch,I., Guide to Enterprise PHP Development. php architect s. United States of America Manual Oficial de PHP - Doyle,M. Beginning PHP 5.3. Wrox. United States of America Beginning Javascript, 4th Edition