기본 콘텐츠로 건너뛰기

Meteor에서 file API를 사용한 upload 방법

https://gist.github.com/4132544
코드는 이쪽에.

Meteor.saveFile = (file)->
  fileReader = new FileReader()
  fileReader.onload = (blob) ->
    Meteor.call 'saveFile',
      file:file
      blob:blob.srcElement.result
  fileReader.readAsBinaryString file
  return
# event for upload
_.extend Tempalte.something,
  events:
    'change input[name=attach]': (e)->
      _.each e.srcElement.files, (file) ->
        Meteor.saveFile file

클라이언트에서 FileReader 객체를 생성하고 onload 시 파일속성과 바이너리를 인자로 Call을 해준다. submit을 타지 않고 Call을 사용하여 직접 전송한다는 점에 주목.

app=__meteor_bootstrap__.app
  fs=__meteor_bootstrap__.require 'fs'
  app.stack.unshift
    route: '',
    handle: (req, res, next)->
      Fiber(->
        unless /upload\/\/*/gi.test req.url
          next()
        else
          res.write fs.readFileSync("#{process.cwd()}/server/tests/upload/images/#{req.url.replace('/upload/','')}")
          res.end()
      ).run()
  Meteor.methods
    saveFile: (param)->
      if param.file.type.indexOf('image')+1
        Fiber(->
          fs.writeFileSync "#{process.cwd()}/server/tests/upload/images/#{param.file.name}",param.blob,'binary'
        ).run()

Meteor.methods부분 : 서버쪽에서 saveFile이란 method를 받으면서
file이름과 바이너리를 받아 파일 쓰기를 한다.
이때 경로는 tests 경로 아래로 두는데 프로젝트 디렉토리가 아닌 곳으로 해줘도 상관없지만
프로젝트 디렉토리 아래 업로드할 파일을 적재할 경우
Meteor가 파일 생성 여부를 스캔하여 어플리케이션을 재시작하는 것을 방지하기 위해
예외 디렉토리인 tests 를 사용한다.

이렇게 저장한 업로드 파일은 /public 디렉토리 아래에 있지 않아 직접 링크를 전달할 수 없다.

Routing 부분 : __meteor_bootstrap__.app 객체로부터 stack에 request 처리를 직접해준다.
route 를 '' 로 할 경우 모든 요청에 대한 처리를 할 수 있으므로 이를 사용한다.
그러면 handle에서 request별 처리를 할 수 있는데
우리는 /upload/xxxxx 형태의 요청에 대해서만 처리하고 나머지는 next()를 사용해 포워딩해주기로 한다.
해당 형식의 URL 요청을 받을 경우 methods 에서 저장한 디렉토리 경로를 붙여서 response 에 write 해준다.

서버 사이드에서 파일을 읽거나 쓸때 병목을 방지하기 위해서 깨알 Fiber를 붙여줌.
readFileSync 나 writeFileSync 대신 readFile / writeFile 을 써서 callback으로 처리해도 되지만 예외처리 등등 귀찮기도 하고 meteor 디자인 가이드에서 CPS 스타일을 참아달라는 부탁이 있어서 Fiber + Sync 로 구현.

이런 건 뭐 메뉴얼에도 없고 검색도 안되니 소스를 뒤져보는 수밖에.
누군가 보고 '이렇게 하는게 더 나아요'라고 제시해줬으면 싶지만 현재로는 이게 제일 맘에 든다.

댓글

이 블로그의 인기 게시물

Unicode 2.0 에서 한글의 이해

요즘 SNS이나 SNG등등 기계적으로 문장을 생성하는 프로그램들이 넘쳐나는 시대에 의외로 한글처리를 제대로는 프로그램들이 드물구나 하는 생각에 간단한 한글 자소 분석기를 만들어보았다. 링크는 이쪽( http://jsbin.com/ofoqal/10/edit ) 애초에 만든 목적은 다음과 같다. 조사처리(은/는, 이/가, 을/를 등등)를 위해 단어의 마지막 글자의 종성을 조사하기 위함인데 예문을 들어보자면 "준기 는 강남에서 사진 을 찍었다." "예슬 은 홍대에서 식사 를 했다." "슬기 가 대화방에서 나갔습니다." "준기님은 강남에서 사진님을 찍으셨습니다 고갱님" 이라고 말하면 할말 없다. 한국식 소프트웨어(꼭 소프트웨어가 아니더라도)의 특징이자 장점이 무엇이냐라고 물으면 귀찮을 정도로 깨알같은 디테일이라고 대답할텐데 한글 기계화 작업에 대한 중요성은 프로그램을 만드는 사람들에게도 별로 중요하게 다가오지 않나보다. 에또 사설이 길었다. 한때 우리는 한글코드체계의 비표준 숲속에서 너무도 괴로운 나날들을 보낸 역사가 있다. KSC5601부터 시작해서 Microsoft통합형한글을 지나 Unicode 2.0의 시대가 왔다. 개인적으로 UTF-8을 사용하지 않고 EUC-KR이나 CP949를 쓰는 제품이나 서비스의 업체의 대표/관계자에게 1억 미만의 벌금 혹은 3년 이하의 금고형의 실형을 내려줬으면 할 정도로 너무나 많은 사람들을 불행하게 하고 막대한 비용을 지출한 악의 근원이라고 생각한다. 하지만 광명이 왔다. 기계적으로 납득이 가능한 검색 및 정렬이 용이한 Unicode 의 시대가 열렸단 말이다. 지금 당신이 복사해서 붙이고 있는 팁들 보다 훨씬 쉽고 명쾌하니 다음 그림을 한번 보자. (출처: http://www.w3c.or.kr/i18n/hangul-i18n/ko-code.html ) 어떤가? 무쟈게 쉽지 않은가? 현대 한글은 초성 ...

MQTT 접속해제 - LWT(Last will and testament)

통신에서 중요하지만 구현이 까다로운 문제로 "상대방이 예상치 못한 상황으로 인하여 접속이 끊어졌을때"의 처리가 있다. 이것이 까다로운 이유는 상대방이 의도적으로 접속을 종료한 경우는 접속 종료 직전에 자신의 종료 여부를 알리고 나갈 수 있지만 프로그램 오류/네트웍 연결 강제 종료와 같은 의도치 않은 상황에선 자신의 종료를 알릴 수 있는 방법 자체가 없기 때문이다. 그래서 전통적 방식으로는 자신의 생존 여부를 계속 ping을 통해 서버가 물어보고 timeout 시간안에 pong이 안올 경우 서버에서 접속 종료를 인식하는 번거로운 방식을 취하는데 MQTT의 경우 subscribe 시점에서 자신이 접속 종료가 되었을 때 특정 topic으로 지정한 메시지를 보내도록 미리 설정할 수 있다. 이를 LWT(Last will and testament) 라고 한다. 선언을 먼저하고 브로커가 처리하게 하는 방식인 것이다. Last Will And Testament 라는 말 자체도 흥미롭다. 법률용어인데  http://www.investopedia.com/terms/l/last-will-and-testament.asp 대략 내가 죽으면 뒷산 xx평은 작은 아들에게 물려주고 어쩌고 하는 상속 문서 같은 내용이다. 즉, 내가 죽었을(연결이 끊어졌을) 때에 변호사(MQTT Broker - ex. mosquitto/mosca/rabbitMQ등)로 하여금 나의 유언(메시지)를 상속자(해당 토픽에 가입한 subscriber)에게 전달한다라는 의미가 된다. MQTT Client 가 있다면 한번 실습해보자. 여러가지가 있겠지만 다른 글에서처럼  https://www.npmjs.com/package/mqtt  을 사용하도록 한다. npm install mqtt --save 로 설치해도 되고 내 경우는 자주 사용하는 편이어서 npm install -g mqtt 로 전역설치를 했다. 호스트는 무료 제공하고 있는 test.mosquitto.o...

OS X 터미널에서 tmux 사용시 pane 크기 조절

http://superuser.com/a/660072  글 참조. OS X 에서 tmux 사용시 나눠놓은 pane 크기 조정할 때 원래는 ctrl+b, ctrl+↑←→↓ 로 사이즈를 조정하는데 기본 터미널 키 입력이 조금 문제가 있다. 키 매핑을 다시 하자 Preferences(cmd+,) > Profile >  변경하고자 하는 Theme 선택 > Keyboards 로 들어가서 \033[1;5A \033[1;5B \033[1;5C \033[1;5D 를 순서대로 ↑↓→←순으로 매핑이 되도록 하면 된다. +를 누르고 Key에 해당 화살표키와 Modifier에 ctrl 선택 한 후 <esc>, [, 1, ;, 5 까지 한키 한키 입력 후 A,B,C,D를 써준다. 잘못 입력했을 땐 당황하지 말고 Delete on character 버튼을 눌러 수정하도록 하자. 그리고 다시 tmux에서 ctrl+b, ctrl+↑←→↓로 사이즈를 조절해보자. 잘 된다.