Как защитить токен доступа API JavaScript?

Существует множество онлайн-ресурсов, которые предоставляют API-интерфейсы JavaScript для доступа к своим услугам. Чтобы быть более понятным, я буду основывать свой вопрос на примере MapBox, но это хорошо относится ко многим другим службам в различных доменах.

Когда кто-то хочет использовать такой сервис в веб-приложении (например, на изображении карты из MapBox), ему обычно необходимо зарегистрироваться/зарегистрироваться и получить токен доступа для доступа к сервису.

Теперь, если бы я использовал API со стороны сервера - это не проблема: я знаю, что мой токен надежно хранится где-то на сервере и "выставляется" только при обмене данными между моим сервером и поставщиком услуг. Однако в случае JavaScript API (например, если я использую Leaflet для рендеринга карты из MapBox), у меня должен быть мой токен доступа в JavaScript, который подвергается воздействию пользовательский веб-браузер - и поэтому очень легко найти кого-то токен доступа. В моем примере простой переход на любой веб-сайт с использованием Leaflet и открытие "Dev Tools" в Firefox обнаруживает токен, который они используют, за минуту внимательного чтения их кода JavaScript.

Однако этот токен, как по мне, следует рассматривать как очень защищенные данные - использование сервиса отслеживается на основе аутентификации, которую обеспечивает этот токен. Если вы платите за услугу на основе ее использования, она становится очень критичной, но даже если вы этого не сделаете (например, если вы используете бесплатный/стартовый/неоплачиваемый план) - использование услуги ограничено, и я хотел бы быть уверен это только я, кто использует это.

Является ли мой единственный вариант прокси через мой собственный веб-сервер?

Есть ли способ обезопасить токен доступа, используемый JavaScript API для доступа к внешней службе, при условии, что JavaScript выполняется в браузере пользователя?

Ответ 1

Ограничить доступ с помощью CORS

Сделайте так, чтобы ваш веб-сервер возвращал токены доступа по запросу ajax от вашего javascript с настройкой CORS. Токен можно получить с помощью этого метода, посетив ваше приложение.

Предоставлять токены авторизованным пользователям

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

Запросы прокси

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

Ответ 2

Значки API Javascript (и все токены клиента) на самом деле всегда видны клиенту (если только они не используются только на стороне сервера, как в node). Об этом нет. Как вы уже упоминали, единственный способ по-настоящему защитить ключ API и сохранить его конфиденциальным - это сохранить его на сервере, а затем попросить сервер сделать запрос от имени клиента.

Ответ 3

Я буду говорить только об API-интерфейсах для создания изображений карт, таких как Mapbox, и, к сожалению, только такие сервисы, как Google Maps, Here Maps, Bing Maps и т.д., Предлагают фильтрацию IP/доменов по поставщикам услуг или по этому типу безопасности, все предложения основаны на OSM, с которыми я встречался. т предложить это. Как сказал Джастин Понелт, единственный надежный способ - это создать прокси, но это обычно запрещено. Я нахожу это в ТУ Mapbox:

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

Ответ 4

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