Como obter o caminho completo do arquivo selecionado na alteração de <input type = 'file'> usando javascript, jquery-ajax?

Como obter o caminho completo do arquivo enquanto seleciona o arquivo usando <input type=‘file’>

<input type="file" id="fileUpload">
<script type="text/javascript">
function getFilePath(){
     $('input[type=file]').change(function () {
         var filePath=$('#fileUpload').val(); 
     });
}
</script>

mas o filePath var contém o only namearquivo selecionado, não o arquivo full path.
Eu procurei na net, mas parece que, por razões de segurança, os navegadores (FF, chrome) apenas fornecem o nome do arquivo.
Existe alguma outra maneira de obter o caminho completo do arquivo selecionado?

Por motivos de segurança, os navegadores não permitem isso, ou seja, o JavaScript no navegador não tem acesso ao sistema de arquivos; no entanto, usando a API de arquivos HTML5, apenas o Firefox fornece uma mozFullPathpropriedade, mas se você tentar obter o valor, ele retornará uma string vazia:

$('input[type=file]').change(function () {
    console.log(this.files[0].mozFullPath);
});

http://jsfiddle.net/SCK5A/

Então não perca seu tempo.

editar: se você precisar do caminho do arquivo para ler um arquivo, poderá usar a API FileReader . Aqui está uma pergunta relacionada ao SO: visualize uma imagem antes de ser carregada.

Tente isto:

Ele fornecerá um caminho temporário, não o caminho exato; você pode usar esse script se desejar mostrar as imagens selecionadas, como neste exemplo do jsfiddle (tente selecionar imagens e outros arquivos): -

JSFIDDLE

Aqui está o código: -

HTML: -

<input type="file" id="i_file" value=""> 
<input type="button" id="i_submit" value="Submit">
<br>
<img src="" width="200" style="display:none;" />
<br>
<div id="disp_tmp_path"></div>

JS: -

$('#i_file').change( function(event) {
    var tmppath = URL.createObjectURL(event.target.files[0]);
    $("img").fadeIn("fast").attr('src',URL.createObjectURL(event.target.files[0]));

    $("#disp_tmp_path").html("Temporary Path(Copy it and try pasting it in browser address bar) --> <strong>["+tmppath+"]</strong>");
});

Não é exatamente o que você estava procurando, mas pode ser que possa ajudá-lo em algum lugar.

Você não pode fazer isso - o navegador não permitirá isso por questões de segurança.

Quando um arquivo é selecionado usando a entrada type = file object, o valor da propriedade value depende do valor da configuração de segurança "Incluir caminho do diretório local ao carregar arquivos para um servidor" para a zona de segurança usada para exibir a página da Web contendo o objeto de entrada.

O nome do arquivo completo do arquivo selecionado é retornado apenas quando essa configuração está ativada. Quando a configuração está desabilitada, o Internet Explorer 8 substitui a unidade local e o caminho do diretório pela string C: \ fakepath \ para evitar a divulgação inadequada de informações.

E outro

Você perdeu ); isso no final da função de evento de alteração.

Além disso, não crie uma função para o evento change, apenas use-a como abaixo,

<script type="text/javascript">

    $(function()
    {
        $('#fileUpload').on('change',function ()
        {
            var filePath = $(this).val();
            console.log(filePath);
        });
    });

</script>

Você não pode. A segurança impede você de saber algo sobre o sistema de arquivamento do computador cliente - ele pode até não ter um! Pode ser um MAC, um PC, um Tablet ou uma geladeira com acesso à Internet - você não sabe, não pode saber e não saberá. E permitir que você tenha o caminho completo pode fornecer algumas informações sobre o cliente - principalmente se for uma unidade de rede, por exemplo.

Na verdade, você pode obtê-lo sob condições específicas, mas requer um controle ActiveX e não funcionará em 99,99% das circunstâncias.

Você não pode usá-lo para restaurar o arquivo para o local original de qualquer maneira (como você não tem absolutamente nenhum controle sobre onde os downloads são armazenados, ou mesmo se eles são armazenados); portanto, na prática, isso não é muito útil para você.

Você quis dizer isso?

$('#i_file').change( function(event) {
var tmppath = URL.createObjectURL(event.target.files[0]);
    $("img").fadeIn("fast").attr('src',tmppath);       
});

Você pode usar o código a seguir para obter um URL local de trabalho para o arquivo carregado:

<script type="text/javascript">    
    var path = (window.URL || window.webkitURL).createObjectURL(file);
    console.log('path', path);
</script>

Uma observação interessante: embora isso não esteja disponível na Web, se você estiver usando JS no Electron, poderá fazê-lo.

Usando a entrada de arquivo HTML5 padrão, você receberá um extra path propriedade nos arquivos selecionados, contendo o caminho real do arquivo.

Documentos completos aqui: https://github.com/electron/electron/blob/master/docs/api/file-object.md

Você pode, se carregar uma pasta inteira for uma opção para você

<input type="file" webkitdirectory directory multiple/>

evento de alteração conterá:

.target.files[...].webkitRelativePath: "FOLDER/FILE.ext"

você nunca deve fazer isso ... e acho que tentar nos navegadores mais recentes é inútil (pelo que sei) ... todos os navegadores mais recentes, por outro lado, não permitirão isso ...

alguns outros links pelos quais você pode acessar, para encontrar uma solução alternativa, como obter o valor no servidor, mas não no lado do cliente (javascript)

Caminho completo da entrada do arquivo usando o jQuery
Como obter o caminho do arquivo do formulário de entrada HTML no Firefox 3

elemento de arquivo tem e chamada de matriz filesque contém todas as coisas necessárias que você precisa

var file = document.getElementById("upload");

file.addEventListener("change", function() {
    for (var i = 0; i < file.files.length; i++) {
        console.log(file.files[i].name);
    }
}, false);

Você pode obter o caminho completo do arquivo selecionado para carregar apenas pelo IE11 e MS Edge.

var fullPath = Request.Form.Files["myFile"].FileName;