2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

herokuの無料プランで独自ドメインのSSL化+サイト表示スピードの高速化を実現する

Last updated at Posted at 2022-01-07

背景

AWSで仮想サーバーを立てて個人アプリを作ったはいいが、如何せんコストがかかりすぎている。(月5000円くらい)
そのため、herokuの使用を検討した。
しかし、herokuの無料プランだと、以下の問題点があった。

  • 30分間アクセスがないと、herokuがスリープしてしまい、サイト表示スピードが著しく落ちる。
  • 独自ドメインのSSL化は有料プランでないとできない。

上記の問題を解決できないかと検討していたところ、解決策を発見したので備忘録を兼ねて記事を書くことにした。

前提条件

  • herokuでのデプロイが完了している。
  • お名前ドットコムで独自ドメインを取得している。

サイト表示スピードの高速化

→ GASを使用して、定期的にサイトにアクセスさせることで解決可能。

GASのスクリプト

portforio_access.gs
function portforio_site_access() 
{
  var response = UrlFetchApp.fetch('sleepさせたくないアプリのurl');
}

UrlFetchAppはGASに用意されているクラス。このクラスでfetchメソッドを使ってあげることで、URLにアクセスできる。今回はパラメータなどをつける必要がないので、fetchメソッドのみ使用したが、何か別の処理を自動化する際に、パラメータを付与してリクエストを行うことも可能らしい。
ref: https://developers.google.com/apps-script/reference/url-fetch/url-fetch-app

独自ドメインのSSL化

→ Cloudflareをherokuアプリとの間にかませる。

Cloudflareとは?

アクセス負荷の軽減や、ネットワーク保護を行ってくれるサービス。
ref: https://www.cloudflare.com/ja-jp/learning/what-is-cloudflare/

Cloudflare上の設定

ドメインの追加

https://www.cloudflare.com にアクセスして、Get Startedを選択。
その後、取得した独自ドメインを入力して、Add siteを選択。独自ドメインの登録.png

プランの選択

赤枠部分を選択する。
プランの選択.png

DNSの追加

下記画像のTypeにはCNAME、Nameには独自ドメイン、Targetにはherokuドメインを入力。
入力後、Saveをして、Continueをクリック。

DNS追加.png

ネームサーバーの確認

下記画像のAdd Cloudflare's nameserversをコピーする。(2つともコピーしてください。)

check_name_server.pngTLS

SSL/TLSの確認

下記画像のようにfullになっていることを確認する。
cloudflare ssl チェック.png

お名前ドットコム側の設定変更

下記画像のネームサーバー1と2に先ほどコピーしたものを貼り付ける。
nameserver_setting.png

アプリ側の設定(今回はRailsで作ったアプリを想定しております。ここは適宜読み替えてください。)

production.rb
config.force_ssl = true # デフォルトだとfalseになっているので、trueにする。

heroku側の設定

herokuのhttps://dashboard.heroku.com/apps/アプリ名/settingsに遷移して、下記画像の赤枠部分をクリックし、独自ドメインを入力する。
heroku setting.png

以上で設定完了になります。
設定してから反映されるまで、1~3日ほどかかるようなので気長に待ちましょう。

2
3
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
3

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?