石田さん

本多@hakobera です。

なんとなくネタとして面白そうだったの、
express 3.1 + AWS公式SDK for Node.jsで実装してみました。
Heroku でも Node.js 0.10.3 が動いています。

https://bitbucket.org/hakobera/s3-image-upload-nodejs-on-heroku/src

4/11まで期間限定のLiveデモはこちら
※ 1MBまでのファイルしかあげられないようにしてあります
※ ファイルは適当なタイミングで消していきます

http://desolate-spire-5513.herokuapp.com/

> herokuでは読み出しだけという記事を見つけ、
> 実際に画像を保存できませんでした。ファイルシステムに保存というのはまた別の方法があるのでしょうか?

今回のサンプルだと、express が処理を隠蔽してしまっていますが、
Heroku はファイルを保存できない(=再起動すると消えてしまう)だけで、このように /tmp 以下にはファイルを書き込むことが可能です。

上記リポジトリの routes/upload.js の19行目の下に console.log を追加してみると、実際のファイルのパスが見えます。

  var uploadFile = req.files.upload;
  if (!uploadFile) {
    return res.send('No file is uploaded!');
  }
  console.log(uploadFile); // <= 追加

出力結果

{
  domain: null,
  _events: {},
  size: 115013,
  path: '/tmp/4ad3d88c6a6fb7e6a6fa7ae6fb7884b1.png',
  type: 'image/png',
...
}

というわけで、expresss(実際の処理は formidable
https://github.com/felixge/node-formidableがやっています)
 を使う場合は特に意識する必要もないですし、
自分でファイルを保存したい場合は、/tmp 以下にファイルを書きだして、同様の処理をすれば良いです。

今回はサンプルですのでそのままファイルを保存していますが、
画像は海老原さんの言うとおり、なんらかの画像処理ライブラリ(ImageMagick のラッパーなら Heroku で動きます)で、
本当に画像なのかのチェック、サムネイル作成、リサイズなどを組み込んだ方が良いと思います。

以上、なにか参考になれば。

P.S 今回、海老原さんの所で紹介されているAWSの公式SDKを使ってみましたが、最初 Promise スタイルだったのが、いつのまにか
Node.js 標準API準拠の
コールバックスタイルに変わっていて、使いやすくなってきたなと思いました。


2013年4月9日 20:44 daaishi <[email protected]>:

> ご連絡ありがとうございます。
> はじめまして、宜しくお願いします。
>
> 1.いったんファイルシステムに保存
>
> herokuでは読み出しだけという記事を見つけ、実際に画像を保存できませんでした。
> ファイルシステムに保存というのはまた別の方法があるのでしょうか?
>
> お手数ですが、宜しくお願いします。
>
> 石田
> twitter: @sho1i4da
>
> 2013年4月9日火曜日 20時27分11秒 UTC+9 Ebihara Yuichiro:
>>
>> はじめまして、海老原と申します。
>>
>> ちょうどいま同じようなことをやっています。
>> 以下のサイトが参考になりました。
>>
>> Expressでファイルをアップロード
>> http://www.hacksparrow.com/**handle-file-uploads-in-**
>> express-node-js.html<http://www.hacksparrow.com/handle-file-uploads-in-express-node-js.html>
>>
>> Node.jsからAmazon S3にアップロード
>> http://aws.typepad.com/aws_**japan/2012/12/aws-sdk-for-**
>> nodejs-now-available-in-**preview-form.html<http://aws.typepad.com/aws_japan/2012/12/aws-sdk-for-nodejs-now-available-in-preview-form.html>
>> http://docs.aws.amazon.com/**AWSJavaScriptSDK/latest/AWS/**
>> S3/Client.html#putObject-**property<http://docs.aws.amazon.com/AWSJavaScriptSDK/latest/AWS/S3/Client.html#putObject-property>
>>
>> だいたい以下の様な手順でうまくいっています。
>>
>> 1.いったんファイルシステムに保存
>> 2.それをfs.readFileで読み込み、**S3にアップロード
>> 3.1のファイルをfs.unlinkで削除
>>
>> あと、私の場合はアップロードされたファイルのリサイズ、**サムネイル作成もやっていますが、**以下のリストが役に立ちました。
>> リサイズとS3へのアップロードをいっぺんにやってくれるような**ものもあります。
>> (私はEasyImageを選びましたが)
>>
>> https://github.com/joyent/**node/wiki/modules#wiki-**graphics<https://github.com/joyent/node/wiki/modules#wiki-graphics>
>>
>> 以上、お役に立てば幸いです。
>>
>> --
>> 海老原 雄一郎 / EBIHARA, Yuichiro
>>  Email: [email protected]
>>  Twitter: @yebihara
>>
>>
>>
>> 2013年4月9日 17:15 daaishi <[email protected]>:
>>
>> はじめまして。
>>> 石田と申します。
>>>
>>> 現在、**チャット機能に画像を投稿できる機能を追加しようと考えています**。
>>> そこで、クライアント側のformから画像を選択し、**XHRでデータをサーバーにPOSTし、**サーバーでパスを変更して、フォルダに保存し、**
>>> それをhtmlで表示する機能を実装しました。
>>>
>>> これをherokuで利用したいので、画像データをAmazon 
>>> S3に保存し、それを取り出してhtmlで表示したいのですが、**サーバーで受け取ったデータをどのようにしてAmazon
>>> S3に保存すれば良いかわかりません。
>>>
>>> 知識が足りなく、説明不足の点があるかと思いますが、
>>> アドバイス頂けないでしょうか?
>>> 宜しくお願い致します。
>>>
>>> --
>>>
>>> ---
>>> このメールは Google グループのグループ「Node.js 日本ユーザグループ」の登録者に送られています。
>>> このグループから退会し、メールの受信を停止するには、node**js_jp+unsubscribe@**googlegroups.comにメールを送信します。
>>> その他のオプションについては、https://groups.**google.com/groups/opt_out<https://groups.google.com/groups/opt_out>にアクセスしてください。
>>>
>>>
>>>
>>
>>  --
>
> ---
> このメールは Google グループのグループ「Node.js 日本ユーザグループ」の登録者に送られています。
> このグループから退会し、メールの受信を停止するには、[email protected]にメールを送信します。
> その他のオプションについては、https://groups.google.com/groups/opt_out にアクセスしてください。
>
>
>

-- 

--- 
このメールは Google グループのグループ「Node.js 日本ユーザグループ」の登録者に送られています。
このグループから退会し、メールの受信を停止するには、[email protected] にメールを送信します。
その他のオプションについては、https://groups.google.com/groups/opt_out にアクセスしてください。


メールによる返信