Как перезагрузить текущую страницу с другим html-шаблоном после завершения задачи в Django?

Я работаю над проектом Django, в котором мне нужно обработать задачу, выполняющуюся в фоновом режиме. После выполнения задачи я хочу перезагрузить текущую страницу, но мне также нужно, чтобы она загружала определенный HTML-шаблон по тому же URL.

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

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

Вот мое представление на django:

Вот мой JS:

form.addEventListener('submit', function(event) {
    event.preventDefault();
    isTranscribing = true;

    const transcribeField = document.querySelector('.transcribe-output-lang-select')
    
    transcribeField.style.opacity = '0';
    setTimeout(function() {
        transcribeField.style.display = 'none';
        transcribingFileField.style.display = 'block';
        errorDiv.style.opacity = '0';
        errorDiv.style.display = 'none';

    }, 300); 
    setTimeout(function() {
        transcribingFileField.style.opacity = '1'

    }, 500); 
   
    const formData = new FormData(form);
 
    const xhr = new XMLHttpRequest();
    xhr.onload = function() {
        if (xhr.status == 200) {
            const response = JSON.parse(xhr.responseText);
            if (response.status === 'success') {
                pollTaskStatus(response.task_id);
            } else {
                showError('An error occurred while initiating the transcription.');
            }
        } else {
            showError('An error occurred while uploading the file.');
        }
    };

    xhr.onerror = function() {
        showError('An error occurred while uploading the file.');
    };

    xhr.open('POST', form.action, true);
    xhr.send(formData);
});

function pollTaskStatus(taskId) {
    currentTaskId = taskId;
    console.log(currentTaskId)
    pollInterval = setInterval(() => {
        const xhr = new XMLHttpRequest();
        xhr.onload = function() {
            if (xhr.status == 200) {
                const response = JSON.parse(xhr.responseText);
                if (response.status === 'completed') {
                    console.log('sent');
                    //console.log(response.filename);
                    showTranscriptionComplete();
                    clearInterval(pollInterval); // Stop polling once completed
                    isTranscribing = false; // Set to false when transcription is complete
                }
            } else {
                showError('An error occurred.');
                clearInterval(pollInterval); // Stop polling on error
                isTranscribing = false; // Set to false on errors
            }
        };
        xhr.onerror = function() {
            showError('Connection error. Please check your network connection and try again.');
            clearInterval(pollInterval); // Stop polling on network error
            isTranscribing = false; // Set to false on network error
            
        };
        xhr.open('GET', `/transcribe/poll_task_status/${taskId}/`, true);
        xhr.send();
    }, 5000); // Poll every 5 seconds
}

Мое представление на стороне сервера возвращает JSON-ответ со статусом задачи. Когда задание выполнено, я хочу, чтобы страница перезагрузилась с определенным HTML-шаблоном, который я написал.

Как обеспечить загрузку правильного HTML-шаблона при перезагрузке страницы без изменения URL?

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