Блог

Я застрял со своим скриптом, и я надеюсь, что кто-нибудь сможет мне помочь. Я пытаюсь отправить файл на сервер с помощью Javascript и PHP. Для этого я создал элемент ввода файла

 <input type="file" class="quote_attachment" id="quote_attachment"/>
  

С помощью Javascript я создаю запрос

 <script type="text/javascript">
document.getElementById("quoteform").addEventListener("submit", function(){
    var attachment      = document.getElementById("quote_attachment").value;
    var xhttp           = new XMLHttpRequest();
    xhttp.open("POST", "https://www.mysite/mailer/mailer.php", true);
    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhttp.send('amp;attachment=' attachment);
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 amp;amp; this.status == 200) {
            var data = JSON.parse(this.responseText);       
        }
    }
    event.preventDefault();
});
</script>
  

На стороне сервера я делаю это с помощью PHP

 <?php
if(isset($_POST['attachment'])){
    $allowed = array('ai', 'AI', 'eps', 'EPS', 'pdf', 'PDF', 'svg', 'SVG');
    if($_POST['attachment'] !== ''){
        $get_extension = pathinfo($_POST['attachment'], PATHINFO_EXTENSION);
        if(!in_array($get_extension, $allowed)){
            $errors[] = 'Dit type ondersteunen wij niet';
        }else{
            if(!move_uploaded_file($_FILES["attachment"]["tmp_name"], 'quoteattachment/')){
                echo 'there is something wrong with uploading the file.';
            }
        }
    }   
}
?>
  

Это не весь код, а только часть обработки файла.
Если я запускаю код, я получаю сообщение об ошибке «что-то не так с загрузкой файла.

Кто может мне помочь в этом?

Использование document.getElementById("quote_attachment").value; просто вернет имя файла во входных данных файла. Вы должны использовать .files и передать его в объект FormData. Например:

 <script type="text/javascript">
document.getElementById("quoteform").addEventListener("submit", function(){
    // Get the files in input
    var files = document.getElemenyById("quote_attachment").files;

    // Create formData object
    var formData = new FormData();

    // Might or not be a multi file input, so loop through it
    for (var i = 0; i < files.length; i  ) {
        var file = files[i]

        formData.append('files[]', file);
    }

    var xhttp           = new XMLHttpRequest();
    xhttp.open("POST", "https://www.mysite/mailer/mailer.php", true);
    xhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    xhttp.send('amp;attachment=' formData);
    xhttp.onreadystatechange = function() {
        if (this.readyState == 4 amp;amp; this.status == 200) {
            var data = JSON.parse(this.responseText);       
        }
    }
    event.preventDefault();
});
</script>
  

Теперь, если вы используете var_dump в своей PHP-функции, вы должны получить массив, содержащий все данные файла. Если это произойдет, ваша PHP-функция должна работать без проблем.