Как засекьюрить код API запросов в React?

Question

[Persotr27]

Добрый день всем. Возникла следующая проблема: мне предстоит использовать в коде запросы к API, для доступа к которому нужен Access Key. Access Key уникальный и принадлежит одному аккаунту (моему) и т.п., а код клиентских приложений, на сколько известно, можно просмотреть, и при желании получить этот Access Key (пользователь может сделать это из своего браузера). Как это можно предостеречь и не допустить? Заранее спасибо за помощь.

Answer 1

[Pavel Shvedov]

Прокидывать запросы через свой бэкенд, и хранить ключ на сервере

Answer 2

[Владимир]

Есть два способа.
1) Как уже написали все пропускаешь через свой прокси бекенд и на нем хранишь ключи. Не самый лучший способ потому что затратный и при этом требует соблюдения некоторых правил. a) на твоем бекенде должен быть отключен CORS и работать он должен на том эе домене что и фронт, иначе смысла от этой возни - 0 , б) смысл это все затевать есть только в том случае если в API к которому ты стучишся с ключем нет возможности настроить ограничение по Origin запроса.

2) Не знаю к какому API ты пытаешся достучаться, но Google API, AWS API, github имею возможность настроить ограничение по Origin, этим ключем можно воспользоваться только с твоего сайта.

Comments

[Vitaliy]

ну или с чьего-то бэка))

Answer 3

[Robur]

Как это можно предостеречь и не допустить?

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