Fine Uploader не может загрузить файл

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

Плагин: http://fineuploader.com/index.html

Мой код:

Я взял код прямо из их демо:

$(document).ready(function() {
$fub = $('#fine-uploader-basic');
$messages = $('#messages');

var uploader = new qq.FileUploaderBasic({
  button: $fub[0],
  action: 'http://localhost/script/file_upload/upload_test',
  debug: true,
  allowedExtensions: ['jpeg', 'jpg', 'gif', 'png'],
  sizeLimit: 204800, // 200 kB = 200 * 1024 bytes
  onSubmit: function(id, fileName) {
    $messages.append('<div id="file-' + id + '" class="alert" style="margin: 20px 0 0"></div>');
  },
  onUpload: function(id, fileName) {
    $('#file-' + id).addClass('alert-info')
                    .html('<img src="client/loading.gif" alt="Initializing. Please hold."> ' +
                          'Initializing ' +
                          '“' + fileName + '”');
  },
  onProgress: function(id, fileName, loaded, total) {
    if (loaded < total) {
      progress = Math.round(loaded / total * 100) + '% of ' + Math.round(total / 1024) + ' kB';
      $('#file-' + id).removeClass('alert-info')
                      .html('<img src="client/loading.gif" alt="In progress. Please hold."> ' +
                            'Uploading ' +
                            '“' + fileName + '” ' +
                            progress);
    } else {
      $('#file-' + id).addClass('alert-info')
                      .html('<img src="client/loading.gif" alt="Saving. Please hold."> ' +
                            'Saving ' +
                            '“' + fileName + '”');
    }
  },
  onComplete: function(id, fileName, responseJSON) {
    if (responseJSON.success) {
      $('#file-' + id).removeClass('alert-info')
                      .addClass('alert-success')
                      .html('<i class="icon-ok"></i> ' +
                            'Successfully saved ' +
                            '“' + fileName + '”' +
                            '<br><img src="img/success.jpg" alt="' + fileName + '">');
    } else {
      $('#file-' + id).removeClass('alert-info')
                      .addClass('alert-error')
                      .html('<i class="icon-exclamation-sign"></i> ' +
                            'Error with ' +
                            '“' + fileName + '”: ' +
                            responseJSON.error);
    }
  }
});
});

HTML:

<div id="fine-uploader-basic" class="btn btn-success">
  <i class="icon-upload icon-white"></i> Click to upload
</div>
<div id="messages"></div>

PHP:

public function upload_test() {
  $upload = move_uploaded_file('./user_files', $_FILES['qqfile']['tmp_name']);
  if($upload) {
    echo json_encode(array('success' => true));
  } else {
    echo json_encode(array('success' => false, 'error' => $upload));
  }
}

Я думаю, что проблема с PHP, но я не могу понять, что я делаю неправильно. Пожалуйста, помогите, прежде чем я сойду с ума.

Спасибо.


person user1701398    schedule 09.11.2012    source источник
comment
Пишет, что файл не может быть загружен с ошибкой undefined. Папка имеет нужные разрешения и все. Я не могу понять, почему это не работает.   -  person user1701398    schedule 10.11.2012


Ответы (6)


я не читал вашу часть js и html, но вам нужно изменить часть PHP. посмотри как он это делает

тонкий загрузчик PHP

person Tian Loon    schedule 18.11.2012
comment
@RayNicholus, какой php-файл в github вы имеете в виду? - person Stranger; 08.04.2013
comment
@Stranger Этот ответ был предоставлен TianLoon. Я просто обновил исходную ссылку, так как она была неработающей. - person Ray Nicholus; 08.04.2013
comment
Хорошо, но знаете ли вы, о каком файле он говорит? - person Stranger; 08.04.2013
comment
@RayNicholus, не могли бы вы помочь мне с проблемой тонкой загрузки? - person Stranger; 08.04.2013
comment
@Stranger Пожалуйста, откройте новую ветку, описывающую вашу проблему, и отметьте ее как Fine-uploader. - person Ray Nicholus; 08.04.2013
comment
@Stranger, я думаю, ты хочешь взглянуть на qqFileUploader.php - person Tian Loon; 10.04.2013

Удалите action: 'http://localhost/script/file_upload/upload_test', и измените с помощью

request: {
            // path to server-side upload script
        endpoint: 'script/file_upload/upload_test/php.php'
         }

Также в вашем файле php.php раскомментируйте:

$allowedExtensions = array("jpeg", "jpg", "bmp", "png");
$sizeLimit = 10 * 1024 * 1024;
$uploader = new qqFileUploader($allowedExtensions, $sizeLimit);
$result = $uploader->handleUpload('uploads/'); //folder for uploaded files
echo htmlspecialchars(json_encode($result), ENT_NOQUOTES);
person Dušan    schedule 27.11.2012

Если это поможет, вот моя установка:

-- jquery.html

    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="utf-8">
        <title>Fine Uploader Demo</title>
        <link href="client/fineuploader.css" rel="stylesheet">
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
      </head>
      <body>
        <div id="fine-uploader"></div>

        <script src="client/jquery.fineuploader-3.1.1.min.js"></script>
        <script>
          function createUploader() {
            var uploader = new qq.FineUploader({
              debug: true,  
              // Pass the HTML element here
              element: document.getElementById('fine-uploader'),
              // or, if using jQuery
              // element: $('#fine-uploader')[0],
              // Use the relevant server script url here
              // if it's different from the default “/server/upload”
              request: {
                endpoint: 'php.php'

              }
            });
          }

          window.onload = createUploader;
        </script>
      </body>
    </html>

--- php.php (в той же папке, что и jquery.html)

следующие строки были раскомментированы:

    // list of valid extensions, ex. array("jpeg", "xml", "bmp")
    $allowedExtensions = array();
    // max file size in bytes
    $sizeLimit = 10 * 1024 * 1024;
    //the input name set in the javascript
    $inputName = 'qqfile';

    $uploader = new qqFileUploader($allowedExtensions, $sizeLimit, $inputName);

    $result = $uploader->handleUpload('uploads/');
    header("Content-Type: text/plain");
    echo htmlspecialchars(json_encode($result), ENT_NOQUOTES);

папка uploads имеет права 777

ПРИМЕЧАНИЕ MAMP: при загрузке будет выдана ошибка stream_copy_to_stream(). Решение: измените строку 58 в php.php с $temp = tmpfile(); в $temp = fopen("php://temp", "wb"); //$temp = tmpfile();

надеюсь, это поможет кому-то.

person Steven    schedule 09.01.2013
comment
Я следовал этому примеру, но загрузчик файлов не отображается в моем пользовательском интерфейсе. Любые намеки на то, почему это происходит? - person Stranger; 05.04.2013

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

<?php
$file = $_FILES['qqfile'];
$uploadDirectory = 'uploads';
$target = $uploadDirectory.DIRECTORY_SEPARATOR.$file['name'];
$result = null;
if (move_uploaded_file($file['tmp_name'], $target)){
    $result = array('success'=> true);
    $result['uploadName'] = $file['name'];
} else {
    $result = array('error'=> 'Upload failed');
}
header("Content-Type: text/plain");
echo json_encode($result);

Конечно, вы должны изменить имя вашего каталога загрузки. Он должен нормально работать с приведенным ниже javascript:

$(document).ready(function() {
    var uploader = new qq.FineUploader({
        element: $('#basicUploadSuccessExample')[0],
        debug: true,
        request: {
            endpoint: "server/php/example.php"
        }
    });
});

Просто убедитесь, что вы включили все *.js в свой html.

person Saul Berardo    schedule 25.01.2013
comment
опубликованный вами php называется «example.php»? - person Stranger; 08.04.2013

У меня тоже была проблема с загрузкой в ​​папку. Чтобы получить больше информации, я изменил строку qqFileUploader.php 59 на:

if (!is_writable($uploadDirectory) || !is_executable($uploadDirectory))
{
return array('error' =>"Server error. Uploads directory isn't writable or executable. CUR_DIR: " . getcwd() . " DIR: " . $uploadDirectory);
}

После этого я увидел, что проблема заключалась в том, что он искал папку в моем каталоге php, а не в корневом каталоге.

Я изменил $result = $uploader->handleUpload('up/'); в $result = $uploader->handleUpload('../up/'); проблема была решена для меня.

person jeremyforan    schedule 30.01.2013

«Загрузчик файлов», я полагаю?

Выполняли ли вы какую-либо базовую отладку, например. добавить обработку ошибок в ваш php-код? Ваш код сломан на нескольких уровнях:

1) move_upload_file требует целевого имени FILE. Вы предоставляете только каталог:

move_uploaded_file('/path/to/destination/on/server.txt', $_FILES['qqfile']['tmp_name']);

2) Вы не проверяете успешность загрузки.

if($_FILES['qqfile']['error'] !== UPLOAD_ERR_OK) {
     die("UPload failed with error code " . $_FILES['qqfile']['error']);
}

Коды ошибок определены здесь: http://php.net/manual/en/features.file-upload.errors.php

person Marc B    schedule 09.11.2012
comment
Нет, все в порядке :D перейдите по ссылке, которую он разместил - person Niko Sams; 10.11.2012
comment
Я использую прекрасный загрузчик, однако я только что попробовал то, что вы предложили, и ничего не изменилось. Я все еще получаю ту же ошибку/проблему. - person user1701398; 10.11.2012