Основы Web-технологий Павел Храмцов paul@kiae. su 2/17/2018 1
WWW: История вопроса HTML: История развития гипертекста 1945. Ванневар Буш. Memex 1965. Тед Нельсон. "Гипертекст" 1968. Дуглас Енжильбард. Мышь + гипертекстовый интерфейс 1975. ZOG/KMS ---> Norton Commander 1987. HYPERTEXT`87 1989. World Wide Web: Proposal for Hyper. Text Project (Tim Berners-Lee) 2/17/2018 2
WWW: История вопроса История развития Web – Технологий HTTP (1990) => Архитектура "Клиент-сервер" HTML (1990) URL (1990 -> URI) HTML FORMS + CGI (1993 Mosaic -> Mozilla) HTML + Java. Script (1995 Netscape) IE (1995) -> ASP, CSS, Channels (XML)… Java (1995) -> Applets, Servlets, JSP, …. . . XML, XSL (XSLT), Ajax … 2/17/2018 3
Обмен данными в рамках WWW Клиент (мультипротокольный) FTP - сервер HTTP - Сервер HTTP HTML URL (URI) CSS Java. Script Java Plug-ins 2/17/2018 CGI SSI PHP ASP JSP API Perl Java 4
WWW: HTML Важным моментом, повлиявшим на судьбу HTML, стало то, что в качестве основы был выбран обычный текстовый файл. Выбор был сделан под влиянием следующих факторов: • • такой файл можно создать в любом текстовом редакторе на любой аппаратной платформе в среде какой угодно операционной системы; к моменту разработки HTML существовал американский стандарт для разработки сетевых информационных систем — Z 39. 50, в котором в качестве единицы хранения указывался простой текстовый файл в кодировке LATIN 1, что соответствует US ASCII. Таким образом, гипертекстовая база данных в концепции WWW — это набор текстовых файлов, размеченных на языке HTML, который определяет форму представления информации (разметка) и структуру связей между этими файлами и другими информационными ресурсами (гипертекстовые ссылки). Гипертекстовые ссылки, устанавливающие связи между текстовыми документами, постепенно стали объединять самые различные информационные ресурсы, в том числе звук и видео; в результате возникло новое понятие — гипермедиа. 2/17/2018 5
WWW: URI Universal Resource Identifier – универсальный дентификатор. URI определяет способ записи (кодирования) адресов различных информационных ресурсов при обращении к ним из страниц WWW. Место применения URI – • гипертекстовые ссылки, которые записываются в тагах <A HREF=URI> и <LINK HREF=URI>; • встраиваемые графические объекты также адресуются по спецификации URI в тагах <IMG SRC=URI> и <FIG SRC=URI>. 2/17/2018 6
WWW: URI В основу URI были заложены следующие принципы: • Расширяемость - новые адресные схемы должны были легко вписываться в существующий синтаксис URI. • Полнота - по возможности, любая из существовавших схем должна была описываться посредством URI. • Читаемость - адрес должен был быть легко читаем пользователем, что вообще характерно для технологии WWW документы вместе с ссылками могут разрабатываться в обычном текстовом редакторе. 2/17/2018 7
WWW: Схемы адресации ресурсов Internet Схема HTTP. http: //polyn. net. kiae. su/polyn/manifest. html http: //144. 206. 160. 40/risk. htm http: //144. 206. 130. 137: 8080/altai/index. htm http: //polyn. net. kiae. su/altai/volume 4. html#first http: //polyn. net. kiae. su/isindex. html? keyword 1+keyword 2 http: //polyn. net. kiae. su/isindex. html? keyword 1%20 keyword 2 http: //polyn. net. kiae. su/isindex. html? field 1=value 1&field 2=value Схема FTP: ftp: //nobody: password@polyn. net. kiae. su/users/local/pub 2/17/2018 8
WWW: Схемы адресации ресурсов Internet Схема Gopher: gopher: //gopher. kiae. su: 70: /7/kuku (поиск по слову “kuku”) Схема MAILTO: mailto: paul@quest. polyn. kiae. su Схема NEWS: news: comp. infosystems. gopher (список) news: 086@comp. infosystems. gopher (текст статьи) Схема NNTP nntp: comp. infosystems. gopher/086 2/17/2018 9
WWW: Схемы адресации ресурсов Internet Схема TELNET : telnet: //guest: password@apollo. polyn. kiae. su Схема WAIS : wais: //wais. think. com/wais? guide wais: //wais. think. com/wais/wtype/039=/kuku. txt Схема FILE : file: ///C|/text/html/index. htm 2/17/2018 10
WWW: Схемы адресации ресурсов Internet 1. Универсальный идентификатор ресурса был придуман для обеспечения однотипности идентификации информационных ресурсов Интернета. 2. Его реализации отличаются друг от друга способом реализации и набором дейтсвий, которые выполняет прикладная программа при обработке идентификатора. 3. Идентификатор позволяет описать не только существующие информационные ресурсы Интернета и технологии доступа к ним, но и возможные будущие информационные ресурсы, построенные на принципах, отличных от современных технологий. 2/17/2018 11
WWW: Hypet. Text Transfer Protocol Принцип работы: • HTTP – это протокол, реализующий схему «клиент-сервер» • Обмен данными между клиентом и сервером называется транзакцией • Транзакция состоит из запроса клиента и ответа сервера • Каждый запрос(ответ) состоят из: строки запроса(ответа), раздела заголовка, тела. 2/17/2018 12
Принцип работы: WWW: Hypet. Text Transfer Protocol • Клиент инициирует транзакцию, обращаясь на 80 -ый порт TCP. • Посылает команду, которая называется методом, адрес документа и версию протокола: GET /index. html HTTP/1. 1 3. Со следующей строки запроса начинается заголовок запроса: User-Agent: Mozilla Accept: image/gif Host: www. kuku. ru 4. Далее следует пустая строка, которая отделяет заголовок от тела 2/17/2018 13
WWW: Hypet. Text Transfer Protocol Принцип работы: • Сервер отвечает строкой состояния: HTTP/1. 1 200 OK 2. Далее со следующей строки следует заголовок Date: Thu, 27 Mar 2008 11: 56: 04 GMT Server: Apache/2. 2. 4 (Unix) PHP/4. 4. 6 mod_ssl/2. 2. 4 Open. SSL/0. 9. 8 d Content-Length: 161 Connection: close Content-Type: text/html; charset=windows-1251 3. Через пустую строку посылаются данные в теле ответа 2/17/2018 14
WWW: Hypet. Text Transfer Protocol Пример: %telnet ipgeobase. ru 80 Trying 194. 85. 91. 253. . . Connected to ipgeobase. ru. Escape character is '^]'. GET / HTTP/1. 0 HTTP/1. 1 200 OK Date: Thu, 27 Mar 2008 11: 56: 04 GMT Server: Apache/2. 2. 4 (Unix) PHP/4. 4. 6 mod_ssl/2. 2. 4 Open. SSL/0. 9. 8 d Content-Length: 161 Connection: close Content-Type: text/html; charset=windows-1251 <!DOCTYPE HTML PUBLIC "-//W 3 C//DTD HTML 3. 2 Final//EN"> <html> <head> <title>Index of /</title> </head> <body> <h 1>Index of /</h 1> <ul></ul> </body></html> Connection closed by foreign host. 2/17/2018 15
WWW: Hypet. Text Transfer Protocol Методы: GET - запрашивает данные полностью HEAD - запрашивает только заголовок POST - запрашивает данные полностью LINK - связывает заголовок с документом на сервере UNLINK – отменяет LINK PUT - публикует данные на сервере DELETE – удаляет данные на сервере OPTIONS – запрашивает информацию о параметрах соединения и сервера TRACE – используется для отладки 2/17/2018 16
WWW: Hypet. Text Transfer Protocol GET - запрашивает данные полностью GET / HTTP/1. 0 HTTP/1. 1 200 OK Date: Thu, 27 Mar 2008 11: 56: 04 GMT Server: Apache/2. 2. 4 (Unix) PHP/4. 4. 6 mod_ssl/2. 2. 4 Open. SSL/0. 9. 8 d Content-Length: 161 Connection: close Content-Type: text/html; charset=windows-1251 <!DOCTYPE HTML PUBLIC "-//W 3 C//DTD HTML 3. 2 Final//EN"> <html> <head> <title>Index of /</title> </head> <body> <h 1>Index of /</h 1> <ul></ul> </body></html> 2/17/2018 17
WWW: Hypet. Text Transfer Protocol HEAD / HTTP/1. 0 HTTP/1. 1 200 OK Date: Thu, 27 Mar 2008 12: 05: 34 GMT Server: Apache/2. 2. 4 (Unix) PHP/4. 4. 6 mod_ssl/2. 2. 4 Open. SSL/0. 9. 8 d Connection: close Content-Type: text/html; charset=windows-1251 2/17/2018 18
WWW: Hypet. Text Transfer Protocol POST /test. cgi HTTP/1. 0 User-Agent: Mozilla/2. 02 Gold (Win. NT; I) Accept: image/gif Host: www. kuku. ru Content-type: application/x-www-form-urlencoded Content-length: 21 Field 1=kuku&field 2=20 2/17/2018 19
WWW: Hypet. Text Transfer Protocol Коды ответов: 100 -199 200 -299 300 -399 400 -499 500 -599 2/17/2018 Информационные Запрос успешный Переадресация Запрос неполный Ошибка сервера 20
WWW: Hypet. Text Transfer Protocol Коды наиболее «популярных» ответов: 200 Ок Запрос обработан успешно 301 Moved Permanently Страница перемещена 302 Moved Temporarily Страница перемещена временно 304 Not Modified Не изменился 305 Use proxy Нужно использовать сервер-посредник 403 Forbidden Доступ не разрешен 404 Not Found Страница не найдена 500 Internal Server Error 2/17/2018 21
WWW: Hypet. Text Transfer Protocol Наиболее «популярные» заголовки: Cache-Control Pragma: no-cache Host: Cookie: Set-Cookie: Referer: Content-Length: Expiries: Last-Modified: Content-Type: 2/17/2018 управление кэшированием страниц имя хоста (виртуальный хостинг) поддержка сессий ссылающийся документ размер тела документа время изменения документа дата последней модификации типа содержания тела 22
Скачать презентацию Основы Web-технологий Павел Храмцов paul kiae su 2 17 2018 1
Intro+URI.ppt