ELB配下のEC2にCakePHPアプリケーションを置いたらCSSが当たらない
概要
自社開発したサービスをELBにぶら下げたEC2インスタンスにデプロイしていざアクセスするとリダイレクト処理が繰り返し行われるというエラーが起こった。AWSで構築されたサイトをSSL化しようとしたらリダイレクトループではまったを参考に.htaccessを編集してそれを解消したら今度はcssが当たらないという状態になり。きっと.htaccessがまだ間違ってるんだろうと深みにハマった。結局、ELBの仕組みを把握してないことから招いたエラーだった。
結論(原因と変更)
- 構成: ->port443->ELB->port80->EC2
- ELBからEC2への通信にはポート80で通信していた。
- コード中でポート80での通信の時はフルパスをhttp://~に設定する記述をしていた。
if($_SERVER["HTTP_PORT"] == 443){
define('SITE_URL', 'https://' . $_SERVER["SERVER_NAME"]); //本番環境の場合
}else{
define('SITE_URL', 'http://' . $_SERVER["SERVER_NAME"]); //ローカル環境の場合
}
- http://~のパスでcssをリクエストしてたのでnotfoundを返してスタイルが当たらなかった。
- 設定部分で["HTTP_X_FORWARDED_PORT"]を参照するように変更した。
if($_SERVER["HTTP_X_FORWARDED_PORT"] == 443){
define('SITE_URL', 'https://' . $_SERVER["SERVER_NAME"]); //ELBでSSL監視してる場合
}else{
define('SITE_URL', 'http://' . $_SERVER["SERVER_NAME"]); //ローカル環境の場合
}
if($_SERVER["HTTP_PORT"] == 443){
define('SITE_URL', 'https://' . $_SERVER["SERVER_NAME"]); //本番環境の場合
}else{
define('SITE_URL', 'http://' . $_SERVER["SERVER_NAME"]); //ローカル環境の場合
}
if($_SERVER["HTTP_X_FORWARDED_PORT"] == 443){
define('SITE_URL', 'https://' . $_SERVER["SERVER_NAME"]); //ELBでSSL監視してる場合
}else{
define('SITE_URL', 'http://' . $_SERVER["SERVER_NAME"]); //ローカル環境の場合
}
※ここから下は細かい話です
.htaccessを疑う
まず最初にこの現象が発生した。
AWSで構築されたサイトをSSL化しようとしたらリダイレクトループではまった
(あんまりよく読まずに)なるほどこの.htaccessの内容にすればいいのねと丸コピして適応。
んでこのエラーは解決したものの今度はcssが当たらないという事態が発生。
赤いところ全部参照できてない。調べてみたら全部http://~のパスで探してる。https://~じゃないからnotfoundになってエラーが吐かれてた。
httpsなのにportが80?
適当な画面でvar_dump($_SERVER[HTTP_PORT])してポート番号を確認すると80番と返される。httpsリクエストしてるのになんで80なんや??と混乱。きっとさっき編集した.htaccessでまだ変更しないといけないんだろうとググって調べて分からなくてハマる。
ELBの働きを知ろう!
解決できなくて消耗しまくる。んでアーキテクチャ構成担当者に相談したところ
HTTP ヘッダーおよび クラシックロードバランサーを読んでときた。
ELBはポート443でリクエストを受け付けてEC2のポート80に受け渡すのが役割。
つまり$_SERVER[HTTP_PORT]は80を返す!
ELBを通った時HTTPヘッダーに["HTTP_X_FORWARDED_PORT"]という項目が追加され、これがELBへアクセスされたポート(443)が格納されているのでこれを利用してコードを変更して解決できた!
初歩的なエラーながらかなりてこずったけれどELBの仕組みとかアーキテクチャの理解が深まったのでいい経験だった。ご参考になれば幸いです。
Author And Source
この問題について(ELB配下のEC2にCakePHPアプリケーションを置いたらCSSが当たらない), 我々は、より多くの情報をここで見つけました https://qiita.com/hotaca/items/e86f749151447342f20e著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .