Как сохранить загруженную фотографию в мой HTML-проект, используя JavaScript - PullRequest
Новая
       8

Как сохранить загруженную фотографию в мой HTML-проект, используя JavaScript

0 голосов
/ 04 декабря 2018

У меня есть HTML-страница, на которой у вас есть изображение по умолчанию, и если вы нажмете кнопку «Обзор», изображение изменится на изображение, которое вы выбрали для открытия.Прямо сейчас выбранное изображение появляется в HTML, но его все равно нужно сохранить в папке проекта "/ images".

Вот мой код.Я исследовал пару дней, и все, что я пробовал до сих пор, не сработало.Кроме того, я новичок в HTML и JS, так что извините, если есть какие-либо ошибки новичка.Любые идеи о том, что мне нужно добавить в код js?

html: 

 <div class="cc-profile-image"><a href="#"><img src="images/photo.png" alt="Image"/></a></div><!--ORIGINAL PHOTO-->

      <form action="images/photo.png" onchange="previewFile()" >
        Select image to upload:
        <input type="file" name="file" id="file" value>
        <label for="file"> Select a file to upload</label> 
        <input type="submit" value="Subir">
      </form>

js: 

function previewFile(){
          var preview = document.querySelector('img'); //selects the query named img
          //preview.height = "512";
          //preview.width = "512";
          var file    = document.querySelector('input[type=file]').files[0]; //sames as here
          //file.height = "512";
          //file.width = "512";
          var reader  = new FileReader();

          reader.onloadend = function () {
              preview.src = reader.result;
          }

          if (file) {
              reader.readAsDataURL(file); //reads the data as a URL
          } else {
              preview.src = "";
          }
        }

PS: я не использую базы данныхЯ просто хочу сохранить загруженное фото в /images.

1 Ответ

0 голосов
/ 04 декабря 2018

вам не нужна база данных.Но только язык сценариев на стороне сервера может сделать это.В противном случае вы можете хранить его на стороне клиента.Javascript не может хранить файлы на стороне сервера.Он может загружать данные в контроллер [независимо от того, что обрабатывает http-запросы], который принимает файл, а затем контроллер отвечает за его сохранение.

Вот соответствующий ответ.Который сохраняет только текстовый файл на стороне сервера. Сохранение текстового файла на сервере с использованием JavaScript

В противном случае вы можете использовать кеш браузера, вот ссылка для этого. JavaScript: создание и сохранение файла

...