안녕하세요 이번에는 네이버에 SmartEditor 2.0 을 사용 할려고 기술검토를 하고 있었습니다. <div><br></div> <div><br></div> <div>글꼴 , 색상 , 정렬 이런것들이 눈에 안보이는 태그로 감쌓아서 그대로 db로 넣으니깐</div> <div>신기하면서 동작이 잘되는걸 확인 했습니다. 문제는 이제 사진을 넣을때 발생 했습니다.</div> <div><br></div> <div><br></div> <div><br></div> <div>텍스트 박스에 사진을 넣는 방식이 </div> <div><br></div> <div>1. 사진 추가 클릭 ( 이미지 선택 팝업창이 뜸 )</div> <div>2. 사진을 드래그 or 선택하여 팝업창의 확인을 누름</div> <div>3. 텍스트 박스에 이미지가 뜨기전 서버로 이미지를 바로 up시킴 ( 이 개념을 아는데 시간이 걸렸습니다 )</div> <div>4. 이미지가 업된 서버에 ajax를 이용하여 텍스트 박스는 경로만 나타나게 한다. ( ajax로 인해 F5를 누르지 않아도 바로 불러온다고 합니다 )</div> <div><br></div> <div><br></div> <div>여기서 3번을 이해하는데 어마어마하게 고생 했습니다. 대부분은 글과 함께 전송을 눌렀을시 이미지가 올라가지만</div> <div>네이버 스마트 에디터는 사진을 고르고 확인만 눌러도 바로 업이 된다는게...;; 소스보고 겨우겨우 해석 했습니다.</div> <div><br></div> <div>그런데 문제가... 아무래도 이미지 업은 환경마다 다르기 때문에 네이버 사용 설명서에서도 이미지 업에 관한건 나오지가 않았습니다.</div> <div>네이버 설명서를 보고 최대로 알아낸 정보가</div> <div><br></div> <div><div style="text-align:left;"><img src="http://thimg.todayhumor.co.kr/upfile/201506/1434504303JZO2pQE4W82PKBP3HmhfPlPpTF8v.jpg" width="707" height="484" alt="에러4.JPG" style="border:none;"></div><br></div> <div><br></div> <div>이 소스를 이용하면 밑에</div> <div>oAjax.header("file-name",encodeURICompnent(tempFile.name));</div> <div>oAjax.header("file-size",tempFile.size);</div> <div>oAjax.header("file-Type",tempFile.type);을 통해서 node js 백단에</div> <div><br></div> <div><br></div> <div><div style="text-align:left;"><img src="http://thimg.todayhumor.co.kr/upfile/201506/1434504432SroSiqCVf5cfOEPQzD.png" width="116" height="144" alt="KakaoTalk_20150616_192136632.png" style="border:none;"></div><br></div> <div><br></div> <div>요렇게 이름, 용량 ,타입을 가져 왔습니다. 그래서 신나게 이걸 이용해서 이미지를 업시키면 끝나겠구나 라고 좋아했는데</div> <div>믱? 뭔가 허전한 느낌이 들어서 확인해본 결과....... 가장 중요한 path.... 파일의 경로가 없는 것이였습니다..ㅠㅠㅠ</div> <div>node js로 파일을 업할때 쓰는 소스가</div> <div><br></div> <div><div style="font-family:'나눔고딕', NanumGothic, '돋움';font-size:13px;list-style:none;margin:0px;padding:0px .5em;color:#666666;line-height:20.7999992370605px;">var ws = fs.createWriteStream(outputPath);</div> <div style="font-family:'나눔고딕', NanumGothic, '돋움';font-size:13px;list-style:none;margin:0px;padding:0px .5em;color:#666666;line-height:20.7999992370605px;"> fs.createReadStream(path).pipe(ws);</div></div> <div style="font-family:'나눔고딕', NanumGothic, '돋움';font-size:13px;list-style:none;margin:0px;padding:0px .5em;color:#666666;line-height:20.7999992370605px;"><span style="line-height:20.7999992370605px;">방법으로 ws는 파일이 올라갈 경로+이름 path는 현재 있는 파일 경로로 올렸는데...</span></div> <div style="font-family:'나눔고딕', NanumGothic, '돋움';font-size:13px;list-style:none;margin:0px;padding:0px .5em;color:#666666;line-height:20.7999992370605px;"><span style="color:#000000;font-family:'굴림';font-size:12px;line-height:18px;">oㅁ</span></div> <div style="font-family:'나눔고딕', NanumGothic, '돋움';font-size:13px;list-style:none;margin:0px;padding:0px .5em;color:#666666;line-height:20.7999992370605px;"><span style="color:#000000;font-family:'굴림';font-size:12px;line-height:18px;">네이버에서 받은 정보는 경로가 없다 보니깐 이미지를 서버에 올리질 못했습니다.</span></div> <div style="font-family:'나눔고딕', NanumGothic, '돋움';font-size:13px;list-style:none;margin:0px;padding:0px .5em;color:#666666;line-height:20.7999992370605px;"><span style="color:#000000;font-family:'굴림';font-size:12px;line-height:18px;">그래서 다시 네이버에서 제공준 js를 뒤적뒤적 한 결과 네이버 측에서 이미지 업시키라고 주는</span></div> <div style="list-style:none;margin:0px;padding:0px .5em;">파일에 대한 정보 (오브젝트) 덩어리를 console.log 로 찍는데 성공 했습니다.</div> <div style="list-style:none;margin:0px;padding:0px .5em;"><br></div> <div style="list-style:none;margin:0px;padding:0px .5em;"><br></div> <div style="list-style:none;margin:0px;padding:0px .5em;"><div style="text-align:left;"><img src="http://thimg.todayhumor.co.kr/upfile/201506/1434504606Wsr3IrwLIjuJscJ.jpg" width="572" height="159" alt="파일.JPG" style="border:none;"></div><br></div> <div style="list-style:none;margin:0px;padding:0px .5em;">믱? 아니 왜.... 이미지 업시키라고 준 정보 덩어리에서도 path 경로를 빼고 주는 걸까요?</div> <div style="list-style:none;margin:0px;padding:0px .5em;">설명서에는 분명 이걸로 업시켜라 환경은 다 다르니 그건 이제 너가 알아서.... 이런식으로 나와 있는데...</div> <div style="list-style:none;margin:0px;padding:0px .5em;">혹시 저기 있는 정보만으로도 이미지를 업 시킬수 있는데 제가 미숙해서 못하는 것 일까요?</div> <div style="list-style:none;margin:0px;padding:0px .5em;"><br></div> <div style="list-style:none;margin:0px;padding:0px .5em;"><br></div> <div style="list-style:none;margin:0px;padding:0px .5em;">질문 하기전에 좀더 원초적으로 소스를 들어가서 path를 추가 하려고 했으나 min.js파일에다가 js가 너무 많아서 여러번 실패끝에</div> <div style="list-style:none;margin:0px;padding:0px .5em;">이렇게 질문 드리게 됩니다. 저 정보만으로 파일을 올릴수 있는지 조언 부탁드립니다.</div>
댓글 분란 또는 분쟁 때문에 전체 댓글이 블라인드 처리되었습니다.