kasumil의 코딩 공작소

버그 체크를 하는데, 간혹 파일 선택을 했는데 다시 파일 선택창이 뜬다. 무엇이 원인인고? 하고 봤더니 라이브러리 자체버그.. 기본 공식문서에서 주는 방법이다. 이렇게 쓰지말고, 그냥 버그 없는 것 같은 라이브러리 버전 찾아서 해당 버전으로 고정해서 쓰자. 이래야 버그가 없더라.

2021.12.29 - [취업/Dropzone] - [Dropzone.js] 게시글 업로드2 [Dropzone.js] 게시글 업로드2 작동 로직은 이러합니다. 1. 유저가 dropzone에 사진 드랍 후 제목, 내용 작성 2. 게시글 업로드 저장 버튼 클릭(dropzone이 보내는 이미지는 base64라서 그냥 db 저장 불가.) 3. 이미지 서버로 이미지 업로 kasumil.tistory.com 이전 글에서 보면 this가 많은데 그 아래에다 넣으면 된다. file로 직접 접근하여 dataUrl을 접근했더니 undefind가 출력되어 어떻게 접근하지 했다가, 해당 코드를 통해서 접근할 수 있었다. 이게 아니면 해당 div태그에 접근하여 src를 추출하는 방법 밖에 없음. this.on('thumbnai..

작동 로직은 이러합니다. 1. 유저가 dropzone에 사진 드랍 후 제목, 내용 작성 2. 게시글 업로드 저장 버튼 클릭(dropzone이 보내는 이미지는 base64라서 그냥 db 저장 불가.) 3. 이미지 서버로 이미지 업로드 후 성공시 url 주소 가져옴. 4. url 주소를 db 서버에 보내기 +++ 이전 로직에 없던 부분이 파일 업로드 체크... 그리고 하다보니 1개를 넘어가면 기존 파일을 삭제하고 다시 업로드 되는 부분도 없어졌더라;; 해당 부분 복구 끝. Dropzone.options.fileDropzone = { url: '이미지 서버주소', //업로드할 url (ex)컨트롤러) init: function () { /* 최초 dropzone 설정시 init을 통해 호출 */ let myD..

작동 로직은 이러합니다. 1. 유저가 dropzone에 사진 드랍 후 제목, 내용 작성 2. 게시글 업로드 저장 버튼 클릭(dropzone이 보내는 이미지는 base64라서 그냥 db 저장 불가.) 3. 이미지 서버로 이미지 업로드 후 성공시 url 주소 가져옴. 4. url 주소를 db 서버에 보내기 이전에 올려놓은 라이브러리 주소 참고하도록 하시고, 스크립트 로직을 구현해 보았습니다. 다들 form데이터에 같이 보내거나 이상하게 hidden으로 넘기고 그러고 있길래, 내 경우 img 서버 주소와 db 저장 주소가 다르기도 하고 그러다보니 쪼갤 필요가 있어 그냥 고민해보다가 이렇게 만들어 봄. 특이하게도 init 안에 넣어놔야 이렇게 구동되는 방식인 듯 싶습니다. image는 그냥 이미지 서버에서 쓸 ..

events: [ "drop" "dragstart" "dragend" "dragenter" "dragover" "dragleave" "addedfile" "removedfile" "thumbnail" "error" "errormultiple" "processing" "processingmultiple" "uploadprogress" "totaluploadprogress" "sending" "sendingmultiple" "success" "successmultiple" "canceled" "canceledmultiple" "complete" "completemultiple" "reset" "maxfilesexceeded" "maxfilesreached" ] this.on('reset', function(..

html 코드 서버전송 아래 코드는 업로드 창에서 무제한(?)으로 업로드 할 수 있다. 하지만, 나는 한개만 업로드하고 기존것을 제거하는 것이 필요하여, 한개만 업로드 하는 기능을 구현하였다. 이제 문제로는 이것을 서버에 제출할때 사진도 한번에 제출하는 방식으로 가야하는데, 그것에대해서 고민해봐야겠다. -공식문서- https://www.dropzone.dev/js/ Dropzone.js Dropzone.js is an open source library that provides beautiful and easy to use drag'n'drop file uploads with image previews. www.dropzone.dev -코드 출처- https://askforyou.tistory.com/9..