Wie löse ich den C: \ fakepath auf?

<input type="file" id="file-id" name="file_name" onchange="theimage();">

Dies ist mein Upload-Button.

<input type="text" name="file_path" id="file-path">

Dies ist das Textfeld, in dem ich den vollständigen Pfad der Datei anzeigen muss.

function theimage(){
 var filename = document.getElementById('file-id').value;
 document.getElementById('file-path').value = filename;
 alert(filename);
}

Dies ist das JavaScript, das mein Problem löst. Aber in der Warnung gibt mir Wert

C:\fakepath\test.csv 

und Mozilla gibt mir:

test.csv

Aber ich möchte den lokalen vollqualifizierten Dateipfad . Wie kann ich dieses Problem beheben?

Wenn dies auf ein Sicherheitsproblem des Browsers zurückzuführen ist, wie sollte dies dann alternativ erfolgen?

Einige Browser verfügen über eine Sicherheitsfunktion, die verhindert, dass JavaScript den lokalen vollständigen Pfad Ihrer Datei kennt. Es ist sinnvoll - als Client möchten Sie nicht, dass der Server das Dateisystem Ihres lokalen Computers kennt. Es wäre schön, wenn alle Browser dies tun würden.

Verwenden

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

anstatt

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

Ich verwende das Objekt FileReader für das Eingabeereignis onchangefür Ihren Eingabedateityp! In diesem Beispiel wird die Funktion readAsDataURL verwendet. Aus diesem Grund sollten Sie ein Tag haben. Das FileReader-Objekt verfügt außerdem über readAsBinaryString, um die Binärdaten abzurufen, mit denen später dieselbe Datei auf Ihrem Server erstellt werden kann

Beispiel:

var input = document.getElementById("inputFile");
var fReader = new FileReader();
fReader.readAsDataURL(input.files[0]);
fReader.onloadend = function(event){
    var img = document.getElementById("yourImgTag");
    img.src = event.target.result;
}

Wenn Sie zu Internet Explorer, Extras, Internetoption, Sicherheit, Benutzerdefiniert wechseln, suchen Sie den Pfad "Lokales Verzeichnis beim Hochladen von Dateien auf einen Server einschließen" (dies ist ziemlich weit unten) und klicken Sie auf "Aktivieren". Das wird funktionieren

Ich bin froh, dass Browser uns vor aufdringlichen Skripten und Ähnlichem bewahren möchten. Ich bin nicht zufrieden damit, dass der IE etwas in den Browser einfügt, das eine einfache Stilkorrektur wie einen Hack-Angriff aussehen lässt!

Ich habe eine <span> verwendet, um die Dateieingabe darzustellen, damit ich anstelle der <Eingabe> (erneut aufgrund des IE) ein geeignetes Styling auf die <div> anwenden kann. Aus diesem Grund möchte der IE dem Benutzer einen Pfad mit einem Wert zeigen, der ihn garantiert auf der Hut hält und im geringsten besorgt ist (wenn nicht sogar völlig abschreckt ?!) ... MEHR IE-CRAP!

Trotzdem habe ich dank derer, die die Erklärung hier gepostet haben: IE-Browsersicherheit: Anhängen von "fakepath" an den Dateipfad in input [type = "file"] , ein kleines Fixer-Upper zusammengestellt ...

Der folgende Code bewirkt zwei Dinge: Er behebt einen IE8-Fehler, bei dem das onChange-Ereignis erst ausgelöst wird, wenn das Upload-Feld onBlur ist, und aktualisiert ein Element mit einem bereinigten Dateipfad, der den Benutzer nicht erschreckt.

// self-calling lambda to for jQuery shorthand "$" namespace
(function($){
    // document onReady wrapper
    $().ready(function(){
        // check for the nefarious IE
        if($.browser.msie) {
            // capture the file input fields
            var fileInput = $('input[type="file"]');
            // add presentational <span> tags "underneath" all file input fields for styling
            fileInput.after(
                $(document.createElement('span')).addClass('file-underlay')
            );
            // bind onClick to get the file-path and update the style <div>
            fileInput.click(function(){
                // need to capture $(this) because setTimeout() is on the
                // Window keyword 'this' changes context in it
                var fileContext = $(this);
                // capture the timer as well as set setTimeout()
                // we use setTimeout() because IE pauses timers when a file dialog opens
                // in this manner we give ourselves a "pseudo-onChange" handler
                var ieBugTimeout = setTimeout(function(){
                    // set vars
                    var filePath     = fileContext.val(),
                        fileUnderlay = fileContext.siblings('.file-underlay');
                    // check for IE's lovely security speil
                    if(filePath.match(/fakepath/)) {
                        // update the file-path text using case-insensitive regex
                        filePath = filePath.replace(/C:\\fakepath\\/i, '');
                    }
                    // update the text in the file-underlay <span>
                    fileUnderlay.text(filePath);
                    // clear the timer var
                    clearTimeout(ieBugTimeout);
                }, 10);
            });
        }
    });
})(jQuery);

Ich bin auf das gleiche Problem gestoßen. In IE8 könnte dies umgangen werden, indem nach dem Dateieingabesteuerelement eine versteckte Eingabe erstellt wird. Füllen Sie dies mit dem Wert des vorherigen Geschwisters. In IE9 wurde dies ebenfalls behoben.

Mein Grund, um den vollständigen Pfad kennenzulernen, war, vor dem Hochladen eine Javascript-Bildvorschau zu erstellen. Jetzt muss ich die Datei hochladen, um eine Vorschau des ausgewählten Bildes zu erstellen.

Wenn Sie wirklich den vollständigen Pfad der hochgeladenen Datei senden müssen, müssen Sie wahrscheinlich so etwas wie ein signiertes Java-Applet verwenden, da es keine Möglichkeit gibt, diese Informationen abzurufen, wenn der Browser sie nicht sendet.

Anscheinend können Sie nicht den vollständigen Pfad in Ihrem localhost von js finden, aber Sie können den falschen Pfad ausblenden, um nur den Dateinamen anzuzeigen. Verwenden Sie jQuery, um den ausgewählten Dateinamen der Dateieingabe ohne Pfad abzurufen

Verwenden Sie Dateireader:

$(document).ready(function() {
        $("#input-file").change(function() {
            var length = this.files.length;
            if (!length) {
                return false;
            }
            useImage(this);
        });
    });

    // Creating the function
    function useImage(img) {
        var file = img.files[0];
        var imagefile = file.type;
        var match = ["image/jpeg", "image/png", "image/jpg"];
        if (!((imagefile == match[0]) || (imagefile == match[1]) || (imagefile == match[2]))) {
            alert("Invalid File Extension");
        } else {
            var reader = new FileReader();
            reader.onload = imageIsLoaded;
            reader.readAsDataURL(img.files[0]);
        }

        function imageIsLoaded(e) {
            $('div.withBckImage').css({ 'background-image': "url(" + e.target.result + ")" });

        }
    }

Hy dort, in meinem Fall verwende ich asp.net Entwicklungsumgebung, also wollte ich diese Daten in asynchronus ajax Anfrage hochladen, in [webMethod] können Sie den Datei-Uploader nicht abfangen, da es kein statisches Element ist, also musste ich Machen Sie einen Umsatz für eine solche Lösung, indem Sie den Pfad festlegen, und konvertieren Sie dann das gewünschte Bild in Bytes, um es in der Datenbank zu speichern.

Hier ist meine Javascript-Funktion, hoffe es hilft dir:

function FixPath(Path)
         {
             var HiddenPath = Path.toString();
             alert(HiddenPath.indexOf("FakePath"));

             if (HiddenPath.indexOf("FakePath") > 1)
             {
                 var UnwantedLength = HiddenPath.indexOf("FakePath") + 7;
                 MainStringLength = HiddenPath.length - UnwantedLength;
                 var thisArray =[];
                 var i = 0;
                 var FinalString= "";
                 while (i < MainStringLength)
                 {
                     thisArray[i] = HiddenPath[UnwantedLength + i + 1];
                     i++;
                 }
                 var j = 0;
                 while (j < MainStringLength-1)
                 {
                     if (thisArray[j] != ",")
                     {
                         FinalString += thisArray[j];
                     }
                     j++;
                 }
                 FinalString = "~" + FinalString;
                 alert(FinalString);
                 return FinalString;
             }
             else
             {
                 return HiddenPath;
             }
         }

hier nur zum testen:

 $(document).ready(function () {
             FixPath("hakounaMatata:/7ekmaTa3mahaLaziz/FakePath/EnsaLmadiLiYghiz");
         });
// this will give you : ~/EnsaLmadiLiYghiz

Ergänzend zu Sardesh Sharmas Antwort:

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

Für vollen Weg.