javascript fakepath上傳 - 如何解決C:\ fakepath?




5 Answers

某些瀏覽器具有防止JavaScript知道文件本地完整路徑的安全功能。 它是有道理的 - 作為一個客戶端,你不希望服務器知道你的本地機器的文件系統。 如果所有瀏覽器都這樣做,那將會很好。

c:\fakepath chrome設定
<input type="file" id="file-id" name="file_name" onchange="theimage();">

這是我的上傳按鈕。

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

這是我必須顯示文件完整路徑的文本字段。

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

這是解決我的問題的JavaScript。 但在警報價值給我

C:\fakepath\test.csv 

Mozilla給我:

test.csv

但我想要本地完全合格的文件路徑 。 如何解決這個問題?

如果這是由於瀏覽器安全問題導致的,那麼應該怎麼做呢?




如果你去Internet Explorer的工具,Internet選項,安全,自定義,找到“包括本地目錄路徑上傳文件到服務器”(這是相當一種方式),並點擊“啟用”。 這將工作




我很高興瀏覽器能夠幫助我們避免使用侵入性腳本等。 我不喜歡IE在瀏覽器中添加一些東西,使得一個簡單的樣式修復看起來像是黑客攻擊!

我用<span>來表示文件輸入,以便我可以將適當的樣式應用於<div>而不是<input>(再次因為IE)。 現在由於這個IE希望向用戶顯示一個值,這個值只能保證讓他們保持警惕,並且至少會感到擔心(如果不是完全嚇到他們的話!)...更多IE-CRAP!

無論如何,感謝那些在這裡發布解釋的人: IE瀏覽器安全:在輸入[type =“file”]中將“fakepath”添加到文件路徑中 ,我將一個小修補程序放在一起...

下面的代碼做了兩件事 - 它修復了一個lte IE8錯誤,其中onChange事件不會觸發,直到上傳字段的onBlur為止,並且它使用不會嚇倒用戶的清理過的文件路徑更新元素。

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



如果你真的需要發送文件的完整路徑,那麼你可能不得不使用類似簽名的java applet,因為如果瀏覽器沒有發送這些信息,沒有辦法獲得這些信息。




在那裡,在我的情況下,我使用的是asp.net開發環境,所以我想要在asynchronus ajax請求中上傳這些數據,在[webMethod]中你不能捕獲文件上傳器,因為它不是靜態元素,所以我不得不通過修復路徑來為這種解決方案創造一個營業額,而不是將想要的圖像轉換為字節以將其保存在數據庫中。

這裡是我的javascript功能,希望它可以幫助你:

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

這裡只用於測試:

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



Related

javascript html dom file-upload