Принудительно заставить колбу ждать асинхронную функцию JS перед перезагрузкой - PullRequest
Новая
       13

Принудительно заставить колбу ждать асинхронную функцию JS перед перезагрузкой

0 голосов
/ 31 января 2019

У меня есть кнопка отправки для загрузки изображений и информации.Когда вызывается кнопка отправки, одновременно происходит следующее:

  • POST-запрос к приложению Flask.(для обновления информации)
  • JS: (в то же время, что и выше)
    • GET-запрос к приложению Flask для presignedPost.
    • Как только presignedPostRequest получил файл для загрузки в s3.

В результате POST-запрос к Flask завершается, и страница перезагружается.Когда это происходит, запрос AJAX отменяется (если он все еще обрабатывается).Иногда мой код работает, а иногда нет.Добавив time.sleep (3) в приложение Flask, я могу дождаться окончания загрузки s3 и все работает.Это не хорошее решение.

Как заставить Flask ожидать завершения функции JS?

Я пытаюсь сохранить свой сервер, отправив пользователей напрямую на s3.Должно быть быстрее для них.

Ожидание 3сек работ.Просмотр журналов xhr в chrome говорит о том, что происходит.

preventDefault() doesnt work because there are 2 requests happening. 


@users.route("/account", methods=['GET', 'POST'])
@login_required
def account():
    form = UpdateAccountForm()
    if form.validate_on_submit():
        if form.picture.data:
            # picture_file = save_picture(form.picture.data)
            # current_user.image_file = picture_file
            time.sleep(3)
        current_user.username = form.username.data
        current_user.email = form.email.data
        db.session.commit()
        flash('Your account has been updated!', 'success')
        return redirect(url_for('users.account'))
    elif request.method == 'GET':
        form.username.data = current_user.username
        form.email.data = current_user.email
    image_file = url_for('static', filename='profile_pics/' + current_user.image_file)
    return render_template('account.html', title='Account',
                       image_file=image_file, form=form)

Ctrl + K не работает, поэтому вот короткая версия JS.Ctrl + K идет в мой URL-бар в Chrome.: - (

function uploadfile() {
    **Get PresignedPostRequest**
    **Upload file to s3**
} 

document.getElementById("submit").onclick = function() {uploadfile()

};

Я знаю, почему это работает, но я не знаю разумного решения. Нужно ли менять шаблон дизайна? Я использую колбу, потому что я слабеена JS.

Только что закончил Bootcamp, так что я довольно новичок в этом. Я могу запустить все через свое приложение, но это будет сложнее на моем сервере ... Я думаю, что я мог бы использовать socket.io, но этоеще один слой усложнения ....

Спасибо за внимание!

1 Ответ

0 голосов
/ 15 февраля 2019

Я изменил свой код на другой подход.Затем я вернулся через несколько дней, чтобы получить помощь от друга, и мой код работал нормально.Вот что я использовал для решения проблемы.ИДК, почему это не сработало два дня ... 

document.getElementById("accountForm").onsubmit = function (e) {
    e.preventDefault();

    uploadfile();

    document.getElementById('accountForm').submit();
...