Как запретить отправку HTML-формы, если предыдущая отправка все еще в действии?

#javascript #jquery #html #security #form-submit

#javascript #jquery #HTML #Безопасность #форма-отправить

Вопрос:

Итак, у меня есть эта форма, которая выполняет довольно длинную публикацию данных с использованием AJAX, теперь я немного параноик, что какой-нибудь умный парень может открыть firebug и повторно запустить процесс публикации, в то время как предыдущая все еще в действии. Как мне избежать этого?

Спасибо!

Комментарии:

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

Ответ №1:

Вы можете:

  • Отключите кнопки отправки.
  • Запретить нажатия клавиш ввода.
  • Удалите action атрибут из тега формы.
  • Перенаправление на другую страницу при первой отправке и истечение срока действия страницы с формой на ней.

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

Комментарии:

1. … обратите внимание, что первые три вещи будут включать в себя то, что вы сделали бы в функции-обработчике «отправить» для формы.

2. Но я могу включить кнопку отправки из Firebug, то же самое для нажатия клавиши Enter, действие… Я не могу перенаправить на другую страницу…

3. Вы не так много можете сделать во внешнем интерфейсе — всегда есть обходной путь. Если вы так обеспокоены этим, то проверка на стороне сервера также необходима (и обычно рекомендуется в любом случае).

Ответ №2:

Установите условие при отправке формы и добавьте проверку при отправке формы. Пример в jQuery:

 $('form').submit(function(e) { 

    // If form has been submitted
    if($(this).data('submitted') == true) {
        e.preventDefault();
        return;
    }

    // Set the condition
    $(this).data('submitted',true);

    //...

    //After form has been submitted successfully, release the condition
    $(this).data('submitted',false);
});
  

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

Ответ №3:

Во-первых, учитывая, что вы беспокоитесь о множественных отправках в результате обхода клиентских элементов управления (например, используя Firebug или Fiddler для повторного выпуска запросов), вы можете забыть о любой опции, которая применяет элементы управления на стороне клиента (например, Отключение кнопок, проверки JS статуса отправки и т.д.). С этим вам придется справиться на сервере.

Взгляните на шаблон токена синхронизатора. Обычно это используется для предотвращения CSRF (как и контекст в ссылке), но также используется для предотвращения отправки нескольких форм. Если вы можете передать токен в своем AJAX-запросе, который проверяется, а затем становится недействительным после начала обработки запроса (очевидно, до начала тяжелой работы), у вас есть средство предотвращения многократных отправок.