1. Веб-карта обогащается дополнительной интерактивностью в рамках описанной разработчиком логики
1. Веб-карта обогащается дополнительной интерактивностью в рамках описанной разработчиком логики
Такая карта удобна, когда мы делаем карту с небольшим количеством объектов. Мы переправляем пользователю данные как есть, а когда мы отправляем пользователю данные как есть, почти не требуется серверных мощностей. Их легко разместить в Интернете, есть варианты бесплатной публикации.
Такая карта удобна, когда мы показываем небольшое количество объектов. Мы отправляем пользователю данные как они есть. Это требует минимальных серверных мощностей. Подобные веб-ресурсы называются статическими. Их легко разместить в Интернете, есть варианты бесплатной публикации.
*Перед тем как броситься на выполнение упражнений, полезно сделать паузу, выпить чаю и немного почитать*
*Перед тем как броситься на выполнение упражнений, полезно сделать паузу, выпить чаю и немного почитать*
В консоль браузера вывелся *Promise* -- обещание того, что браузер уже занимается нашим запросом. Ответ от сервера не вывелся, хотя во вкладке "Сеть" в инструментах разработчика мы видим, что данные браузер запросил и получил. Дело в том, что вывод в консоль был выполнен раньше, чем мы получили ответ от сервера.
В консоль браузера вывелся *Promise* -- обещание того, что браузер уже занимается нашим запросом. Ответ от сервера не вывелся, хотя во вкладке "Сеть" в инструментах разработчика мы видим, что данные браузер запросил и получил. Дело в том, что вывод в консоль был выполнен раньше, чем мы получили ответ от сервера.
Браузер начал исполнять наш код, увидел запрос к внешнему ресурсу и подумал: "Здесь можно завязнуть. Ещё неизвестно, сколько этот внешний ресурс будет отвечать. Я сейчас отправлю запрос, а пока верну обещание, что когда будет ответ, я его предоставлю. А пока жду ответа буду дальше код выполнять."
Браузер начал исполнять наш код, увидел запрос к внешнему ресурсу и подумал: "Здесь можно завязнуть. Ещё неизвестно, сколько этот внешний ресурс будет отвечать. Я сейчас отправлю запрос, а пока верну обещание, что когда будет ответ, я его предоставлю. А пока жду ответа, буду дальше код выполнять."
Другими ~более умными~ словами, запрос к внешнему ресурсу выполняется асинхронно, то есть изымается из последовательного выполнения программного кода и выполняется отдельно. Поэтому вывод в консоль выполняется раньше того, как данные получены.
Другими ~более умными~ словами, запрос к внешнему ресурсу выполняется асинхронно, то есть изымается из последовательного выполнения программного кода и выполняется отдельно. Поэтому вывод в консоль выполняется раньше того, как данные получены.
@ -158,9 +158,9 @@ map.on("load", () => {
})
})
```
```
> Можно запрашивать эту таблицу, но лучше скопировать её себе. Тогда можно будет менять данные, а этом и есть интерес этого упражнения. Чтобы открыть таблицу, уберите из URL часть `/export?format=csv` или воспользуйтесь этой [ссылкой](https://docs.google.com/spreadsheets/d/1f0waZduz5CXdNig_WWcJDWWntF-p5gN2-P-CNTLxEa0). Чтобы потом запросить свою таблицу в формате CSV, добавьте в конец `/export?format=csv`, чтобы URL был похож на тот, что в коде выше.
> Можно запрашивать эту таблицу, но лучше скопировать её себе. Тогда можно будет менять данные, ав этом и есть интерес этого упражнения. Чтобы открыть таблицу, уберите из URL часть `/export?format=csv` или воспользуйтесь этой [ссылкой](https://docs.google.com/spreadsheets/d/1f0waZduz5CXdNig_WWcJDWWntF-p5gN2-P-CNTLxEa0). Чтобы потом запросить свою таблицу в формате CSV, добавьте в конец `/export?format=csv`, чтобы URL был похож на тот, что в коде выше.
`fetch` выполняет запрос и возвращает Promise (1) -- обещание, что дождётся ответа от внешнего ресурсасcsv-данными о вакансиях.
`fetch` выполняет запрос и возвращает Promise (1) -- обещание, что дождётся ответа от внешнего ресурсасCSV-данными о вакансиях.
`then` получает Promise (1) и сразу возвращает новый Promise (2) -- обещание, что обработает ответ от Promise (1) с помощью заданной функции `(response) => response.text()`. Эта функция извлечёт текст из ответа от Promise (1).
`then` получает Promise (1) и сразу возвращает новый Promise (2) -- обещание, что обработает ответ от Promise (1) с помощью заданной функции `(response) => response.text()`. Эта функция извлечёт текст из ответа от Promise (1).
Механизм CORS -- Cross-Origin Resource Sharing -- призван повысить безопасность веб-страницы. Чтобы избежать ошибки CORS, укажем, что API может отвечать на запросы любых веб-страниц.
Механизм CORS -- Cross-Origin Resource Sharing -- призван повысить безопасность веб-страницы. Чтобы избежать ошибки CORS, укажем, что API может отвечать на запросы любых веб-страниц.
> CORS -- это история про *веб-страницы*, поэтому выполняя запросы к API напрямую мы с ней не сталкивались.
> CORS -- это история про *веб-страницы*, поэтому, выполняя запросы к API напрямую, мы с ней не сталкивались.
```diff lang=py title=app.py
```diff lang=py title=app.py
...
...
@ -385,7 +385,7 @@ map.on("load", () => {
1. Создайте метод, который вернёт список доступных годов
1. Создайте метод, который вернёт список доступных годов
2. Выведите модальное окно слева и выполните подлёт к точке клика
2. Выведите модальное окно слева и выполните подлёт к точке клика
3. Вы могли заметить, что данные, которые мы получаем запросом подробных сведений о городе уже содержатся в полном списке городов: вам предлагается избавиться от этой избыточности
3. Вы могли заметить, что данные, которые мы получаем запросом подробных сведений о городе, уже содержатся в полном списке городов: вам предлагается избавиться от этой избыточности
<details>
<details>
<summary>Есть два варианта -- подумайте над ними. Это тест на то, что вам ближе, бэкенд или фронтенд. Когда подумаете, можно посмотреть разгадку 👀</summary>
<summary>Есть два варианта -- подумайте над ними. Это тест на то, что вам ближе, бэкенд или фронтенд. Когда подумаете, можно посмотреть разгадку 👀</summary>
Бэкендер: можно убрать из метода для списка городов лишние атрибуты<br/>Фронтендер: на клик по объекту можно не обращаться к серверу, а использовать данные из атрибутов объекта
Бэкендер: можно убрать из метода для списка городов лишние атрибуты<br/>Фронтендер: на клик по объекту можно не обращаться к серверу, а использовать данные из атрибутов объекта
@ -142,7 +142,7 @@ martin postgresql://postgres:password@localhost:5432/oikonyms


На последней строчке увидим, что каталог слоёв доступен по адресу `http://0.0.0.0:3000/catalog`, то есть по IPадресам компьютера. Мы воспользуемся нашим любимым `localhost` (другие обычно и недоступны).
На последней строчке увидим, что каталог слоёв доступен по адресу `http://0.0.0.0:3000/catalog`, то есть по IP-адресам компьютера. Мы воспользуемся нашим любимым `localhost` (другие обычно и недоступны).
Перейдём по адресу `localhost:3000/catalog`, чтобы увидеть доступные наборы векторных тайлов. Их должно быть два по количеству пространственных таблиц в базе данных.
Перейдём по адресу `localhost:3000/catalog`, чтобы увидеть доступные наборы векторных тайлов. Их должно быть два по количеству пространственных таблиц в базе данных.
> Веб-ГИС должна не только визуализировать данные, но и реализовывать функции хранения, передачи, обработки пространственных данных
> Веб-ГИС должна не только визуализировать данные, но и реализовывать функции хранения, передачи, обработки пространственных данных
Отдельно стоит упомянуть геопортал и картографические веб-сервисы. Их мы формируем от родовых IT-терминов приземляя к картографии и пространственным данным.
Отдельно стоит упомянуть геопортал и картографические веб-сервисы. Их мы формируем от родовых IT-терминов, приземляя к картографии и пространственным данным.
*Геопортал* — это веб-ресурс, предоставляющий доступ к каталогам пространственных данных, наборам пространственных данных, веб-сервисам, публикующим пространственные данные.
*Геопортал* — это веб-ресурс, предоставляющий доступ к каталогам пространственных данных, наборам пространственных данных, веб-сервисам, публикующим пространственные данные.