Ответ 1
Используйте data
Пример:
$.post({
url: serverUrl,
data: {
'fileasstring': filedataUrl
},
success: function(response) {
alert('ok');
}
});
Смотрите: http://api.jquery.com/jQuery.post/
У меня есть скриншот в виде двоичной строки. Я хотел бы отправить некоторые данные на сервер, используя функцию $.post().
Мой код:
var filename = "screenshot.jpg":
var filedataUrl = "";// string like 'data:image/jpeg;base64,/9j/4A .....'
$.post(serverUrl, {
title: title
name: name
/*here must be my file */
}, function(response) {
alert('ok');
});
Как я могу указать параметр в виде прикрепленного файла?
Используйте data
Пример:
$.post({
url: serverUrl,
data: {
'fileasstring': filedataUrl
},
success: function(response) {
alert('ok');
}
});
Смотрите: http://api.jquery.com/jQuery.post/
Технически base64 представляет собой текстовое представление двоичных данных - если вы в порядке с этим выше, ответы правильные. Если вы хотите отправить реальные двоичные данные, вы должны использовать FormData.
Если я правильно читаю ваш вопрос, вы сохраняете html "скриншот" в элемент холста. Если это вместо чтения toDataURL
, вы должны использовать toBlob. Это даст вам двоичные данные, которые мы можем отправить с помощью FormData
var form = new FormData();
form.append('image', blob, 'image.jpg');
Выше можно отправить с помощью обычного XMLHttpRequest
:
var request = new XMLHttpRequest();
request.open('POST', 'http://foo.com/submitform.php');
request.send(form);
Рабочий пример → codepen
Если вы заглянете в инспектор хрома, вы увидите, что создается правильный множественный запрос:
------WebKitFormBoundaryGWsPW93HnMPQFcXB
Content-Disposition: form-data; name="image"; filename="image.jpg"
Content-Type: image/jpeg
------WebKitFormBoundaryGWsPW93HnMPQFcXB--
Вы также можете отправить форму выше с помощью jQuery:
$.ajax({
url: 'http://foo.com/submitform.php',
type: 'POST',
data: form,
processData: false,
contentType: false
});
Обновление
Просто увидел ваше уведомление о загрузке файлов на серверной стороне в PHP. Загруженный файл доступен в массиве $_FILES:
<?php
$uploaddir = '/var/www/uploads/';
$uploadfile = $uploaddir . basename($_FILES['image']['name']);
if (move_uploaded_file($_FILES['image']['tmp_name'], $uploadfile)) {
echo "File was successfully uploaded.\n";
} else {
echo "Error";
}
echo 'File info:';
print_r($_FILES);
?>
Вам нужно будет сделать несколько вещей.
Сначала вам нужно разбить filedataUrl. Вам нужны только данные base64, а не остальные. Затем используйте методы в кодировании и декодировании Base64 в Javascript на стороне клиента, чтобы base64 декодировал строку в двоичные данные с переменной длиной.
Затем включите эту переменную в свой почтовый запрос.
Я не думаю, что вы можете загрузить изображение, используя имя файла. Возможно, вам понадобится создать форму с элементом ввода файла, где пользователь может выбрать файл (а не через javascript).
Затем отправьте форму с помощью AJAX.
base64
закодированное изображение также является нормальной строкой. Вы можете передать его как data
в POST jQuery.
Это будет выглядеть следующим образом.
var filename = "screenshot.jpg":
var filedataUrl = "";// string like 'data:image/jpeg;base64,/9j/4A .....'
$.post(serverUrl, {
title: title,
name: name,
image: filedataUrl,
})
.done(function(res){
alert('ok')
})