はじめに
私が設定しておきたいセキュリティヘッダーについて自分で書いたものを
自分の言葉で記録に残しておきたいと思い今回の記事にしました！(✿´ ꒳ `❤️ )
よろしくお願いいたします！🙇♀️
ちなみに『セキュリティヘッダー』とは『セキュリティ』のために設定しておくといい『ヘッダー』です。<=繰り返しただけ、、
サーバー言語で設定が基本的なのかな〜?とかよく考えたりしています。??どうなのでしょうか？
ではさっそく！
ちなみにヘッダーは以下のようにして確認できます！
referrer-policy
書き方例参考：referrer-policy:same-origin
『リッファーラーーポリシー🐥』はっつ！
同じオリジンのみしかリファラーを送信しないと設定したものです。※ほかドメインには送らないと言ったものです。
少し細かくちょっと後に説明するよ！🏊♂️
『リファラー』とはサイトに色々ぽちぽちしていろんなページを見ると思うのですが、
今のページに『前のページのURLとか送ってくれる』的な機能があるのですが『それ』です。
例えばAサイトから全く違うBサイトに行った時に、
Bサイトへ『前のページこのURLだったよ〜』を知れる機能があるので、、いや迷惑(◍•ᴗ•◍) SEO的にいいんだろうな〜きっと。
この何がいけないのか？URLにトークンとかくっついていたりすると、
それがそのまま、ほかサイトに渡ってしまうというのがいけません。
もしそのトークンが有効で、
ほかサイトがそれを知って悪用とした場合悪用されてしまうからです。
x-frame-options
書き方例参考：x-frame-options:deny
『エックスフレ〜〜〜ムポジションッつ！😠』はっつ！
他のサイトのiframeに自分のサイトを表示させないと言った設定をするものです。クリックジャッキングの防止用です。
少し細かくちょっと後に説明するよ！👩
まず、『iframe』とはHTMLのタグの一つでwebページに他のサイトを小さく表示する的な時に使うというものです！
え、表示させるだけならわざわざ拒否しなくてよくない？？って思いますよね、
なのですが、、、、え〜〜〜〜、
ここ上手く言えないのですが、
実際は自分のサイトが前面に表示されているのにCSSを上手く使うと自分のサイト画面を透明にして、
その後ろに悪意あるサイトがあるようにすることが出来てしまうのです、、
実際はユーザーは自分のサイトの『ログインボタン』を押しているのに、
ユーザーは悪意あるサイトの『まずはここを押してから処理開始してくださいボタン』を押している的なことが起きてしまうのです！
(クリックジャッキング)
なのでこれをうまい具合にやると、
自分のサイトのログインして退会や、
お金の送金をユーザーが意図していないのに行ってしまうこともなきにしもあらず的なことが起きてしまうという感じなのですよね。
コワイです、、
x-xss-protection
書き方参考例：x-xss-protection:1; mode=block
『エックス、シェシェシェっつプロテクションっつ』はっつ😲
XSS攻撃をブラウザで検知した時ページの読み込みを停止する設定のヘッダーです。
XSSとはお馴染み不正な攻撃を含むリクエストでページを改変されて表示させる的な攻撃なのですが、
このヘッダーを設定しておくとブラウザが『ムムムッつこれなんか怪しいリクエストだ！』。
みたいに検知してくれた時それ以降処理させない的なことをしてくれます！
いや便利すぎるヘッダーだな本当かよとなるのですが本当みたいです。
x-download-options
書き方参考例：x-download-options:noopen
『エックス、ダウンロード〜オプションっつ👶』はっつ
ブラウザー(Internet Explorer) がアプリケーションからのダウンロードでファイルを「開く」の選択肢を表示しないようにする設定(『保存』の選択になる)です。
なぜダウンロードがいいの？ってなるかと思うのですが、
開いたのが攻撃的なコードのファイルだとweb上で実行されてしまう的なことが起きてしまう的なことが起こるためとのことです。
攻撃はいきなりきますね(◍•ᴗ•◍) あぶないっあぶないっ。
x-content-type-options
書き方参考例：x-content-type-options:nosniff
『エックスコンテンツイプオプションっつ』はっつ <=普通に言ったぞ！👩
CSSのstyleシートのタイプがtext/cssであることやjsのファイルscriptでない場合(適切でないタイプ)アクセスをブロックする設定です。
なぜそんなことをするのかと思うのですが、
コンテンツタイプが違うのにとあるブラウザは勝手にインストールしてしまうことがおこりそこに攻撃的なコードが実装されているとXSS的な脆弱性が発生する的なことが起こるからみたいです。
ほんとやめてほしいですよね、、攻撃(｡･ω･｡)
※Content-Type: text/html; charset=UTF-8 的なContent-Typeの指定も忘れずにお願いします。
Content-Security-Policy
書き方参考例：Content-Security-Policy: object-src 'self'; script-src 'self' https://unpkg.com https://cdn.jsdelivr.net https://www.googletagmanager.com;
『コンテンっっセキュリティ〜〜〜〜ポリシ〜〜』はっつ
自分のドメイン以外のほかサイトのインストールはこれだけに制限するみたいな設定です。
ちょっと何言っているかわからないですよね、、
よく文字とか、アイコン画像とか他サイトからアクセスして取得的なことをするのですが、
その時自分が明示しておいたドメインのものしか自分のサイト以外は許さない的なものを指定する感じです、、
上手く言えませんが、自分の家に入れる人をあらかじめ限定しておく的なものです、
間違って入れようとしたらこのヘッダーに記入されていないんで入れません！的な感じです！
CDNは全く使わないサイトの方が少ないかと思い今回この『書き方参考例』にさせて頂きました。
Strict-Transport-Security
『ストリクトトランスポートセキュリティ〜〜』はっつ
なんか疲れてきましたね(◍•ᴗ•◍) お疲れ様です！
でももうそろそろ終わりです！
むしろこれとそれ以降は書きはしたもののそこまで大事じゃないのかも？？的な感じで思っている的なことがあるので、、
言ってしまえば終わりです！！<=無責任の極み！！\└('ω')┘/
一度そのサイトを訪れたらそれ以降https://じゃないとサイトにアクセスできないようにするを強制するヘッダーです。
通信暗号化を強制、強制！！！
これなのですが、IPAサイトに書いてあるようにhttpとhttps等併用しているサイトは使用に注意してください。🙇♀️
自分のサイトは怖かったのでこのヘッダーはあえて外しています。
その代わり認証に大事なクッキーにセキュア属性をつけたりサイトはHTTPSでないと表示させないような対応を取っていること確認するようにしています！。
ちなみにセキュア属性って以下箇所での確認しか知らずいつも確認しずらいな〜とか思ったりしてます、。
x-permitted-cross-domain-policies
書き方例参考：x-permitted-cross-domain-policies:none
『エックスパーミティッドクロスドメインポリシー』はっ、……なんか長いですね、、🙃
AdobeやPDFのファイルダウンロードをクロスドメインで許可しないといったヘッダーです。
通常追加でヘッダーを付与しない限り、他ドメインにクッキーの送信等許可ないのですが、
それがAdobeのファイル等だとこのヘッダーも設定しないと許可しちゃうよ的なものと認識しています。
あまりいらないのでは等みたりするのですがないよりはある方がましなのかと思い今回書かせて頂きました。
参考サイト
https://book.cakephp.org/4/ja/security/security-headers.html
https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers
https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/Strict-Transport-Security
https://www.ipa.go.jp/files/000017316.pdf
https://qiita.com/ariaki/items/78ed2d3810ad17f72398
https://developer.mozilla.org/ja/docs/Web/HTTP/Headers/X-Content-Type-Options
参考本
安全なwebアプリケーションの作り方 第2版
さいごに
最後まで読んでいただきありがとうございました！！(✿´ ꒳ ` )
作成したサイトの改善希望記事サイトやここでも改善募集中ですのでよろしくお願いします！
あと絵文字ないのがみたい的な要望あれば、(ケレスミス多くもても良ければ)
以下サイトの改善前の方見ていただければと思います！