Подготовка карты к выпуску: отказы, приватность и договоры
Оглавление серии «Карты для веба» · Урок 12 из 12.
Мы собрали учебный клиент карты: проверенные точки, безопасные карточки, список, фильтры, публичную ссылку, личную исходную точку, ограничение отображения и обмен GeoJSON. Последний урок посвящён границе между работающим учебным устройством и выпуском настоящего каталога. Подготовим поведение при отказе Leaflet и оформим решения, которые нельзя заменить одним копированием файлов на хостинг.
Публикация в этой серии не выполняется. Исходники, зависимости, геолокация и обращения к подложке не запускались при подготовке материала. Поэтому ниже есть ожидаемые сценарии и план ручного принятия, а не отчёт о состоявшемся успешном выпуске. Такой статус особенно важен для карты: сетевой поставщик, браузер и условия данных входят в результат наряду с самим JavaScript.
Разделим три вида отказа
Первый отказ — приложение не смогло получить библиотеку Leaflet. В ранних шагах импорт карты тогда останавливал контроллер. Во втором случае Leaflet работает, но не загружается часть тайлов. Третий случай — пользователь не разрешил геолокацию. Эти состояния требуют разных сообщений: недоступная подложка не означает исчезновение данных, а отказ в разрешении не является ошибкой пользователя.
Есть и четвёртая граница: JavaScript может быть полностью отключён или не исполниться из-за политики сайта. Клиентский список тогда тоже не появится. Не называем резервный список в нашем модуле полноценной HTML-версией: он сохраняется при отказе карты, но сам строится JavaScript. Для SEO и чтения без скриптов настоящий сайт должен иметь статически сгенерированный или серверный текстовый каталог.
Это хорошо сочетается с подходом ProfessorWeb. Основное содержание и устойчивые ссылки могут существовать в HTML, а карта — добавлять пространственный способ просмотра. Тогда поисковый робот и посетитель получают данные без обязательного общения с картографическим сервисом. В учебном «Рядом» такой сборщик отдельно не реализован, но договор его данных уже есть — принятая FeatureCollection.
Сначала подготовим список, затем карту
В двенадцатом src/main.js данные и модуль списка импортируются независимо от Leaflet. Сам модуль карты загружается динамически внутри try. Существенная часть изменения:
let map, renderMarkers, selectMarker;
try {
if (typeof L === 'undefined') throw new Error('Leaflet не загрузился.');
({ map, renderMarkers, selectMarker } = await import('./map.js'));
} catch {
document.querySelector('#status').textContent =
'Карта недоступна. Список сохранён.';
}
Проверка глобального L соответствует нашему профилю 1.9.4. Если карта не создалась, обычный список всё равно строится из исходных данных. Текстовый поиск, категория, импорт и экспорт могут продолжить работу. Кнопки, для которых нужен экземпляр карты, отключаются. Мы не оставляем внешне активный элемент, который всегда заканчивается скрытым исключением.
Фильтр по расстоянию требует математического API выбранной библиотеки и исходной точки. При отказе карты такая точка в начальном состоянии отсутствует, а действия её выбора недоступны. Поэтому список работает по тексту и категории. Для более независимого приложения можно вынести расчёт расстояния в собственный проверенный модуль, но это будет новая ответственность и новый предмет проверки.
Обработка тайлов не должна ломать каталог
tileerror сообщает о недоступном изображении и оставляет текстовые данные. Не очищаем список, не принимаем пустой набор за успешный ответ и не повторяем запросы без конца. Поставщик может ограничить сервис или временно отказать; пользователь должен понимать, что каталог остаётся доступным, а географическая подложка частично отсутствует.
Наша учебная конфигурация не реализует автоматический failover. Переход к резервному источнику требует заранее выбранного поставщика и его атрибуции, а также оценки условий и возможного раскрытия области ещё одной стороне. Подставить случайный публичный URL из чужого примера — не полноценная стратегия доступности. Зафиксируйте источник и порядок переключения в документации проекта.
Перенос файлов на свой домен может убрать зависимость от CDN библиотеки, но не решит отказ тайлов. Аналогично собственный тайловый сервер не исправит ошибку данных и отсутствие текстовой версии. Выпуск рассматривает каждый слой отдельно: документ, приложение, данные, изображения и запрос положения имеют свои договоры.
Опишем приватность по реальным потокам
В нашем коде личная точка остаётся в памяти, не включается в hash и не экспортируется отдельным объектом. Однако после её применения карта может запросить тайлы соответствующей области. CDN получает загрузки Leaflet, а встроенные сторонние скрипты настоящего сайта смогут читать собственный контекст страницы в пределах своих прав. Объяснение приватности должно перечислять реальные потоки, а не ограничиваться отсутствием одного fetch в контроллере.
Нельзя загружать карты во всех статьях сайта заранее, если человеку ещё не нужен этот интерфейс. Для ProfessorWeb подходящая точка подключения — конкретная страница практического проекта или отдельная карта каталога. Кнопка подложки даёт явный момент обращения к поставщику, а список остаётся основным способом изучить данные. Для реального сайта уточните требования аудитории и законодательные вопросы вместе с ответственным специалистом, не копируя универсальную формулировку согласия.
Не сохраняйте точные координаты в логах ошибок, именах аналитических событий и параметрах обращения поддержки без отдельного обоснования. Для разбора отказа полезнее код ситуации, версия клиента и состояние доступности функций. Даже имя экспортированного файла не должно автоматически содержать личную позицию. Наш фиксированный учебный файл не создаёт такой зависимости.
Подготовим договор источника данных
Перед заменой вымышленных мест реальными сведениями определите, откуда они получены и разрешено ли их публиковать. Наличие открытой страницы организации не делает любые поля автоматически свободными для массового переноса. Укажите редакционную ответственность, период обновления, возможность исправить запись и устойчивый идентификатор. Координата без подтверждения адреса может отправить посетителя в неправильное место.
Валидатор проверяет форму и пределы нашего профиля, но не подтверждает существование площадки. Порядок координат, ожидаемый регион, дубли одной организации и актуальность описания требуют проверки смысла данных. Для массового импорта полезен отдельный редакционный отчёт, который сохраняет отклонённые строки и причины. Не нужно показывать каждому посетителю внутренние документы этого процесса.
Если данные будут редактировать несколько людей, импорт в память браузера недостаточен. Появятся ревизии, права записи, конфликт изменений и история публикации. Можно использовать CMS или серверное API, но сохраняйте текущую границу: сначала принятый набор с понятным договором, затем его отображение. Библиотечные маркеры не должны становиться главным хранилищем сведений.
Оформим ручное принятие будущего выпуска
Для функционального прохода понадобятся обычный поиск, нулевая выдача, выбор списка и маркера, границы камеры, отмена личной точки во время ожидания, ошибочный и повторный импорт. Отдельно проверьте клавиатурный фокус, узкий экран, читаемость атрибуции и сохранение списка при недоступной библиотеке. Это будущие сценарии; их не запускали в рамках локальной подготовки уроков.
Для сетевого прохода изучите действующую политику поставщика тайлов, штатный кэш, HTTPS, выбранные домены и поведение при отказе. Не выполняйте нагрузочный проход по публичному сервису только ради проверки своего интерфейса. Для нагрузки используйте подходящую собственную среду или разрешённый источник. Число 400 в коде не заменяет измерения отзывчивости на целевых устройствах.
После этого подготовьте версию данных, исходники клиента, сведения о библиотеке и план возврата прежнего выпуска. Для статического каталога полезно хранить прежний набор вместе с предыдущим HTML, чтобы откат не смешивал новые координаты со старыми карточками. На большом сайте ссылки на места должны сохраняться независимо от декоративного состояния карты.
Вы получили основу, которую можно развивать по конкретной задаче: добавить серверную выдачу области, поиск адреса через согласованный сервис, редакционный процесс или независимую текстовую страницу. Выбирайте следующий шаг по потребности посетителя, сохраняя точность названий и границ. Карта полезна, когда помогает понять каталог, а основной текст и данные остаются доступными и объяснимыми.
Полный снимок этого шага находится в папке lesson-12 архива серии. При подготовке материала пример не запускался; описанные эффекты ожидаются по разобранному коду и требуют самостоятельной проверки в браузере.