Как импортировать/загружать файлы с помощью jQuery AJAX?

Вот решение, которое мне удалось найти, и я действительно заметил несколько распространенных ошибок, которые были допущены.

• Файлы не добавлялись должным образом в JS.
• AJAX dataFilter: function() можно заменить на dataType: 'json'.
• В JS submit не нужно возвращать false, чтобы остановить действие формы.
  • Можно заменить на event.stopPropagation() и e.preventDefault().
  • Добавить пустое действие формы в HTML.
• PHP-функция для AJAX не завершалась die().

HTML

<form id="form_import" name="form_import" method="post" enctype="multipart/form-data" action >
    <input id="file_import" name="import_data" type="file" />
    <br/>
    <button id="btn_import" type="submit" >Импорт</button>
</form>

JavaScript

jQuery(document).ready(function($){
    // PHP-файлы могут выводить Nonce. Однако это локализует скрипты.
    var importNonce = localizedData.import_nonce;

    $('#form_import').submit( function( event ) {
        event.stopPropagation(); // Остановить выполнение событий
        event.preventDefault(); // Полностью остановить выполнение событий

        var formData = new FormData();
        var importFiles = $('#file_import')[0].files;

        // Для КАЖДОГО файла добавить в formData.
        // ПРИМЕЧАНИЕ: Простое добавление всех importFiles не очень хорошо работает с PHP.
        jQuery.each( importFiles, function( index, value ) {
            var name = 'file_' + index;
            formData.append( name, value )
        });

        formData.append( 'action', 'ajax_file_import' );
        formData.append( '_ajax_nonce', importNonce );

        jQuery.ajax({
            url: ajaxurl,
            type: 'POST',
            data: formData,
            cache: false,
            dataType: 'json', // Это заменяет dataFilter: function() && JSON.parse( data ).
            processData: false, // Не обрабатывать файлы
            contentType: false, // Установить content type в false, так как jQuery сообщит серверу, что это запрос строки запроса


            beforeSend: function( jqXHR, settings ){
                // (ОПЦИОНАЛЬНО) Альтернативная концепция AJAX.
                // Удаляет старый IFrame, если он есть.
                var element = document.getElementById('import_IF');
                if ( element !== null ){
                    element.parentNode.removeChild( element );
                }
                // КОНЕЦ (ОПЦИОНАЛЬНО).
            },
            success: function( data, textStatus, jqXHR ) {
                console.log( 'Возврат из PHP AJAX функции/метода.' );

                // Делаем что-то с data.values

                // (ОПЦИОНАЛЬНО) Альтернативная концепция AJAX.
                // Необходимо для загрузки в AJAX.
                var paramStr = '';
                paramStr += '?_ajax_nonce=' + data._ajax_nonce;
                paramStr += '&action='      + data.action;
                paramStr += '&filename='    + data.filename;

                var elemIF = document.createElement("iframe");
                elemIF.id = 'import_IF'
                elemIF.style.display = "none";
                elemIF.src = ajaxurl + paramStr;

                document.body.appendChild(elemIF);
                elemIF.parentNode.removeChild(elemIF);
                // КОНЕЦ (ОПЦИОНАЛЬНО).
            },
            complete: function(jqXHR, textStatus){
                console.log( 'AJAX завершен.' );

                // (ОПЦИОНАЛЬНО) Альтернативная концепция AJAX.
                // Очистка IFrame.
                var element = document.getElementById('import_IF');
                if ( element !== null ){
                    element.parentNode.removeChild( element );
                }
                // КОНЕЦ (ОПЦИОНАЛЬНО).
            }
        });// Конец AJAX.
    });// Конец .submit().
});

PHP

<?php
class server {
    public function __construct() {
        // Пример добавления скрипта.
        add_action( 'admin_enqueue_scripts', array( $this, 'enqueue_example' ) );
        add_action( 'wp_ajax_ajax_file_import', array( $this, 'ajax_import_example' ) );
    }

    public funtion enqueue_example() {
        wp_register_script(
            'example-js',
            FILE_URL,
            array(),
            VERSION,
            false
        );
        wp_enqueue_script( 'example-js' );

        $data = array(
            'import_nonce'  => wp_create_nonce( 'ajax_file_import_nonce' ),
        );

        wp_localize_script( 'example-js', 'localizedData', $data );
    }

    public function ajax_import_example() {
        check_ajax_referer( 'ajax_file_import_nonce' );

        $raw_content = array();
        $i = 0;
        while ( isset( $_FILES[ 'file_' . $i ] ) ) {
            $file_arr = $_FILES[ 'file_' . $i ];
            $file_content = file_get_contents( $file_arr['tmp_name'] );
            $raw_content[]  = json_decode( $file_content );
            $i++;
        }

        $new_data = array();
        // Делаем что-то с новыми данными.
        update_option( 'example_database', $new_data );

        // (ОПЦИОНАЛЬНО) Добавляем данные для возврата в AJAX Success
        $rtn_data = array(
            'action'               => 'apl_import',
            '_ajax_nonce'          => wp_create_nonce( 'alt_ajax' ),
        );
        echo json_encode( $rtn_data );
        // КОНЕЦ (ОПЦИОНАЛЬНО).

        die();
    }
}
?>