C : \ fakepath를 해결하는 방법?

C : \ fakepath를 해결하는 방법?

---

<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

그러나 로컬 정규 파일 경로를 원합니다 . 이 문제를 해결하는 방법?

이것이 브라우저 보안 문제로 인한 것이라면 이것을 대체하는 방법은 무엇입니까?

---

일부 브라우저에는 JavaScript가 파일의 로컬 전체 경로를 알지 못하게하는 보안 기능이 있습니다. 클라이언트로서 서버가 로컬 시스템의 파일 시스템을 알기를 원하지 않습니다. 모든 브라우저에서이 작업을 수행하면 좋을 것입니다.

---

사용하다

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

대신에

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

---

Internet Explorer, 도구, 인터넷 옵션, 보안, 사용자 정의로 이동 한 경우 "파일을 서버에 업로드 할 때 로컬 디렉토리 경로 포함"을 찾아 "다운"방법을 클릭하십시오. 이 작동합니다

---

onchange입력 파일 유형 의 입력 이벤트에서 FileReader 객체를 사용합니다 ! 이 예제는 readAsDataURL 함수를 사용하므로 태그가 있어야합니다. FileReader 객체에는 이진 데이터를 가져 오는 readAsBinaryString도 있습니다. 나중에이 파일을 사용하여 서버에서 동일한 파일을 만들 수 있습니다

예:

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

---

브라우저가 방해가되는 스크립트 등으로부터 우리를 구해 주어야한다는 것이 기쁘다. IE가 간단한 스타일 수정을 해킹 공격처럼 보이게하는 브라우저에 무언가를 넣는 것에 만족하지 않습니다!

<span>을 사용하여 파일 입력을 나타내므로 <input> 대신 <div>에 적절한 스타일을 적용 할 수 있습니다 (IE로 인해 다시 한 번). 이제는이 IE로 인해 사용자에게 가드와 최소한의 불안감을 줄 수있는 값을 가진 경로를 보여주고 자합니다. (완전히 겁내지 않으면?!) ... 추가 IE-CRAP!

어쨌든, 여기에 설명을 게시 한 사람들 덕분에 IE 브라우저 보안 : input [type = "file"]의 파일 경로에 "fakepath"를 추가 하여 사소한 해결사-상단을 정리했습니다 ...

아래 코드는 두 가지 작업을 수행합니다. 업로드 필드의 onBlur까지 onChange 이벤트가 시작되지 않고 사용자를 놀라게하지 않는 정리 된 파일 경로로 요소를 업데이트하는 IE8 버그를 수정합니다.

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

---

나는 같은 문제에 직면했다. IE8에서는 파일 입력 제어 후에 숨겨진 입력을 작성하여 해결할 수 있습니다. 이것을 이전 형제의 값으로 채 웁니다. IE9에서는이 문제가 수정되었습니다.

전체 경로를 알고 싶어하는 이유는 업로드하기 전에 자바 스크립트 이미지 미리보기를 만드는 것이 었습니다. 이제 선택한 이미지의 미리보기를 만들려면 파일을 업로드해야합니다.

---

uploded 파일의 전체 경로를 실제로 보내야하는 경우 브라우저가 보내지 않으면이 정보를 얻을 수있는 방법이 없으므로 서명 된 Java 애플릿과 같은 것을 사용해야합니다.

---

js로 localhost에서 전체 경로를 찾을 수없는 것처럼 보이지만 파일 이름을 표시하기 위해 fakepath를 숨길 수 있습니다. jQuery를 사용하여 경로없이 파일 입력의 선택된 파일 이름을 가져옵니다.

---

내 경우에는 asp.net 개발 환경을 사용하고 있으므로 asynchronus ajax 요청으로 해당 데이터를 업로드하고 싶었습니다. [webMethod]에서는 정적 요소가 아니기 때문에 파일 업 로더를 잡을 수 없으므로 원하는 이미지를 바이트로 변환하여 DB에 저장하는 것보다 경로를 수정하여 이러한 솔루션을 전환하십시오.

여기 내 자바 스크립트 함수가 도움이되기를 바랍니다.

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

---

파일 리더를 사용하십시오.

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

        }
    }

---

Sardesh Sharma의 답변 사용 보완 :

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

전체 경로.

참고 URL : https://stackoverflow.com/questions/4851595/how-to-resolve-the-c-fakepath