Как получить API ключ, с Nuxt и проверить

Как получить API ключ, с Nuxt и проверить

08.12.2018 08:34:49 Просмотров 58 Источник

Я использую Nuxt (с SSR/ PWA/ Vuejs / Node.js/ Vuex / Firestore) и хотел бы иметь общую идею или иметь пример для следующего:

  1. Как я могу защитить ключ API. Например, чтобы позвонить в MailChimp API-интерфейс
  2. Я не знаком с тем, как хакер увидит это, если будет реализовано плохое решение. Как я могу проверить, что он не доступен для них?

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

https://github.com/nuxt-community/dotenv-module/issues/7

https://github.com/nuxt/nuxt.js/issues/2033

Возможно, промежуточное ПО сервера-это ответ? https://blog.lichter.io/posts/sending-emails-through-nuxtjs и еще https://www.youtube.com/watch?v=j-3RwvWZoaU (@11: 30). Мне просто нужно добавить электронное письмо в учетную запись mail chimp после ввода, похоже, много накладных расходов.

Кроме того, я вижу, что уже храню свой ключ API Firestore в качестве переменной среды. Это безопасно? Когда я открываю инструменты-> хром Дэв источники-> страницы-> приложение.js я вижу ключ api прямо там (только протестирован в режиме dev)!

У вопроса есть решение - Посмотреть?

Ответы - Как получить API ключ, с Nuxt и проверить / How to secure API Key with Nuxt and verify

Является ответом!
Aldarund

08.12.2018 12:52:53

Вы можете использовать либо промежуточное ПО сервера, либо https://github.com/nuxt-community/separate-env-module

Само по себе промежуточное программное обеспечение не будет работать, потому что оно может быть выполнено и на клиенте, а код, используемый в промежуточном программном обеспечении, будет доступен на клиенте

Для #2 Вы можете проверить, включен ли он в клиентские источники js. Там путь более другой способ хакер, чтобы получить что-нибудь, например xss, но его общие вещи и не так много связано с вашим кодом.

https://stackoverflow.com/questions/53679843/how-to-secure-api-key-with-nuxt-and-verify/53681340#comment94219936_53681340
Как именно помогает модуль env? Я предполагаю, что если я запустил env на клиенте, я вернусь туда, где я сейчас нахожусь. Итак, вы подразумеваете, что безопасно выполнять стандартные функции промежуточного программного обеспечения и вытаскивать env api_key, когда этот модуль устанавливает env только на сервер?
https://stackoverflow.com/questions/53679843/how-to-secure-api-key-with-nuxt-and-verify/53681340#comment94221479_53681340
@JavaBeast да, хотя промежуточное программное обеспечение также будет выполняться на клиенте при изменении маршрута, поэтому вам нужно будет обрабатывать эти случаи
https://stackoverflow.com/questions/53679843/how-to-secure-api-key-with-nuxt-and-verify/53681340#comment94229015_53681340
Круто, я попробую сегодня вечером. А как насчет № 2? Это инструменты-> Дэв приложение.js единственная проверка, которую я должен сделать? Обновите ответ, и я приму его, когда я получу его на работу позже. Спасибо!
https://stackoverflow.com/questions/53679843/how-to-secure-api-key-with-nuxt-and-verify/53681340#comment94328390_53681340
В конечном итоге с помощью промежуточного программного обеспечения сервера, чтобы избежать проблем CORS от mailchimp api от клиента я испытывал. Используется blog.lichter.io/posts/... как удобный пример ссылки для конечной точки Nuxt API
Exadra37

17.12.2018 06:19:54

Как я могу защитить ключ API. Например, чтобы позвонить в MailChimp API-интерфейс

Жестокой правды здесь нет... На стороне клиента вы не можете защитить какой-либо секрет, по крайней мере, в веб-приложении.

Просто для того, чтобы вы имели представление о методах, которые могут быть использованы для защиты API и как их можно обойти, вы можете прочитать эту серию статей. Хотя это происходит в контексте Api, обслуживающего мобильное приложение, большинство из них также применяется для API, обслуживающего веб-приложение. Вы узнаете, как использовать и обходить api-ключи, токены ouath, hmac и закрепление сертификатов.

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

Например, в вашем случае доступа к API Mailchimp... Если ваш сервер отвечает за выполнение этого от имени вашего веб-приложения, то вы можете применить меры безопасности для обнаружения и смягчения использования Mailchimp вашим веб-приложением, например решение для анализа поведения пользователей (UBA), но оставить для веб-приложения доступ к API Mailchimp означает, что вы только знаете, что кто-то злоупотребляет им, когда Mailchimp предупреждает Вас или вы видите его на своих панелях мониторинга.

Я не знаком с тем, как хакер увидит это, если будет реализовано плохое решение. Как я могу проверить, что он не доступен для них?

Как вы уже знаете, F12 для доступа к инструментам разработчиков является одним из способов.

Другой стороны ID, чтобы использовать множество других инструментов инструмент безопасности Зед атаковать Прокси (Зап) , и, используя свои слова:

OWASP Zed Attack Proxy (ZAP) является одним из самых популярных бесплатных инструментов безопасности в мире и активно поддерживается сотнями международных добровольцев*. Это может помочь вам автоматически находить уязвимости безопасности в веб-приложениях во время разработки и тестирования приложений. Его также отличный инструмент для опытных пентестеров, чтобы использовать для ручного тестирования безопасности.

butterchikita

19.09.2019 02:10:35

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

Закрыть X