Сохранение блоба изображения javascript в ASP.NET Core Controller - PullRequest
0 голосов
/ 06 июля 2018

Добрый день,

Я пытаюсь отправить изображение большого двоичного объекта javascript методу контроллера в ASP.NET Core, но оно не отправляется на мой контроллер.

У меня есть изображение с моего холста, и оно dataUri, чтобы иметь возможность преобразовать его в блоб JavaScript, я использую этот код:

dataURItoBlob(dataURI) {
// convert base64 to raw binary data held in a string
// doesn't handle URLEncoded DataURIs - see SO answer #6850276 for code that does this
var byteString = atob(dataURI.split(',')[1]);

// separate out the mime component
var mimeString = dataURI.split(',')[0].split(':')[1].split(';')[0]

// write the bytes of the string to an ArrayBuffer
var ab = new ArrayBuffer(byteString.length);

// create a view into the buffer
var ia = new Uint8Array(ab);

// set the bytes of the buffer to the correct values
for (var i = 0; i < byteString.length; i++) {
    ia[i] = byteString.charCodeAt(i);
}

// write the ArrayBuffer to a blob, and you're done
var blob = new Blob([ab], { type: mimeString });
return blob;
}

// Then in my save method here are my javascript codes:
const fileImage = this.dataURItoBlob(myDataUriImage);

axios.post(`Info/Create`, fileImage , {
headers: {
    "Content-Type": "multipart/form-data"
    }
})

Вот мой простой метод контроллера ASP.NET Core

public async Task<IActionResult> Create([FromBody]IFormFile fileImage)
{
 ...
}

Любая помощь, пожалуйста?

1 Ответ

0 голосов
/ 06 июля 2018

Чтобы опубликовать файл через AJAX, вам нужен класс FormData JS.

var formData = new FormData();
formData.append('fileImage', fileImage);

Затем вы отправляете formData вместо fileImage в качестве данных в вашем сообщении.

Имейте в виду, что для отправки файла через AJAX требуется HTML5, что требует современного браузера. Похоже, это не проблема, поскольку вы уже активно используете File API, который также является HTML5. Просто знайте, что ничего из этого не будет работать в чем-то вроде IE10 или менее.

Кроме того, это только для запросов с типом пантомимы multipart/form-data, которые вы здесь используете. Для справки, если вы хотите отправить JSON, файл должен быть закодирован как строка Base64 и отправлен как просто еще один элемент объекта JSON. На стороне сервера вам необходимо привязаться к byte[] вместо IFormFile.

...