3

Вопрос заключается в следующем при помощи тега <input type="file"> мы выбираем файл, и после нажатия кнопки мы его отправляем на сервер, так вот перед тем как отправить его на сервер хотелось бы ему дать новое имя и уже с новым именем отправить его на сервер.

function onChangeFile(e) {
    var eventData = e.dataTransfer || e.target;
    var files = eventData.files;
    for (var i = 0, file; file = files[i]; i++) {
        file[i].name = 'new-name-' + i + '.txt'; // расширение не важно...
    }
    //... тут дальше код обработки и отправки
}
1
  • Переименовать или сделать копию с новым импнем. И уже потом отправить.
    – Sergey
    14 апр 2016 в 0:44

1 ответ 1

4

Могу предложить через FormData

У которого есть метод append, который может принимать два или три параметра. В случае трех параметров будет выглядеть так: formData.append(name, value, filename);, где как третий параметр то, что и нужно

filename - Имя файла которое будет отправлено серверу (USVString), когда Blob или File прошел проверку как второй параметр. Стандартное имя файла для Blob объектов это "blob".

Минимальный пример:

$(document).on('click', '#btn', function(){
    var formData = new FormData();
    formData.append("myFile", document.getElementById("file").files[0], 'chris1.jpg');
    
    var xhr = new XMLHttpRequest();
    xhr.open("POST", "index.php");
    xhr.send(formData);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form method="post" enctype="multipart/form-data" action="">
<input type="button" id="btn" value="GO" />
<input type="file" id="file" name="file" />

В итоге на сервер полетит следующее:

Content-Disposition: form-data; name="myFile"; filename="test.jpg"
Content-Type: image/jpeg

То есть картинка с именем test.gpg

Убедиться, что это правда - можно написав в php банальный print_r($_FILES) и получим:

Array
(
    [myFile] => Array
        (
            [name] => test.jpg
            [type] => image/jpeg
            [tmp_name] => W:\userdata\temp\php7731.tmp
            [error] => 0
            [size] => 875248
        )
)
1
  • IE 10+?.......... 13 апр 2016 в 18:32

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.