CORSでクロスオリジンの設定をする際に、なんでドメインを絞り込む必要があるのか浅く理解した

本記事は不確かな情報が多く含まれる可能性がある 本職はフロントエンドエンジニアで、基本的に取得した情報に色をつけ表示させることで会社内での居場所を維持してきた。 ただ最近個人開発でバックエンドに触れることが増えセキュリティにも興味が出てきた。 ただ、まだまだ浅い理解しかない。 何が言いたいかというと、この記事は不確かな情報を含んでいる可能性があるということ。 浅く理解したくなったきっかけ 最近、個人開発ということでNestJSでAPIを作成した、 作成したAPIをLambdaに乗せ、カスタムドメインを設定せずに使用している。 そのため、CORSのクロスオリジンを指定する必要があった。 NestJSは一行ですべてのドメインに対しCORSを許可することができる。 開発環境ではそれでいいが、本番で運営するにあたり、許可するドメインを指定する必要がありそうだということを調べて知った。 しかし、なぜ? という疑問が生じた。 いくら絞ったところでcurlコマンドで叩けるので別に絞る必要がないのでは? という疑問を解決するために調べてみた。 CORSを指定しないことで考えられるセキュリティリスク クロスサイトリクエストフォージェリ(CSRF)攻撃 CSRFは悪意のある攻撃サイトにユーザーが訪問した際、意図しないリクエストがCSRFの脆弱性のあるウェブアプリケーションに投げられ、設定の変更や、強制投稿が行われるということ。 CSRF(Cross-Site Request Forgery)攻撃について このサイトが非常に参考になった。 CORSで防げる このサイトにあげられている下記のようなポイントのうち、 対象のWebサイトのユーザが、正規の手順でログイン済であることを前提とする 対象のWebサイトが、設計上意図しない更新操作を受け付けてしまうことで攻撃が成立する 「対象のWebサイトが、設計上意図しない更新操作を受け付けてしまうことで攻撃が成立する」をCORSの設定で防ぐことができる。 悪意のあるサイトのドメインがCORSで許可されていなければ、いくらリクエストが飛ばされたところで問題ない。 そのため、CORSのドメインは信頼されたドメインに絞り込む必要がある。 そういうこと。

投稿日 · 2023-07-28 · 更新日 · 2024-06-07 · 1 分 · nove-b

エックスサーバーで借りたドメインのサブドメイン使用し、Vercelにカスタムドメインを設定する

過去にドメイン関係のトラブルに見舞われたことがある。 ドメイン関係のトラブルはクリティカルなので非常にそわそわする。 そんな時エックスサーバーのサポートが手厚く、以来、レンタルサーバー・ドメインはエックスサーバーにお世話になっている。 そのため、今回新たに作成したWebサービスもエックスドメインで借りたドメインのサブドメインに紐づけることにした。 サーバーはVercelに浮気した。 エックスサーバーでサブドメインを作成する 前述したとおり、エックスサーバーは非常にサポートが充実している。 なので、サブドメインの作成を改めてここに書く必要なんてない。 公式が最も正しく、詳しい。 サブドメイン設定を参考にサブドメインを作成する。 Vercelに紐づける 大前提としてVercelにプロジェクトが既にあるという体で進めていく。 Vercel管理画面 SettingsタブをクリックしProject Settingsページに遷移する。 サイドナビのDomainsをクリックし、inputに作成したサブドメインを入力しAddボタンをクリックする。 https://は不要なので注意。 Invalid Configurationという警告がでるが、Vercelに認識はしてもらった。 エックスサーバー管理画面 DNSレコード設定をクリックしDNSレコード一覧から対象ドメインを選択し変更ボタンをクリックする。 ここでDNSレコードが設定できるので、下記のように設定する。 項目 値 ホスト名 [サブドメイン名] 種別 CNAME 内容 cname.vercel-dns.com 優先度 上記設定を追加し、しばらく待つ。 Vercelサービスに割り当てられるドメイン サービスを作成すると独自に、割り当てられるドメインがある。 service-name.vercel.app のようなやつ。 独自ドメインを設定した暁には、このドメインをリダイレクトするのがいいと思われる。 先ほど設定したドメインの下にこのドメインがあると思うので、Editボタンをクリックすると、Redirect toというセレクトボックスがある。 そこに先ほど設定したドメインが表示されると思うので、選択し、Saveすればリダイレクトが完了する。 もしこの設定を行わないとGoogleのクローラーはどのように判断するのだろうか。 コピーサイトと間違われることもありそうなので、リダイレクトはしたほうがいい。 ただサブドメインを使用する場合は、友人に共有したいけどメインドメインがばれるのが嫌という人も多いだろう。 その場合はシェア用に取っておくのも有りかもしれない。 Vercel管理画面にて、Valid Configuration・Assigned to main 5分くらいでValid Configurationが上記のような表記に変更された。 実際に設定したドメインを訪れると作成したサービスにアクセスすることができた。 キャッシュを消さないと見れないかもしれないので注意が必要。

投稿日 · 2023-07-21 · 更新日 · 2024-06-07 · 1 分 · nove-b

エックスサーバーで作ったサブドメインをGoogle Hostingに適用する

エックスサーバーは非常に便利で50個のサブドメインを作成することができる。 これは私みたいに飽き性でいろいろなものを作っては放置するタイプには非常に重宝する機能である。 エックスサーバーが気になるのであれば下記リンクをどうぞ。 [sc name=“exserver_all_unlimited” ][/sc] さてそしてまた、この機能を使用する機会がきた。 今回はエックスサーバーのサブドメインをGoogle Hostingに適用するというケースを行ったので、備忘録としてここに書いておく。 サブドメインの取得の仕方は省力する。 が、反映になかなか時間がかかるのが、エックスサーバーの玉に瑕。 firebase Consoleに行く Firebase console 作成したドメインを入力する まずはfirebase ConsoleのHostingに移動し、カスタムドメインを追加ボタンをクリックする。 するとドメイン名の入力を求められるので、エックスサーバーで作成したサブドメインを記入する。 ※「angular.nove-web.com を既存のウェブサイトにリダイレクトする」をチェック。 リダイレクト先にはエックスサーバーで作成したサブドメインを記入する。 次へをクリック。 所有権の確認 エックスサーバーのDNSレコード設定に進み、対象ドメインを選択する。 次に「DNSレコード追加」タブに移動する。 記入欄が現れるので、下記のように記入していく。 ホスト名:作成したドメイン 種別:TXTを選択 内容:Firebaseコンソール画面でコピーしたTXTレコードの値 追加が完了したら、firebase Consoleに戻り、所有権を証明ボタンをクリックする。 ここで失敗した。 ドメイン ********.com の所有権を証明できませんでした。設定をお確かめいただき、もう一度お試しください。 とのエラーが表示された。 解決方法がわからずに、途方に暮れていたので、初心に戻りGoogle Workspace 管理者ヘルプに行くと、 最初に試すことに48 時間待機すると書かれていたので、待機することにした。 ちなみに下記サイトでDNSレコードがしっかり適用されているか確認することができる。 Google Admin Toolbox Dig 全然うまくいかずに、色々DNSレコードをいじっていたら、途端に通った。 何をしたか、わからない。 実行(ドメインとの紐づけ) 何をしたかはわかないが、うまくいったようで、セットアップ画面が表示された。 またレコードを追加する必要がある。 下記のように追加すれば問題ない。 ホスト名:作成したドメイン 種別:Firebaseコンソール画面で表示されたレコードタイプ(私の場合はA) 内容:Firebaseコンソール画面でコピーしたTXTレコードの値 追加が完了した後に、終了ボタンをクリックする。 この時点でカスタムドメインの追加はうまくいったが、ステータスが設定が必要ですと表示されている。 最後に 設定を完了するために、最後にもうひとつ。 サブドメインの場合は、すでにあるDNSレコードと干渉する場合がある。 本サイトでは「*.nove-web.com」のようなレコードが既に存在していた。 これは見ての通り、すべてのサブドメインを対象にしているので、削除する必要がある。 ただ、本サイトのように新規で追加する以外にサブドメインを使っている場合は、そのサブドメインのレコードを新規に作成する必要がある。 後は接続が完了するまで待つ、ひたすら待ちましょう。 公開ができればそのサイトにアクセスができる。 今回追加したのは下記サイト。 https://angular.nove-web.com/home コスパ最強のWeb アプリ 今回はfirebase hosting で公開したのはAngularを勉強のために立ち上げたブログサイト。...

投稿日 · 2022-05-03 · 更新日 · 2024-06-07 · 1 分 · nove-b