Как передать изображение в кодировке Base64 в конечную точку REST WCF

Question

Я пытаюсь выбрать изображение на моем компьютере и передать данные в конечную точку REST с помощью элемента file.

<input type="file" id="input">

Я могу отобразить изображение и отобразитьэто в браузере. Тем не менее, я получаю пустую строку или объект при передаче изображения в конечную точку, как показано в коде ниже.

(function () {

const inputElement = document.getElementById("input");

inputElement.addEventListener("change", handleFiles, false);
function handleFiles() {

        const reader = new FileReader();
        reader.onload = (function() {

            return function(e) {
                sendFile(e.target.result);
            };

        })();
        reader.readAsDataURL(this.files[0]);
    }


function sendFile(file) {

    let img = {
        'Photo': new Blob([file], {type : 'image/png'})
    };

    const xhr = new XMLHttpRequest();
    xhr.onreadystatechange = function() {
        if (xhr.readyState === 4 && xhr.status === 200) {
            alert(xhr.responseText);
        }
    };

    xhr.open('POST', 'http://localhost/example/service.svc/AddPhoto/', true);
    xhr.setRequestHeader('Content-Type', 'application/json; charset=utf-8');
    xhr.send(JSON.stringify(img));

}})();

Сервис выглядит следующим образом:

    [OperationContract]
    [WebInvoke(UriTemplate = "/AddPhoto/", Method = "POST", 
     RequestFormat = WebMessageFormat.Json, ResponseFormat = 
     WebMessageFormat.Json)]
     void AddPhoto(BlogEntityModel blogEntityModel);

Answer 1

Если вы хотите отправить файл в формате JSON, вы должны принять во внимание две вещи:

• Значение e.target.result - это URI данных.
• Вы не можетеконвертируйте Blob в JSON, используя метод stringify.

Итак, чтобы исправить это, вам просто нужно заменить 'Photo': new Blob([file], {type : 'image/png'}) на 'Photo': file.

Имейте в виду, что в вашемВ этом случае переменная file представляет собой URI данных. Если вы хотите передать только значение Base64, вы должны удалить префикс data:image/xxx;base64,.