5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

S3のオブジェクトをSSLで公開するには

Last updated at Posted at 2018-09-04

S3とSSL通信

企業などでホワイトリストで内部からアクセス可能なドメインを制限している場合、動的なWebサイトからS3の動画オブジェクトなどにリンクを張っていてもはねられてしまって表示できないケースがある。この場合、オブジェクトのURLを許可されたドメイン内に設定する必要があり、S3をWebサイトホスティングを有効にしたうえでDNSのゾーン設定でCNAMEしてやれば一応は対応可能だ。

しかし、S3の仕様でWebサイトホスティングドメインはSSLには非対応(2018年9月現在)になっている(※こちらを参照 [S3のSSL通信]
(https://qiita.com/Yuhkih/items/1754ac9caf3f12d75946) )

問題なのは、参照元のWebサービスがSSLアクセスの場合、chromeでは「保護された通信」から「保護されていない通信」へのリンクが記述されたページとして認識されてしまい、最悪そのままではページ自体が表示されないというケースがあることだ。

また、chromeが2018年10月から生のhttpアクセスを許可しなくなる、ということでS3からオブジェクトをSSLで呼び出す必要も出てきそうだ。

以下、自分のための作業メモ。

証明書の取得

ここはDNSのzoneファイルを書き換えできることを前提と考えて、DNS認証でACMから証明書を取得しよう。
以前のまとめを参照されたい。(ACMの証明書をメール検証からDNS検証に差し替えた話 )

ここでの留意点が、リージョンをバージニア北部にしておくこと。
CloudFrontが証明書を利用するにはバージニア北部に置かれていることが必要なためだ。ここが第一のハマりポイントだった。

#S3の設定について
これはデフォルトの設定で(非表示のままで)全く問題ない。
テスト用にindex.htmlを置く場合、バケット全体を公開するか、公開用rootフォルダを設定するかここで決めておく。自分はバケット全体を公開範囲にしたので、バケットの/にindex.htmlを置くことにした。

Webホスティング設定などは不要

バケット名は
(公開用サブドメイン名).(メインのドメイン名)としておくと後でわかりやすい。

例: movie.hogehoge.jp

リージョンはどこでもよい。自分は普通に東京リージョンにした。

#CloudFrontの設定

CloudFrontのダッシュボードを開き、Create Distributionsをクリック
CloudFront1.png

次にweb distributionを選択
CloudFront2.png

#####Distributionの諸元を設定
CloudFront3.png

①S3のエンドポイント
②公開のルートにするフォルダを指定
今回はバケット丸ごと公開するので何も入力しなかったが、/rootのように絞り込むこともできる。
③ ①+②がIDとして自動入力される。変更する必要はない。
④S3のバケットにアクセスする事を指定
⑤S3にアクセスするIAMを新規に生成する
⑥公開するバケットのポリシーに⑤で生成したIAMでアクセスできるように設定する。
⑦クライアントからHTTPがきたら、HTTPSに変換する。

CloudFront4.png
⑧CNAMEで設定するサブドメイン名を記入する。
⑨ACMで取得した証明書を使用する。
 使用可になった状態の証明書があれば、ここのリストボックスに出てくる。はずだが、証明書のリージョンを間違えていると出てこない。

CloudFront5.png
⑩確認用のサンプルhtmlのファイル名を指定する。
⑪このボタンを押してDistributionを作成する。

#####CloudFrontのダッシュボード
CloudFront6.png
DNSのゾーン設定でIN CNAMEするエンドポイントがここに表示される。
⑬Enabledになるまでしばし待つ。

#DNSのゾーン設定

証明書の認証時に編集したzoneファイルをもう一度編集する。参照→ACMの証明書をメール検証からDNS検証に差し替えた話
ここでもIN CNAMEを使用してサブドメインをCloudFrontのエンドポイントに紐づける。

指定したいサブドメインがMOVIE、エンドポイントがxxxxxxxxxxxxxx.cloudfront.netであった場合、
MOVIE IN CNAME xxxxxxxxxxxxxx.cloudfront.net.
と表記する。
エンドポイントの最後にピリオドを付け忘れると相対指定になってしまうので、必ずつけてFQDNにすること。
※ここが今トピック第2のハマりポイントだった。

以上。

5
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?