Отправляю файл через XMLHttpRequest методом POST, не получаю не какого ответа. В чём проблема?

Question

[Игнат Лобода]

Создаю собственный текстовый редактор для сайта, проблема возникла при отправке изображения на сервер, и вставки его на страницу

Мой JS

var nicUploadButton = nicEditorAdvancedButton.extend({	
	nicURI : 'php.php',
  errorText : 'Не удалось загрузить изображение',

	addPane : function() {
    if(typeof window.FormData === "undefined") {
      return this.onError("Загрузка изображений в этом браузере не поддерживается, вместо этого используйте Chrome, Firefox или Safari.");
    }
    this.im = this.ne.selectedInstance.selElm().parentTag('IMG');

    var container = new bkElement('div')
      .setStyle({ padding: '10px' })
      .appendTo(this.pane.pane);

		new bkElement('div')
      .setStyle({ fontSize: '14px', fontWeight : 'bold', paddingBottom: '5px' })
      .setContent('Вставить изображение')
      .appendTo(container);

    this.fileInput = new bkElement('input')
      .setAttributes({ 'type' : 'file' })
      .appendTo(container);

    this.progress = new bkElement('progress')
      .setStyle({ width : '100%', display: 'none' })
      .setAttributes('max', 100)
      .appendTo(container);

    this.fileInput.onchange = this.uploadFile.closure(this);
	},

  // onError : function(msg) {
  //   this.removePane();
  //   alert(msg || "Не удалось загрузить изображение");
  // },

  uploadFile : function() {
    var file = this.fileInput.files[0];
    if (!file || !file.type.match(/image.*/)) {
      this.onError("Можно загружать только файлы изображений");
      return;
    }
    this.fileInput.setStyle({ display: 'none' });
    this.setProgress(0);

    var fd = new FormData();
    fd.append("image", file);

    var xhr = new XMLHttpRequest();
    xhr.open("POST", this.ne.options.uploadURI || this.nicURI);

    xhr.onload = function() {
      try {
        var data = JSON.parse(xhr.responseText).data;
      } catch(e) {
        return this.onError;
      }
      if(data.error) {
        return this.onError(data.error);
      }
      this.onUploaded(data);
    }.closure(this);
    xhr.onrror = this.onError;
    xhr.upload.onprogress = function(e) {
      this.setProgress(e.loaded / e.total);
    }.closure(this);
    xhr.send(fd);
  },

  setProgress : function(percent) {
    this.progress.setStyle({ display: 'block' });
    if(percent < .98) {
      this.progress.value = percent;
    } else {
      this.progress.removeAttribute('value');
    }
  },

  onUploaded : function(options) {
    this.removePane();
    var src = options.link;
    if(!this.im) {
      this.ne.selectedInstance.restoreRng();
      var tmp = 'javascript:nicImTemp();';
      this.ne.nicCommand("insertImage", src);
      this.im = this.findElm('IMG','src', src);
    }
    var w = parseInt(this.ne.selectedInstance.elm.getStyle('width'));
    if(this.im) {
      this.im.setAttributes({
        src : src,
        width : (w && options.width) ? Math.min(w, options.width) : ''
      });
    }
  }
});

Мой PHP:

<?php
 
$data = array();
 
if( isset( $_POST['uploadfiles'] ) ){
    $error = false;
    $files = array();
 
    $uploaddir = 'img/'; 
 
 
    if( ! is_dir( $uploaddir ) ) mkdir( $uploaddir, 0777 );
 
    foreach( $_FILES as $file ){
        if( move_uploaded_file( $file['tmp_name'], $uploaddir . basename($file['name']) ) ){
            $files[] = realpath( $uploaddir . $file['name'] );
        }
        else{
            $error = true;
        }
    }
 
    $data = $error ? array('error' => 'Ошибка загрузки файлов.') : array('files' => $files );
 
    echo json_encode( $data );
}

Comments

[Дмитрий]

Сделайте отладку в файле пхп
А лучше лог

$arr = ['r' => $_REQUEST, 'p' => $_POST, 'f' => $_FILES];
ob_start();
var_dump($arr);
$content = ob_get_contents();
ob_end_clean();

file_put_contents('log.txt', $content);

[AUser0]

Стоит явно указать тип запроса xhr.setRequestHeader( 'Content-Type', 'multipart/form-data' );

А значение $_POST['uploadfiles'], оно откуда возьмется в PHP, если оно не указано в самом запросе?