1
00:00:01,060 --> 00:00:04,450
‫Erzähler: Lassen Sie uns nach dieser Art von schwerem

2
00:00:04,450 --> 00:00:07,236
‫Theorievortrag jetzt http in Aktion sehen und

3
00:00:07,236 --> 00:00:09,640
‫einige Anfragen stellen und einen

4
00:00:09,640 --> 00:00:14,163
‫Blick auf die Antworten werfen, die wir mit unseren Browser-Entwicklertools erhalten haben.

5
00:00:15,670 --> 00:00:18,260
‫Also verwende ich Google Chrome als Browser und

6
00:00:18,260 --> 00:00:21,100
‫bin hier bei udemy. com.

7
00:00:21,100 --> 00:00:23,260
‫Also geh einfach zu udemy. com, und

8
00:00:23,260 --> 00:00:25,073
‫öffnen Sie dann Ihre Entwicklertools.

9
00:00:26,410 --> 00:00:31,150
‫Und ich verwende dafür die Befehlsoption J auf meinem Mac, unter Windows ist es

10
00:00:31,150 --> 00:00:33,870
‫wahrscheinlich Alt+Strg+J, oder klicken Sie einfach mit der

11
00:00:33,870 --> 00:00:36,100
‫rechten Maustaste irgendwo auf die Seite und

12
00:00:36,100 --> 00:00:38,260
‫klicken Sie dann auf Inspizieren,

13
00:00:38,260 --> 00:00:42,100
‫nur für den Fall, dass Sie mit den Entwicklungstools nicht vertraut sind.

14
00:00:42,100 --> 00:00:45,120
‫Dann gehen wir zum

15
00:00:45,120 --> 00:00:46,820
‫Netzwerk-Tab.

16
00:00:46,820 --> 00:00:49,000
‫Und dann hier auf Cache deaktivieren klicken.

17
00:00:49,000 --> 00:00:51,110
‫Das ist wichtig, da Sie sonst

18
00:00:51,110 --> 00:00:54,240
‫die Seite möglicherweise von Ihrem Computer laden, weil Sie

19
00:00:54,240 --> 00:00:57,310
‫in udemy waren. com vor.

20
00:00:57,310 --> 00:00:59,930
‫Okay, laden wir jetzt

21
00:00:59,930 --> 00:01:02,665
‫die Seite neu, damit wir

22
00:01:02,665 --> 00:01:06,640
‫die Netzwerkaktivität hier in diesem Netzwerk-Tab aufzeichnen.

23
00:01:06,640 --> 00:01:08,440
‫Laden Sie dies also neu.

24
00:01:08,440 --> 00:01:11,500
‫Und jetzt können wir hier alle Anfragen sehen,

25
00:01:11,500 --> 00:01:14,060
‫die auf der Seite passieren.

26
00:01:14,060 --> 00:01:18,130
‫Wie ich Ihnen bereits sagte, wird es viele Anfragen für alle Elemente

27
00:01:18,130 --> 00:01:20,743
‫geben, die sich auf der Seite befinden.

28
00:01:21,740 --> 00:01:23,200
‫Wenn wir hier nach

29
00:01:23,200 --> 00:01:26,820
‫oben gehen, ist das erste tatsächlich Udemy. com.

30
00:01:26,820 --> 00:01:29,870
‫Und wir können hier den Statuscode sehen, der 200 ist,

31
00:01:29,870 --> 00:01:31,550
‫wie ich in der letzten Vorlesung

32
00:01:31,550 --> 00:01:33,040
‫sagte, das bedeutet okay.

33
00:01:33,040 --> 00:01:35,030
‫Es hat also alles gepasst.

34
00:01:35,030 --> 00:01:37,130
‫Dann die Größe und die Zeit,

35
00:01:37,130 --> 00:01:39,500
‫die zum Herunterladen dieser Ressource benötigt wurde.

36
00:01:39,500 --> 00:01:43,000
‫Aber dann haben wir auch all diese anderen

37
00:01:43,000 --> 00:01:46,220
‫Ressourcen hier, wie die CSS-Dateien, die Sie hier

38
00:01:46,220 --> 00:01:48,770
‫sehen, einige Bilder, Java-Script-Dateien wie ich

39
00:01:50,550 --> 00:01:51,970
‫hier habe.

40
00:01:51,970 --> 00:01:54,830
‫Und all dies wurde tatsächlich vom Index,

41
00:01:54,830 --> 00:01:56,913
‫also von der Stammseite, initiiert.

42
00:01:57,820 --> 00:02:00,140
‫Okay, wir haben Udemy. com und dass

43
00:02:00,140 --> 00:02:02,430
‫man dann alle diese Assets anfordern wird.

44
00:02:02,430 --> 00:02:05,840
‫Das ist also der Index, also passiert es nicht im Initiator,

45
00:02:05,840 --> 00:02:10,840
‫und all dies hier wurde vom Haupt-Udemy angefordert. com.

46
00:02:11,340 --> 00:02:14,220
‫Wenn wir nun auf eine dieser Ressourcen klicken und wir

47
00:02:14,220 --> 00:02:16,730
‫tatsächlich udemy machen. com zuerst.

48
00:02:16,730 --> 00:02:19,490
‫Hier können wir einige weitere Informationen über die Anfrage und

49
00:02:19,490 --> 00:02:20,519
‫die Antwort erhalten.

50
00:02:20,519 --> 00:02:25,470
‫Also zuerst die Anfrage, die eigentlich ganz unten steht.

51
00:02:25,470 --> 00:02:29,040
‫Und Sie werden sehen, dass die Anfrage an udemy gerichtet wurde. com, wir haben

52
00:02:29,040 --> 00:02:31,100
‫eine Get-Anfrage gestellt und der

53
00:02:31,100 --> 00:02:33,920
‫Pfad war nur der Root-Pfad, genau wie

54
00:02:33,920 --> 00:02:37,450
‫ich es Ihnen im letzten Video erklärt habe, okay.

55
00:02:37,450 --> 00:02:39,440
‫Dann haben wir eine Menge

56
00:02:39,440 --> 00:02:41,430
‫Header, also bedeutet dies

57
00:02:41,430 --> 00:02:46,010
‫hier zum Beispiel, dass die Seite nur mit einem gzip komprimiert wurde.

58
00:02:46,010 --> 00:02:50,050
‫Hier unten haben Sie eine Kopfzeile zum Setzen einiger Cookies

59
00:02:50,050 --> 00:02:51,990
‫und eine Reihe anderer

60
00:02:51,990 --> 00:02:54,810
‫Kopfzeilen, über die wir später sprechen werden.

61
00:02:54,810 --> 00:02:56,970
‫Dies ist also die Anfrage,

62
00:02:56,970 --> 00:02:58,520
‫und dann

63
00:02:58,520 --> 00:03:02,840
‫enthält die Antwort auch einen Haufen all dieser Header, okay.

64
00:03:02,840 --> 00:03:06,700
‫So können wir sehen, wann die Antwort tatsächlich gesendet wurde.

65
00:03:06,700 --> 00:03:09,521
‫Wir können eine Reihe von

66
00:03:09,521 --> 00:03:11,820
‫Cookies und auch den

67
00:03:11,820 --> 00:03:15,120
‫Statuscode hier sehen, daher kommt der 200-Statuscode.

68
00:03:15,120 --> 00:03:18,330
‫Und wieder ein paar andere Header, über die

69
00:03:18,330 --> 00:03:21,100
‫wir etwas später sprechen werden, okay.

70
00:03:21,100 --> 00:03:22,260
‫Und das

71
00:03:22,260 --> 00:03:27,000
‫gleiche gilt natürlich auch für alle anderen heruntergeladenen Assets.

72
00:03:27,000 --> 00:03:30,180
‫Also die Antwort und die Anfrage hier unten.

73
00:03:30,180 --> 00:03:32,120
‫Und diesmal sehen wir tatsächlich, dass die Wurzel

74
00:03:32,120 --> 00:03:34,880
‫hier immer noch Udemie ist. com, also

75
00:03:34,880 --> 00:03:36,930
‫das, was sie hier

76
00:03:36,930 --> 00:03:39,980
‫die Autorität nennen, aber der Pfad

77
00:03:39,980 --> 00:03:41,875
‫ist dann all das,

78
00:03:41,875 --> 00:03:45,850
‫also dieser Ort hier, wo sich die CSS-Datei befindet.

79
00:03:45,850 --> 00:03:49,260
‫Und wenn wir jetzt tatsächlich irgendwo hier auf dieser

80
00:03:49,260 --> 00:03:52,080
‫Seite stöbern, sagen wir mal zu den

81
00:03:52,080 --> 00:03:55,253
‫Webentwicklungskursen, na dann mal sehen was hier passiert.

82
00:03:56,920 --> 00:03:59,580
‫Und hier haben wir

83
00:03:59,580 --> 00:04:02,810
‫diese Seite, die die Webentwicklungsressource ist, okay.

84
00:04:02,810 --> 00:04:05,690
‫Also im Grunde dieses Stück hier der URL.

85
00:04:05,690 --> 00:04:07,620
‫Denken Sie daran, dass dies aus dem

86
00:04:07,620 --> 00:04:09,520
‫letzten Video als Ressource bezeichnet wird.

87
00:04:09,520 --> 00:04:11,289
‫Wenn wir also darauf

88
00:04:11,289 --> 00:04:14,787
‫klicken, sehen wir das hier tatsächlich wieder, richtig.

89
00:04:17,210 --> 00:04:18,120
‫Also

90
00:04:18,120 --> 00:04:22,750
‫haben wir wieder udemy. com und /coursesdevelopment/webdevelopment.

91
00:04:22,750 --> 00:04:27,040
‫Das ist also der Pfad, zu dem die Anfrage geht.

92
00:04:27,040 --> 00:04:30,190
‫Hier auf der linken Seite können wir zB auch

93
00:04:30,190 --> 00:04:32,460
‫Vorschaubilder liken, dieses Logo hier.

94
00:04:32,460 --> 00:04:34,610
‫Wenn es sich um ein Bild handelt, können wir

95
00:04:35,580 --> 00:04:37,790
‫die Vorschau sehen, und wir können die Reaktion besser sehen.

96
00:04:37,790 --> 00:04:40,930
‫In diesem hier können wir zum

97
00:04:40,930 --> 00:04:44,830
‫Beispiel tatsächlich die HTML-Antwort sehen, die zurückgekommen ist.

98
00:04:44,830 --> 00:04:48,920
‫Anstatt also nur die Header zu sehen, wie wir es

99
00:04:48,920 --> 00:04:51,360
‫hier getan haben, können wir auch

100
00:04:51,360 --> 00:04:55,810
‫die Antwort sehen und eine schöne Übersicht über alle Cookies, die in

101
00:04:55,810 --> 00:04:57,500
‫dieser Anfrage gesetzt wurden.

102
00:04:57,500 --> 00:05:00,240
‫Wir haben jetzt noch nicht über Kekse

103
00:05:00,240 --> 00:05:03,230
‫gesprochen, aber das ist wieder etwas für später.

104
00:05:03,230 --> 00:05:06,790
‫Aber ich denke, es ist wichtig, dass Sie sich diesen

105
00:05:06,790 --> 00:05:10,120
‫Überblick verschaffen, wie Anfragen und Antworten tatsächlich unter einer

106
00:05:10,120 --> 00:05:11,090
‫Haube aussehen.

107
00:05:11,090 --> 00:05:13,610
‫Genau das war also das Ziel

108
00:05:13,610 --> 00:05:17,460
‫dieses Videos, ich hoffe, die Botschaft war klar und alles

109
00:05:17,460 --> 00:05:18,990
‫hat Sinn gemacht.

110
00:05:18,990 --> 00:05:20,220
‫Lassen Sie

111
00:05:20,220 --> 00:05:24,213
‫uns nun weitermachen und über die Back-End-Entwicklung im Allgemeinen sprechen.