Загрузка файла изображения с использованием html и javascript, возвращающего поддельный путь

Question

Я пытаюсь загрузить изображение на свой веб-сайт, чтобы добавить его в базу данных в виде строки в кодировке base64.Проблема в том, что я не могу получить путь к файлу, чтобы загрузить его по Java.На внешнем интерфейсе я использую HTML и JavaScript, вот тег HTML:

<div class="col-xs-6">
    <label>passport image </label><input id="image-input" type="file"
                        placeholder="file">
    </div>

в JavaScript, который я добавил:

document.getElementById("image-input").value;

Путь к изображению, которое приходит ко мнеэто "C: \ fakepath \ IMAGE_NAME".Мне нужен способ отправить фотографию или путь к java-коду, как это сделать, если я не использую jsf или spring.

Answer 1

Некоторые браузеры имеют функцию безопасности, которая не позволяет JavaScript знать локальный полный путь вашего файла.Это имеет смысл - как клиент, вы не хотите, чтобы сервер знал файловую систему вашего локального компьютера.

Я использую объект FileReader для события входного обмена для вашего типа входного файла!В этом примере используется функция readAsDataURL, и по этой причине у вас должен быть тег.Объект FileReader также имеет readAsBinaryString для получения двоичных данных, которые впоследствии можно использовать для создания того же файла на вашем сервере

Пример:

var input = document.getElementById("inputFile");
var fReader = new FileReader();
fReader.readAsDataURL(input.files[0]);
fReader.onloadend = function(event){
    var img = document.getElementById("yourImgTag");
    img.src = event.target.result;
}