Share
Wufoo est une application Web qui vise à simplifier les formulaires. Les formulaires peuvent généralement être fastidieux. Vous devez écrire le code XHTML / CSS pour les éléments de formulaire, configurer le code d’arrière-plan pour capturer toutes les données, puis travailler à la génération de rapports utilisables. Wufoo simplifie tout ce processus, de la création du formulaire à son intégration dans votre site, en passant par un support thématique complet, en vue de la production de jolis rapports utilisables vous permettant d'analyser vos données..
Il fait même beaucoup de choses avancées, y compris des Web hooks et une API appropriée pour accéder aux données collectées. Aujourd'hui, nous allons voir comment créer un formulaire simple avec Wufoo, puis utiliser l'API pour accéder par programme aux données collectées et les modifier..
Tout d’abord, nous devons créer un formulaire pour pouvoir le manipuler. Inscrivez-vous pour un nouveau compte avec Wufoo et vous serez dirigé vers l'un des états d'application vierges les plus humoristiques de tous les temps:
Cliquez sur le bouton pour commencer à créer un nouveau formulaire et vous serez redirigé vers l'application de création de formulaire. L’interface est très intuitive avec un panneau contextuel à gauche et la section principale du formulaire à droite. Ajouter des éléments est aussi simple que de cliquer dessus ou de le faire glisser dans la section principale..
En cliquant sur l'élément créé, vous pouvez éditer tous les détails pertinents.
Puisque nous souhaitons que cela reste aussi simple que possible, un seul champ de texte contenant une adresse électronique suffit. Cliquez sur Enregistrer le formulaire et nous avons terminé. Nous avons créé notre premier formulaire avec zéro code et cela a pris 60 secondes..
Intégrer le formulaire créé dans notre site est incroyablement facile. Allez à la page des formulaires et cliquez sur le bouton code lien du formulaire nouvellement créé.
Wufoo vous permet de transmettre le formulaire à vos visiteurs de différentes manières, notamment une version JavaScript qui fonctionne dans un iframe, du code XHTML pour une page complète contenant les formulaires ou simplement un lien que vous pouvez partager avec vos amis..
L'API Wufoo vous permet de récupérer, de soumettre et de modifier par programme des données pertinentes pour votre compte en toute simplicité. Le jeu d’API comprend essentiellement deux API fixes stables et un autre sous test bêta. Nous allons regarder les parties stables aujourd'hui.
Notez que vous ne pourrez récupérer et soumettre des données que dans des formulaires existants. Si vous souhaitez créer des formulaires à la volée, y envoyer des données ou simplement créer de nouveaux champs via l'API, vous ne pouvez pas vous permettre. La version actuelle de l'API n'autorise pas cette fonctionnalité, mais la recherche dans un avenir proche avec de nombreuses autres fonctionnalités..
Mais d’abord, vous aurez besoin d’une clé API. Vous pouvez l'obtenir à partir du lien d'informations sur l'API dans la page où vous obtenez vos extraits de code..
Prenez note de votre clé d’API et de l’ID du champ auquel vous souhaitez accéder et / ou modifier. Nous allons l'utiliser bientôt.
L'API de requête vous permet de récupérer les informations que vous avez collectées dans vos formulaires en contournant le site Web Wufoo. Si vous souhaitez obtenir toutes les données brutes puis créer un rapport personnalisé, c’est la voie à suivre..
La première chose à noter est l'URL que vous devez demander pour accéder aux bonnes données. L'URL ressemble à ceci:
http://username.wufoo.com/api/query/
Remplacer Nom d'utilisateur avec votre nom d'utilisateur et vous êtes prêt à partir. le question certaines parties leur permettent de savoir si vous souhaitez récupérer des informations sur les serveurs Wufoo.
CURL est le moyen le plus simple pour nous d’envoyer des données au serveur. Si vous êtes un peu nouveau et que vous vous sentez perdu, je vous recommande vivement de lire cet article sur cURL ici chez Nettuts.+.
Passons en revue le code partie par partie. Nous avons d’abord besoin de la clé API dont nous avons pris note précédemment. Nous avons également besoin du nom du formulaire à partir duquel vous souhaitez récupérer les données. Ces deux paramètres, ainsi que la version de l'API que nous utilisons, deux dans notre cas, sont les paramètres minimaux nécessaires à la réussite d'une demande..
Nous concaténons tous les éléments requis sous forme de paires clé / valeur et les stockons pour une utilisation ultérieure..
Ensuite, nous passons l'URL correcte comme indiqué ci-dessus avec la chaîne de requête que nous avons créée ci-dessus. Nous stockons également la réponse à une variable afin de pouvoir l'utiliser.
$ resp détient la réponse à notre demande. Par défaut, l'API Wufoo renvoie les données au format JSON. Si XML est la charge utile de votre choix, vous devez ajouter un paramètre supplémentaire à la chaîne de demande. Le paramètre supplémentaire prend le format de w_format = format où le format peut être XML ou JSON.
La charge JSON renvoyée est en fait assez grande et contient de nombreuses informations. Les parties pertinentes sont indiquées ci-dessous:
La partie principale est le résultat de la demande ainsi que des informations sur le formulaire demandé, y compris le nom du formulaire, son titre, son URL, sa description et de nombreuses autres informations..
Le deuxième point d’intérêt concerne les champs que contient le formulaire. Comme notre formulaire était très simple avec un seul champ, nos données renvoyées sont assez courtes. Quoi qu'il en soit, il contient des informations sur l'ID du champ, son titre et diverses autres informations, notamment s'il est obligatoire ou non, une description du champ, etc..
Le dernier point d’intérêt est la partie contenant les entrées elles-mêmes. Chaque entrée du formulaire sélectionné est renvoyée à l'appelant et contient une myriade d'informations, notamment l'identifiant de l'entrée, la valeur des champs, l'adresse IP de l'utilisateur, la date de création, etc..
À partir de ce moment, ce que vous faites avec les données est entièrement à vous. Vous pouvez analyser les données pour créer un bon rapport personnalisé, rechercher des données spécifiques dans les informations ou simplement les saisir dans une feuille de calcul ou une base de données. La limite, c'est votre imagination.
L'API de soumission vous permet de soumettre des données directement aux serveurs Wufoo. Cette API est particulièrement utile si vous devez absolument utiliser votre propre fichier XHTML / CSS tout en exploitant toutes les fonctionnalités d’arrière-plan fournies par Wufoo. De cette façon, vous obtenez le meilleur des deux mondes: vous pouvez utiliser votre propre look personnalisé tout en conservant toute la puissance de Wufoo..
Le front-end n'exige aucune différence significative. À titre d'exemple, voici le balisage que j'ai utilisé pour tester l'API de soumission.
handler.php ressemble tellement.
Il y a plusieurs choses à noter ici. Comme avec l'API de requête, nous sauvegardons l'apikey et le formidable pour pouvoir l'utiliser plus tard. Nous capturons également la valeur de la zone de texte POSTed afin de pouvoir l'envoyer nous-mêmes à Wufoo..
Notez que nous avons également créé une variable appelée champ id. Cela correspond directement à l'ID de l'API présent dans la page de clés de l'API..
Après cela, tout est comme avant. Nous concaténons la chaîne puis utilisons cURL pour transmettre les données au serveur. Le serveur renvoie une réponse JSON qui ressemble à celle ci-dessous:
C'est tout. Pas de soucis, pas de non-sens. Publier sur Wufoo avec notre code personnalisé est aussi simple que cela..
En tant que fonctionnalité supplémentaire, Wufoo vous permet désormais de publier dans d'autres services lorsqu'une nouvelle entrée est connectée au système. Vous pouvez faire beaucoup de choses astucieuses avec cette nouvelle fonctionnalité géniale, mais je vais juste rester sur la façon d'utiliser cette fonctionnalité.
Pour accéder à la page des notifications, cliquez sur le lien notifications sur la page des formulaires..
Cette page vous permet de choisir de recevoir une notification via un certain nombre d'options, notamment des e-mails et des SMS, ou d'envoyer des messages à des services tels que Highrise, Twitter et bien plus encore lorsqu'une nouvelle entrée est publiée. Mais ce ne sont pas ceux que nous allons examiner aujourd'hui. Nous allons examiner les Web hooks, une technologie astucieuse qui permet aux développeurs de recevoir des rappels HTTP lorsqu'une entrée est soumise à Wufoo. Pensez-y comme un rappel sur les stéroïdes.
Du côté de Wufoo, il vous suffit de saisir une URL sur laquelle Wufoo POST traitera les données à chaque fois. Tout ce que vous avez besoin de votre côté pour créer une page qui capture les données POSTed. À des fins de test, vous pouvez créer un compte sur PostBin, ce qui vous évite les tracas. Entrez cette URL dans Wufoo et vous êtes tous ensemble. Un exemple des données publiées par Wufoo sur notre URL cible.
Très chouette, si je puis me le dire.
Et nous avons fini! Nous avons envisagé de créer un formulaire simple avec Wufoo, puis de manipuler et de récupérer par programme les données que nous avons collectées via l’API facile à utiliser de Wufoo. J'espère que cela vous a été utile et que vous l'avez trouvé intéressant. Je surveillerai attentivement la section des commentaires. alors carillon là-bas si vous avez des questions.
Des questions? De belles choses à dire? Des reproches? Hit la section des commentaires et laissez-moi un commentaire. Bonne codage!
Saviez-vous que vous pouvez gagner jusqu'à 600 USD en écrivant un tutoriel et / ou un screencast PLUS pour nous?? Nous recherchons des didacticiels détaillés et bien écrits sur HTML, CSS, PHP et JavaScript. Si vous en avez la possibilité, veuillez contacter Jeffrey à l'adresse [email protected]..
Veuillez noter que la rémunération réelle dépendra de la qualité du didacticiel final et du screencast..
Accentsconagua