Выпадающий список стран со значением по умолчанию по IP

Выпадающий список стран, в котором по умолчанию выбрана страна, подсказанная IP-адресом посетителя, избавляет большинство людей от прокрутки длинного списка, если при этом его можно изменить, когда значение по умолчанию неверно.

Получение значения по умолчанию

При запросе страницы определите IP-адрес посетителя на своём сервере и прочитайте поле country_code из ответа, чтобы сделать его выбранным вариантом списка ещё до отправки страницы в браузер.

GET /v1/ip?ip=192.0.2.15

{
  "status": "ok",
  "ip": "192.0.2.15",
  "version": 4,
  "found": true,
  "country": "Spain",
  "country_code": "ES",
  "region": "Madrid",
  "city": "Madrid",
  "postcode": "28001",
  "lat": 40.4168,
  "lon": -3.7038,
  "timezone": "Europe/Madrid",
  "asn": 5678,
  "org": "Example Networks"
}

Отрисовка на сервере

Поскольку всё происходит на сервере до отрисовки страницы, в браузере не мелькает неверное значение с последующим исправлением, как это бывает при клиентских подходах, которые делают запрос уже после загрузки страницы. Установите атрибут selected у подходящего варианта прямо в генерируемом HTML, сопоставив country_code с ISO-кодами, которые уже используются в значениях ваших вариантов.

Второй пример: предзаполнение поля страны при оформлении заказа

Тот же вызов так же хорошо работает на странице оформления заказа, как и в форме регистрации. Определите IP покупателя один раз при загрузке страницы оформления, сопоставьте country_code со своим списком стран доставки и выберите её по умолчанию. Поскольку страна доставки влияет на налоги и варианты доставки, показанные ниже на странице, правильный выбор до отрисовки страницы избавляет от резкой перестройки макета, если бы посетителю пришлось исправлять значение после того, как всё остальное уже загрузилось вокруг неверного значения по умолчанию.

Всегда разрешайте изменить значение

Считайте страну по IP отправной точкой, а не окончательным ответом. Посетителю в поездке, с рабочим VPN или просто живущему там, где зарегистрированный адрес его интернет-провайдера не совпадает с реальным, понадобится выбрать другой вариант, поэтому ничто в форме не должно предполагать, что значение по умолчанию верно.

Распространённая ошибка, которой стоит избегать

Не кэшируйте полностью отрисованную страницу за CDN или обратным прокси без разделения по посетителям, поскольку страница, отрисованная один раз для IP первого посетителя и затем отдаваемая из кэша всем остальным, будет показывать страну первого посетителя каждому следующему, где бы он ни находился. Если ваши страницы вообще кэшируются, либо исключите этот фрагмент из кэша, либо выводите его через небольшое серверное включение, которое выполняется при каждом запросе.

Если определение ничего не нашло

Если found возвращается как false, что бывает для некоторых частных или нераспределённых диапазонов, используйте нейтральное значение по умолчанию, например пустой выбор или самую распространённую у вас страну, а не оставляйте поле в неопределённом состоянии.

Посетители с IPv6 обрабатываются так же

Посетитель, подключающийся по IPv6, получает то же поле country_code от того же эндпоинта, только определённое по сети /48, а не /24. В логике выпадающего списка ничего не нужно менять в зависимости от версии IP запроса. Подробности по версиям смотрите в документации по определению IPv6.

Стоимость этой функции

Это один запрос на каждую новую сессию посетителя с кэшированием на время сессии, чтобы один визит не вызывал повторных запросов на нескольких страницах формы. Поэтому функция спокойно укладывается в 2 500 бесплатных запросов в день, которые входят в каждый ключ или доступны с одного адреса и без ключа, для всех сайтов, кроме самых загруженных.

Разумное значение по умолчанию избавляет от прокрутки списка из сотни пунктов, а посетитель сохраняет полный контроль, если догадка неверна. Описание полей находится в документации по определению IPv4.

• X
• LinkedIn
• Facebook
• Reddit
• Hacker News
• Telegram
• WhatsApp
• Mastodon
• Электронная почта