石田さん
本多@hakoberaです。
> おそらくなのですが、回転を直す処理が完了する前に、次の処理をしてしまっているからでは
> ないかと考えているのですが、この場合、どのように処理をすればよろしいのでしょうか？
本当はソースをどこかに公開してもらえると、より具体的にコメントできるのですが、ないので推測になりますが、これは普通に Node
のコールバックスタイルでの実行順序をきちんと把握せずにプログラムを書いているからではないでしょうか。
fs.readFile を例にすると、
// 1
fs.readFile('some.txt', function (err, data) {
// 2
});
// 3
と書いた場合、処理の順番は、1 => 3 => 2 になります。
ということで、以前に提示したサンプルを node-imagemagick を利用して、
リサイズしてからS3にアップロードするように改造してみました。
https://bitbucket.org/hakobera/s3-image-upload-nodejs-on-heroku/src/5c9f8b3a2cac46ac8ba0c3bb419fa344f7ec9c4a/routes/upload.js?at=master#cl-27
var srcPath = uploadFile.path; var dstPath = srcPath +
'_converted'; console.log('src=%s, dst=%s', srcPath, dstPath);
im.resize({ srcPath: srcPath, dstPath: dstPath,
width: 128, customArgs: [ '-auto-orient' ] }, function
(err, stdout, stderr) { if (err) return next(err);
fs.readFile(dstPath, next); });
こんな感じで、im.resize() のコールバックで変換後のファイルを読みこめば良いはずです。
2013年4月12日 20:39 daaishi <[email protected]>:
> 本多さん
>
> ありがとうございます！
> 無事、サーバにて回転を直すことができました。
>
> また問題がありまして。
> サーバーで回転を直す処理をすると、新しく画像データが生成され、
> それをtmpに保存して、そのデータのパスを利用して、amazon s3に保存するという
> ものを実装しようと挑戦しています。
>
> しかし、新しい画像データをtmpに保存した後、パスを利用しようとすると、
> もとのパスのままになっています。
>
> おそらくなのですが、回転を直す処理が完了する前に、次の処理をしてしまっているからでは
> ないかと考えているのですが、この場合、どのように処理をすればよろしいのでしょうか？
>
> もしくは、別の問題が考えられるかもしれません。
>
> アドバイス宜しくお願い致します。
>
> 石田
>
> 2013年4月11日木曜日 21時28分57秒 UTC+9 hakobera:
>>
>> 石田さん
>>
>> 本多@hakobera です。
>>
>> 以下のブログに書いてあるように、
>> -auto-orient オプションを付けて、imagemagick を実行してあげれば良いと思います。
>>
>> iPhone / iPadの画像が90度回転してしまっているのをサーバ側で直す
>> http://lab.flama.co.jp/**archives/765<http://lab.flama.co.jp/archives/765>
>>
>> node-imagemagick だと、customArgs: ['-auto-orient'] とかしてあげれば良いみたいですね。
>>
>> https://github.com/rsms/node-**imagemagick/issues/66<https://github.com/rsms/node-imagemagick/issues/66>
>>
>>
>>
>> 2013年4月11日 20:34 daaishi <[email protected]>:
>>
>> 海老原さん、本多さん
>>>
>>> アドバイスありがとうございました。
>>> 画像をアップロードすることができました。
>>>
>>> 更に質問があります。
>>> iPhone、**iPadから画像をアップロードすると画像が90度回転してしま**います。
>>> exifに回転のデータがあり、**それをimagemagickで確認することができました。
>>>
>>> これを書き換えて、**画像が回転しないようにと考えているのですが、**行き詰まっています。
>>>
>>> アドバイス頂けないでしょうか。
>>> 宜しくお願い致します。
>>>
>>> 石田
>>>
>>> 2013年4月10日水曜日 14時58分05秒 UTC+9 daaishi:
>>>
>>>> 本多さん
>>>>
>>>> 非常に参考になります！
>>>> /tmp以下に書き込むことは可能なのですね。
>>>>
>>>> socket通信を使い、**画面の遷移をせずに画像をアップしてい**く場合には、**ファイルをサーバーに送り、/tmpに保存し、**pa**
>>>> thを書き換えれば宜しいのでしょうか？
>>>>
>>>> 宜しくお願い致します。
>>>>
>>>> 2013年4月9日火曜日 21時35分08秒 UTC+9 hakobera:
>>>>>
>>>>> 石田さん
>>>>>
>>>>> 本多@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<https://bitbucket.org/hakobera/s3-image-upload-nodejs-on-heroku/src>
>>>>>
>>>>> 4/11まで期間限定のLiveデモはこちら
>>>>> ※ 1MBまでのファイルしかあげられないようにしてあります
>>>>> ※ ファイルは適当なタイミングで消していきます
>>>>>
>>>>> http://desolate-spire-5513.**her**okuapp.com/<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/**4ad3d88c6a6fb7e6a6fa7ae6**fb7884**b1.png',
>>>>> type: 'image/png',
>>>>> ...
>>>>> }
>>>>>
>>>>> というわけで、expresss（実際の処理は formidable https://github.com/felixge/**nod**
>>>>> e-formidable <https://github.com/felixge/node-formidable> がやっています)
>>>>> を使う場合は特に意識する必要もないですし、
>>>>> 自分でファイルを保存したい場合は、/tmp 以下にファイルを書きだして、同様の処理をすれば良いです。
>>>>>
>>>>> 今回はサンプルですのでそのままファイルを保存していますが、
>>>>> 画像は海老原さんの言うとおり、なんらかの画像処理ライブラリ（****ImageMagick のラッパーなら Heroku で動きます）で、
>>>>> 本当に画像なのかのチェック、サムネイル作成、**リサイズなどを組**み込んだ方が良いと思います。
>>>>>
>>>>> 以上、なにか参考になれば。
>>>>>
>>>>> P.S 今回、**海老原さんの所で紹介されているAWSの公式SD**Kを使ってみま**したが、最初 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/**han****dle-file-uploads-in-**express-**
>>>>>>> no**de-js.html<http://www.hacksparrow.com/handle-file-uploads-in-express-node-js.html>
>>>>>>>
>>>>>>> Node.jsからAmazon S3にアップロード
>>>>>>> http://aws.typepad.com/aws_**jap****an/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/**AWS****JavaScriptSDK/latest/AWS/**S3/**
>>>>>>> Cl**ient.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 日本ユーザグループ」の登録者に送られています。
>>>>>> このグループから退会し、メールの受信を停止するには、node****js_jp+unsubscribe@**googlegroups**
>>>>>> .com にメールを送信します。
>>>>>> その他のオプションについては、https://groups.****google.com/groups/opt_out<https://groups.google.com/groups/opt_out>にアクセスしてください。
>>>>>>
>>>>>>
>>>>>>
>>>>>
>>>>> --
>>>
>>> ---
>>> このメールは 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 にアクセスしてください。
