Help us understand the problem. What is going on with this article?

Herokuで独自ドメインを割り当てる(お名前.com)

More than 5 years have passed since last update.

はじめに

Herokuでアプリを公開する際には、appname.heroku.comというHeroku URLで接続ができます。これをお名前.com等のレジストラで取得した好きなドメイン名で公開する方法について書きます。

私のブログをLokkaというブログアプリを使って、Heroku上で動作したときの設定をベースに手順をご紹介します。

お名前.comの設定

まず、hirotaka.meというドメインを取得します。お名前.comでドメインを取得すると、無料でレンタル[DNSレコード設定]というDNSサーバのサービスを利用できます。ここでは、この[DNSレコード設定]というサービスを使った設定をします。

また、設定するドメインは下記の通りになります。

Heroku URL: blog-hirotaka.heroku.com
設定する独自ドメイン: hirotaka.me, www.hirotaka.me, blog.hirotaka.me

Rootドメイン(hirotaka.me)はTypeをAとして登録し、サブドメイン(www.hirotaka.me, blog.hirotaka.me)はHeroku URLのCNAMEとして登録します。

まず、ドメインNaviにログインをして、[ドメイン設定]から[ネームサーバの設定]->[レンタルDNSレコード設定]の画面を開きます。設定するドメイン名のラジオボタンを選択し、[入力画面へ進む]を押すとDNSレコード入力画面が表示されます。

下記のとおりレコードを登録します。

ホスト名: (空欄).hirotaka.me
TYPE: A
VALUE: 75.101.163.44
優先: (空欄)
状態: 有効

ホスト名: (空欄).hirotaka.me
TYPE: A
VALUE: 75.101.145.87
優先: (空欄)
状態: 有効

ホスト名: (空欄).hirotaka.me
TYPE: A
VALUE: 174.129.212.2
優先: (空欄)
状態: 有効

ホスト名: blog.hirotaka.me
TYPE: CNAME
VALUE: blog-hirotaka.heroku.com
優先: (空欄)
状態: 有効

ホスト名: www.hirotaka.me
TYPE: CNAME
VALUE: blog-hirotaka.heroku.com
優先: (空欄)
状態: 有効<

これらのIPアドレスはHerokuのドキュメントに記載されているIPアドレスになります。

以上のレコードを追加し、[確認画面へ進む]を押して内容を確認します。問題がなければ「設定する」を押して設定を反映します。

設定した内容を手元のPCで確認します。DNSレコード設定のみの場合はすぐに確認できますが、ドメインを取得した直後だと設定の反映に時間がかかるかもしれません。

Rootドメインを確認します。

$ host hirotaka.me
hirotaka.me has address 75.101.163.44
hirotaka.me has address 174.129.212.2
hirotaka.me has address 75.101.145.87

サブドメインを確認します。

$ host blog.hiraka.me
blog.hirotaka.me is an alias for blog-hirotaka.heroku.com.
blog-hirotaka.heroku.com is an alias for proxy.heroku.com.
proxy.heroku.com has address 174.129.20.208
proxy.heroku.com has address 184.73.171.204
proxy.heroku.com has address 50.16.215.20
proxy.heroku.com has address 50.16.215.67
$ host www.hirotaka.me
www.hirotaka.me is an alias for blog-hirotaka.heroku.com.
blog-hirotaka.heroku.com is an alias for proxy.heroku.com.
proxy.heroku.com has address 174.129.20.208
proxy.heroku.com has address 50.16.215.20
proxy.heroku.com has address 50.16.215.104
proxy.heroku.com has address 107.22.233.248

Herokuの設定

次にHeroku側の設定をします。画面から設定する方法もありますが、ここではコマンドラインから設定する方法をご紹介します。

アプリに受け付けるドメインを追加します。

$ heroku domains:add hirotaka.me
$ heroku domains:add blog.hirotaka.me
$ heroku domains:add www.hirotaka.me

もし、間違って登録してしまった場合はremoveで削除します。

$ heroku domains:remove test.hirotaka.me

追加したドメインを確認します。

$ heroku domains
Domain names for blog-hirotaka.heroku.com:
www.hirotaka.me
blog.hirotaka.me
hirotaka.me

以上で設定したドメインで接続できるようになりました。

おわりに

.meドメインが年間980円で、それ以外は無料です。年間980円で独自ドメインのこんなすてきな環境が手に入るとは素晴らしすぎです。

hrtkmztn
Ruby, Ruby on Rails, GitHub, Rhodes, JQuery
gamba
「笑顔ではたらく」をつくる gamba!
http://www.getgamba.com/top
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away