Bagaimana cara mendapatkan path lengkap file yang dipilih pada perubahan <input type = 'file'> menggunakan javascript, jquery-ajax?

Cara mendapatkan path lengkap file saat memilih file menggunakan <input type=‘file’>

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

tetapi filePath var berisi only namefile yang dipilih, bukan file full path.
Saya mencarinya di internet, tetapi tampaknya karena alasan keamanan browser (FF, chrome) hanya memberikan nama file.
Apakah ada cara lain untuk mendapatkan path lengkap dari file yang dipilih?

Demi alasan keamanan, peramban tidak mengizinkan ini, yaitu JavaScript di peramban tidak memiliki akses ke Sistem File, namun menggunakan API File HTML5, hanya Firefox yang menyediakan mozFullPathproperti, tetapi jika Anda mencoba untuk mendapatkan nilai, peramban mengembalikan string kosong:

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

http://jsfiddle.net/SCK5A/

Jadi jangan buang waktu Anda.

sunting: Jika Anda memerlukan jalur file untuk membaca file, Anda dapat menggunakan API FileReader sebagai gantinya. Berikut adalah pertanyaan terkait pada SO: Pratinjau gambar sebelum diunggah.

Coba ini:

Ini akan memberi Anda jalan sementara bukan jalur yang akurat, Anda dapat menggunakan skrip ini jika Anda ingin menampilkan gambar yang dipilih seperti dalam contoh jsfiddle ini (Cobalah dengan memilih gambar serta file lain): -

JSFIDDLE

Ini kodenya: -

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>");
});

Ini tidak persis apa yang Anda cari, tetapi mungkin dapat membantu Anda di suatu tempat.

Anda tidak dapat melakukannya - browser tidak akan mengizinkan ini karena masalah keamanan.

Ketika file dipilih dengan menggunakan tipe input = objek file, nilai properti nilai tergantung pada nilai "Sertakan jalur direktori lokal saat mengunggah file ke server" pengaturan keamanan untuk zona keamanan yang digunakan untuk menampilkan halaman Web berisi objek input.

Nama file yang sepenuhnya memenuhi syarat dari file yang dipilih dikembalikan hanya ketika pengaturan ini diaktifkan. Ketika pengaturan dinonaktifkan, Internet Explorer 8 menggantikan jalur drive dan direktori lokal dengan string C: \ fakepath \ untuk mencegah pengungkapan informasi yang tidak pantas.

Dan lainnya

Anda melewatkan );ini di akhir fungsi perubahan acara.

Juga jangan membuat fungsi untuk acara ganti saja gunakan saja seperti di bawah ini,

<script type="text/javascript">

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

</script>

Kamu tidak bisa Keamanan menghentikan Anda karena mengetahui sesuatu tentang sistem pengarsipan komputer klien - bahkan mungkin tidak memilikinya! Itu bisa berupa MAC, PC, Tablet, atau kulkas berkemampuan internet - Anda tidak tahu, tidak bisa tahu dan tidak akan tahu. Dan membiarkan Anda memiliki jalur lengkap dapat memberi Anda beberapa informasi tentang klien - terutama jika itu adalah drive jaringan misalnya.

Sebenarnya Anda bisa mendapatkannya dalam kondisi tertentu, tetapi membutuhkan kontrol ActiveX, dan tidak akan berfungsi dalam 99,99% keadaan.

Anda tidak dapat menggunakannya untuk mengembalikan file ke lokasi semula (karena Anda sama sekali tidak memiliki kendali atas tempat unduhan disimpan, atau bahkan jika itu disimpan) sehingga dalam praktiknya toh tidak banyak gunanya bagi Anda.

Apakah maksud Anda ini?

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

Anda dapat menggunakan kode berikut untuk mendapatkan URL lokal yang berfungsi untuk file yang diunggah:

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

Satu catatan yang menarik: meskipun ini tidak tersedia di web, jika Anda menggunakan JS di Electron maka Anda bisa melakukan ini.

Menggunakan input file HTML5 standar, Anda akan menerima pathproperti tambahan pada file yang dipilih, yang berisi jalur file nyata.

Dokumentasi lengkap di sini: https://github.com/electron/electron/blob/master/docs/api/file-object.md

Anda dapat, jika mengunggah seluruh folder adalah opsi untuk Anda

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

acara perubahan akan berisi:

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

Anda tidak boleh melakukannya ... dan saya pikir mencobanya di browser terbaru tidak berguna (dari apa yang saya tahu) ... semua browser terbaru di sisi lain, tidak akan mengizinkan ini ...

beberapa tautan lain yang bisa Anda lalui, untuk menemukan solusi seperti mendapatkan nilai serveride, tetapi tidak di sisi klien (javascript)

Path lengkap dari input file menggunakan jQuery
Cara mendapatkan path file dari form input HTML di Firefox 3

elemen file memiliki dan memanggil array filesyang berisi semua hal yang diperlukan yang Anda butuhkan

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);

Anda bisa mendapatkan path lengkap dari file yang dipilih untuk diunggah hanya oleh IE11 dan MS Edge.

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