[컴] html/js 에서 어떻게 file path 를 얻을 수 있나?

 

thumbnail / 썸네일

html/js 에서 어떻게 file path 를 얻을 수 있나?

결론부터 이야기하면, user 가 browser 를 통해 올린 file 에 대해서 user 의 local 환경에 대한 file path 를 얻을 수는 없다. 보안상의 이유라는 이야기들이 있다.

그래서 ref. 2 처럼 createObjectURL() 을 이용해서 새로운 object를 만들어서 그 url 을 가져다 쓴다. createObjectURL를 사용하고는 꼭 revokeObjectURL를 해주라고 한다.[ref. 3]

const img = document.createElement("img");
img.src = URL.createObjectURL(this.files[i]);
img.height = 60;
img.onload = () => {
  URL.revokeObjectURL(img.src);
};

See Also

1. Using files from web applications - Web APIs | MDN : thumbnail 보여주는 법

Reference

1. How to get full path of selected file on change of <input type=‘file’> using javascript, jquery-ajax? - Stack Overflow
2. javascript - Preview an image before it is uploaded - Stack Overflow
3. URL: createObjectURL() static method - Web APIs | MDN
4. Using files from web applications - Web APIs | MDN