Обработка ошибок проверки формы Flask в Javascript с помощью события omclick ⇐ Python

[Anonymous]

Итак, есть форма загрузки файлов.

Код: Выделить всё

forms.py

from flask_wtf import FlaskForm

class Form(FlaskForm):
file = FileField('File',
validators=[FileRequired(msg),
FileAllowed(ext, msg),
FileSize(max_, min_, msg)])
upload = SubmitField('Upload')

upload.html


{{ form.hidden_tag() }}
{{ form.file(class="form-control", id="file") }}

{{ form.upload(class="btn btn-outline-secondary", id="upload") }}

• Здесь я пытаюсь сохранить текст ошибки проверки, чтобы его можно было получить из функции JS.
  Мне это нужно, потому что я хочу показывать сообщение об ошибке в красивом элементе всплывающего уведомления Bootstrap, который требует инициализации в JS.

Код: Выделить всё

script.js

let fu = document.querySelector('#upload');

fu.addEventListener('click', (ev) => {
let el = document.querySelector('#error');
if (el.dataset.error) {
// Show error message and do nothing else
let toast = document.querySelector('.toast');
document.querySelector('.toast-body').innerText = el.dataset.error;
bootstrap.Toast.getOrCreateInstance(toast).show(); // initialize
}
// Let Flask do its job
});

Очевидно, что когда я нажимаю кнопку загрузки, функция JS срабатывает немедленно. Информации о произошедших ошибках (если таковые имеются) по-прежнему нет, поскольку проверка на стороне сервера еще не произошла.
Также я пытался решить проблему с веб-сокетами:

Код: Выделить всё

Python

@app.route('/upload', methods=['GET', 'POST'])
def upload():
form = Form()

if request.method == 'POST':
if not form.validate():
socketio.emit('err', {'error': form.file.errors[0]})
# ...

JS

const ws = io();
ws.on('err', (ev) => (
// let error = ev.error;
// Yhe same logic
));

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

Подробнее здесь: https://stackoverflow.com/questions/784 ... lick-event