Cloud Frontから特定のS3バケットにある画像にアクセスできるようにする（cache distributionパターン）AWSS3route53CloudFrontTerraform やりたかったこと s3にuploadした画像を cache distributionパターンで管理しアクセスできるようにしたい。 Infrastructure as Code100%を目指しているので、リソースの作成はterraformで！ ※ 独自ドメインでアクセスできるようにしたいのでroute53の設定もしますが、SSL証明書は発行してある前提です。Cloud Frontはus-eastで発行しないと作成できないので要注意です！（罠） 構成 作成手順 上の構成図の下から順に作っていこうと思います👍 全てのterraformコードを載せています。 S3の作成
AWS S3 + CloudFront のCORS設定手順
（画像はAWS-CloudDesignPatternから引用） フォントファイルの豆腐化問題Font Awesomeのようなフォントファイルを外部ホスト（例えばS3など）から読み込もうとする場合、Access-Control-Allow-OriginのヘッダでAllowされていないOriginからのリクエストの場合、いわゆるフォントの豆腐現象が起きます。これはCORS(Cross-Origin Resource Sharing) の設定が正しくなされていないためです。今回はAWSのS3+CloudFrontの構成でフォントファイルを配信したいので、S3およびCloudFrontのCORS設定手順および確認方法について説明します。 S3の設定CORSの設定はS3のバケットのプロパティ設定から行えます。 XMLをサンプルとして下記のように設定できます。 CORS Configuration <
大規模トラフィックを捌くための CloudFront 以外の選択肢 – I'm Sei.
〜 大晦日に秒間 1 万ユーザを捌くためにやったこと (ロードバランサー編) 〜今回、ロードバランサーは全面的に AWS の Elastic Load Balancing (ELB) を使用しました。 Web API を提供するシステムにはもともと ELB を使う予定だったのですが、静的ファイルの配信などは ClouldFront + S3 という構成でいこうと思っていました。 が、最終的には静的ファイルを配信するシステムも ELB + EC2 という構成になりました。 そのへんの経緯とか、AWS を使うときのシステムのフロント周りの負荷分散にはどういう選択肢があるのかとか、軽くまとめてみようと思います。 静的ファイルの配信には CloudFront を使ったほうがいいのかCloudFront は S3 と併用することで、静的なファイルの配信のことはほとんど考えなくていい、というくらい簡単
CloudFront + nginx(http_image_filter_module) + S3 を使って画像変換サーバを構築する - 本日も乙
珍しく(初めて?)AWSネタです。 仕事でAWSのVPCを構築しているのですが、画像を取り扱うサーバが欲しいとの要望がありました。 画像を表示するだけならCloudFront+S3だけで強力な画像(CDN)サーバを構築することができるのですが、今回は画像サイズもリアルタイムで変換して表示してほしいとのことでした。 幸いにも社内で以前、nginxのhttp_image_filter_moduleを使って画像変換している実例(実サーバ)があるのでそれを参考に構築してみました。 構成図 簡単な図です。 今回やりたかったこと ユーザが独自ドメインとマッピングされたCloudFrontにアクセスすると、CloudFrontに画像がキャッシュされていればその画像を返します もし画像がキャッシュされていなければELB・EC2インスタンス経由でS3にある画像を取得します EC2インスタンスにhttp_im
よく訓練されたアップル信者、都元です。本日は画像加工処理のお話。 チューター クラスメソッド社にはチューターというWebサイトパフォーマンスチューニングのサービスがあります。チューニングのポイントは、一般的に言われていることから、AWSを利用したアプリケーションアーキテクチャまで様々です。 一般的なWebサイトパフォーマンス向上の施策として、画像まわりのチューニングも色々あります。少し考えるだけでも、「CSSスプライト」「サイズ変換」「画像の軽量化」など、多くのテクニックがあります。しかし画像というのは、見栄えは良くしたいがパフォーマンスは落としたくない、というトレードオフに挟まれることが多く、扱いが難しい *1ことが多々あります。 よくあるパフォーマンスチューニングポイントとしては、「画像をHTML/CSSでリサイズしてしまっている」というものです。具体的には、例えばページ上に100x1
QiitaとKobitoで画像アップロードができるようになりました。 その後ろ側をちょっぴり公開します。 件名からも分かるように、背後ではAWSのS3を画像ストレージに採用しています。 画像アップロード機能をリリースしました - The Official Qiita Blog Kobito v1.6.1リリース: ドラッグ&ドロップやスクリーンショット撮影で簡単に画像を添付できるようになりました! - The Official Qiita Blog 用語統一 サーバ はQiitaのサーバのことを指すことにします。（つまり、S3ではない、ということ） また クライアント は各ユーザのブラウザのことを指します。 要件 画像アップロード機能を実装するにあたっていくつかの要求がありました。 成りすましを防げる アップロードされたファイルを管理できる 自分達のサーバに負荷をかけたくない 変な画像のア
初めまして。濱田と申します。AmazonWebService上での構成について、皆さんのご意見をお伺いしたくこちらのユーザーグループに投稿させていただきました。 現在初めてDrupalで構築したサービスを本番稼働させようとテスト中なのですが、その中でひとつ壁に当たっています。 前提として、全てのHWはAmazon上に構築することとしてます。 当初想定のHW構成は以下のとおりでした。 ロードバランサ、Webサーバ２台、DB(RDS)、画像ファイル格納用のS3 アプリケーション用途は一般的なSNSなので、ユーザによる画像アップロード等が頻繁にあります。 で、まだベータ版のAmazonS3モジュールを利用して画像格納先に利用していたんですが、どうにもこうにもパフォーマンスが出ないためS3の利用をあきらめてしまいました。。。（これはこれで、このモジュールを利用して本番運用されてる方の話は凄く興味が
CloudFront+S3の画像配信システムに、サムネイルとかに使う画像のリサイズ機能を追加してみる。 要するにオリジナル画像がこのURLだとすると、 http://xxx.cloudfront.net/sample.jpg こういうURLで100×100にリサイズできるようにする。 http://xxx.cloudfront.net/resize/100x100/sample.jpg システム構成 元の構成はこういうのを想定。 画像はS3に保存され、アクセスは全てCloudFront経由。 これをパスが/resize/で始まる場合は、画像変換サーバを通してリサイズするようにする。 画像変換サーバはEC2で、ちゃんとELBを使って冗長化もする。 既にELB+EC2でAPPサーバを運用しているなら、流用して追加コスト0で実現できるかも。 画像変換サーバの設定 今回はnginxのimage_f
こんにちは、せーのです。今日はS3の画像をCloudfrontで配信する際のコツを自動化してしまおう、という試みです。 Cloudfrontキャッシュコントロールおさらい Cloudfrontは静的、動的関わらずキャッシュしてくれるとても便利なCDNサービスですが、Cloudfrontにてキャッシュしてくれる時間（TTL）は基本Cache-Control max-ageヘッダやExpiresにて制御します。更にCloudfront自体の設定にも[minimum TTL]というものがあり、これはヘッダで設定されたキャッシュ時間を強制的に上書きするためのものです。 ここで理解しておきたいのが「ヘッダとminimum TTLのキャッシュ時間の関係」です。詳しくはこちらの記事に書いてありますが、基本的には「キャッシュコントロールはヘッダありき。ヘッダの設定より長く強制的に上書きしたい時にminim
動画関連の知識がなく苦労したのでメモ。 ffmpegでの動画変換も試したのですが、変換の時間とサーバのリソースを食うため、 小規模サービスでは向かないと判断し、ElasticTranscoderを利用することとしました。 今回の構成としては、COOKPADに近いものとなっています。 http://techlife.cookpad.com/entry/2014/06/17/160905 動画配信方法 PC,スマートフォン(iOS, Android)向けに配信する方法を調査し、最終的にmp4とHLSで配信する事としました。 大半のデバイスはこの2種類を用意すればカバーできます。 mp4 : PC, Android2系への配信(flash) HLS : iOS, Android4系への配信 HTML5での動画再生用のライブラリがいくつかあるので、 そちらを使えば両形式の配信に対応できます。 今回
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
