Как спрятать ключ от API чтоб работал github pages?

Question

[webjun]

Сделал проект по типу фильмотеки, где получаю данные через АПИ на страницу. Сам ключ и айди для апи у меня находятся в компоненте и записаны примерно так:

const ID= "7bcd67nm";
const KEY = "3gbnae5b42357469d8c01990b83f49b";

Как спрятать эти данные так, чтобы я мог выложить проект на github pages и мой проект работал? К примеру, создам js файл, в который я запишу ID и KEY и добавлю его в .gitignore, но если так сделать, то апи работать не будет из-за отсутствия ключа и айди.

Answer 1

[bqio]

Для хранения секретных ключей используется сервер, либо environment variables.

Как пример, dotenv

Answer 2

[Алексей Ярков]

На фронте никак не спрятать

Answer 3

[Vest]

Я не знаю, кто у вас предоставляет API, но у Гугла сделано это с помощью цифровой подписи: https://developers.google.com/maps/documentation/m...
Допустим, вы знаете какие у вас параметры (надеюсь, что они не меняются), вы подписываете свой запрос и шлёте провайдеру. Если кто-либо захочет поменять параметры запроса, то ему придётся подписать его заново, а без приватного ключа он не сможет.
С другой стороны, если у вас есть квота на запросы, или вы хотите их в JS динамически менять, то да, вам без личного бекенда не справится.

Всё, что приходит в браузер, можно украсть :)