More Related Content Similar to Browser Uploads to S3 using HTML POST Forms Similar to Browser Uploads to S3 using HTML POST Forms (20) More from Hiroyasu Suzuki More from Hiroyasu Suzuki (20) Browser Uploads to S3 using HTML POST Forms3. (Upload)ファイル分散問題
•nfs?
•SPOF対策が面倒...
•s3fs?
•Heavyに利用すると嫌な思い出が...
•...
Saturday, December 17, 11
6. <form action="http://www.suz-lab.com.s3.amazonaws.com/"
method="post" enctype="multipart/form-data">
<input type="hidden" name="key"
value="${filename}"/>
<input type="hidden" name="AWSAccessKeyId"
value="AAAAAAAAAAAAAAAAAAAA"/>
<input type="hidden" name="acl"
value="private"/>
<input type="hidden" name="success_action_redirect"
value="http://www.suz-lab.com/"/>
<input type="hidden" name="policy"
value="pppppppppppppppppppppppppppp"/>
<input type="hidden" name="signature"
value="ssssssssssssssssssssssssssss"/>
<input type="hidden" name="Content-Type"
value="text/plain"/>
<input type="file" name="file"/>
<input type="submit" name="button" value="Upload"/>
</form>
Saturday, December 17, 11
7. <form action="http://www.suz-lab.com.s3.amazonaws.com/"
method="post" enctype="multipart/form-data">
<input type="hidden" name="key"
value="${filename}"/>
<input type="hidden" name="AWSAccessKeyId"
value="AAAAAAAAAAAAAAAAAAAA"/>
<input type="hidden" name="acl"
value="private"/>
<input type="hidden" name="success_action_redirect"
value="http://www.suz-lab.com/"/>
<input type="hidden" name="policy"
value="pppppppppppppppppppppppppppp"/>
<input type="hidden" name="signature"
value="ssssssssssssssssssssssssssss"/>
<input type="hidden" name="Content-Type"
value="text/plain"/>
<input type="file" name="file"/>
<input type="submit" name="button" value="Upload"/>
</form>
Saturday, December 17, 11
8. action
• バケット名.s3.amazonaws.comを指定
• http/httpsが指定可能
•りのバケット名は証明書エラー
www.suz-lab.comのようなドット区切
• 証明書が*.s3.amazonaws.comだから
Saturday, December 17, 11
9. <form action="http://www.suz-lab.com.s3.amazonaws.com/"
method="post" enctype="multipart/form-data">
<input type="hidden" name="key"
value="${filename}"/>
<input type="hidden" name="AWSAccessKeyId"
value="AAAAAAAAAAAAAAAAAAAA"/>
<input type="hidden" name="acl"
value="private"/>
<input type="hidden" name="success_action_redirect"
value="http://www.suz-lab.com/"/>
<input type="hidden" name="policy"
value="pppppppppppppppppppppppppppp"/>
<input type="hidden" name="signature"
value="ssssssssssssssssssssssssssss"/>
<input type="hidden" name="Content-Type"
value="text/plain"/>
<input type="file" name="file"/>
<input type="submit" name="button" value="Upload"/>
</form>
Saturday, December 17, 11
10. key
•S3にアップロードされるオブジェクト
(ファイル)名を指定
•${filename}にするとアップロードする
ファイル名が利用される
Saturday, December 17, 11
11. <form action="http://www.suz-lab.com.s3.amazonaws.com/"
method="post" enctype="multipart/form-data">
<input type="hidden" name="key"
value="${filename}"/>
<input type="hidden" name="AWSAccessKeyId"
value="AAAAAAAAAAAAAAAAAAAA"/>
<input type="hidden" name="acl"
value="private"/>
<input type="hidden" name="success_action_redirect"
value="http://www.suz-lab.com/"/>
<input type="hidden" name="policy"
value="pppppppppppppppppppppppppppp"/>
<input type="hidden" name="signature"
value="ssssssssssssssssssssssssssss"/>
<input type="hidden" name="Content-Type"
value="text/plain"/>
<input type="file" name="file"/>
<input type="submit" name="button" value="Upload"/>
</form>
Saturday, December 17, 11
12. acl
• private
• public-read
• public-read-write
• authenticated-read
• bucket-owner-read
• bucket-owner-full-control
Saturday, December 17, 11
13. <form action="http://www.suz-lab.com.s3.amazonaws.com/"
method="post" enctype="multipart/form-data">
<input type="hidden" name="key"
value="${filename}"/>
<input type="hidden" name="AWSAccessKeyId"
value="AAAAAAAAAAAAAAAAAAAA"/>
<input type="hidden" name="acl"
value="private"/>
<input type="hidden" name="success_action_redirect"
value="http://www.suz-lab.com/"/>
<input type="hidden" name="policy"
value="pppppppppppppppppppppppppppp"/>
<input type="hidden" name="signature"
value="ssssssssssssssssssssssssssss"/>
<input type="hidden" name="Content-Type"
value="text/plain"/>
<input type="file" name="file"/>
<input type="submit" name="button" value="Upload"/>
</form>
Saturday, December 17, 11
14. success_action_redirect
•アップロード完了後のリダイレクト先
•http://www.suz-lab.com/
?bucket=www.suz-lab.com
&key=upload.txt
&etag=%22...%22
Saturday, December 17, 11
15. <form action="http://www.suz-lab.com.s3.amazonaws.com/"
method="post" enctype="multipart/form-data">
<input type="hidden" name="key"
value="${filename}"/>
<input type="hidden" name="AWSAccessKeyId"
value="AAAAAAAAAAAAAAAAAAAA"/>
<input type="hidden" name="acl"
value="private"/>
<input type="hidden" name="success_action_redirect"
value="http://www.suz-lab.com/"/>
<input type="hidden" name="policy"
value="pppppppppppppppppppppppppppp"/>
<input type="hidden" name="signature"
value="ssssssssssssssssssssssssssss"/>
<input type="hidden" name="Content-Type"
value="text/plain"/>
<input type="file" name="file"/>
<input type="submit" name="button" value="Upload"/>
</form>
Saturday, December 17, 11
16. policy
• JSONで記述されたポリシーをBase64で
エンコードしたもの
• ポリシーには有効期限やフォームの
inputタグに記載された内容の条件など
を記述
Saturday, December 17, 11
17. require 'base64'
json = <<"EOS"
{
"expiration": "2012-01-01T00:00:00Z",
"conditions": [
{"bucket": "www.suz-lab.com"},
["starts-with", "$key", ""],
{"acl": "private"},
{"success_action_redirect": "http://www.suz-lab.com/"},
["starts-with", "$Content-Type", ""],
["content-length-range", 0, 1048576]
]
}
EOS
policy = Base64.encode64(json).gsub("n","")
Saturday, December 17, 11
18. <form action="http://www.suz-lab.com.s3.amazonaws.com/"
method="post" enctype="multipart/form-data">
<input type="hidden" name="key"
value="${filename}"/>
<input type="hidden" name="AWSAccessKeyId"
value="AAAAAAAAAAAAAAAAAAAA"/>
<input type="hidden" name="acl"
value="private"/>
<input type="hidden" name="success_action_redirect"
value="http://www.suz-lab.com/"/>
<input type="hidden" name="policy"
value="pppppppppppppppppppppppppppp"/>
<input type="hidden" name="signature"
value="ssssssssssssssssssssssssssss"/>
<input type="hidden" name="Content-Type"
value="text/plain"/>
<input type="file" name="file"/>
<input type="submit" name="button" value="Upload"/>
</form>
Saturday, December 17, 11
19. signature
• Base64でエンコードされたポリシーを
HMAC/SHA-1を使ってシークレットキー
でサインして、さらにBase64でエン
コードしたもの
Saturday, December 17, 11
20. require 'base64'
require 'openssl'
require 'digest/sha1'
...
signature = Base64.encode64(OpenSSL::HMAC.digest(
OpenSSL::Digest::Digest.new('sha1'),
"SECRET_KEY", policy
)).gsub("n","")
Saturday, December 17, 11
21. まとめ
•負荷分散によるアップロードファイル
分散問題
•直接S3にファイルアップロードする
ことで解決
•S3の耐久性と可用性をダイレクト
に利用できるので負荷や障害にも
強いシステムに!
Saturday, December 17, 11
22. 参考資料
• Browser-Based Uploads Using POST
http://docs.amazonwebservices.com/AmazonS3/2006-03-01/
dev/UsingHTTPPOST.html
• Browser Uploads to S3 using HTML POST Forms
http://aws.amazon.com/articles/1434
• Amazon Simple Storage Service: Browser-Based Uploads
using POST Proposal
http://doc.s3.amazonaws.com/proposals/post.html
Saturday, December 17, 11