Как отобразить индикатор выполнения для формы загрузки нескольких файлов в Django?

Я разрабатываю приложение, которое требует от пользователей загружать массивный каталог из нескольких файлов/типов файлов/подпапок. Он будет обрабатывать 10, возможно, 100 ГБ на пользователя, поэтому наличие индикатора выполнения, отображаемого во время загрузки, будет очень полезно для информирования пользователя о ходе загрузки массивных файлов

Моя текущая установка основана на следующем ответе на другой вопрос: https://stackoverflow.com/a/52016594/15739035

Вот упрощенная установка:

models.py:

class Feed(models.Model):
user=models.ForeignKey(User, on_delete=models.CASCADE)
text=models.TextField(blank=False, max_length=500)

class FeedFile(models.Model):
file = models.FileField(upload_to="files/%Y/%m/%d")
feed = models.ForeignKey(Feed, on_delete=models.CASCADE)

forms.py:

class FeedModelForm(forms.ModelForm):
    class Meta:
        model = Feed
        fields = ['text']

class FileModelForm(forms.ModelForm):
    class Meta:
        model = FeedFile
        fields = ['file']
        widgets = {
            'file': ClearableFileInput(attrs={'multiple': True}),
        }
        # widget is important to upload multiple files

views.py:

def upload_files_view(request):
    user = request.user
    if request.method == 'POST':
        form = FeedModelForm(request.POST)
        file_form = FileModelForm(request.POST, request.FILES)
        files = request.FILES.getlist('file')  # field name in model

        if form.is_valid() and file_form.is_valid():
            feed_instance = form.save(commit=False)
            feed_instance.user = user
            feed_instance.save()

            total_files = len(files)  # Get the number of files in 'files'
            files_count = 0  # Use to show user the progress out of 'total_files'

            for f in files:
                file_instance = FeedFile(file=f, user=use, feed=feed_instance)
                file_instance.save()

                progress = f"{total_files}/{files_count}"
                # render(request, 'some_folder/upload_progress.html', {'file_form': file_form, 'form': form, 'progress': progress})  # somehow refresh the page showing 'progress' in an html tag? 
                files_count += 1

            return redirect('upload_success_page')
    else:
        form = FeedModelForm()
        file_form = FileModelForm()
        return render(request, 'some_folder/file_upload.html', {'file_form': file_form, 'form': form})

Моя конечная цель - получить общее количество файлов (как показано в приведенном выше файле views.py), определить, какой файл загружается в данный момент, и вернуть это значение в шаблон, чтобы пользователь мог как-то отслеживать его. (Вы можете видеть, что я попытался сделать выше в файле views.py, однако этот метод не работает по ряду причин.)

Мой вопрос: Как мне получить эту информацию во время загрузки файлов и отправить ее в шаблон/страницу, которую просматривает пользователь?

Вот пример индикатора прогресса загрузки папки Google Drive, загружается папка из 1185 файлов, текущий прогресс составляет 11:

An example of the Google Drive Folder upload UI element showing a folder of 1185 files is being uploaded and the current progress is 11

Проведя исследование, я нашел много похожих вопросов об использовании Ajax. Все остальные вопросы на StackExchagne либо очень старые, либо не имеют ответа и не очень помогли. Эта статья показалась многообещающей, однако, похоже, что код не доработан, и я не смог заставить его работать: https://anshu-dev.medium.com/file-upload-progress-bar-using-django-and-ajax-ba4eb7482d9c

На мой взгляд, идеальным методом было бы полное использование Django views.py, однако я не совсем уверен, возможно ли это и как это сделать.

Я очень ценю любую помощь, которую я могу получить, спасибо за ваше время!

Вернуться на верх