Va bene ragazzi.
Ora nell'ultima lezione abbiamo impostato le nostre richieste e risposte alle richieste get e alle richieste post sulla
rotta di casa.
E così facendo siamo in grado di caricare la nostra pagina di iscrizione con bootstrap abilitato e siamo in
grado di inviare questi dati ai nostri server utilizzando il parser del corpo.
Quindi ora è il momento di iniziare a incorporare la nostra API.
Quindi, se utilizziamo Google per l'API MailChimp, verremo indirizzati allo sviluppatore dot MailChimp dot com.
E questa è la documentazione per l'ultima versione 3 dell'API MailChimp. 0.
Quindi andremo avanti e fare clic su per iniziare con l'API MailChimp.
Ora, come si dice qui per utilizzare l'API, dobbiamo ottenere una chiave API per autenticarci con i loro server perché, in fin
dei conti, non si desidera che una persona a caso inizi ad aggiungere abbonati alla propria
mailing list.
E sicuramente non vuoi che qualcuno elimini tutta la tua mailing list inviando
richieste non autorizzate.
Quindi andiamo avanti e impostiamo la nostra chiave API.
Se non hai un account mailchimp, questo è un buon momento per crearne uno per registrarti per un account mailchimp.
Vai su MailChimp dot com e quindi fai clic su Iscriviti gratuitamente.
E qui puoi creare un nuovo account con MailChimp ed è completamente gratuito e non richiede dettagli
sulla carta di credito.
Il processo è abbastanza autoesplicativo ma vuoi scegliere il piano gratuito e dire loro che non
hai un elenco esistente di abbonati e-mail.
E infine puoi fare clic su Non adesso per trovare il percorso di marketing.
Ora, una volta terminato, vai avanti e accedi e poi otterremo la tua chiave API quindi
per fare questo fai clic sul nome del tuo account vai agli extra degli account e fai clic sulle chiavi API.
Ora una volta che sei qui puoi scorrere verso il basso e fare clic su Crea una chiave API e questo genererà una
nuova chiave API per te.
Quindi vuoi andare avanti e selezionare la chiave API da qui, quindi incollarla nella parte inferiore della
tua app.
E lo combatteremo per ora o ci torneremo un po 'più tardi.
Quindi ora che abbiamo utilizzato la nostra chiave API per interagire già con i server MailChimp attraverso la loro API.
Se torni allo sviluppatore slash dot di MailChimp e poi scorri verso il basso per fare
clic sul loro riferimento API, possiamo usarlo come nostro manuale di istruzioni per capire come aggiungere abbonati al nostro elenco.
La prima cosa da fare è andare alla sezione elenco e ci sono diverse cose che puoi fare
qui.
Puoi creare puoi leggere.
È possibile modificare ed è possibile eliminare.
Ora siamo interessati alle parti di creazione perché vogliamo abbonare alcuni membri dell'elenco.
Quindi farò clic qui e finirò con questo post siccità che mi consente di iscrivere in batch o annullare
l'iscrizione ai membri dell'elenco.
Ora il processo è esattamente lo stesso.
Se vuoi iscriverti in batch.
Molte persone o semplicemente abbonati a una sola persona tutto ciò che serve è un elenco I. D. e puoi fornire i membri
a cui desideri iscriverti nel corpo della tua richiesta.
Quindi, come possiamo fare tutto questo.
Bene, prima di tutto prendiamo la nostra lista I. D ..
Se torni a MailChimp dot com e presumi di aver già effettuato l'accesso, puoi semplicemente andare al pubblico e gestire
le impostazioni del pubblico e scorrere verso il basso per ottenere il tuo unico I. D ..
Questo è il tuo pubblico I. D. o noto anche come elenco I. D. e questo aiuterà MailChimp
a identificare l'elenco in cui vuoi inserire i tuoi iscritti.
Quindi andiamo avanti e copiarlo e incollarlo nella parte inferiore della nostra app G. S. e lo commenteremo
anche noi.
Ora che abbiamo la nostra chiave API e la nostra lista I. D. quindi siamo pronti per passare al
passaggio successivo, ovvero iniziare a inviare la nostra richiesta a MailChimp.
Torniamo allo sviluppatore di slash dot di MailChimp e facciamo clic su Inizia per vedere come
possiamo iniziare a interagire con l'API MailChimp.
Se scorri verso il basso su questa pagina puoi vedere che hanno una sezione sugli esempi di codice che di
solito è un bel modo di capire come lavorare con una particolare API.
Quindi qui hanno una richiesta di arricciatura che è in realtà qualcosa che viene fatta nel terminale ma
nel nostro caso implementeremo questo usando il nostro codice.
Dai un'occhiata a questa sezione di dati.
Questo è il tipo di dati che si aspetterebbero che vengano inviati al loro server.
Quindi se copio questo e lo incollo nel nostro codice, allora puoi vedere che si tratta essenzialmente di un flat
pack Jason giusto.
Quindi è tutto pieno di stringhe ed è delineato da queste parentesi graffe e due punti.
Quindi ciò che dovremmo fare è creare i nostri dati che vogliamo pubblicare come Jason.
Quindi prima creiamo l'oggetto javascript quindi creiamo una nuova variabile chiamata data e la
imposterò come un nuovo oggetto javascript.
Ora all'interno del nostro oggetto dati dobbiamo fornire a tutte le nostre coppie chiave-valore le chiavi che
MailChimp riconoscerà.
Quindi, se torniamo al riferimento API e andiamo al nostro elenco, riduciamo il pubblico in modo da poter vedere che i nostri dati
verranno inviati tramite i parametri del corpo utilizzando i membri di un codice chiave.
Ora, questo membro sembra essere un array di oggetti, ognuno dei quali rappresenta un membro a cui vogliamo iscriverci.
Quindi possiamo aggiungere fino a 500 nel nostro array per abbonarci contemporaneamente.
Ma se facciamo clic su Mostra proprietà puoi vedere che ciascuno di questi membri
può avere le proprie proprietà come l'indirizzo e-mail per l'abbonato lo stato e i campi di unione.
Questi sono i campi di unione che conterranno i loro nomi o cognomi.
Creiamo prima i membri coppia chiave-valore.
Quindi i nostri dati verranno chiamati membri e questo membro ricorda che deve essere una matrice di oggetti.
Quindi apriremo un altro insieme di oggetti e avremo un solo oggetto
nel nostro array perché abboneremo solo una persona alla volta.
Ora la chiave e-mail si chiama indirizzo e-mail.
E solo per impedirmi di fare un refuso, lo copierò e incollerò qui e il valore di questa
chiave sarà l'e-mail che abbiamo ricevuto dal corpo della richiesta di post.
Quindi mettiamo l'e-mail qui e poi il prossimo sarà questo stato.
Quindi copiamolo e incolliamolo di nuovo e puoi vedere che possono avere quattro possibili valori sottoscritti cancellati
cancellati o in sospeso e andremo per abbonati.
Quindi lo stato è uguale alle stringhe sottoscritte.
E poi il prossimo saranno i campi di unione e i campi di unione.
Nota come questo ora è un oggetto.
Quindi dobbiamo inserire i nostri campi di unione e quindi aprire una serie di parentesi graffe e puoi impostare i
nomi di questi campi di unione andando al tuo pubblico e poi andando alle impostazioni e andando ai campi del pubblico
e unendo i tag.
Quindi, se dai un'occhiata in questo elenco, la maggior parte dei contatti arriva per impostazione predefinita con un nome, cognome, compleanno e la
parola che si trova in questo campo è il campo di unione e, per impostazione predefinita, MailChimp lo imposta in modo che il nome sia
un nome L in maiuscolo.
Puoi cambiarlo o come consiglierei di mantenerlo lo stesso.
Quindi usiamo f name come primo tasto che conterrà il nome del modulo e poi l
name che conterrà il cognome del modulo.
Ora abbiamo il nostro oggetto dati completato ma questo è JavaScript e ciò di cui abbiamo bisogno è in realtà trasformarlo
in un flat pack Jason.
Quindi creerò una nuova variabile chiamata Jason data e imposterò questo su Jason dot string se
io e io passeremo i miei dati qui in modo da trasformarli in una stringa che è nel formato di
un Jason ora perché in realtà non cambierò mai nessuna di queste variabili.
Posso davvero cambiarle tutte in
costanti, quindi ora abbiamo i nostri dati Jason.
Questo è ciò che invieremo a MailChimp e siamo pronti per il prossimo passo che sarà fare
la nostra richiesta.
Ora ricorda in precedenza che abbiamo usato il modulo ATP e tutto ciò che abbiamo fatto è stato dire 80 G. P. S. punto viene e quindi
all'interno inseriamo una cella e quindi una funzione di richiamata.
Giusto.
Ma come puoi immaginare, ottiene richieste solo quando vogliamo dati da una risorsa esterna.
Ma nel nostro caso vogliamo effettivamente pubblicare dati sulla risorsa esterna.
Quindi, se torniamo alla documentazione del modulo H2 CPS, puoi vedere che oltre a un
punto CPS c'è anche una chiamata richiesta Dot.
E in questo caso oltre ad aggiungere una U. R. L. per fare la nostra richiesta possiamo anche specificare alcune opzioni.
Ora ci dice che queste opzioni accettano tutte le opzioni dal modulo di richiesta punti ATP.
Quindi facciamo clic su di esso e vediamo quali opzioni possiamo avere.
Quindi nelle nostre opzioni c'è qualcosa chiamato Metodo e questo ci consente di specificare il tipo di richiesta che
vogliamo fare.
Ad esempio get o, nel nostro caso, verrà postato tornando al nostro codice, andiamo avanti e creiamo una costante per
HP G. P. S. modulo e richiederlo.
Ora qui sotto, dove abbiamo i nostri dati Jason, ma all'interno del post del punto dell'app
creeremo la nostra richiesta.
Quindi diremo 80 G. P. S. punto richiesta e passeremo prima tu sei RL
e poi passeremo nelle nostre opzioni.
E finalmente avremo un callback che ci darà una risposta dal server MailChimp.
Quindi compiliamo ciascuno di questi campi.
Ora il tuo ruolo verrà dall'endpoint principale di MailChimp.
Possiamo scoprire quali sono autorizzati a utilizzare andando alla documentazione dell'API MailChimp.
Quindi nell'esempio di codice della sezione ci mostra che questa è la U. R. L. che stanno usando.
E in effetti fino a qui c'è l'endpoint dell'API MailChimp e poi abbiamo percorsi opzionali su cui possiamo
taggare e se volessimo iscrivere alcuni membri, pubblicheremmo per inoltrare gli elenchi di barre in avanti,
tagliare l'elenco I. D. che vogliamo prendere di mira.
Quindi copierò l'intero URL e lo incollerò nel mio sei tutto qui.
Inoltre, devo aggiungere un elenco I. D. perché in MailChimp potresti avere più
liste e devi dirgli in quale lista vuoi iscrivere i membri.
Ora ricorda prima avevo già salvato la lista I. D. del mio pubblico principale e ce l'ho davvero
qui.
Lo copierò e lo taggerò fino alla fine dell'U. R. L ..
Quindi c'è solo un'ultima cosa prima che abbiamo finito con l'U. R. L ..
Notate come qui dice U. S. e poi ha una X.
Devi sostituire quella X con il numero che hai nella chiave API dopo la parola U. S. MailChimp ha diversi server che
sono in esecuzione contemporaneamente perché sono una grande operazione.
E quando ti iscrivi vieni assegnato a caso a uno di loro.
E potrebbe essere ovunque da noi uno a noi 20.
Dai un'occhiata alla tua chiave API e vedi quale numero hai dopo la parola noi, quindi copia quel numero e
sostituisci la X con quel numero.
Quindi ora abbiamo finalmente completato.
Sei RL Il prossimo passo è creare alcune opzioni.
Quindi ho intenzione di chiamarlo opzioni e sarà un oggetto javascript ora l'opzione più importante
che devo specificare è il metodo.
Quindi specifica un metodo e impostalo per pubblicare.
Ora la prossima cosa che devo fare se voglio che questa richiesta di poster sia soddisfatta è
fornire una qualche forma di autenticazione.
Abbiamo già ottenuto la nostra chiave API in precedenza da MailChimp, ma ora dobbiamo pensare a come
la useremo.
Se torniamo indietro per iniziare e dare un'occhiata ai metodi di autenticazione, ci dice che
possiamo usare l'autenticazione HP di base e inserire qualsiasi stringa come nome utente e la nostra chiave API come password.
Ad esempio potrebbe sembrare qualcosa del genere.
Qualsiasi stringa di carbone sulla tua chiave API.
Ora nelle opzioni per la nostra funzione di richiesta ATP c'è qualcosa chiamato auth che ci permette di fare
questa forma di autenticazione di base.
Quindi è quello che aggiungeremo dopo.
Oltre alla chiave del metodo nelle nostre opzioni, aggiungeremo due punti di autenticazione e quindi specificheremo
una stringa.
Ora MailChimp ha detto che potremmo usare qualsiasi stringa come nome utente e quindi separare il nome utente
dalla password che sarà la chiave API con i due punti.
Quindi dovrebbe assomigliare a questo.
Non importa cosa scrivi qui finché hai qualcosa e poi hai i due punti
e poi incolli nella tua chiave API assicurandoti che la tua regione nella chiave API corrisponda alla regione nella tua
U. R. L ..
Quindi ora siamo finalmente pronti per fare la nostra richiesta HB e quando riceviamo una risposta controlleremo
quali dati ci hanno inviato.
Quindi vedremo iniziare una risposta proprio come abbiamo fatto prima.
Specificheremo che stiamo cercando tutti i dati che vengono
restituiti dal server MailChimp e quindi registreremo i nostri dati ma useremo il pass Jason per passarli prima.
Quindi ora alcuni di voi potrebbero chiedersi OK.
Quindi abbiamo fatto la nostra richiesta, ma nessun punto in questa richiesta o nella nostra U. R. L. o nelle nostre opzioni
abbiamo specificato cosa vogliamo inviare a MailChimp, ovvero i nostri dati Jason che provengono da qui e
includono l'indirizzo e-mail e il nome e cognome del nostro abbonato.
Quindi è un ottimo punto.
Al fine di inviare tali dati se diamo uno sguardo alla documentazione per il metodo di richiesta, dobbiamo
salvare la nostra richiesta in una costante.
E in seguito possiamo usare quella costante richiesta per inviare cose al server MailChimp chiamando
request.
Va bene, andiamo avanti e creiamo una nuova richiesta di codice costante perché non vogliamo entrare
in conflitto con il nostro req qui e quindi useremo questa richiesta e chiameremo il punto di richiesta giusto.
E dentro tutto bene passeremo i dati di Jason al server MailChimp e poi specificheremo che abbiamo
finito con la richiesta che chiamiamo punto richiesta.
E ora proviamolo.
Quindi facciamo clic su Salva sul nostro aggiornamento J. S. e controlliamo solo hyper per assicurarci che
non ci siano errori.
E ora andiamo al nostro host locale tremila e proviamo a registrarci.
Quindi inserirò il mio nome e poi userò semplicemente un'e-mail casuale, chiamiamola.
Non lo so.
4 cinque sei otto e-mail dot com e fare clic su Registrati.
A questo punto, se guardiamo all'interno del nostro terminale, vedremo ciò che ci viene restituito come i dati da MailChimp.
E sembra suggerire che è stato aggiunto un nuovo membro e non ci sono stati errori in questo processo.
Quindi ora se andiamo al nostro account MailChimp e andiamo al nostro pubblico dovresti essere lì per vedere
che dovresti avere un nuovo contatto.
E se fai clic su quel numero uno o due che potresti vedere lì,
dovresti vedere l'e-mail che abbiamo appena inserito il nome e il cognome e ora è stato aggiunto al nostro pubblico.
E se vuoi aggiungere un altro membro puoi andare sulla barra U RL e premere di nuovo Invio per riavviarlo e
aggiungere una nuova persona.
Ora, quando faccio clic su Registrami e torno al nostro pubblico e premo Aggiorna, dovresti vedere che ora abbiamo due voci
e puoi continuare ad aggiungere questo, ma il nostro sito Web ha ancora un numero di piccoli difetti.
Giusto.
Come quando clicchiamo su di me, mi si blocca, non fa nulla, non dà alcun
feedback all'utente se ha avuto successo o se ha fallito.
Quindi nella prossima lezione.
È esattamente quello che faremo.
Invieremo l'utente a una pagina di successo se tutto è andato bene.
E li invieremo a una pagina del problema se è andata male.
Quindi divertiti con la tua pagina web esistente.
E una volta che vai già alla lezione successiva.