Diferència entre revisions de la pàgina «NF1 - Web Services (30h)»

De wikiserver
Dreceres ràpides: navegació, cerca
(→‎Pràctica Web Services)
(→‎Què són els Serveis Web?)
 
(Hi ha 6 revisions intermèdies del mateix usuari que no es mostren)
Línia 1: Línia 1:
 
=Què són els Serveis Web?=
 
=Què són els Serveis Web?=
 +
https://statickidz.com/proyectos/traductor-google-api-php-gratis/
 +
 +
https://jnjsite.com/symfony-como-montar-una-api-rest-de-tu-plataforma-completa-en-menos-de-1-hora/
 +
 
Els '''serveis web són aplicacions client i servidor''' que es comuniquen sobre (WWW) Protocol de transferència d'hipertext de la World Wide Web (HTTP). Segons el descrit pel World Wide Web Consortium (W3C), serveis web '''proporcionen un mitjà estàndard d'interoperabilitat entre aplicacions de programari que s'executen en una varietat de plataformes i marcs'''.  
 
Els '''serveis web són aplicacions client i servidor''' que es comuniquen sobre (WWW) Protocol de transferència d'hipertext de la World Wide Web (HTTP). Segons el descrit pel World Wide Web Consortium (W3C), serveis web '''proporcionen un mitjà estàndard d'interoperabilitat entre aplicacions de programari que s'executen en una varietat de plataformes i marcs'''.  
−
Els serveis web es caracteritzen per la seva gran interoperabilitat i extensibilitat, així com les seves descripcions processable per màquina, gràcies a la utilització de XML. Els serveis web es poden combinar d'una manera precisa per aconseguir operacions complexes.  
+
Els serveis web es caracteritzen per la seva gran interoperabilitat i extensibilitat, així com les seves descripcions processable per màquina, gràcies a la utilització de XML. Els serveis web es poden combinar d'una manera precisa per aconseguir operacions complexes.
  
 
=Tipus de Serveis Web=
 
=Tipus de Serveis Web=
Línia 177: Línia 181:
  
 
[[Fitxer:wsclient-php1.png|500px]]
 
[[Fitxer:wsclient-php1.png|500px]]
 +
 +
 +
=== Creació WebService Symfony ===
 +
 +
1. Instalar Bundle FosRestBundle e instalar MiBundle para luego añadirle el controlador
 +
 +
'''composer require friendsofsymfony/rest-bundle'''
 +
 +
2. Añadir en config/AppKernel
 +
 +
'''new FOS\RestBundle\FOSRestBundle(),'''
 +
 +
 +
3. Configurar serializer, añadir dentro de  app/config/config.yml
 +
<source lang="php">
 +
serializer:
 +
        enabled: true
 +
</source>
 +
 +
4. Configurar el Format Listener,  añadir dentro de  app/config/config.yml al final
 +
<source lang="php">
 +
fos_rest:
 +
    view:
 +
        view_response_listener: 'force'
 +
        formats:
 +
            json: true
 +
    format_listener:
 +
        rules:
 +
            - { path: ^/api, priorities: [ json ], fallback_format: json, prefer_extension: true }
 +
            - { path: ^/, stop: true }
 +
</source>
 +
 +
5. Cambiar routing app/config/routing
 +
<source lang="php">
 +
test:
 +
    resource: "@TestBundle/Controller/"
 +
    type:    annotation
 +
    prefix:  /api/
 +
</source>
 +
 +
6.Controlador
 +
<source lang="php">
 +
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
 +
use FOS\RestBundle\Controller\FOSRestController;
 +
use FOS\RestBundle\View\View;
 +
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Method;
 +
 +
class DefaultController extends FOSRestController
 +
{
 +
    /**
 +
    * @Route("/usuario/{id}", requirements={"id" = "\d+"}, defaults={"id" = 1})
 +
    * @Method({"GET"})
 +
    */
 +
    public function indexAction($id)
 +
    {
 +
        $view = View::create();
 +
        $view->setData(array("id"=> $id ,"nombre"=>"Silvia"));
 +
        return $this->handleView($view);
 +
 +
      // return $this->render('TestBundle:Default:index.html.twig');
 +
    }
 +
 +
 +
    /**
 +
    * @Route("/usuario/obtenerUser")
 +
    * @Method({"GET"})
 +
    */
 +
 +
    public function obtenerUserAction()
 +
    {
 +
        $data = array("Usuarios" => array(
 +
            array(
 +
                "nombre"  => "Julio",
 +
                "Apellido" => "Noguera"
 +
            ),
 +
            array(
 +
                "nombre"  => "Estefania",
 +
                "Apellido" => "Maestre"
 +
            )));
 +
 +
        return $data;
 +
    }
 +
 +
}
 +
 +
</source>
 +
 +
 +
7.Obtener datos de la API
 +
<source lang="javascript">
 +
<!DOCTYPE html>
 +
<html lang="en">
 +
<head>
 +
<meta charset="UTF-8">
 +
<title>Document</title>
 +
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
 +
 +
<script>
 +
url = 'http://localhost/rest/web/app_dev.php/api/usuario/obtenerUser';
 +
datos = {};
 +
$.getJSON(url, datos, function(response){
 +
    console.log(response);
 +
});
 +
 +
</script>
 +
</head>
 +
<body>
 +
 +
</body>
 +
</html>
 +
</source>
 +
 +
 +
 +
<source lang="php">
 +
 +
</source>
  
 
==Exercici Web Service SOAP ==
 
==Exercici Web Service SOAP ==

Revisió de 23:00, 8 maig 2018

Què són els Serveis Web?

https://statickidz.com/proyectos/traductor-google-api-php-gratis/

https://jnjsite.com/symfony-como-montar-una-api-rest-de-tu-plataforma-completa-en-menos-de-1-hora/

Els serveis web són aplicacions client i servidor que es comuniquen sobre (WWW) Protocol de transferència d'hipertext de la World Wide Web (HTTP). Segons el descrit pel World Wide Web Consortium (W3C), serveis web proporcionen un mitjà estàndard d'interoperabilitat entre aplicacions de programari que s'executen en una varietat de plataformes i marcs. Els serveis web es caracteritzen per la seva gran interoperabilitat i extensibilitat, així com les seves descripcions processable per màquina, gràcies a la utilització de XML. Els serveis web es poden combinar d'una manera precisa per aconseguir operacions complexes.

Tipus de Serveis Web

En el pla conceptual, un servei és un component de programari que es proporciona de la xarxa.

A nivell tècnic, els serveis web es poden implementar de diverses maneres. Els dos tipus de serveis web analitzats en aquesta secció es poden distingir com a Big Web Services i serveis web RESTful.

Big Web Services En Java EE 6, JAX-WS proporciona la funcionalitat de Big Web Services. Serveis web Grans utilitzen missatges XML que segueixen el protocol d'accés a objectes estàndard (SOAP), un llenguatge XML que defineix una arquitectura de missatges i formats de missatges. Aquests sistemes sovint contenen una descripció llegible per les màquines de les operacions que ofereix el servei, escrit en la Web Services Description Language (WSDL), un llenguatge XML per a definir sintàcticament interfícies.

El format del missatge SOAP i WSDL llenguatge de definició d'interfície han guanyat l'adopció generalitzada. Moltes de les eines de desenvolupament, com NetBeans IDE, poden reduir la complexitat del desenvolupament d'aplicacions de serveis web.

Soap-message.png

Serveis Web REST En Java EE 6, JAX-RS proporciona la funcionalitat per a la Transferència d'estat representacional ​​(REST Web Services). REST és molt adequat per a escenaris bàsics. Serveis web RESTful sovint estan millor integrats amb HTTP que els serveis basats en SOAP ja que no requereixen de missatges XML o definicions servei API WSDL.

Projecte Jersey és la implementació de referència de l'especificació JAX-RS. Jersei implementa suport per a les anotacions definides en l'especificació JAX-RS, el que facilita als desenvolupadors crear serveis web RESTful amb Java i la màquina virtual de Java (JVM).

SOAP Web Services

Simple Object Access Protocol (SOAP)és un protocol estàndard per l'intercanvi de missatges XML. La comunicació entre el client i el servei succeeix utilitzant missatges XML.

Què és el WSDL?

WSDL: Web Service Description Language. És un arxiu XML que descriu els detalls tècnics de com s'implementa un servei web, més específicament la URI, port, nom dels mètodes, els paràmetres i els tipus de dades. Llegint el WSDL poden veure:

  • Ports / EndPoint - URL del servei web
  • Format del missatge d'entrada
  • Format del missatge de sortida
  • Protocol de seguretat que s'ha de seguir
  • El protocol de servei web utilitzat

Exemple: 

<?xml version='1.0' encoding='UTF-8'?><!-- Published by JAX-WS RI at http://jax-ws.dev.java.net. RI's version is JAX-WS RI 2.2-hudson-740-. --><!-- Generated by JAX-WS RI at http://jax-ws.dev.java.net. RI's version is JAX-WS RI 2.2-hudson-740-. --><definitions xmlns:wsu="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-utility-1.0.xsd" xmlns:wsp="http://www.w3.org/ns/ws-policy" xmlns:wsp1_2="http://schemas.xmlsoap.org/ws/2004/09/policy" xmlns:wsam="http://www.w3.org/2007/05/addressing/metadata" xmlns:soap="http://schemas.xmlsoap.org/wsdl/soap/" xmlns:tns="http://ws/" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://schemas.xmlsoap.org/wsdl/" targetNamespace="http://ws/" name="Hola">
    <wsp:Policy wsu:Id="HolaPortBindingPolicy" />
    <types>
        <xsd:schema>
            <xsd:import namespace="http://ws/" schemaLocation="http://localhost:8084/webServiceProject/Hola?xsd=1" />
        </xsd:schema>
    </types>
    <message name="hello">
        <part name="parameters" element="tns:hello" />
    </message>
    <message name="helloResponse">
        <part name="parameters" element="tns:helloResponse" />
    </message>
    <message name="adeu">
        <part name="parameters" element="tns:adeu" />
    </message>
    <message name="adeuResponse">
        <part name="parameters" element="tns:adeuResponse" />
    </message>
    <portType name="Hola">
        <operation name="hello">
            <input wsam:Action="http://ws/Hola/helloRequest" message="tns:hello" />
            <output wsam:Action="http://ws/Hola/helloResponse" message="tns:helloResponse" />
        </operation>
        <operation name="adeu">
            <input wsam:Action="http://ws/Hola/adeuRequest" message="tns:adeu" />
            <output wsam:Action="http://ws/Hola/adeuResponse" message="tns:adeuResponse" />
        </operation>
    </portType>
    <binding name="HolaPortBinding" type="tns:Hola">
        <wsp:PolicyReference URI="#HolaPortBindingPolicy" />
        <soap:binding transport="http://schemas.xmlsoap.org/soap/http" style="document" />
        <operation name="hello">
            <soap:operation soapAction="" />
            <input>
                <soap:body use="literal" />
            </input>
            <output>
                <soap:body use="literal" />
            </output>
        </operation>
        <operation name="adeu">
            <soap:operation soapAction="" />
            <input>
                <soap:body use="literal" />
            </input>
            <output>
                <soap:body use="literal" />
            </output>
        </operation>
    </binding>
    <service name="Hola">
        <port name="HolaPort" binding="tns:HolaPortBinding">
            <soap:address location="http://localhost:8084/webServiceProject/Hola" />
        </port>
    </service>
</definitions>

Existeixen dues maneres per accedir a un servei web:

  • 'El proveïdor de serveis web coneix al client:El proveïdor de serveis web proporcionarà el WSDL al client i el client podrà accedir als serveis web.
  • El proveïdor de serveis registri la WSDL com a UDDI. UUID (Universal Description, Discover and Integration). Els WSDL es poden convertir a un UDDI i així, poden estar disponibles mitjançant un directori de serveis per a la seva utilització.

Creació d'un Servei Web amb Netbeans

Per crear un servei web soap (wsdl) es poden seguir els següents passos:

  • Creació d'un projecte nou de tipus Web Application

Webservice1.png

  • Seleccionar el servidor apache Tomcat

Webservice2.png

  • Una vegada creat el projecte, crear un nou servei web

Webservice3.png

  • Introduïr les dades del servei web (nom, package,...)

Webservice4.png

  • Utilitzar la implementació METRO per la creació del WS

Webservice5.png

  • Implementar el servei web. Es pot fer mitjançant codi únicament:

Webservice6.png

  • o bé, podem fer servir l'eina gràfica per crear nous serveis i modificar els paràmetres dels serveis creats

Webservice7.png

  • Compila i desplega el servei

Webservice8.png

  • Accedeix al wsdl del servei web

Webservice9.png Webservice10.png

Creació d'un client JAVA per fer servir un WebService

Es farà una implementació d'un servei web client utilitzant JAVA SWING. Segueix aquests passos:

  • Crea un nou projecte de tipus Java Application.

Wsclient-java1.png

  • Crea un formulari SWING per afegir els camps elements necessaris (buttons, labels, text fields, etc)

Wsclient-java2.png Wsclient-java3.png

  • Una vegada tinguis el formulari, afegeix la funcionalitat de web-service client

Wsclient-java4.png

  • Omple el camp wsdl a l'hora de configurar el client. Deixa en blanc el camp package:

Wsclient-java5.png

  • Una vegada generat, ja es pot utilitzar el client del WS des del formulari Swing. Per tal d'utilitzar-lo, genera el codi necessari insertant-lo des del netbeans:

Wsclient-java6.png Wsclient-java7.png Wsclient-java8.png

  • Podem veure el codi generat. Él nom de la funció generada correspon al nom del servei web:

Wsclient-java9.png

  • Ja podem utilitzar la crida al servei web associant-la al click d'un botó. El resultat de la execució del servei web es mostrarà en un Dialog.

Wsclient-java10.png

  • Resultat de l'execució:

Wsclient-java11.pngWsclient-java12.png

Accedir a un servei Web des de un client php

Per accedir a un servei web, és molt fàcil, només s'ha de donar el WSDL a la classe SoapClient de PHP. L'objecte generat conté tots els serveis webs que estan implementat en el WSDL. Per passar els paràmetres, es fa servir un Array associatiu on la clau és el nom del paràmetre configurat en el WS i el valor és el que es vol enviar al servei web. Exemple: 

$client = new SoapClient("http://192.168.56.1:8084/webServiceProject/Hola?wsdl");

$result = $client->hello(array("name"=>"alex"));

echo $result->return;

Per accedir al resultat del WebService, hem de veure en el WSDL el nom del camp corresponent al resultat del WS i així podrem accedir al valor.

Es pot crear un formulari amb php i en el controlador, fer la crida al servei Web corresponent.

Resultat execució codi anterior (Es recorda que es necessari una màquina virtual amb php + apache2):

Wsclient-php1.png


Creació WebService Symfony

1. Instalar Bundle FosRestBundle e instalar MiBundle para luego añadirle el controlador 

composer require friendsofsymfony/rest-bundle

2. Añadir en config/AppKernel

new FOS\RestBundle\FOSRestBundle(),


3. Configurar serializer, añadir dentro de app/config/config.yml 

serializer:
         enabled: true

4. Configurar el Format Listener, añadir dentro de app/config/config.yml al final 

fos_rest:
    view:
        view_response_listener: 'force'
        formats:
            json: true
    format_listener:
        rules:
            - { path: ^/api, priorities: [ json ], fallback_format: json, prefer_extension: true }
            - { path: ^/, stop: true }

5. Cambiar routing app/config/routing 

test:
    resource: "@TestBundle/Controller/"
    type:     annotation
    prefix:   /api/

6.Controlador 

use Sensio\Bundle\FrameworkExtraBundle\Configuration\Route;
use FOS\RestBundle\Controller\FOSRestController;
use FOS\RestBundle\View\View;
use Sensio\Bundle\FrameworkExtraBundle\Configuration\Method;

class DefaultController extends FOSRestController
{
    /**
     * @Route("/usuario/{id}", requirements={"id" = "\d+"}, defaults={"id" = 1})
     * @Method({"GET"})
     */
    public function indexAction($id)
    {
        $view = View::create();
        $view->setData(array("id"=> $id ,"nombre"=>"Silvia"));
        return $this->handleView($view);

       // return $this->render('TestBundle:Default:index.html.twig');
    }


    /**
     * @Route("/usuario/obtenerUser")
     * @Method({"GET"})
     */

    public function obtenerUserAction()
    {
        $data = array("Usuarios" => array(
            array(
                "nombre"   => "Julio",
                "Apellido" => "Noguera"
            ),
            array(
                "nombre"   => "Estefania",
                "Apellido" => "Maestre"
            )));

        return $data;
    }

}


7.Obtener datos de la API 

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

	<script>
		url = 'http://localhost/rest/web/app_dev.php/api/usuario/obtenerUser';
		datos = {};
		$.getJSON(url, datos, function(response){
		    console.log(response);
		});

	</script>
</head>
<body>
	
</body>
</html>


Exercici Web Service SOAP

  • Crea un servei web que permeti Sumar, Restar, Multiplicar i Dividir.
  • Crea una aplicació client en Swing que utilitzi el servei web anterior
  • Crea una aplicació client en PHP que també utilitzi aquest servei.

Pràctica Web Services

La idea és realitzar una aplicació semblant a Twitter. Aquesta aplicació ha de permetre:

  • Administració de l'aplicació
    • Crear Usuaris
    • Esborrar Usuaris
    • Esborrar Tweets
  • Utilització de la aplicació
    • Login d'usuari
    • Publicar tweet
    • Follow d'un usuari
    • unFollow d'un usuari
    • Veure tweets al mur

Els Clients dels Serveis Webs:

  • La part de l'administració ha de implementar-se en SWING
  • La part del usuari de l'aplicació ha de realitzar-se en PHP

Webgrafia

Obtingut de «http://wikiserver.infomerce.es/index.php?title=NF1_-_Web_Services_(30h)&oldid=10288»