Фронтенд Конфиденциальная информация

Question

Я создаю свое первое приложение для реагирования и не уверен в безопасности внешнего интерфейса. Я звоню в следующую стороннюю библиотеку: emailjs.sendForm(serviceID, templateID, templateParams, userID); Поле userId является конфиденциальной информацией. Я делаю следующий вызов своему обработчику onSubmit. Мне интересно, нужно ли мне как-то защитить эту информацию? Кроме того, есть ли у меня способ проверить, может ли пользователь каким-либо образом увидеть эту информацию, которую я как-то проверял и нахожу код в методе?

emailjs
          .sendForm(
            "gmail",
            "client-email",
            "#form",
            "**here_is_the_sensitive_info**"
          )
          .then(() => {
            resetForm({});
          })
          .catch(() => {
            const acknowledgement = document.createElement("H6");
            acknowledgement.innerHTML = "Something went wrong, please try.";
            document.getElementById("form").appendChild(acknowledgement);
          });

Answer 1

У вас никогда не должно быть конфиденциальной информации во внешнем интерфейсе. У вас должен быть, например, запущенный экземпляр nodejs, доступ к конечной точке для внешнего интерфейса и вызов его. Затем внутри вашего nodejs приложения у вас должен быть файл .env с вашими учетными данными.

Затем просто используйте информацию .env с вашего node.js сервера. Если у вас есть конфиденциальная информация во внешнем интерфейсе, вы раскрываете все.

Answer 2

В этом случае электронная почта JS предназначена для использования в браузере, поэтому я не думаю, что userId вообще чувствителен.

В их собственная документация , вы можете увидеть следующую инструкцию, чтобы начать работу.

<script type="text/javascript"
  src="https://cdn.jsdelivr.net/npm/emailjs-com@2.4.1/dist/email.min.js">
</script>
<script type="text/javascript">
   (function(){
      emailjs.init("YOUR_USER_ID");
   })();
</script>

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

Чтобы никто не использовал ваш userId на своем собственном веб-сайте (что очень маловероятно, поскольку он запускает только настроенные вами электронные письма), вы можете внести свой собственный домен в белый список с их платным планом, по-видимому, .

---

Файл .env при использовании во внешнем проекте , служит только для установки переменных среды, которые используются во время компиляции. Файл никогда не попадает в браузер, но значения часто просто интерполируются (например, с помощью DefinePlugin ) в окончательном источнике пакета, поэтому здесь нет ничего более безопасного.

ВНИМАНИЕ: не храните какие-либо секреты (например, закрытые ключи API) в вашем приложении React!

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

# (s) for sensitive info

.env -> compilation -> bundle -> browser -> third-party
 (s)        (s)         (s)        (s)          (s)

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

.env -> Node.js server -> third-party
 (s)          (s)            (s)      
                  ^
                 /  (api call)
...bundle -> broswer

Но опять же, здесь электронная почта JS 'userId не является конфиденциальной информацией.