Лекция 1 Основы web-технологий Стыценко Илья, Исаев Денис О чём курс? Зачем это нам? 2 Структура курса 8 лекций, 7 семинаров 15-17 баллов за семинар 0-49 — неуд 50-69 — удовл 70-89 — хор 90-100 — ОТЛИЧНО! 3 Структура курса 1. Пишем себе ТЗ на проект 2. Готовим окружение 3. Верстка клиентской части 4. Программирование бэкенда 5. В бой 4 Функционал проекта 1. Наличие авторизации 2. Наличие создаваемого пользователем контента 3. Комментарии 4. Пользовательские действия «в одно нажатие» (лайк, дизлайк, вроде того) 5. Проверка прав 5 Структура проекта HTML, CSS Frontend • Nginx • Gunicorn Backend • Python • Django DB • Mysql 6 Сетевые протоколы • Назначение разных протоколов • Инкапсуляция протоколов • Принципы работы DNS, IP, TCP • Синтаксис и возможности HTTP • HTTPS 7 Модель работы браузера Браузер HTTP WEB сервер DNS DNS 8 Сетевые протоколы 9 Инкапсуляция сетевых протоколов 10 Протоколы канального уровня 11 IP-адрес, подсети Частные 10.0.0.0/8 172.16.0.0/12 192.168.0.0/16 12 Типы IP-адресов • • • Публичные Частные (напр. 192.168.0.0 - 192.168.255.255) Localhost (127.0.0.1) • • IPv4 IPv6 13 IP 14 TCP 15 TCP Handshake 16 Сокеты, порты Клиент socket() connect() write() read() close() Сервер socket() bind() listen() accept() read() write() close() 17 Модель работы браузера Браузер HTTP WEB сервер DNS DNS 18 DNS 19 DNS дерево 20 DNS схема запроса 21 DNS, обратный запрос 22 URL hXps://track.mail.ru:80/blog/topic/11/?a=1&b=2#comment_id_67 1. 2. 3. 4. 5. 6. https – протокол track.mail.ru – хост 80 – порт /blog/topic/11/ - путь ?a=1&b=2 – строка запроса #comment_id_67 – якорь 23 Абсолютные и относительные URL http://some.com/p1/p2/&a=1&b=2#aaa • /path/ -> http://some.com/path/ • path/ -> http://some.com/p1/p2/path/ • ../path/ -> http://some.com/p1/path • ?c=3 -> http://some.com/p1/p2/?c=3 • #anchor -> http://some.com/p1/p2/?a=1&b=2#anchor 24 MIME text/html text/css text/javascript image/png video/mp4 application/json 25 HTTP 26 HTTP запрос GET /path/page.html?a=1&b=2 HTTP/1.1 Host: mydomain.com Connection: keep-alive Accept: text/html User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_4) Referer: http://mydomain.com/page0.html Accept-Encoding: gzip, deflate Accept-Language: ru-RU,ru Cookie: j4i3clrjqqbopkn1nucg1lg0; tncu_cu=1; tncu_any=1 If-None-Match: "2b544b-4cf7-2a98c2c0” If-Modified-Since: Tue, 20 Apr 2010 05:15:31 GMT 27 HTTP ответ HTTP/1.1 200 Ok Date: Wed, 23 Sep 2015 10:09:09 GMT Content-Type: text/html; charset=UTF-8 Expires: Wed, 23 Sep 2015 10:09:09 GMT Last-Modified: Wed, 23 Sep 2015 10:09:09 GMT Set-Cookie: yp=; Expires=Sun, 25-Sep-2005 10:09:09 GMT; Path=/ Set-Cookie: yp=; Expires=Sun, 25-Sep-2005 10:09:09 GMT; Domain=.www.yandex.ru; Path=/ Content-Encoding: gzip Content-Length: 12032 ……. 28 HTTP методы • GET • HEAD • POST • PUT 29 HTTP заголовки • • • • • • Host Date Referer Content-Length Content-Encoding User-Agent 30 HTTP коды ответа • 1xx - информационные • 2xx - успешное выполнение • 3xx - перенаправления • 4xx - ошибка на стороне клиента • 5xx - ошибка на стороне сервера 31 HTTP согласование содержимого Accept,Accept-Charset,Accept-Encoding,Accept-Languages,User-Agent Сервер Клиент Vary 32 HTTP управление соединением • Connection: close • Connection: keep-alive 33 HTTP кеширование, условный GET Expires: Mon, 18 Oct 2010 14:15:00 GMT Last-Modified If-Modified-Since ETag If-None-Match 304 Not Modified 34 HTTP Cookie Cookie: Сервер Клиент Set-Cookie: 35 HTTP перенаправления Клиент Сервер GET/HTTP/1.1 302Found Locamon:/page1/ GET/page1/HTTP/1.1 36 HTTP Range Клиент Сервер Accept-ranges:bytes Range:bytes=500-999 204Parmalcontent 37 HTTP Множественное содержимое Content-Type: multipart/form-data; boundary=Asrf456BGe4h Content-Length: (суммарный объём, включая дочерние заголовки) --Asrf456BGe4h Content-Disposition: form-data; name="DestAddress" (пустая строка) [email protected] --Asrf456BGe4h Content-Disposition: form-data; name="AttachedFile2"; filename="horror-photo-2.jpg" Content-Type: image/jpeg (пустая строка) (двоичное содержимое фотографии) 38 HTTPS, SSL, TLS 39 HTTPS сертификаты 40
Автор
1/--страниц