Ajax показывает ответ из php-файла после загрузки файла

ProgramBox

Ajax показывает ответ из php-файла после загрузки файла

Post author:admin
Запись опубликована:20 марта, 2023
Post category:Вопросы по программированию

#javascript #php #jquery #ajax

Вопрос:

У меня есть html-форма для загрузки файла (я использую php для загрузки). Я хочу показать результат загрузки с помощью ajax (я новичок в этом, поэтому я могу пропустить что-то действительно простое), однако мой код в настоящее время этого не делает. Я много читал и много чего пробовал, но тщетно, поэтому, наконец, я решил обратиться за помощью.

HTML и AJAX

 <script type="text/javascript">
( function( $ ) {
    $('form').ajaxForm({
        type: "POST",
        url: "Upload.php",
        data: $('#upload').serialize(),
        dataType: "html",
        timeout: 15000,
        success: function( data ) { 
                    alert( data );
        }
    }); 
})( jQuery );
</script>
  <form enctype="multipart/form-data" method="post" id="upload">
        <input type="hidden" name="MAX_FILE_SIZE" value="2000000" />
        <h2>File to upload</h2>
        <input name="userfile" type="file" class='file'/>
        <input type="submit" name="send" value="Upload File" />
    </form>

PHP

 try
{
    if ( $_POST["send"] )
    {
        if ( isset( $_FILES['userfile'] ) )
        {
            require_once "FileUploader.php";
            $fileUploader   = new FileUploader();

            if ( $fileUploader->moveFile() )
            {
                echo "Success";
            }
            echo "Error";
        }
    }
}
catch( Exception $e )
{
    echo "n" . $e->getMessage();
    exit();
}

В настоящее время alert (data); выдает сообщение NULL. В консоли нет ошибок.

1. может быть, просто из-за dataType: "json", изменения его с dataType: "html",

2. Вы смотрели запрос / ответ AJAX в инструментах разработчика браузера? Вы включили библиотеку jQuery в проект? Есть ли какие-либо сообщения об ошибках? Вы запускаете это на веб-сервере?

3. Вы не можете загрузить такой файл, вам нужен FormData объект для его отправки.

4. Обратите внимание, что если условия ваших первых 2 if операторов не будут выполнены, скрипт ничего не выведет. Какой результат вы получаете…

5. Похоже, вы смешиваете стандартный синтаксис jQuery ajax с плагином для загрузки формы, поэтому я понятия не имею, что происходит. Но если вы действительно ожидаете возврата json, вы должны убедиться, что ваш php-скрипт выводит допустимый json. Теперь вы выводите либо текст, либо ничего, и оба не являются допустимыми json.

Ответ №1:

КАК я упоминал в комментарии, serialize() не может передать ФАЙЛ, и вы можете проверить это с помощью простого var_dump($_POST); в вашем upload.php . вы можете передать свой файл в экземпляре FormData(), как показано ниже.

другая проблема заключается в вашем upload.php который использует FileUploader.php и я не знаю, что это за код, но я пытаюсь исправить ваш код jQuery AJAX с помощью примера upload.php для тебя

 <html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script type="text/javascript">
$( function() {
    $('form').submit(function(){
          var form_data = new FormData(this);                  
          $.ajax({
            type: "POST",
            url: "upload.php",
            data: {userfile:JSON.stringify(form_data)},
            dataType: "json",
            timeout: 15000,
            success: function( data ) { 
                        console.log( data );
            }
        }); 
        return false;
    });
});
</script>
</head>
<body>
  <form enctype="multipart/form-data" method="post" id="upload">
        <input type="hidden" name="MAX_FILE_SIZE" value="2000000" />
        <h2>File to upload</h2>
        <input name="userfile" type="file" class='file'/>
        <input type="submit" name="send" value="Upload File" />
    </form>
</body>
</html>

ваш upload.php с некоторыми оптимизациями

 try
{
    if ( isset( $_FILES['userfile'] ) amp;amp; $_POST["userfile"] )
        {
            require_once "FileUploader.php";
            $fileUploader   = new FileUploader();

            if ( $fileUploader->moveFile() )
            {
                echo "Success";
            }
            echo "Error";
        }
}
catch( Exception $e )
{
    echo "n" . $e->getMessage();
    exit();
}

1. Спасибо, но, как я писал в приведенных выше комментариях, теперь он работает с изменением типа данных на html. Сама загрузка выполняется через FileUpload.php файл, а не код ajax. Спасибо за исправления в моем коде, мне действительно нужно над этим поработать.

2. Я думаю, что есть недопонимание, изменение типа данных на html или текст было незначительной проблемой, я упомянул, что вам нужны FormData для отправки переменной post в ajax.

Ответ №2:

Вы забыли указать путь, по которому вы отправляете свой файл!