herokuapp.comから独自ドメインにリダイレクトする方法（htaccessで設定する方法）

こんにちは！

大宮でWEBアプリケーション制作を行っているTEDASKのToshi Seitoです。

今回の記事では、アプリ名.herokuapp.comから独自ドメインにリダイレクトする方法を共有したいと思います。

Herokuでウェブサービスを公開するにあたり独自ドメインを設定しましたが、そのままだとデフォルトのドメイン（アプリ名.herokuapp.com）にもアクセス出来る状態です。

またSSLをしましたが、そのままだとhttpとhttpsどちらもアクセス出来てしまう状態です。

そこで今回は.htaccessを使って、アプリ名.herokuapp.comにアクセスした場合にhttps＋独自ドメインにリダイレクトするように設定する方法を共有したいと思います。

背景

Herokuでhtaccessを使ってBasic認証をやる方法は分かっていたので、同様にドメインのリダイレクトとhttpsリダイレクトも出来ると思ってリダイレクトの処理を書いたhtaccessファイルをデプロイしましたが、転送エラーになってしまい、通常のリダイレクトの記述では上手くいかないため調べました。

前提条件

・フレームワークはLaravel8を使っています。

・Procfileを適切に設定していること（publicの位置を指定していること）

Heroku公式サイトのヘルプを見てみる

Herokuの公式サイトのヘルプページに「Can Heroku force an application to use SSL/TLS?」とSSLに強制リダイレクトは出来ないのかという質問があるので、それが参考になります。

ログインしないと観られませんので、ログインしましょう。↓

Can Heroku force an application to use SSL/TLS? - Heroku Help

help.heroku.com

<IfModule mod_rewrite.c>
    <IfModule mod_negotiation.c>
        Options -MultiViews -Indexes
    </IfModule>

    RewriteEngine On

    # Handle Authorization Header
    RewriteCond %{HTTP:Authorization} .
    RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}]

    # Redirect Trailing Slashes If Not A Folder...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_URI} (.+)/$
    RewriteRule ^ %1 [L,R=301]

    # Send Requests To Front Controller...
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^ index.php [L]
    //ここから追記
    # If we receive a forwarded http request from a proxy...
    RewriteCond %{HTTP:X-Forwarded-Proto} =http [OR]

    # ...or just a plain old http request directly from the client
    RewriteCond %{HTTP:X-Forwarded-Proto} =""
    RewriteCond %{HTTPS} !=on

    # Redirect to https version
    RewriteRule ^ https://%{HTTP_HOST}%{REQUEST_URI} [L,R=301]

    RewriteCond %{http_host} ^appname.herokuapp.com
    RewriteRule ^ https://www.tedask-app.jp/$1 [L,R=301]
</IfModule>

「RewriteCond %{http_host} ^appname.herokuapp.com」のappnameの所は、ご自身のアプリ名に変更して下さい。

「RewriteRule ^ https://www.tedask-app.jp/$1 [L,R=301]」のtedask-app.jpはご自身の独自ドメインに変更して下さい。

ちなみ、この設定でhttpsへのリダイレクトも設定できています。

htaccessを更新したらデプロイ

htaccessを更新したら本番にデプロイしましょう。

問題なければ、無事リダイレクトが成功するはずです。

もし、無限ループみたいなエラーが発生していたら、記述ミスなど確認して下さい。

ちなみに、Basic認証ももちろんhtacessを使って設定できますので、もしやり方が分からないかたはこちらも参考にしてみて下さい。

LaravelをHerokuにデプロイしてサイトを表示するまでの方法（GUI操作メインでBasic認証のやり方も紹介）

こんにちは！大宮のWEB屋TEDASKのToshi Seitoです。今回は、インフラのPaaSの一つであるHerokuに作ったWEBアプケーションをデプロイする方法を書いていこうと思います。Herokuを簡単に説明すると、インフラの構築をア...

tedask.jp

まとめ

HerokuはところどころでレンタルサーバーやVPSと使い勝手が異なる部分があるので、困ったときはHerokuのヘルプを見る様にすると良いです。

以上、「herokuapp.comから独自ドメインにリダイレクトする方法（htaccessで設定する方法）」でした。

ウエブアプリに関するお問い合わせはこちらからどうぞ。

問い合わせる