Работа с api/hash или как правильно защитить http/fetch запросы на сайте?

Добрый день.
Зараннее уточню, текущий мой проект создан полностью без БД и серверной логики, а также у меня нету большого опыта в создании сайтов с серверной логикой и запросами на бэкэнд, потому прошу в ответах учитывть то, что я не шибко разбираюсь в определенных понятиях и алгоритмах, таких как CORS и тд. Я лишь прошу предложить в ответах способы типа Best practice при работе с внешним api и зашитой ключей/hash_id

Ситуация такая:
На сайте присутствует форма которая используя api из formspree делает post запрос чтобы отправить данные с формы на мою почту. Запрос на formspree можно сделать только post запросом но на 2 эндпоинта (в зависмости от пожелания):

  • через обычный запрос на спец ссылку сервиса formspree: https://formspree.io/f/хэш_айди
  • через использование библиотеки и ее хука с передачей в него "хеш_айди"

В любом из вариантов, при нажатии на кнопку отправки идет запрос, и все работает отлично, однако, данный запрос можно отследить через вкладку Network в любом браузере и заполучить хеш_айди или ссылку с хеш_айди.
На сколько я понял из изучения данной темы, скрыть данный запрос из Network никак не получится, но и в тоже время, любой сможет используя данную ссылку создать простой цикл на localhost и заспамить мне почту и/или использовать весь лимит отправки писем.

З.ы. уточню, варианты captcha и Restrict to domain можно не предлагать, ибо captcha уже стоит и на сервисе formspree функция Restrict to domain, гдето так спрятана что я не нашел

Дополнительно:

Лучший (и единственный) вариант - работать через свой бэкенд и нигде никогда не светить ключи от посторонних API. На своём бэке вы можете вводить любые ограничения на частоту и количество запросов к чужому API.
Всё, что попадает к клиенту, или приходит от клиента - небезопасно по умолчанию.
А Restrict to domain вам не поможет, в браузере можно написать JS-код, который будет работать с вашим ID прямо на вашей же странице и массово генерировать запросы.

  • Спасибо за ответ, извиняюсь что не уточнил сразу, я стараюсь сделать проект используя только front-end, я не разбираюсь в back-end и никогда не делал ничего сложнее json-server. Потому ищу варианты реализации задумки без серверной части. (По логике, будь у меня сервер и знания как с ним работать я бы не парился с использованием внешних сервисов и сделал отправку сообщения на почту напрямую)
    У меня есть несколько причин почему я не пытаюсь создать сервер:
    -отсутствие опыта в создании серверной логики
    -отсутствие опыта в депллое и хостинге сайта с серверной частью
  • N0Escape, Что-то секьюрное без бэкенда создать не получится в любом случае. Поиграться со всякими фронтенд решениями вы конечно можете, но с таким подходом вас вы*бут за 3 секунды, так как ключи хранятся в открытом виде. Все равно что положить ключ от сейфа под коврик рядом с сейфом в проходном месте...
  • N0Escape,

    У меня есть несколько причин

    Кто хочет - ищет способ, кто не хочет - причину.

  • ThunderCat, хорошо, спасибо за ответ, жаль конечно, что как бы не старался, не выйдет обойтись без сервера, не хотелось его делать для обычного лендинг-сайта...
    Что ж, буду искать инфу как создать мини сервер (без знаний в этой области) для моих задач.
  • Rsa97, Частично согласен с этим выражением, однако без причин не будет и следствия хД
  • N0Escape, если это единичный случай, когда тебе надо развернуть сервер, лучше обратись на фриланс тут на хабре даже, там тебе сделают за 2-3к всё, привяжут твою форму, сделают базовый сервер и отправят твои данные на твою почту + ещё и задеплоят это всё на хост

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

  • N0Escape, нормальный чел, который хотя бы мидл, и который трогал как-то бэк и деплой, за час всё это сделает примерно
  • szQocks, спасибо за совет, но лучше уж самому разобраться, ибо в любом случае в будущем и не такое понадобится.

 

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

 

    • Работа с api/hash или как правильно защитить http/fetch запросы на сайте?Есть ответ
    • 07.04.2024
    Ответить

    Для защиты HTTP/Fetch запросов на вашем сайте, важно принять несколько мер безопасности. Одним из способов защиты является использование API ключей для аутентификации запросов. Ниже приведены некоторые рекомендации по работе с API и хешированием данных:

    1. Используйте HTTPS: Убедитесь, что ваш сайт работает через HTTPS протокол, чтобы защитить передаваемые данные от несанкционированного доступа.

    2. Используйте API ключи: Для каждого пользователя или приложения, отправляющего запросы к вашему API, генерируйте уникальный API ключ. Этот ключ должен быть передаваем в каждом запросе для аутентификации.

    3. Хеширование данных: Перед отправкой запроса, хешируйте данные, такие как пароли или другие чувствительные данные, чтобы защитить их от перехвата. Не храните пароли в открытом виде.

    4. Ограничение доступа: Ограничьте доступ к вашему API только для авторизованных пользователей или приложений. Используйте токены доступа или сессии для аутентификации.

    Пример использования API ключа в PHP:

    $apiKey = 'ваш_уникальный_ключ';
    $url = 'https://example.com/api/data';
    $data = array('param1' => 'value1', 'param2' => 'value2');
     
    $headers = array(
        'Content-Type: application/json',
        'Authorization: Bearer ' . $apiKey
    );
     
    $ch = curl_init($url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    curl_setopt($ch, CURLOPT_HTTPHEADER, $headers);
    curl_setopt($ch, CURLOPT_POST, true);
    curl_setopt($ch, CURLOPT_POSTFIELDS, json_encode($data));
     
    $response = curl_exec($ch);
    curl_close($ch);
     
    echo $response;

    Это лишь некоторые из мер безопасности, которые можно принять для защиты HTTP/Fetch запросов на вашем сайте. Важно постоянно обновлять и обеспечивать безопасность вашего API, чтобы предотвратить возможные атаки и утечки данных.

Оставить комментарий