Могу предложить через 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
)
)