Diferència entre revisions de la pàgina «JsonXat»
(Es crea la pàgina amb «Realitzarem una aplicació de xat a través del mòbil i de la web. Per permetre una màxima eficiencia i bon disseny utilitzarem serveis web. Et caldrà haver llegit el…».) |
|||
Línia 39: | Línia 39: | ||
== Definint la nostra API dels serveis JSON == | == Definint la nostra API dels serveis JSON == | ||
Necessitem una interfície per parlar amb el servidor. Ens permetrà definir el '''protocol per enviar i rebre missatges independentment de la implementació que tinguem al servidor'''. És a dir que podem tenir el servei muntat sobre el filesystem o sobre una base de dades i que el client no noti la diferència, ja que la interfície és comuna. | Necessitem una interfície per parlar amb el servidor. Ens permetrà definir el '''protocol per enviar i rebre missatges independentment de la implementació que tinguem al servidor'''. És a dir que podem tenir el servei muntat sobre el filesystem o sobre una base de dades i que el client no noti la diferència, ja que la interfície és comuna. | ||
+ | |||
+ | Bàsicament volem enviar i rebre missatges. El nostre protocol tindrà, doncs: | ||
+ | * Demanar llista de canals: '''xat_get_canals_ws''' | ||
+ | * Demanar missatges per un canal: '''xat_get_canal_ws/<canal>''' | ||
+ | * Enviar missatge per un canal: '''xat_set_missatge_ws''' | ||
+ | |||
+ | === xat_get_canal_ws === | ||
+ | |||
+ | {| border="1" class="wikitable" style="border-collapse:collapse;" | ||
+ | |+ xat_get_canal_ws (entrada) | ||
+ | ! atribut | ||
+ | ! valor (exemple) | ||
+ | ! comentari | ||
+ | |- | ||
+ | | canal | ||
+ | | principal | ||
+ | | canal de xat del què volem rebre els missatges | ||
+ | |} | ||
<br> | <br> | ||
+ | {| border="1" class="wikitable" style="border-collapse:collapse;" | ||
+ | |+ xat_get_canal_ws (sortida) : llista de | ||
+ | ! atribut | ||
+ | ! valor | ||
+ | ! comentari | ||
+ | |- | ||
+ | | remitent | ||
+ | | manel | ||
+ | | nick de l'usuari que ha escrit l'entrada | ||
+ | |- | ||
+ | | missatge | ||
+ | | "hola què tal" | ||
+ | | string del missatge | ||
+ | |} | ||
+ | |||
+ | Podeu testejar-ho amb: | ||
+ | $ curl http://enricus.tk/serveis/xat_get_canal_ws | ||
+ | |||
+ | === xat_set_missatge_ws === | ||
+ | |||
+ | {| border="1" class="wikitable" style="border-collapse:collapse;" | ||
+ | |+ xat_set_missatge_ws (entrada) | ||
+ | ! atribut | ||
+ | ! valor (exemple) | ||
+ | ! comentari | ||
+ | |- | ||
+ | | canal | ||
+ | | principal | ||
+ | | canal de xat al què volem enviar el missatge | ||
+ | |- | ||
+ | | missatge | ||
+ | | "hola, com anem per aquí?" | ||
+ | | cos dels missatge a enviar | ||
+ | |} | ||
+ | |||
+ | <br> | ||
+ | |||
+ | Cal tenir en compte que potser no us cal tota la informació que el servei ens dóna: | ||
+ | |||
+ | {| border="1" class="wikitable" style="border-collapse:collapse;" | ||
+ | |+ xat_set_missatge_ws (sortida) | ||
+ | ! atribut | ||
+ | ! valor | ||
+ | ! comentari | ||
+ | |- | ||
+ | | servei | ||
+ | | "xat" | ||
+ | | nom del servei que estem utilitzant (sempre serà "xat") | ||
+ | |- | ||
+ | | canal | ||
+ | | "principal" | ||
+ | | canal de xat al què hem volgut enviar el missatge | ||
+ | |- | ||
+ | | status | ||
+ | | true/false | ||
+ | | si la petició s'ha resolt OK (gravar missatge) | ||
+ | |- | ||
+ | | missatge | ||
+ | | "ERROR: JSON incorrecte"<br>"missatge enregistrat correctament" | ||
+ | | missatge amb detalls de l'execució | ||
+ | |} | ||
+ | |||
+ | Podeu testejar-ho amb: | ||
+ | $ curl http://enricus.tk/serveis/xat_set_missatge_ws | ||
== Directiva de seguretat de browsers i JSONP == | == Directiva de seguretat de browsers i JSONP == |
Revisió del 19:56, 26 març 2014
Realitzarem una aplicació de xat a través del mòbil i de la web.
Per permetre una màxima eficiencia i bon disseny utilitzarem serveis web. Et caldrà haver llegit els següents articles:
Contingut
Introducció
Objectius:
- Treballar web services.
- Treballar JSON com a format estàndard de comunicació.
- Establir una API de referència independent de l'implementació.
- Treballar aplicacions mòbils.
Recursos:
- Links articles anteriors.
- curl: (Call URL) utilitat per línia de comandes Unix per testejar serveis web (i d'altres).
- Pàgina web de test i exemple amb JavaScript:
Passes recomanades
- Costat servidor: serveis web
- Es pot realitzar amb el llenguatge/framework de la vostra elecció (en principi Pyramid o PHP).
- Web Services amb Pyramid i Cornice
- JSONP en Pyramid: ens resulta més convenient ja que podem cridar la llibreria entre servidors (problema de seguretat dels browsers i la política de "mateix domini" en les crides JSON).
- http://docs.pylonsproject.org/projects/pyramid/en/latest/narr/renderers.html#jsonp-renderer
- Test amb curl
- Costat client: exemple JavaScript
- http://enricus.tk/jsonxat.html
- Instal·leu l'exemple al vostre domini
- Aplicació mòbil:
Definint la nostra API dels serveis JSON
Necessitem una interfície per parlar amb el servidor. Ens permetrà definir el protocol per enviar i rebre missatges independentment de la implementació que tinguem al servidor. És a dir que podem tenir el servei muntat sobre el filesystem o sobre una base de dades i que el client no noti la diferència, ja que la interfície és comuna.
Bàsicament volem enviar i rebre missatges. El nostre protocol tindrà, doncs:
- Demanar llista de canals: xat_get_canals_ws
- Demanar missatges per un canal: xat_get_canal_ws/<canal>
- Enviar missatge per un canal: xat_set_missatge_ws
xat_get_canal_ws
atribut | valor (exemple) | comentari |
---|---|---|
canal | principal | canal de xat del què volem rebre els missatges |
atribut | valor | comentari |
---|---|---|
remitent | manel | nick de l'usuari que ha escrit l'entrada |
missatge | "hola què tal" | string del missatge |
Podeu testejar-ho amb:
$ curl http://enricus.tk/serveis/xat_get_canal_ws
xat_set_missatge_ws
atribut | valor (exemple) | comentari |
---|---|---|
canal | principal | canal de xat al què volem enviar el missatge |
missatge | "hola, com anem per aquí?" | cos dels missatge a enviar |
Cal tenir en compte que potser no us cal tota la informació que el servei ens dóna:
atribut | valor | comentari |
---|---|---|
servei | "xat" | nom del servei que estem utilitzant (sempre serà "xat") |
canal | "principal" | canal de xat al què hem volgut enviar el missatge |
status | true/false | si la petició s'ha resolt OK (gravar missatge) |
missatge | "ERROR: JSON incorrecte" "missatge enregistrat correctament" |
missatge amb detalls de l'execució |
Podeu testejar-ho amb:
$ curl http://enricus.tk/serveis/xat_set_missatge_ws
Directiva de seguretat de browsers i JSONP
En aquesta pràctica ens convé utiltizar JSONP (wikipedia) enlloc del JSON habitual per solventar un "problema" de seguretat. Bé, no és un problema, sinó una directiva amb molt de sentit:
SOP o Same-Origin Policy: simplement, els navegadors o browsers impedeixen crides a serveis en servidors que no son el què apareix a la URL en curs.
És lògic i convenient, perquè si no, ens poden "robar la cartera" quan naveguem.
Pel desenvolupament, però, ens provocarà certes molèsties. Les alternatives son:
- Treballem sempre amb el mateix servidor+port amb JSON (important el port, diferents ports el navegador els considera diferents sites).
- Col·locar un proxy en el nostre servidor perquè ens redirigeixi certes crides al 2n servidor (apache2 mod_proxy).
- Utiltizar un "truc" anomenat JSONP. Ens permetrà cridar serveis en un altre servidor però només ens funciona a través de GET.
Teniu un exemple de tot plegat (particularment de la part JavaScript) a:
http://enricus.tk/jsonxat.html
Cal implementar JSONP al servidor i al client. La part negativa de tot plegat és que si després volem fer els serveis amb JSON haurem de duplicar codi o bé passar-lo de JSONP a JSON (seria convenient per seguretat).
App mòbil Android
Utiltizeu l'article Android per iniciar-vos amb les aplicacions pel SO de Google.
Volem realitzar una app que ens faci la mateixa funció que la web d'exemple anterior. És a dir, que carregui i envii missatges a un servidor seguint el protocol marcat per la nostra API.