programing

변경 시 선택한 파일의 전체 경로를 가져오는 방법변경 시 선택한 파일의 전체 경로를 가져오는 방법javascript, jquery-discript를 사용할까요?javascript, jquery-discript를 사용할까요?

yoursource 2022. 11. 22. 22:26
반응형

변경 시 선택한 파일의 전체 경로를 가져오는 방법javascript, jquery-discript를 사용할까요?

파일을 선택하는 동안 파일의 전체 경로를 가져오는 방법<input type=‘file’>

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

filePath 변수에는only name선택한 파일의full path.
인터넷으로 검색했는데 보안상의 이유로 브라우저(FF, chrome)에서 파일 이름만 알려준 것 같습니다.
선택한 파일의 전체 경로를 얻을 수 있는 다른 방법이 있습니까?

보안상의 이유로 브라우저의 JavaScript는 파일시스템에 액세스 할 수 없지만 HTML5 파일 API를 사용하면 Firefox만이 파일시스템에 액세스 할 수 있습니다.mozFullPath값을 가져오려고 하면 빈 문자열이 반환됩니다.

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

https://jsfiddle.net/SCK5A/

그러니 시간을 낭비하지 마세요.

edit: 파일을 읽기 위해 파일 경로가 필요한 경우 FileReader API를 대신 사용할 수 있습니다.SO: 이미지를 업로드하기 전에 미리보기 관련 질문입니다.

시험:

정확한 경로가 아닌 임시 경로를 제공합니다. 이 jsfiddle 예시와 같이 선택한 이미지를 표시하려면 이 스크립트를 사용하십시오(이미지와 다른 파일을 선택하여 시도합니다).-

JSFIDLE

코드는 다음과 같습니다.-

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

당신이 찾던 것은 아니지만 어딘가에 도움이 될 수도 있습니다.

이렇게 할 수 없습니다. 보안상의 문제로 인해 브라우저는 이를 허용하지 않습니다.

input type=file 객체를 사용하여 파일을 선택하면 값 속성의 값은 입력 객체가 포함된 웹 페이지를 표시하는 데 사용되는 보안 영역의 "서버에 파일을 업로드할 때 로컬 디렉토리 경로 포함" 보안 설정 값에 따라 달라집니다.

선택한 파일의 완전 수식 파일명이 반환되는 것은, 이 설정이 유효하게 되어 있는 경우 뿐입니다.설정이 비활성화되면 Internet Explorer 8은 부적절한 정보 노출을 방지하기 위해 로컬 드라이브 및 디렉터리 경로를 문자열 C:\fakepath\로 바꿉니다.

그리고 기타

놓치셨네요);이것은 변경 이벤트 기능의 마지막에 표시됩니다.

또한 변경 이벤트를 위한 기능을 만들지 말고 아래와 같이 사용하십시오.

<script type="text/javascript">

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

</script>

그럴수는 없어요.보안에 의해 클라이언트 컴퓨터의 파일 시스템에 대해 아는 것이 없어집니다.클라이언트 컴퓨터에는 파일 시스템이 없을 수도 있습니다.MAC, PC, 태블릿 또는 인터넷 대응 냉장고를 사용할 수 있습니다.모르거나 알 수 없거나 알 수 없습니다.또, 풀 패스를 취득하면, 클라이언트에 관한 정보(특히 네트워크 드라이브등)를 얻을 수 있습니다.

실제로는 특정 조건 하에서 취득할 수 있지만 ActiveX 컨트롤이 필요하며 99.99%의 상황에서는 동작하지 않습니다.

파일을 원래 위치에 복원하는 데 사용할 수 없기 때문에(다운로드가 저장되는 위치나 저장되는 위치에 대한 제어가 전혀 없기 때문에) 실제로는 그다지 유용하지 않습니다.

다음 코드를 사용하여 업로드된 파일의 작동 로컬 URL을 가져올 수 있습니다.

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

이거 진심이었어?

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

한 가지 흥미로운 점은 웹에서는 사용할 수 없지만 전자에서 JS를 사용하고 있다면 사용할 수 있다는 것입니다.

입력을 HTML5 파일을 path실제 파일 경로를 포함하는 선택한 파일의 속성.

자세한 내용은 이쪽: https://github.com/electron/electron/blob/master/docs/api/file-object.md

전체 폴더를 업로드할 수 있는 경우

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

변경 이벤트 내용:

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

절대 경로 전체가 아니라 상대 경로만 들어있어요Firefox에서도 지원됩니다.

절대 그러면 안 돼...최신 브라우저로 시도해봐도 소용없을 것 같아요.한편, 모든 최신 브라우저는 이를 허용하지 않습니다.

다른 링크를 통해 값 serverside와 같은 회피책을 찾을 수 있지만 clientside에서는 찾을 수 없습니다(subscript).

jQuery를 사용한 파일 입력의 전체 경로
Firefox 3에서 HTML 입력 양식에서 파일 경로를 가져오는 방법

FileReader API를 사용하여 img 요소의 src를 변경할 수 있습니다.

https://developer.mozilla.org/en-US/docs/Web/API/FileReader/readAsDataURL

에는 및 콜이 .files한 있다

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);
$('input[type=file]').change(function () {
    console.log(this.files[0].path);
});

이것이 올바른 양식입니다.

IE11 및 MS Edge에서만 업로드할 선택한 파일의 전체 경로를 가져올 수 있습니다.

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

언급URL : https://stackoverflow.com/questions/15201071/how-to-get-full-path-of-selected-file-on-change-of-input-type-file-using-jav

반응형