[JQUERY] 어떻게 자바 스크립트, JQuery와 - 아약스를 사용하여 <입력 유형 = '파일'>의 변화에 ​​선택한 파일의 전체 경로를 얻으려면?

어떻게 자바 스크립트, JQuery와 - 아약스를 사용하여 <입력 유형 = '파일'>의 변화에 ​​선택한 파일의 전체 경로를 얻으려면?

해결법

1. ---

   1.보안상의 이유로 브라우저는 이것을 허용하지 않는 경우, 브라우저에서 즉, 자바 스크립트는 시스템 그러나 HTML5 파일 API를 사용하여, 단지 파이어 폭스는 mozFullPath 속성을 제공하는 파일에 액세스 할 수 없습니다,하지만 당신은 가치를하려고하면 빈 문자열을 반환합니다 :

   보안상의 이유로 브라우저는 이것을 허용하지 않는 경우, 브라우저에서 즉, 자바 스크립트는 시스템 그러나 HTML5 파일 API를 사용하여, 단지 파이어 폭스는 mozFullPath 속성을 제공하는 파일에 액세스 할 수 없습니다,하지만 당신은 가치를하려고하면 빈 문자열을 반환합니다 :

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

   http://jsfiddle.net/SCK5A/

   그래서 당신의 시간을 낭비하지 않습니다.

   편집 : 파일을 읽기 위해 파일의 경로를해야 할 경우 대신을 FileReader API를 사용할 수 있습니다. 여기에 SO에 대한 관련 질문은이 업로드 미리보기 이미지 전에.

2. ---

   2.이 시도:

   이 시도:

   그것은 당신이 jsfiddle 예 (selectng 이미지뿐만 아니라 다른 파일에 의해 그것을 시도) 등, 선택한 이미지를 표시하려면이 스크립트를 사용할 수 없습니다 정확한 경로 당신에게 임시 경로를 줄 것이다 : -

   JSFIDDLE

   여기 코드는 다음과 같습니다 -

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

   그것의 당신이 찾고있는 사람이되었지만, 어딘가에 당신을 도울 수있을 수 있습니다 정확히 무엇인지.

3. ---

   3.당신은 그렇게 할 수 없습니다 - 브라우저가 보안상의 이유로이 허용하지 않습니다.

   당신은 그렇게 할 수 없습니다 - 브라우저가 보안상의 이유로이 허용하지 않습니다.

   및 기타

   당신) 놓친; 변경 이벤트 함수의 끝이.

   또한 대신 변경 이벤트에 대한 함수를 생성하지 않습니다 단지 다음과 같이 사용,

   <script type="text/javascript">
   
       $(function()
       {
           $('#fileUpload').on('change',function ()
           {
               var filePath = $(this).val();
               console.log(filePath);
           });
       });
   
   </script>
   

4. ---

   4.당신은 할 수 없습니다. 보안 클라이언트 컴퓨터의 파일링 시스템에 대해 아무것도 아는 당신을 중지 - 그것도 하나를 가질 수 없습니다! 그것은 MAC, PC와 태블릿이 될 수 또는 인터넷 냉장고를 사용할 수 - 알 수 없다, 당신은 모르고 알 수 없습니다. 그리고셔서 전체 경로는 당신에게 클라이언트에 대한 정보를 줄 수 있습니다 - 그것은 예를 들어, 네트워크 드라이브 특히합니다.

   당신은 할 수 없습니다. 보안 클라이언트 컴퓨터의 파일링 시스템에 대해 아무것도 아는 당신을 중지 - 그것도 하나를 가질 수 없습니다! 그것은 MAC, PC와 태블릿이 될 수 또는 인터넷 냉장고를 사용할 수 - 알 수 없다, 당신은 모르고 알 수 없습니다. 그리고셔서 전체 경로는 당신에게 클라이언트에 대한 정보를 줄 수 있습니다 - 그것은 예를 들어, 네트워크 드라이브 특히합니다.

   사실 당신은 특정 조건에서 그것을 얻을 수 있지만 ActiveX 컨트롤을 필요로하고, 상황의 99.99 %에서 작동하지 않습니다.

   (다운로드가 저장하거나 저장하는 경우에도 위치를 전혀 제어 할 것처럼) 그래서 실제로 그것은 당신에게 사용의 많은 어쨌든 아니다 어쨌든 원래 위치에 파일을 복원하는 데 사용할 수 없습니다.

5. ---

   5.당신은이 찾으시는 것입니까?

   당신은이 찾으시는 것입니까?

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

6. ---

   6.당신은 업로드 된 파일에 대한 작업 지역의 URL을 얻기 위해 다음과 같은 코드를 사용할 수 있습니다 :

   당신은 업로드 된 파일에 대한 작업 지역의 URL을 얻기 위해 다음과 같은 코드를 사용할 수 있습니다 :

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

7. ---

   7.한 가지 흥미로운 참고 :이 웹에서 사용할 수 없습니다 비록 당신이 전자에 JS를 사용하는 경우, 당신은이 작업을 수행 할 수 있습니다.

   한 가지 흥미로운 참고 :이 웹에서 사용할 수 없습니다 비록 당신이 전자에 JS를 사용하는 경우, 당신은이 작업을 수행 할 수 있습니다.

   표준 HTML5 파일 입력을 사용하여 실제 파일 경로를 포함, 선택한 파일에 추가 경로 속성을 받게됩니다.

   여기에 전체 문서 : https://github.com/electron/electron/blob/master/docs/api/file-object.md

8. ---

   8.할 수 있습니다, 전체 폴더를 업로드하는 것은 당신을위한 옵션 인 경우

   할 수 있습니다, 전체 폴더를 업로드하는 것은 당신을위한 옵션 인 경우

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

   변경 이벤트가 포함됩니다 :

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

9. ---

   9.반면에 모든 최신 브라우저는 이것을 허용하지 않습니다 ... 당신이 그렇게해서는 안됩니다 ... 그리고 최신 브라우저에서 그것을 시도하는 것은 (내가 아는 어떤에서) 쓸모없는 생각 ...

   반면에 모든 최신 브라우저는 이것을 허용하지 않습니다 ... 당신이 그렇게해서는 안됩니다 ... 그리고 최신 브라우저에서 그것을 시도하는 것은 (내가 아는 어떤에서) 쓸모없는 생각 ...

   당신이 아니라 클라이언트 측에서, 통과 할 수있는 값의 서버 측을 받고 같은 해결 방법을 찾기 위해 몇 가지 다른 링크 (자바 스크립트)

   jQuery를 사용하여 파일 입력에서 전체 경로 어떻게 파이어 폭스 3에서 HTML 입력 양식에서 파일 경로를 얻을 수 있습니다

10. ---

    10.파일 요소를 가지고 배열 전화는 당신이 필요로하는 모든 필요한 물건을 포함하는 파일

    파일 요소를 가지고 배열 전화는 당신이 필요로하는 모든 필요한 물건을 포함하는 파일

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

11. ---

    11.당신이 선택한 파일의 전체 경로는 IE11과 MS 에지에 의해 업로드 할 수 있습니다.

    당신이 선택한 파일의 전체 경로는 IE11과 MS 에지에 의해 업로드 할 수 있습니다.

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

from https://stackoverflow.com/questions/15201071/how-to-get-full-path-of-selected-file-on-change-of-input-type-file-using-jav by cc-by-sa and MIT license