Upload Temporário de Imagens (usando Base64) com Javascript

<div>
    <p>Sua imagem vai aparecer aqui:</p>
    <div id="container-perfil" class="esconder-container-perfil">
        <img src="" alt="Imagem" id="minha-imagem">
    </div>
    <p><input type="file" id="fileInput" accept="image/*"></p>
</div>

<script>
  // Adiciona um evento para permitir a troca de imagens
  document.getElementById('fileInput').addEventListener('change', function(e) {
      var file = e.target.files[0];
      var containerPerfil = document.getElementById('container-perfil');
  
      if (file) {
          var reader = new FileReader();
  
          reader.onload = function (readerEvent) {
              // Atualiza a imagem com o novo conteúdo
              document.getElementById('minha-imagem').src = readerEvent.target.result;
  
              // Remove a classe para exibir a div do perfil
              containerPerfil.classList.remove('esconder-container-perfil');
          };
  
          // Lê o conteúdo da imagem como uma URL de dados
          reader.readAsDataURL(file);
      } else {
          // Adiciona a classe para ocultar a div do perfil se nenhum arquivo for selecionado
          containerPerfil.classList.add('esconder-container-perfil');
      }
  });
</script>

<style>
  .esconder-container-perfil {
      display: none;
  }

  #minha-imagem {
    max-width: 200px;
    height: auto;
  }
</style>