Pumaで静的コンテンツを配信する

Puma は Rails アプリケーションのためのアプリケーションサーバですが、 Web サーバとしての機能もあります。特定のディレクトの中に HTML ファイルなどを設置することで静的コンテンツをユーザーに返すことができます。ここでは Puma を使って静的コンテンツを配信する方法について解説します。

(Last modified: 2024-06-11)

静的コンテンツの設置場所
ルートディレクトリに設置するindex.htmlについて

静的コンテンツの設置場所

静的コンテンツを設置する場所は、アプリケーションディレクトリの中の public ディレクトリです。( Apache でいうところのドキュメントルートにあたります)。

静的コンテンツの設置場所(1)

新しいアプリケーションを作成した直後は、このディレクトリには次のようなファイルが格納されています。

静的コンテンツの設置場所(2)

Puma にブラウザからアクセスしたときに、 HTML ページや画像ファイルなど静的なコンテンツはディレクトリに設置してください。例えば public ディレクトリに hello.html を設置した場合は http://localhost:3000/hello.html でアクセスすることができます。

では hello.html ページを実際に作成して public ディレクトリに設置してみます。 hello.html ページはどんなものでもいいのですが、今回はテキストエディタで次のような内容を入力し、 hello.html として保存しました。

<html>
<head>
	<meta charset="UTF-8">
</head>
<body>
	<h1>こんにちは</h1>
</body>
</html>

静的コンテンツの設置場所(3)

それではコマンドプロンプトを起動し、アプリケーションディレクトリに移動したあとで「rails server」と実行してください。

静的コンテンツの設置場所(4)

ブラウザから http://localhost:3000/hello.html へアクセスします。すると次のように public ディレクトリに設置した hello.html ファイルがブラウザに返されました。

静的コンテンツの設置場所(5)

今回は public ディレクトリに HTML ページを設置しましたが、 public ディレクトリの中にサブディレクトリを作成して静的コンテンツを設置することもできますし、画像や CSS ファイルを設置して HTML ページから読み込むこともできます。

ルートディレクトリに設置するindex.htmlについて

ブラウザから http://localhost:3000/ へアクセスすると次のような画面が表示されます。

ルートディレクトリに設置するindex.htmlについて(1)

この画面はウェルカムページと呼ばれるものです。先ほど public ディレクトリにデフォルトで格納されているファイルを見てもらいましたが、 public ディレクトリにはデフォルトでは HTML ページが一つもありませんので public ディレクトリにある index.html ページが表示されているわけではありません。

またデフォルトで作成される config/routes.rb にもルートパス (/) へのルートは何も設定されていません。

Rails.application.routes.draw do
  # Define your application routes per the DSL in https://guides.rubyonrails.org/routing.html

  # Reveal health status on /up that returns 200 if the app boots with no exceptions, otherwise 500.
  # Can be used by load balancers and uptime monitors to verify that the app is live.
  get "up" => "rails/health#show", as: :rails_health_check

  # Defines the root path route ("/")
  # root "posts#index"
end

このように public ディレクトリに index.html がなく、またルートパスに対するルートが設定されていない場合に限り、 http://localhost:3000/ へアクセスするとウェルカムページが生成されてブラウザに返されます。(厳密には開発環境で動かしている場合だけです)。

public ディレクトリに index.html ファイルを設置した場合は、ウェルカムページではなく index.html ページの内容がブラウザに返されます。例として次のように public ディレクトリに index.html ファイルを設置してみました。

ルートディレクトリに設置するindex.htmlについて(2)

ブラウザから http://localhost:3000/ へアクセスします。すると次のように public ディレクトリに設置した index.html ファイルがブラウザに返されました。

ルートディレクトリに設置するindex.htmlについて(3)

なお public ディレクトリに index.html ファイルを設置し、同時にルートパスへのルートが設定されている場合、 index.html の方が優先されます。ルートパスへのルートの設定を有効にしたい場合は public ディレクトリに index.html ファイルを設置しないようにしてください。

-- --

Puma を使って静的コンテンツを配信する方法について解説しました。

( Written by Tatsuo Ikura )

著者 / TATSUO IKURA

これから IT 関連の知識を学ばれる方を対象に、色々な言語でのプログラミング方法や関連する技術、開発環境構築などに関する解説サイトを運営しています。