Блог

Главная - Вопросы по программированию - Как защитить ключи API в переменных среды в проекте Vue CLI 4 и Electron

Как защитить ключи API в переменных среды в проекте Vue CLI 4 и Electron

#javascript #electron #vue-cli-4

Вопрос:

Я пытаюсь разработать настольное приложение, для которого потребуется выполнить несколько частных вызовов API, аутентифицированных с помощью некоторых секретных ключей.

Ключи создаются для меня внешними поставщиками ИТ — услуг за пределами моей организации-они отвечают за безопасность, поэтому существует несколько ограничений:

  1. Они сказали, что, несмотря на то, что они уже предприняли шаги со своей стороны для защиты API, и существуют стратегии смягчения последствий, даже если произойдет нарушение, но все же они хотели бы убедиться, что я отношусь к ключам с пониманием безопасности и предпринимаю все возможные шаги с моей стороны, чтобы убедиться, что они остаются защищенными.
  2. Мне не разрешается просто создавать случайное промежуточное программное обеспечение / шлюз на частном сервере или бессерверной платформе для выполнения вызовов API от имени моего приложения, поскольку эти вызовы могут содержать бизнес-данные.

Я провел некоторое исследование, и из того, что я могу найти, общая рекомендация состоит в том, чтобы создать файл «.env» в папке проекта и использовать переменные среды в этом файле для хранения ключей API.

Но, прочитав документацию Vue CLI, я обнаружил следующее:

предупреждение

Не храните никаких секретов (таких как личные ключи API) в своем приложении!

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

Итак, учитывая ограничения, есть ли способ безопасно хранить эти ключи в проекте настольного приложения Vue CLI 4 Electron?

Спасибо.

Ответ №1:

В целом, особенно если у вас много переменных среды, было бы лучше хранить переменные среды в файле dot env (.env), однако возможно, что этот файл может быть утечен при упаковке приложения electron. Таким образом, в этом случае было бы лучше хранить переменные среды из терминала/командной строки. Для этого следуйте этому руководству (https://www.electronjs.org/docs/api/environment-variables).

Имейте в виду, что все, что требует ключа API/личной информации, старайтесь хранить в бэкэнде, то есть в электронном процессе, и отправляйте результаты на интерфейс Vue.

Вот пример того, как вы могли бы это реализовать:

В Windows из CMD:

 set SOME_SECRET="a cool secret"

На POSIX:

 $ export SOME_SECRET="a cool secret"

Основной процесс:

 // Other electron logic
const { ipcMain } = require("electron");

// Listen for an event sent from the client to do something with the secret
ipcMain.on("doSomethingOnTheBackend", (event, data) => {
    API.post("https://example.com/some/api/endpoint", {token: process.env.SOME_SECRET, data});
});

Сторона клиента:

 const { ipcRenderer } = require("electron");

ipcRenderer.send("doSomethingOnTheBackend", {username: "test", password: "some password"});

Также обратите внимание, что для использования ipcRenderer на стороне клиента nodeIntegration необходимо включить.

Вот еще несколько ресурсов, которые помогут вам начать работу:

https://www.electronjs.org/docs/api/ipc-renderer

https://www.electronjs.org/docs/api/ipc-main

Метки: