1
00:00:02,170 --> 00:00:07,360
Przejdźmy do Redux, do akcji miejsc, które teraz również otrzymują obiekt lokalizacji i pamiętajmy, że

2
00:00:07,390 --> 00:00:09,490
jest to obiekt, który wygląda

3
00:00:09,490 --> 00:00:12,610
tak, więc ma tutaj klucz do lat i lng.

4
00:00:12,610 --> 00:00:21,730
Więc w miejscach akcji, dodaj miejsce, otrzymamy ten obiekt lokalizacji i tutaj, oczywiście, chcę go zapisać w mojej bazie danych, chcę

5
00:00:21,730 --> 00:00:23,920
go przechowywać w moim sklepie

6
00:00:23,920 --> 00:00:25,460
Redux i jak

7
00:00:25,540 --> 00:00:28,930
wspomniałem, chcę dostać tego człowieka czytelny adres, właściwie

8
00:00:28,960 --> 00:00:30,010
i

9
00:00:30,100 --> 00:00:33,130
do tego możemy użyć innego Google API.

10
00:00:33,130 --> 00:00:37,610
Jeśli szukasz interfejsu do geokodowania API Map Google, znajdziesz ten link

11
00:00:37,690 --> 00:00:43,780
tutaj, a jest to interfejs API, który pozwala ci tłumaczyć adresy na współrzędne lub współrzędne na adresy.

12
00:00:44,590 --> 00:00:52,870
Współrzędne w adresach nazywane są wyszukiwaniem wstecznym, więc możemy kliknąć tam odwrotne geokodowanie, a to mówi nam, jak

13
00:00:52,870 --> 00:00:58,230
to działa, a do tego potrzebny jest klucz API Map Google,

14
00:00:58,230 --> 00:00:59,530
który skonfigurowałem

15
00:01:00,130 --> 00:01:04,960
wcześniej w tym module i teraz możemy wyślij prośbę na

16
00:01:04,960 --> 00:01:10,780
koniec do tego adresu URL tutaj. Możemy więc skopiować cały adres URL i wysłać do niego żądanie HTTP.

17
00:01:10,810 --> 00:01:15,130
Teraz nie wygeneruje to obrazu, ale zwróci nam trochę danych JSON, więc wyślemy

18
00:01:15,130 --> 00:01:22,460
to żądanie z interfejsem API pobierania, jak się tego nauczyłeś w module HTTP, a ja po prostu zrobię to tutaj w mojej

19
00:01:22,460 --> 00:01:27,340
procedurze dodawania akcji w ta wewnętrzna funkcja. Oczywiście możesz go również zlecić na zewnątrz w

20
00:01:27,460 --> 00:01:29,920
osobnym pliku, jeśli chcesz zachować ten plik nieco szczuplejszy.

21
00:01:29,980 --> 00:01:36,730
Tak więc możemy użyć interfejsu API pobierania i wysłać zapytanie na adres URL, który utworzę tutaj jako

22
00:01:36,730 --> 00:01:45,620
ciąg znaków z tykającymi znakami wstecznymi, aby łatwiej było wstrzykiwać dane dynamiczne i tam chcę skopiować ten adres URL i wkleić go tam

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

24
00:01:47,090 --> 00:01:47,930
Okej, to

25
00:01:47,930 --> 00:01:56,310
nie działa, więc pozwól mi ręcznie go pobrać, a teraz wkleić tam i dla klucza API, oczywiście

26
00:01:56,310 --> 00:01:58,520
chcę użyć tej zmiennej środowiskowej,

27
00:01:58,520 --> 00:02:02,980
którą wcześniej skonfigurowałem, więc zaimportuj env z pliku env.

28
00:02:02,990 --> 00:02:07,180
Być może pamiętasz, że jest to plik zawierający obiekt, który przechowuje mój klucz API.

29
00:02:07,220 --> 00:02:14,170
Więc teraz mogę zastąpić to tutaj, kluczową rzeczą API tutaj, mogę zastąpić to dynamicznie wstrzykiwaną env.

30
00:02:14,180 --> 00:02:20,870
wartość googleapikey i oczywiście szerokość i długość geograficzna również muszą być ustawiane dynamicznie.

31
00:02:20,870 --> 00:02:23,840
Upewnij się, że nie usuwasz przecinku między tymi

32
00:02:23,840 --> 00:02:30,460
dwoma, ale teraz w mojej lokalizacji można znaleźć szerokość geograficzną, która oczywiście ma klucz Lat w sposobie, w jaki

33
00:02:30,460 --> 00:02:35,620
ją konfigurujemy, zawsze możesz zobaczyć to tutaj, na dole w konsoli i lokalizacja jako klucz

34
00:02:35,620 --> 00:02:37,880
lng, więc mamy te dwie informacje.

35
00:02:37,960 --> 00:02:39,990
To wysyła żądanie get i

36
00:02:40,000 --> 00:02:45,830
jest to w porządku, ponieważ musimy wysłać żądanie get i oczywiście możemy zatem poczekać na

37
00:02:45,970 --> 00:02:50,700
odpowiedź i chcę przechowywać odpowiedź w sposób ciągły, aby z niej skorzystać.

38
00:02:50,760 --> 00:02:57,690
Następnie możemy sprawdzić, czy ta odpowiedź może nie być w porządku, powinna być w porządku, ale jeśli nie, możemy tu

39
00:02:57,690 --> 00:02:59,930
rzucić nowy błąd, coś poszło nie

40
00:02:59,970 --> 00:03:01,630
tak i oczywiście można również

41
00:03:01,710 --> 00:03:05,850
skonfigurować obsługę błędów w taki sam sposób, jak się nauczyłeś w module

42
00:03:05,860 --> 00:03:06,890
HTTP, ale

43
00:03:07,200 --> 00:03:09,640
tutaj zakładam, że to zadziała i teraz

44
00:03:09,840 --> 00:03:14,970
możemy uzyskać dane odpowiedzi, czekając na odpowiedź. json, który wyodrębnia treść odpowiedzi

45
00:03:14,980 --> 00:03:21,730
i konwertuje ją do normalnego Javascript, i na razie po prostu konsoluję te dane

46
00:03:21,730 --> 00:03:26,780
odpowiedzi, abyśmy mogli zorientować się, co tam jest, a teraz po

47
00:03:26,920 --> 00:03:28,340
prostu spróbujmy.

48
00:03:29,230 --> 00:03:34,960
Spróbujmy dodać nowe miejsce, uzyskać lokalizację użytkownika i kliknąć zapisz miejsce, a my możemy to

49
00:03:34,960 --> 00:03:37,350
zrobić nawet bez wypełniania reszty,

50
00:03:37,370 --> 00:03:43,840
ponieważ nie otrzymaliśmy tutaj żadnej weryfikacji na iOS. Więc to działa, oczywiście otrzymuję błąd z powodu brakujących danych,

51
00:03:43,840 --> 00:03:48,500
ale tak naprawdę otrzymujemy wynik naszego żądania HTTP i to jest ten super ogromny obiekt, teraz

52
00:03:48,560 --> 00:03:51,190
jest to naprawdę duży obiekt, jak można powiedzieć.

53
00:03:51,760 --> 00:03:58,390
Teraz na końcu, co tam jest, w tym dużym obiekcie jest to obiekt tutaj, mamy tutaj klucz wyników, który jest tablicą

54
00:03:58,390 --> 00:04:02,310
i mamy różne składniki tego adresu, ale jeśli przewiniesz trochę w dół,

55
00:04:02,320 --> 00:04:09,220
my oprócz tej tablicy mamy również ten sformatowany klucz adresu. Więc w naszym obiekcie wynikowym nie mamy tylko

56
00:04:09,280 --> 00:04:13,930
tej tablicy, ale mamy również sformatowany adres i właśnie tego

57
00:04:13,930 --> 00:04:14,690
szukam,

58
00:04:14,710 --> 00:04:21,360
tego właśnie chcę, chcę ten sformatowany adres, abyśmy mogli wyodrębnić go z naszej odpowiedzi dane tutaj.

59
00:04:21,360 --> 00:04:26,510
Zamiast rejestrować go tutaj, po prostu sprawdzam, czy może nie mamy klucza wyników danych

60
00:04:26,520 --> 00:04:34,300
odpowiedzi, jeśli go w jakiś sposób brakuje, w tym przypadku również wyrzucę błąd, ale jeśli przejdziemy przez tę kontrolę, powinienem być

61
00:04:34,300 --> 00:04:35,960
w stanie go odzyskać.

62
00:04:35,980 --> 00:04:43,210
Więc tutaj mogę uzyskać mój adres, uzyskując dostęp do wyników danych odpowiedzi, a następnie pierwszy element wiersza, gdzie właśnie

63
00:04:43,280 --> 00:04:43,790
znajdujemy

64
00:04:43,810 --> 00:04:49,540
sformatowany adres i możesz po prostu sprawdzić ten obiekt, który właśnie pokazałem, aby uzyskać

65
00:04:49,540 --> 00:04:52,090
pomysł na jego pełną strukturę .

66
00:04:52,090 --> 00:04:58,570
Oczywiście oficjalne dokumenty dokumentują również, jak wyglądają te dane, które otrzymujesz. Mamy teraz sformatowany adres i dlatego mogę

67
00:04:58,570 --> 00:05:03,550
go pobrać w ten sposób, a teraz otrzymujemy wszystko, czego potrzebujemy.

68
00:05:04,420 --> 00:05:09,280
Kiedy teraz przechowujemy coś w bazie danych, mogę użyć adresu, który właśnie wyodrębniłem, zamiast adresu

69
00:05:09,280 --> 00:05:15,210
zastępczego, a tutaj dla szerokości geograficznej mogę użyć lokalizacji. lat, nic dziwnego, że

70
00:05:15,430 --> 00:05:23,100
na długość geograficzną mogę użyć lokalizacji. Jeśli chodzi o wysyłanie danych, możemy również dodać dodatkowe informacje.

71
00:05:23,520 --> 00:05:32,100
Możemy dodać adres i może klucz coords, który przechowuje obiekt, w którym mamy łat, czyli lokalizację. lat i lng,

72
00:05:32,100 --> 00:05:40,320
czyli lokalizacja. lng i teraz wszystkie te dane są przekazywane wraz z naszym obiektem akcji

73
00:05:40,320 --> 00:05:42,380
i dlatego docierają do naszego reduktora.

74
00:05:42,480 --> 00:05:47,940
Dlatego w reduktorze musimy teraz upewnić się, że używamy nowego adresu i pól współrzędnych, które otrzymujemy. Dlatego w reduktorze miejsc

75
00:05:47,940 --> 00:05:53,750
chcemy zainicjować nasze miejsce tutaj tymi dodatkowymi danymi i przede wszystkim

76
00:05:53,770 --> 00:05:58,150
musimy dostosować model miejsca, aby oczekiwać tych danych.

77
00:05:58,150 --> 00:06:04,990
Więc tutaj chcę uzyskać adres i chcę uzyskać szerokość i długość geograficzną. Możemy więc przechowywać to wszystko,

78
00:06:04,990 --> 00:06:08,740
przechowywać adres tutaj, przechowywać szerokość i długość

79
00:06:08,880 --> 00:06:17,460
geograficzną, dzięki czemu model jest przygotowany, a model przygotowany, aby odzyskać te dodatkowe dane z

80
00:06:17,460 --> 00:06:22,500
powrotem do reduktora, powinniśmy to dodać, gdy dodaj miejsce.

81
00:06:22,500 --> 00:06:30,420
Więc tutaj dodajemy jako adres akcję. placeData. adres, ponieważ to właśnie dodałem

82
00:06:30,420 --> 00:06:35,310
tutaj do akcji miejsc, ten klucz adresu i możemy również uzyskać współrzędne.

83
00:06:35,310 --> 00:06:40,860
Więc dla szerokości geograficznej tutaj mija akcja. placeData. coords. lat i

84
00:06:40,860 --> 00:06:50,620
na długości geograficznej, mijam akcję. placeData. coords. lng. Dzięki temu miejsca są inicjowane

85
00:06:50,620 --> 00:06:51,510
tutaj.

86
00:06:51,520 --> 00:06:57,550
Teraz, kiedy ładujemy je z bazy danych, kiedy ustawiamy nasze miejsca, powinniśmy również poprawnie

87
00:06:57,550 --> 00:07:01,650
zainicjować nasz model miejsca i pobrać dane, które już

88
00:07:02,020 --> 00:07:07,210
są w bazie danych, więc zachowaj adres, zachowaj szerokość i długość geograficzną,

89
00:07:07,240 --> 00:07:13,940
więc to całkiem proste i dlatego mamy nadzieję, że mamy wszystkie dane i wykorzystujemy wszystkie dane.

90
00:07:14,330 --> 00:07:16,340
Teraz, aby zobaczyć, czy to działa,

91
00:07:16,340 --> 00:07:21,760
musimy popracować nad elementem miejsca, który wyświetlamy tutaj na stronie początkowej, możemy zobaczyć go na Androidzie, więc

92
00:07:21,950 --> 00:07:23,800
może też tutaj pokazamy adres

93
00:07:24,080 --> 00:07:29,540
i musimy też popracować nad miejscem ekran szczegółów. Pracujmy nad tym, abyśmy mogli zobaczyć, jak wszystkie

94
00:07:29,540 --> 00:07:30,680
elementy się łączą.