<body><script type="text/javascript"> function setAttributeOnload(object, attribute, val) { if(window.addEventListener) { window.addEventListener('load', function(){ object[attribute] = val; }, false); } else { window.attachEvent('onload', function(){ object[attribute] = val; }); } } </script> <div id="navbar-iframe-container"></div> <script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script> <script type="text/javascript"> gapi.load("gapi.iframes:gapi.iframes.style.bubble", function() { if (gapi.iframes && gapi.iframes.getContext) { gapi.iframes.getContext().openChild({ url: 'https://www.blogger.com/navbar.g?targetBlogID\x3d16734928\x26blogName\x3dSid05+weblog\x26publishMode\x3dPUBLISH_MODE_BLOGSPOT\x26navbarType\x3dSILVER\x26layoutType\x3dCLASSIC\x26searchRoot\x3dhttp://sid05.blogspot.com/search\x26blogLocale\x3dit_IT\x26v\x3d2\x26homepageUrl\x3dhttp://sid05.blogspot.com/\x26vt\x3d2587781031737933902', where: document.getElementById("navbar-iframe-container"), id: "navbar-iframe" }); } }); </script>

Le API di PicNik: esempi pratici 18/11/07

Avevo parlato abbastanza dettagliatamente di PicNik alla sua uscita ma mi ero dimenticato di segnalare la presenza delle API per sfruttare il servizio anche "fuori" dal contesto originario... diciamo che recupero oggi; ricordo che PicNik è un servizio dedicato all' editing di immagini online e via browser e, lo devo confessare, funziona alla grande...

» continua

In questo post voglio riportarvi alcuni esempi pratici di funzionamento delle API, solo per evidenziare la loro semplicità e anche per capire che tipo di utilizzo se ne possa fare concretamente; per maggiori dettagli consultate la pagina dedicata e date un occhiata ai tutorial. Bene, possiamo iniziare.

La prima cosa di cui avete bisogno è una API key che potete ottenere semplicemente richiedendola a questo indirizzo (è necessaria la registrazione a PicNik); dovrete specificare il dominio nel quale utilizzerete il servizio e, nel caso lo vogliate, richiedere altre API keys (una per ogni dominio).

A questo punto possiamo da subito eseguire alcune operazioni di base; in questo post vediamo come inviare un' immagine all' editor semplicemente utilizzando alcuni parametri URL e come inserire un form che permetta agli utenti di caricare ed editare direttamente un immagine del loro computer.

Il primo esempio è semplicissimo, cliccate sull' immagine sotto, verrete reindirizzati nell' editor che a sua volta caricherà la stessa immagine:

2000blogger

Il codice necessario è questo (da inserire ovviamente <a href="qui"...):

http://www.picnik.com/service/?_import=http%3A//example.com/image.jpg&_apikey=YourApiKey

Si tratta solo di inserire alcuni parametri nel nostro URL (in grassetto le parti da personalizzare con il proprio percorso e API key).

Vediamo adesso qualcosa di più interessante; inseriamo un form dal quale ogni utente potrà caricare un immagine dal suo hard disk ed editarla in PicNik; qualcosa tipo questo:


E questo è il codice relativo:

<form method="post" action="http://www.picnik.com/service/" enctype='multipart/form-data'>
<input type="hidden" name="_import" value="image_file" />
<input type="file" name="image_file" size="30" ><br/>
<input type="submit" value="Upload this image"/>
<input type="hidden" name="_apikey" value="YourApiKey" />
</form>

Rispetto a questo esempio dovete inserire solo la vostra API key.

Concludo con una piccola nota, se volete importante: non ho ben chiaro un campo di applicazione (certo, ci sono gia alcuni esempi, ma non mi sembra niente di trascendentale); considerando però il supporto quasi completo di tutte le funzionalità del servizio e la possibilità di "far girare" il tutto sul proprio sito qualcosa ci deve essere...

Etichette: , , , ,

[Sid]
del.icio.us Digg technorati Design Float http://www.wikio.it oknotizie | Permalink | |

Ultimi commenti