サーバレスのサムネイル

サーバレス

完全無料!Cloudflare + Gitlab Pagesで静的コンテンツの高速ホスティングする

公開日: 2020.5.25

完全無料で静的コンテンツのホスティングを、「Cloudflare + Gitlab Pages」で構築します。レンタルサーバーやVPS、クラウドストレージとの比較も。

編集ノート:SERVERSUSでは、パートナーリンクからコミッションを得ています。コミッションが記事の意見や、サービスの評価に影響を与えることはありません。

実践方法

実践方法は簡単です。

  • 静的コンテンツだけを管理するレポジトリを用意
  • レポジトリに静的コンテンツと.gitlab-ci.ymlを追加してプッシュ
  • Gitlab Pagesで公開(ドメインを追加)
  • CloudflareでCDNキャッシュする

という形です。

.gitlab-ci.ymlについては、HTMLファイルのテンプレートを利用すればOKです。

pages:
  stage: deploy
  script:
    - mkdir .public
    - cp -r * .public
    - mv .public public
  artifacts:
    paths:
      - public
  only:
    - master

静的コンテンツの配信方法を比べてみる

静的コンテンツ(画像、CSS、JS、動画ファイル)などをホスティングする方法としては、

  • レンタルーサーバ
  • VPS
  • クラウドストレージ

を利用する選択肢があります。

現在では、AWS S3やGoogle Cloud Storageなどのクラウドストレージを利用するケースも多いですが、静的コンテンツだけの配信であれば、Gitlab Pages + Cloudflareの組み合わせで、CDNキャッシュを効かせた高速配信ホスティングが可能です。

今回のGitlab Pages + Cloudflareの方法と機能・料金で比べてみましょう。

サービス容量課金転送量上限同居サーバーへの負荷ファイルのバージョニング
レンタルサーバー有限(プランの上限)月額ありありなし
VPS有限(プランの上限)月額ありありなし
クラウドストレージなし従量課金なしなしあり
Gitlab Pages + Cloudflare10GB(レポジトリごと)無料なしなしあり

Gitlab Pagesの無料枠には、「ビルドタイムが月間2,000分まで」という縛りがあるので、レポジトリを頻繁に更新する場合は、追加クォータを購入する必要がありますが、多くのケースで無料枠で収まるでしょう。

また、Gitlab Pagesは転送量無制限で使えます。とはいえ、静的コンテンツはCloudflare側でキャッシュしてしまうため、実際には転送量はそこまで気にしないでも大丈夫でしょう。


Cloudflare + Gitlab Pagesで静的コンテンツの高速ホスティングを無料で実現する方法をみてきました。

レンタルサーバーやVPS、クラウドストレージサービスと比べても圧倒的に安く、ファイルのバージョニングまでできるかなり万能なクラウドストレージが無料で構築できることがわかりました。

使い方によっては非常に便利なので、ぜひ使ってみてください。


価格は記載がある場合を除き、すべて税込みです。

関連キーワード

サーバレスの新着記事