Share
Wufoo è un'applicazione web che intende semplificare le forme. Le forme possono essere generalmente noiose con cui lavorare. Dovresti scrivere XHTML / CSS per gli elementi del modulo, impostare il codice back-end per acquisire tutti i dati e poi lavorare sulla generazione di rapporti utilizzabili per questo. Wufoo semplifica l'intero processo, dalla creazione del modulo all'integrazione all'interno del tuo sito attraverso l'ampio supporto a tema, alla creazione di report utili e utili per l'analisi dei dati.
Fa anche un sacco di cose avanzate, inclusi ganci Web e un'API corretta per accedere ai dati raccolti. Oggi vedremo come creare un semplice modulo con Wufoo e quindi utilizzare l'API per accedere e modificare a livello di codice i dati raccolti.
Per prima cosa, dovremo creare un modulo in modo che possiamo giocarci. Registrati per un nuovo account con Wufoo e sei portato a uno degli stati di applicazione in bianco più divertenti di tutti i tempi:
Fare clic sul pulsante per iniziare a creare un nuovo modulo e si viene indirizzati all'applicazione di creazione moduli. L'interfaccia è molto intuitiva con un pannello sensibile al contesto a sinistra e la sezione modulo principale sulla destra. Aggiungere elementi è semplice come cliccarci sopra o trascinarlo nella sezione principale.
Cliccando sull'elemento creato puoi modificare tutti i dettagli rilevanti.
Dal momento che vorremmo mantenerlo il più semplice possibile, basta un singolo campo di testo che prende un indirizzo email. Fai clic su Salva modulo e il gioco è fatto. Abbiamo creato il nostro primo modulo con codice zero e ci sono voluti 60 secondi.
Integrare il modulo creato con il nostro sito è incredibilmente facile. Vai alla pagina dei moduli e clicca su codice collegamento del modulo appena creato.
Wufoo offre una serie di modi per ottenere il modulo ai visitatori tra cui una versione JavaScript che funziona all'interno di un codice XHTML iframe per una pagina completa contenente i moduli o solo un collegamento che puoi condividere con i tuoi amici.
L'API di Wufoo ti consente di recuperare, inviare e modificare a livello di codice i dati pertinenti al tuo account con pochissimo disagio. L'insieme delle API consiste essenzialmente di due API stabili e fisse e un'altra in fase di beta test. Guarderemo le parti stabili oggi.
Tieni presente che sarai in grado di recuperare e inviare dati a moduli già esistenti. Se stai cercando di creare moduli on-the-fly e quindi inviare dati ad esso o semplicemente creando nuovi campi tramite l'API, sei fuori dalla fortuna. La versione corrente dell'API non consente questa funzionalità, ma la cerca nel prossimo futuro insieme a molte altre funzionalità.
Ma prima, avrai bisogno di una chiave API. Puoi scaricarlo dal link delle informazioni API nella pagina in cui trovi i frammenti di codice.
Prendere nota della chiave API e dell'ID del campo a cui si desidera accedere e / o modificare. Lo useremo a breve.
L'API Query ti consente di recuperare le informazioni raccolte tramite i tuoi moduli ignorando il sito web di Wufoo. Se stai cercando di ottenere tutti i dati grezzi e poi creare un rapporto personalizzato, questa è la strada da percorrere.
La prima cosa che devi notare è l'URL che dovrai richiedere per ottenere i dati giusti. L'URL è così:
http://username.wufoo.com/api/query/
Sostituire nome utente con il tuo nome utente e sei a posto. Il domanda parti consentono ai server Wufoo di sapere che stai cercando di recuperare le informazioni dai server.
cURL è il modo più semplice per noi di inviare dati al server. Se sei un po 'nuovo per cURL e ti senti perso, ti consiglio vivamente di passare attraverso questo articolo cURL proprio qui a Nettuts+.
Esaminiamo il codice parte per parte. Per prima cosa abbiamo bisogno della chiave API di cui abbiamo preso nota. Abbiamo anche bisogno del nome del modulo da cui vuoi recuperare i dati. Questi due insieme alla versione dell'API che stiamo usando, due nel nostro caso, sono i parametri minimi di cui abbiamo bisogno per effettuare una richiesta di successo.
Concateniamo tutti gli elementi richiesti come coppie chiave / valore e li memorizziamo per un uso successivo.
Successivamente, passiamo nell'URL corretto come indicato sopra insieme alla stringa richiesta che abbiamo creato sopra. Memorizziamo anche la risposta a una variabile in modo che possiamo usarla.
$ resp tiene la risposta alla nostra richiesta. Per impostazione predefinita, l'API di Wufoo restituisce i dati in un formato JSON. Nel caso in cui XML sia il tuo payload di scelta, dovrai aggiungere un parametro aggiuntivo alla stringa di richiesta. Il parametro aggiuntivo assume il formato di w_format = formato dove il formato può essere XML o JSON.
Il carico utile JSON restituito è in realtà piuttosto ampio e contiene numerose informazioni. Le parti rilevanti sono mostrate di seguito:
La parte principale è il risultato della richiesta insieme alle informazioni sul modulo richiesto incluso il nome del modulo, il titolo, l'URL, la descrizione e molte altre informazioni.
Il secondo punto di interesse sono i campi, il modulo contiene. Poiché la nostra forma era molto semplice con un solo campo, i nostri dati restituiti sono piuttosto brevi. In entrambi i casi, contiene informazioni sull'ID del campo, il suo titolo e varie altre informazioni tra cui se richiesto o meno, una descrizione per il campo e così via.
L'ultimo punto di interesse è la parte contenente le voci stesse. Ogni voce per il modulo selezionato viene restituita al chiamante contenente una miriade di informazioni tra cui l'id della voce, il valore dei campi, l'IP dell'utente, la data di creazione e così via.
Da questo punto, ciò che fai con i dati dipende completamente da te. È possibile analizzare i dati per creare un report personalizzato, ricercare le informazioni per dati specifici o semplicemente inserirli tutti in un foglio di calcolo o in un database. La tua immaginazione è il limite.
L'API di invio consente di inviare dati direttamente ai server Wufoo. Questa API è particolarmente utile se hai assolutamente bisogno di usare il tuo XHTML / CSS pur continuando a sfruttare tutte le funzionalità di back-end fornite da Wufoo. In questo modo ottieni il meglio da entrambi i mondi: puoi usare il tuo look personalizzato ma conservare tutta la potenza di Wufoo.
Il front-end non richiede alcuna differenza significativa. Ad esempio, ecco il markup, che ho usato per testare l'API di invio.
handler.php sembra così.
Ci sono un paio di cose da notare qui. Come con la query API, salviamo l'apikey e il formid in modo che possiamo usarlo in seguito. Catturiamo anche il valore della casella di testo POSTed in modo che possiamo inviarlo direttamente a Wufoo.
Si noti che abbiamo anche creato una variabile chiamata fieldid. Questo corrisponde direttamente all'ID API presente nella pagina chiave dell'API.
Dopo questo, tutto è come prima. Concateniamo la stringa e quindi usiamo cURL per passare i dati al server. Il server restituisce una risposta JSON che appare di seguito:
Questo è tutto. Nessun problema, nessun non senso. Pubblicare su Wufoo tramite il nostro codice personalizzato è così semplice.
Come funzionalità aggiuntiva, Wufoo ora ti consente di postare su altri servizi quando una nuova voce viene registrata nel sistema. Puoi fare un sacco di cose belle con questa fantastica nuova funzionalità, ma mi limiterò a come usare questa funzione.
Per accedere alla pagina delle notifiche, fare clic sul collegamento delle notifiche nella pagina dei moduli.
Questa pagina ti consente di ricevere notifiche tramite una serie di opzioni tra cui e-mail e SMS o post su servizi come Highrise, Twitter e molti altri quando viene inserita una nuova voce. Ma quelli non sono quelli che vedremo oggi. Quello che vedremo è il web hook: una tecnologia ingegnosa che consente agli sviluppatori di ricevere callback HTTP quando una voce viene inviata a Wufoo. Pensa ad una richiamata con steroidi.
Da parte di Wufoo tutto ciò che devi fare è inserire un URL a cui Wufoo invierà i dati POST ogni volta. Tutto quello di cui hai bisogno è impostare una pagina che cattura i dati POST. A scopo di test, puoi configurare un account su PostBin che ti evita il fastidio. Inserisci questo URL in Wufoo e sei pronto. Un esempio dei dati inviati da Wufoo al nostro URL di destinazione.
Molto elegante, se posso dirlo anch'io.
E abbiamo finito! Abbiamo cercato di creare un semplice modulo con Wufoo e poi come manipolare e recuperare a livello di codice i dati raccolti tramite l'API di facile utilizzo di Wufoo. Spero che questo ti sia stato utile e l'hai trovato interessante. Seguirò da vicino la sezione dei commenti; così carillon lì se avete domande.
Domande? Belle cose da dire? Critiche? Colpisci la sezione dei commenti e lasciami un commento. Buona programmazione!
Sapevi che puoi guadagnare fino a $ 600 per scrivere un tutorial PLUS e / o screencast per noi? Stiamo cercando tutorial dettagliati e ben scritti su HTML, CSS, PHP e JavaScript. Se sei dell'abilità, contatta Jeffrey a [email protected].
Si prega di notare che il risarcimento effettivo dipenderà dalla qualità del tutorial finale e screencast.
Accentsconagua