Tech Hotoke Blog

IT観音とは私のことです。

Vue×SpringでSPA作成11【ドメインの設定】

まえがき

こちらの記事の続編です。

techhotoke.hatenablog.com

目的

VueとSpringで作成したプロジェクトの構築手順の備忘録。 備忘録のため、詳細な説明を省略している部分があります。

前提

  • 基本的なJavaの知識やSpring、Vueの知識があること
  • AWSに関する基本的な知識があること
  • ネットワークに関する基本的な知識があること

環境

  • Java 11
  • Spring Boot2.5.6
  • Gradle 7.1.1
  • Vue2.6
  • IDESTS
  • AWS(EC2,RDS,ELBなど)

やること

注意

ドメインの取得には別途料金がかかるため注意が必要です

構成

f:id:TechHotoke:20220215232239p:plain

ドメインとは?

インターネット上の住所と説明されていることが多いです。

f:id:TechHotoke:20220215151429p:plain

また、ドメインとサーバーの関係性のイメージは添付画像のようになります。

f:id:TechHotoke:20220215151952p:plain

引用:

【図解】ドメインとは?をわかりやすく解説します - カゴヤのサーバー研究室

IPアドレスがインターネット上の住所として機能しており、URL上のホストがIPアドレスと紐づき、

DNSドメインネームシステム)が、主にホスト名に対するIPアドレスは何かを教えてくれます。(これを名前解決と呼ぶ)

DNSとは?

DNSは簡単に言うと、辞書のような仕組みとなっています。たとえば、辞書で「ドメイン」という言葉を調べるときは、まず「と」からはじまる文字列について書かれたエリアをさがし、その次に「め」「い」「ん」という風に絞り込んでその名前の情報を探しますね。同様に、たとえば「www.kagoya.com」であれば、「.」で区切られた順に右側から検索を行い、「com」の情報を管理するDNSサーバー(ルートDNSサーバー)に対して「kagoya.com」の情報を管理するDNSサーバーはどこにあるかを確認します。こうして最後に、「kagoya.com」のDNSサーバーに対して「『www.kagoya.com』のIPアドレスは何か」を確認するわけです。

ここまでの話をまとめると、ドメイン名をつけることは、IPアドレスをより人間が覚えやすく使いやすい「名前」で指定できるようにすることと言い換えることが出来そうです。

もっと詳しく: インターネット10分講座 DNS - JPNIC

DNSサーバーとは?

ドメインの購入

  • 今回はお名前ドットコムさんを利用していこうと思います。

  • 今回はtemple-management-system.comというドメイン名を取得しました。Whois設定と、ドメインプロテクション設定をつけておきます。

  • ドメインの自動更新がデフォルトでオンになっているため、マイページから自動更新の設定をオフにしておきます

f:id:TechHotoke:20220215155931p:plain

f:id:TechHotoke:20220215155950p:plain

Route53の導入

Route53とは?

  • AWSDNSサービス。ネームサービスの役割を果たす。
  • 多くの場合、権威DNSサーバーとして利用されることが多い。
  • ホストゾーン:DNSのリソースレコードの集合
  • フルサービスリゾルバの機能も存在しており、VPCで使用可能。
  • 高可用性。SLA100%
    • SLA:Service Level Agreementの略で、サービスの提供事業者とその利用者の間で結ばれる、サービスのレベル(定義、範囲、内容、達成目標等)に関する合意サービス水準、サービス品質保証などと訳されます。サービスを提供する事業者が契約者に対して、どの程度まで品質を保証できるかを明示したもの。
  • 高速
  • フルマネージド(DNSサーバーの設計構築・維持管理などが不要)
  • ルーティングポリシー↓

f:id:TechHotoke:20220215161826p:plain

設定

  • Route53を選択し、ホストゾーンの作成を押下
  • 先ほど購入したドメイン名を登録し、ホストゾーンを作成
  • 作成するとドフォルトでNSレコードとSOAレコードが登録されています
    • NSレコード:ネームサーバーを管理するレコード
    • SOAレコード:ドメインのゾーンを管理するレコード
  • お名前.comにログインし、ネームサーバーを登録する(反映に時間がかかります)

f:id:TechHotoke:20220215171925p:plain

  • Route53のコンソールに移動し、Aレコードを登録します。

    • Aレコード:Aレコードとは、DNSで定義されるそのドメインについての情報の種類の一つで、特定のホスト名に対応するIPアドレスIPv4アドレス)を定義するもの。IPv6の場合は「AAAAレコード」を用いる。
  • 添付画像のように接続先EC2インスタンスIPアドレスを登録します。

f:id:TechHotoke:20220215175441p:plain

  • dig <ドメイン名> NS +shortコマンドでDNSサーバーに問い合わせて、ネームサーバーを確認します。画像のようにRDSのNSレコードに登録されているネームサーバーが反映されていればOKです。

    • digコマンド:

【 dig 】コマンド――ドメイン名からIPアドレスを調べる:Linux基本コマンドTips(158) - @IT

f:id:TechHotoke:20220215230332p:plain

  • 最後にAレコードのエイリアスを設定し、現在使用しているALBのDNS名を割り当てます

f:id:TechHotoke:20220215231357p:plain

  • 取得したドメイン名でアクセスし、画面が表示されれば完了となります。

今回はここまでとなります! お付き合い頂きありがとうございました!

参考

独自ドメインを取得し、Route53 と ELB を使ってEC2上のWebアプリをHTTPS(SSL)通信に対応させてみる - Qiita