ラズパイにWebサーバーを立てる - ハードウェア技術者のスキルアップ日誌

見守りカメラ作成に向けた第二回目はWebサーバーです。

masaeng.hatenablog.com

カメラの映像や過去の温度データを参照するため、ラズパイにWebサーバーを立てて、スマホやPCからこのサーバーにアクセスするようにします。

今回はWebサーバーを立てるところまでをやってみましたので、手順を書いていきます。

①Apatch2のインストール

まず、WebサーバーソフトウェアのApache HTTP Serverを利用するために「apache2」パッケージをインストールします。

$ sudo apt install apache2

インストールするとApacheのWebサービスが自動的に開始されます。ラズパイと同じネットワークにつながったPCやスマホのブラウザで「http://ラズパイのIPアドレス」と入力すると以下のようにApacheのデフォルトページが表示されます。

f:id:masashi_k:20200923222725p:plain

②htmlファイルの作成

次に、デフォルトページの代わりに表示するオリジナルのページを作ってみます。

apacheの設定ファイルは"/etc/apache2/"以下にあり、ディレクトリ構成は以下の通りです。

/etc/apache2/
|-- apache2.conf　　　   # 最初に読み込まれる設定ファイル
|       |--  ports.conf　# 使用するポートの設定ファイル
|-- mods-enabled
|       |-- *.load　　　　# モジュールをロードするための設定ファイル
|       |-- *.conf　　　　# モジュールの基本的な設定ファイル
|-- conf-enabled
|       |-- *.conf　　　　# Webサイトに共通する設定ファイル
|-- sites-enabled
|       |-- *.conf　　　　# Webサイトごとの設定ファイル

静的コンテンツの保存場所は"/etc/apache2/sites-enabled/000-default.conf"の「DocumentRoot」で指定されており、デフォルトでは"/var/www/html"となっています。この中にhtmlファイルを置きます。

テスト用に作成したhtml(ファイル名：hello.html)はこちらです。単にHello HTML World!と表示するだけのものとなっています。

<html>
<head>
<title>HTML Sample</title>
</head>
<body>
<p>Hello HTML World!</p>
</body>
</html>

これを"/var/www/html/"に格納し、PC、スマホから「http://ラズパイのIPアドレス/hello.html」にアクセスすると以下の画面が表示されます。

f:id:masashi_k:20200923224438p:plain

うまく表示できました！！

➂CGIを使用して動的コンテンツを表示

次は動的コンテンツの表示をやってみます。CGIを使用できるようにするために以下のコマンドを実行します。

$ sudo ln -s ../mods-available/cgi.load /etc/apache2/mods-enabled/
$ sudo systemctl reload apache2

"/etc/apatch2/mods-enabled/"にcgi.loadのシンボリックリンクを作成し、設定をリロードしています。

CGIの実行ファイルは"/usr/lib/cgi-bin"に置きます。

テスト用に現在の時刻を表示する実行ファイル(hello)を作成し、上記フォルダに保存します。実行ファイルの中身は以下の通りです。

#!/bin/sh
echo "Content-Type; text/plain"       # リソースの種類を示す「Content-Type」ヘッダーの出力
echo ""                               # 区切り用のスペース
echo "Hello CGI World! ($(data +%T))" # 時刻の出力