Resolver fakepath em input file

[FabianoSouza 5]

Gente, meu código de upload estava funcionando normalmente.
Do nada deixou de reconhecer o path do arquivo.

 

To pesquisando há dias. Ainda nenhuma sugestão ajudou.

Eu usava assim (e estava funcionando)

document.getElementById('file-id').value

Nem usando isso  abaixo funciona

document.getElementById("file-id").files[0].name; 
document.getElementById("file-id").files[0].fileName; 

 

Até nessa site ocorre o problema

https://docs.sencha.com/extjs/4.2.1/extjs-build/examples/form/file-upload.html

 

O problema só pode ser no meu PC...não é possível!

 

[Omar~ 87]

Aí depende qual problema mesmo está acontecendo....

 

Porque isso:

5 horas atrás, FabianoSouza disse:

document.getElementById('file-id').value

Quando true obtêm o valor em string de um input, (não o arquivo se for um input tipo file)

 

Já isso:

5 horas atrás, FabianoSouza disse:

document.getElementById("file-id").files[0].name; 

Vai informar o nome do primeiro arquivo anexado a classe nativa "FormData" se ela for requisitada e se o input id "file-id" for um tipo file.

 

 

[FabianoSouza 5]

1 hora atrás, Omar~ disse:

Aí depende qual problema mesmo está acontecendo....

 

Porque isso:

Quando true obtêm o valor em string de um input, (não o arquivo se for um input tipo file)

 

Já isso:

Vai informar o nome do primeiro arquivo anexado a classe nativa "FormData" se ela for requisitada e se o input id "file-id" for um tipo file.

 

 

Pois é, amigo. Não sei explicar a doideira mas isso estava fazendo meu upload funcionar:

 document.getElementById('file-id').value 

Isso passava "C:\Usuarios\Fabiano\Desktop\nomeDoArquivo.jpg"  para um alert.
Agora passa "C:\fakepath\nomeDoArquivo.jpg"

[Omar~ 87]

Lógico o browser está informando o diretório temporário do arquivo de envio.

Isso é para melhor desempenho, quando enviamos um arquivo e logo tentamos enviar o mesmo novamente o browser só informa que o arquivo já foi enviado e é só reaproveitar-lo.

De qualquer forma mostre a função JS para ter uma ideia de como a função se comporta.

 

Tente esse script JS meu para uploads e downloads veja se ocorre o mesmo problema.

https://github.com/Spell-Master/sm-web/tree/master/scripts/FileTransfer

<link href="FileTransfer.css" rel="stylesheet" type="text/css"/>
<script src="FileTransfer.js" type="text/javascript"></script>

<div id="resultado"></div>

<form id="upload_exemplo" onsubmit="return objeto.upload(this.id, 'upload.php', 'resultado', true);">
    <input type="file" name="enviar" />
    <button>Upload</button>
</form>

<script>var objeto = new FileTransfer();</script>

O arquivo upload.php, que vai tratar do arquivo pelo lado do servidor

<?php
/*
 * Esse é só o exemplo do lado do servidor.
 * !! Não há nenhum tratamento aqui por que é só para mostrar o armazenamento !!!
 * 
 * Nota: __DIR__ . '/'   Isso quer dizer o mesmo diretório onde está esse arquivo
 */
move_uploaded_file($_FILES['enviar']['tmp_name'], __DIR__ . '/' . $_FILES['enviar']['name']);
echo ("Arquivo enviado <br />FILE INFO:<pre>");
var_dump($_FILES);
echo ("</pre>");

 

[FabianoSouza 5]

OK... a "interface" (form, botão submit e etc)  eu crio com JS. Veja um trecho...só coloquei o trecho da criação do form pq creio que não haja problema nessa parte do secript...

// cria FORM
  var $frm = document.createElement('form')
  $dvContainer.appendChild($frm);
  $frm.setAttribute('method','post');
  $frm.setAttribute('name','frmFotoCandidato');
  $frm.setAttribute('id','frmFotoCandidato');
  $frm.setAttribute('action','../vagas/candidatos/backend/uploadFotoCandidato/');
  $frm.setAttribute('enctype','multipart/form-data');
  $frm.setAttribute('onsubmit','return uploadFotoCandidato(this);');

Aqui segue o script que faz o upload...que é onde deve estar o problema.
Meu back end é em ASP...lá está tudo ok.

function uploadFotoCandidato(objFrmElem)
{
  var $pesoMax = 200000
  , $frmFoto = document.getElementById('frmFotoCandidato')
  , $codCandidato =  $frmFoto['codCandidato'].value
  , $valArquivo = $frmFoto['arquivo'].value; //************ AQUI É O INPUT FILE ***************
  if ($valArquivo !='')
	{
	  var $files = $frmFoto['arquivo'].files // FileList object
	  //Recupera atributos do arquivo
	   , $nome = $files[0].name
	   , $tipo = $files[0].type
	   , $peso = $files[0].size;
	}
  if ($valArquivo == '')
  {
	alert('Selecione um arquivo')
	return false;
  }
  if ($tipo != 'image/jpeg')
  {
	alert('Selecione apenas arquivos do tipo JPEG')
	return false;
  }
  if ($peso > $pesoMax)
  {
	alert('Arquivo muito grande. Selecione um arquivo menor do que 200 KB')
	return false;
  }
  document.getElementById('animaLoading').style.display = 'inline';
  document.getElementById('btnEnvFotoCand').disabled = true;
  var $xhr = new XMLHttpRequest();
  $xhr.onload = function(){
	  try {
	  var $oJson = JSON.parse($xhr.responseText);
  } catch(e) {
	alert('Erro: ' + 'Não foi possível obter dados em formato válido.')
	document.getElementById('animaLoading').style.display = 'none'
	return false;
  }
  if ($oJson[0].codMsg == 1) // SE HOUVE SUCESSO ....
  {
  var $foto = document.getElementById('srcFotoCandidato');
  $foto.setAttribute('src',$oJson[0].strImg)
  $foto.style.display = 'block'
  $foto.previousSibling.lastChild.style.display = 'block' //reexibe a span Excluir

  var $dvMiniModal = document.getElementById(objFrmElem.parentNode.id)
  , $overlay = $dvMiniModal.parentNode.firstChild.id  
  $dvMiniModal.parentNode.removeChild($dvMiniModal);
  document.getElementById($overlay).style.zIndex= '0'
  return false;
  }
  if ($oJson[0].codMsg == 2 || $oJson[0].codMsg == 3) // CASO OCORRA ERRO NO BACK END...
  {
	document.getElementById('animaLoading').style.display = 'none';
	document.getElementById('btnEnvFotoCand').disabled = false;
	alert($oJson[0].msg)
	return false;
  }
}

  $xhr.open (objFrmElem.method, objFrmElem.action, true);
  $xhr.send (new FormData (objFrmElem));
  return false;
}

Estou anexando um print para ajudar a ilustrar.
O primeiro código aqui acima cria a tela menor, com fundo branco (lembrando que só postei o trecho que cria o form).
O segundo código é para enviar o formulário (DataForm) no envento onsubmit.
 

[Omar~ 87]

Bem, ASP não entendo desde sempre rejeitei por ser extremamente limitada e falha...

Enfim, tentou fazer assim?

$valArquivo = document.getElementById('id_do_input_tipo_file').value;

ao invés de

$valArquivo = $frmFoto['arquivo'].value;

Não sei se aqui você se referiu a isso

20 horas atrás, FabianoSouza disse:

document.getElementById('file-id').value

 

 

Porque ao meu ver, parece que aqui você está pegando o ID do form e não o do input onde está o texto do arquivo inserido:

$frmFoto = document.getElementById('frmFotoCandidato')

[FabianoSouza 5]

Salve salve pessoal!

Formatei minha máquina e o problema resolveu!
Não sei explicar o que houve. Creio que após fazer limpeza de uns vírus, deve ter dado pane em alguma coisa do Windows.

 

Fiz uma checagem. Sempre vai aparecer o tal fakepath. O problema não estava nisso e sim em meu computador.
Agora mesmo aparecendo o tal fakepath o código funciona.
Até fiz um vídeo para mostrar funcionando - Vejam em  Vídeo do upload

Obrigado pela atenção ao meu problema, Omar~!
 

[Omar~ 87]

Sinistro! Nunca vi coisa assim, se fosse comigo, iria fazer de tudo menos formatar a máquina.