1
00:00:02,170 --> 00:00:07,360
Andiamo a Redux, nelle azioni dei luoghi che ora ricevono anche un oggetto location e ricordiamo che questo

2
00:00:07,390 --> 00:00:09,490
è un oggetto che assomiglia a

3
00:00:09,490 --> 00:00:12,610
questo, quindi qui ha un tasto lat e un tasto lng.

4
00:00:12,610 --> 00:00:21,730
Quindi nelle azioni di luoghi, in luogo aggiuntivo, otterremo questo oggetto posizione e qui, ovviamente, voglio memorizzarlo nel mio database, voglio memorizzarlo

5
00:00:21,730 --> 00:00:23,920
nel mio negozio Redux e,

6
00:00:23,920 --> 00:00:25,460
come ho già

7
00:00:25,540 --> 00:00:28,930
detto, voglio ottenere questo umano indirizzo leggibile, giusto

8
00:00:28,960 --> 00:00:30,010
e per

9
00:00:30,100 --> 00:00:33,130
questo possiamo usare un'altra API di Google.

10
00:00:33,130 --> 00:00:37,610
Se cerchi l'API di geocodifica di Google Maps, troverai questo link

11
00:00:37,690 --> 00:00:43,780
qui e questa è un'API che ti consente di tradurre indirizzi in coordinate o coordinate in indirizzi.

12
00:00:44,590 --> 00:00:52,870
Le coordinate in indirizzi sono chiamate reverse look up, quindi possiamo fare clic sul geocoding inverso laggiù e questo ci dice

13
00:00:52,870 --> 00:00:58,230
come funziona e per questo, hai bisogno di una chiave API di Google

14
00:00:58,230 --> 00:00:59,530
Maps che

15
00:01:00,130 --> 00:01:04,960
ho impostato in precedenza in questo modulo e ora possiamo invia una

16
00:01:04,960 --> 00:01:10,780
richiesta alla fine a questo URL qui. Quindi possiamo semplicemente copiare l'intero URL e inviare una richiesta HTTP a questo.

17
00:01:10,810 --> 00:01:15,130
Ora questo non genererà un'immagine ma ci restituirà alcuni dati JSON, quindi invieremo

18
00:01:15,130 --> 00:01:22,460
quella richiesta con l'API di recupero come hai appreso nel modulo HTTP e lo farò semplicemente qui all'interno del mio gestore di

19
00:01:22,460 --> 00:01:27,340
azioni Aggiungi posto in questa funzione interiore. Ovviamente potresti anche esternalizzarlo in un file separato

20
00:01:27,460 --> 00:01:29,920
anche se vuoi mantenere questo file un po 'più magro.

21
00:01:29,980 --> 00:01:36,730
Quindi, possiamo usare l'API di recupero e inviare una richiesta a un URL che creerò qui come una stringa

22
00:01:36,730 --> 00:01:45,620
con segni di spunta posteriori in modo che l'iniezione di dati dinamici sia più semplice e lì, voglio copiare questo URL qui e incollarlo lì

23
00:01:45,620 --> 00:01:47,080
.

24
00:01:47,090 --> 00:01:47,930
Va bene

25
00:01:47,930 --> 00:01:56,310
che non funziona, quindi fammi afferrarlo manualmente e ora incollarlo lì e per la chiave API, ovviamente voglio usare

26
00:01:56,310 --> 00:01:58,520
questa variabile di ambiente che

27
00:01:58,520 --> 00:02:02,980
ho impostato in precedenza, quindi importa env dal file env.

28
00:02:02,990 --> 00:02:07,180
Potresti ricordare che questo è un file che contiene un oggetto che contiene la mia chiave API.

29
00:02:07,220 --> 00:02:13,040
Quindi ora posso sostituire questo qui, questa cosa chiave API qui, posso sostituirlo con questo env iniettato

30
00:02:13,460 --> 00:02:14,170
dinamicamente.

31
00:02:14,180 --> 00:02:20,870
il valore googleapikey e, naturalmente, anche la latitudine e la longitudine devono essere impostati dinamicamente.

32
00:02:20,870 --> 00:02:23,840
Assicurati di non eliminare la virgola tra questi due,

33
00:02:23,840 --> 00:02:30,460
ma ora qui puoi trovare la latitudine nella mia posizione che ovviamente ha un tasto lat nel modo in cui

34
00:02:30,460 --> 00:02:35,620
l'abbiamo impostato, puoi sempre vederlo qui in basso nella console e posizione come chiave anche per

35
00:02:35,620 --> 00:02:37,880
lng, quindi abbiamo queste due informazioni.

36
00:02:37,960 --> 00:02:39,990
Questo invia una richiesta get

37
00:02:40,000 --> 00:02:45,830
lì e va bene perché dobbiamo inviare una richiesta get e, naturalmente, possiamo quindi attendere

38
00:02:45,970 --> 00:02:50,700
la risposta e voglio archiviare la risposta in una costante per usarla.

39
00:02:50,760 --> 00:02:57,690
Successivamente possiamo verificare se questa risposta forse non va bene, dovrebbe essere a posto, ma se non lo è, potremmo lanciare un

40
00:02:57,690 --> 00:02:59,930
nuovo errore qui, qualcosa è andato storto

41
00:02:59,970 --> 00:03:01,630
e ovviamente puoi anche impostare

42
00:03:01,710 --> 00:03:05,850
la gestione degli errori nello stesso modo in cui hai imparato nel modulo

43
00:03:05,860 --> 00:03:06,890
HTTP ma

44
00:03:07,200 --> 00:03:09,640
qui suppongo che funzionerà e ora possiamo ottenere

45
00:03:09,840 --> 00:03:14,970
i dati di risposta in attesa di risposta. json che estrae il corpo della

46
00:03:14,980 --> 00:03:21,730
risposta e lo converte in Javascript normale e, per il momento, consolerò semplicemente i dati di risposta

47
00:03:21,730 --> 00:03:26,780
della console in modo da avere un'idea di cosa c'è dentro e

48
00:03:26,920 --> 00:03:28,340
ora proviamo semplicemente.

49
00:03:29,230 --> 00:03:34,960
Proviamo ad aggiungere un nuovo posto, ottenere la posizione dell'utente e fare clic su Salva luogo e

50
00:03:34,960 --> 00:03:37,350
possiamo farlo anche senza compilare il

51
00:03:37,370 --> 00:03:43,840
resto perché non abbiamo ottenuto la convalida qui su iOS. Quindi funziona, ovviamente ricevo un errore a causa della mancanza di dati, ma

52
00:03:43,840 --> 00:03:48,500
in realtà otteniamo anche il risultato della nostra richiesta HTTP e questo è questo oggetto super enorme lì,

53
00:03:48,560 --> 00:03:51,190
ora è davvero un oggetto grande come puoi dire.

54
00:03:51,760 --> 00:03:58,390
Ora alla fine quello che c'è dentro, in questo grande oggetto è questo qui l'oggetto, abbiamo una chiave di risultati lì che è un array e lì,

55
00:03:58,390 --> 00:04:02,310
abbiamo i diversi componenti di questo indirizzo ma se scorri un po 'verso il basso,

56
00:04:02,320 --> 00:04:09,220
noi vedi oltre a questo array, abbiamo anche questa chiave di indirizzo formattata. Quindi nel nostro oggetto risultato qui, non abbiamo solo

57
00:04:09,280 --> 00:04:13,930
quell'array ma abbiamo anche un indirizzo formattato ed è quello che sto

58
00:04:13,930 --> 00:04:14,690
cercando,

59
00:04:14,710 --> 00:04:21,360
questo è quello che voglio, voglio questo indirizzo formattato, quindi possiamo estrarlo dalla nostra risposta dati qui.

60
00:04:21,360 --> 00:04:26,510
Quindi, invece di registrarlo qui, controllo solo se forse non abbiamo una chiave dei risultati dei

61
00:04:26,520 --> 00:04:34,300
dati di risposta, se in qualche modo manca, in quel caso lancerò anche un errore ma se superiamo questo controllo, allora dovrei essere

62
00:04:34,300 --> 00:04:35,960
in grado di recuperarlo.

63
00:04:35,980 --> 00:04:43,210
Quindi qui posso derivare il mio indirizzo accedendo ai risultati dei dati di risposta e poi lì, il primo elemento pubblicitario, è

64
00:04:43,280 --> 00:04:43,790
lì

65
00:04:43,810 --> 00:04:49,540
che troviamo effettivamente l'indirizzo formattato e puoi semplicemente ispezionare questo oggetto che ti ho appena mostrato per

66
00:04:49,540 --> 00:04:52,090
avere un'idea per la sua struttura completa .

67
00:04:52,090 --> 00:04:58,570
Naturalmente i documenti ufficiali documentano anche l'aspetto di questi dati che si ottiene. Quindi ora abbiamo l'indirizzo formattato qui e quindi

68
00:04:58,570 --> 00:05:03,550
posso recuperarlo in questo modo e ora otteniamo tutto ciò di cui abbiamo bisogno.

69
00:05:04,420 --> 00:05:09,280
Quando ora archiviamo qualcosa nel database, posso usare il mio indirizzo che ho appena estratto, anziché l'indirizzo

70
00:05:09,280 --> 00:05:15,210
fittizio e qui per la latitudine, posso usare la posizione. lat, per la longitudine non

71
00:05:15,430 --> 00:05:23,100
sorprende che io possa usare la posizione. Per la spedizione dei dati, possiamo anche aggiungere ulteriori informazioni.

72
00:05:23,520 --> 00:05:32,100
Possiamo aggiungere l'indirizzo e forse una chiave coords che contiene un oggetto in cui abbiamo lat che è location. lat e lng che

73
00:05:32,100 --> 00:05:40,320
è la posizione. Adesso tutti i dati vengono trasmessi con il nostro oggetto azione e

74
00:05:40,320 --> 00:05:42,380
quindi raggiungono il nostro riduttore.

75
00:05:42,480 --> 00:05:47,940
Quindi nel riduttore, ora dobbiamo assicurarci di usare il nuovo indirizzo e i campi coords che otteniamo. Quindi nel riduttore di luoghi, vogliamo

76
00:05:47,940 --> 00:05:53,750
inizializzare il nostro posto qui con quei dati extra e per questo dobbiamo prima

77
00:05:53,770 --> 00:05:58,150
di tutto modificare il modello del luogo per aspettarci quei dati.

78
00:05:58,150 --> 00:06:04,990
Quindi qui, voglio ottenere un indirizzo e voglio ottenere una latitudine e una longitudine. Quindi possiamo quindi archiviare tutto ciò, archiviare

79
00:06:04,990 --> 00:06:05,530
l'indirizzo

80
00:06:05,530 --> 00:06:08,740
qui, memorizzare la latitudine e memorizzare

81
00:06:08,880 --> 00:06:17,460
la longitudine, con che il modello è preparato e con il modello preparato, per ottenere questi dati

82
00:06:17,460 --> 00:06:22,500
extra nel riduttore, dovremmo aggiungere questo quando aggiungi un posto.

83
00:06:22,500 --> 00:06:30,420
Quindi qui aggiungiamo come indirizzo l'azione. placeData. indirizzo perché è quello che ho appena aggiunto

84
00:06:30,420 --> 00:06:35,310
nelle azioni dei luoghi qui, questa chiave di indirizzo e possiamo anche ottenere le coordinate.

85
00:06:35,310 --> 00:06:40,860
Quindi, per la latitudine qui, passo azione. placeData. coordinate. lat e

86
00:06:40,860 --> 00:06:50,620
per la longitudine, passo azione. placeData. coordinate. lng. Con ciò, i posti vengono

87
00:06:50,620 --> 00:06:51,510
inizializzati qui.

88
00:06:51,520 --> 00:06:57,550
Ora quando li cariciamo dal database, quando impostiamo i nostri luoghi, dovremmo quindi inizializzare correttamente

89
00:06:57,550 --> 00:07:01,650
il nostro modello di luogo e prendere i dati già

90
00:07:02,020 --> 00:07:07,210
presenti nel database, quindi mantieni l'indirizzo, mantieni la latitudine e mantieni la longitudine,

91
00:07:07,240 --> 00:07:13,940
quindi questo è piuttosto semplice e quindi ora, speriamo di avere tutti i dati e utilizzarli tutti.

92
00:07:14,330 --> 00:07:16,340
Ora per vedere se funziona, dobbiamo

93
00:07:16,340 --> 00:07:21,760
lavorare sull'elemento del luogo che stiamo trasmettendo qui sulla pagina iniziale, possiamo vederlo su Android, in modo che

94
00:07:21,950 --> 00:07:23,800
possiamo mostrare anche l'indirizzo qui

95
00:07:24,080 --> 00:07:29,540
e dobbiamo anche lavorare sul luogo schermata dei dettagli. Quindi lavoriamo su questo in modo da poter vedere tutti

96
00:07:29,540 --> 00:07:30,680
i pezzi riuniti.