RaspberryPiの外部サーバ化

#はじめに
私はQiitaの記事を見てもらえる通り、結構クライアント側の開発を行っていました。
ですが、大学を卒業し会社に入社した私は、研修でサーバ側について学びました。
その研修において私は、自分自身でもサーバ構築をしたいと思いこの記事にまとめていることを行いました。
サーバ構築は意外に簡単ということと、インフラは楽しいぞってことを世に広めたいです！

#完成図
以下のように、自宅のグローバルIPアドレスを打つとホームページが表示されるようになります。
※現在以下のサイトは、サーバ稼働していないのでアクセスできません。
![スクリーンショット 2020-01-02 19.18.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/0a9d6fab-b1d5-7331-85f2-840bdbd2cb53.png)
この記事の実装所要時間は１時間半ほどです。


#準備
- [Rasberry Pi3 ModelB](https://www.amazon.co.jp/gp/product/B01CSFZ4JG/ref=ppx_yo_dt_b_asin_title_o03_s00?ie=UTF8&psc=1)
- [電源ケーブル](https://www.amazon.co.jp/gp/product/B0748C6YBZ/ref=ppx_yo_dt_b_asin_title_o03_s00?ie=UTF8&psc=1)
- [新品SDカード(32GB)](https://www.amazon.co.jp/gp/product/B06XSV23T1/ref=ppx_yo_dt_b_asin_title_o03_s00?ie=UTF8&psc=1)
　※64GB以上だとSDカードのデータ形式を変換する手間があるので私はおすすめしません。
- マウス
- キーボード
- モニター
- ノートパソコン(MacbookAir)

#手順
1. RasberryPiの初期化(OSダウンロードからセットアップまで)
2. webサーバの設定(nginxのインストール、ホームページの確認)
3. 外部公開に向けての設定(プライベートIPアドレスの固定化、ルータのポート開放)
4. 外部からアクセス(ホームページの確認、新しいホームページの設定)

##1. RaspberryPiの初期化
まずはRaspberryPiのOSを[ダウンロード](https://www.raspberrypi.org/downloads/noobs/)します。以下の赤枠のNOOBSをダウンロード。
![スクリーンショット 2020-01-02 19.15.11.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/3013d480-f636-a85d-8c1f-5580ed201577.png)
ダウンロードしたNOOBSを、以下のようにSDに書き込みます。
![スクリーンショット 2020-01-02 18.06.04.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/be36feaf-b73a-6075-dc55-807a8fadaea6.png)
RaspberryPiにmicroSD、HDMI、電源ケーブルを挿します。そして、少し待つとOSが起動します。
![スクリーンショット 2020-01-01 15.05.20.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/26e58598-bb5c-4cae-cc9d-f2ad6c6db31c.png)
適当に設定します。
![スクリーンショット 2020-01-01 15.05.33.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/bc3a5e39-8ce9-fb7c-5ba2-ec118520e6ba.png)
![スクリーンショット 2020-01-01 15.05.42.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/9a819fbc-4623-78f0-e7f3-abbd47def158.png)
![スクリーンショット 2020-01-01 15.06.21.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/449fe02c-44ce-5764-e57d-e12071b7440a.png)
この画面が表示されれば、OSのインストールは完了です。
![スクリーンショット 2020-01-01 15.06.40.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/4dea24ef-323f-9b6f-9ff1-0c38f636ead5.png)
続いて初期設定を行います。適当に設定します。
![スクリーンショット 2020-01-01 15.06.49.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/73c5ba38-200b-b454-f843-dcc7d0fc5efd.png)
![スクリーンショット 2020-01-01 15.06.58.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/3017bfeb-07fb-8aa1-0432-01c7b9581189.png)
![スクリーンショット 2020-01-01 15.07.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/e8ad2ce0-892e-a55d-f6ff-df2dd974450c.png)
![スクリーンショット 2020-01-01 15.07.26.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/122c1d32-1933-f097-58a5-f258516b3958.png)
![スクリーンショット 2020-01-01 15.07.46.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/4e0fef92-a5d4-fa70-b9d8-019e1d680e9f.png)
これにて、RaspberryPiの初期設定は終了です。

参考サイト
・[Raspberry Pi 3 Model B+の初回セットアップ（購入から起動まで）](https://qiita.com/Higemal/items/c817b96c3806f23b35f6)

##2.webサーバの設定
続いてwebサーバのインストールを行います。その前に事前知識を少し紹介します。
サーバは以下のアーキテクチャによって設計されることが多いらしいです。
![スクリーンショット 2020-01-02 9.32.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/92fb4e19-975c-ce4d-a803-60e38083d1a1.png)
webサーバは静的なコンテンツをクライアントに返します。
APサーバは動的なコンテンツをwebサーバに返します。
DBサーバは名前の通りデータをAPサーバに返します。
このような設計を「サーバの３層構造」といい、よく扱われているらしいです。
また、ただ単にホームページを表示するだけならwebサーバだけで事足ります。

###2.1 nginxのインストール
上記で紹介したwebサーバの１つであるnginxをインストールします。
Apacheでも良かったのですが、最近の流行りはnginxという話を聞いたので、私はnginxにしました。
では、下記のコマンドでnginxをインストールします。
`sudo apt-get install nginx`
![スクリーンショット 2020-01-01 15.08.09.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/7621b0e3-80e9-9a5c-3e58-966cafad0ec2.png)
続いて下記のコマンドでnginxを起動します。
`systemctl start nginx`
また下記のコマンドでnginxのステータスが確認できます。
`systemctl status nginx`
ステータスにおいて、activeと緑で表示されていればOKです。
![スクリーンショット 2020-01-02 17.40.19.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/598321a9-12fd-b2b9-8814-2bf678db4a86.png)

###2.2 ホームページの確認
下記のコマンドで現在RaspberryPiに割り振られているプライベートIPアドレスを確認します。
`ifconfig`
![スクリーンショット 2020-01-02 19.15.22.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/80f9c448-654a-01dd-8cc6-9c591fd31a0f.png)
プライベートIPアドレスは192.168.11.19であることが分かります。このアドレスにアクセスします。(プライベートIPアドレスは人によって異なります)
ブラウザ画面を開き、URLに`http://192.168.11.19`と打ち込みます。そうすると、以下の画面が開きます。
※表示しているホームページ(htmlファイル)の格納場所は`/var/www/html`です。
![スクリーンショット 2020-01-02 17.39.17.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/264b4082-09ea-0c67-2244-bab31af5889f.png)


これにて、ローカルネットワーク内においてのwebサーバが構築できました！

参考サイト
・[RaspberryPI で nginx + uwsgi 最小構成](https://qiita.com/kinpira/items/bbccc8e66777a4526b0f)
・[「nginx実践ガイド」のコマンドのメモ](https://qiita.com/u310ai/items/3b99b2dfb4897ca83374)
・[nginx コマンド超シンプル早見表](https://qiita.com/katzueno/items/44e02db2f1bfa0de5860)
・[UbuntuとNginxでウェブサーバを立てる](https://qiita.com/sakkuntyo/items/807f25f9eb13525eebef)
・[nginxでWebサーバを構築してみよう](https://www.yaz.co.jp/tec-blog/webサービス/263)
・[nginxのドキュメントルートを知る方法について](https://teratail.com/questions/6690)
・[nginx 公開ディレクトリの変更](https://qiita.com/ShinyaOkazawa/items/789db336f27f0d080152)

##3.外部公開に向けての設定
続いて外部公開に向けての設定を行っていきます。
###3.1 プライベートIPアドレスの固定化
まず、プライベートIPアドレスの固定化を行います。これを行う理由としては、ルータ側の設定でRaspberryPiのプライベートIPアドレスが必要になるためです。
/etc/dhcpcd.confファイルの一番最後の行に以下の記述を追加します。(適宜プライベートIPアドレスの第3オクテットを変更してください。)
ファイルは`sudo vi /etc/dhcpcd.conf`コマンドで開きます。
vimの扱い方は、ここでは記述しません。適宜調べてください。。。
注意点：有線LAN接続を行っている場合はwlan0ではなく、eth0に変更。私はここで少しハマりました。
　　　　またip_addressはDHCPの範囲外に設定をすることを推奨。

```
 interface wlan0
 static ip_address=192.168.11.100/24
 static routers=192.168.11.1
 static domain_name_servers=192.168.11.1
```

記述ができたら、ここで一旦RaspberryPiを再起動します。
再起動が終わったら、`ifconfig`コマンドでRaspberryPiのプライベートIPアドレスが変更されたか確認をします。
私の場合ですと、`192.168.11.19`が`192.168.11.100`になりました。
###3.2 ルータのポート開放
ルータのポートを開放します。これを行うことにより、外部からのアクセスを許可することとなります。
ルータの設定画面を開きます。`http://192.168.11.1`(ここのアドレスは人によって違います。第3オクテットの値を適宜変えてください。)
![スクリーンショット 2020-01-01 14.10.39.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/d1a20feb-7d4d-9855-9695-a47b746158af.png)
下記画像の赤枠のように、ルータのポートを開放します。
ポートは80番で、LAN側IPアドレスは3.1 IPアドレスの固定化で設定した値(私の場合は`192.168.11.100`)にします。
![スクリーンショット 2020-01-02 22.56.41.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/a959520f-04e1-99cd-5d66-e7e0f1379c1d.png)
参考サイト
・[この通りやれば出来る！Raspberry PiのIPアドレス固定化からSSHによるWindowsからのリモート接続の設定](http://yurugadge-channel.com/article/185920110.html)


##4.外部からアクセス
###4.1 ホームページの確認
下記サイトにてグローバルIPアドレスを調べます。私は112.139.63.11でした。
[アクセス情報【使用中のIPアドレス確認】 - cman.jp](https://www.cman.jp/network/support/go_access.cgi)
スマホから`http://112.139.63.11`にアクセスします。
注意点：wifiは外してください。同一ネットワーク内からはアクセスできません。
下記画面が表示されたら、RaspberryPiの外部サーバ化が完了しました！
![スクリーンショット 2020-01-02 19.18.06.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/204266/a6290977-d2bd-5eda-db6f-d4bf0b5ad223.png)

###4.2 番外編(新しいホームページの設定)
nginxの初期画面では、味気ないのでホームページを変更しましょう。
先ほども説明しましたが、`/var/www/html`にホームページを表示しているindex.htmlファイルがあります。
このファイルを他のindex.htmlファイルに置き換えることで表示するホームページを変更できます。
置き換えの際に権限がありませんと注意されると思いますが、その時はsudoコマンドで操作するか、
chmodコマンドでファイルのアクセス権を変更するとできます！
また、SSH接続を用いてパソコンからRaspberryPiに対してデータを転送するといった方法もあります。
この方法は以下の参考サイトを参照して行ってください。ここでは説明しません。
以上で、RaspberryPiの外部サーバ化は終了です。

参考サイト
・[Linuxの権限確認と変更(chmod)（超初心者向け）](https://qiita.com/shisama/items/5f4c4fa768642aad9e06)
・[Raspberry Pi3のLAN外からのSSH接続設定方法](https://qiita.com/3no3_tw/items/4b5975a9f3087edf4e20)
・[Raspberry PI 3 をMacのターミナルからSSHで動かす](https://www.atnr.net/how-to-work-raspberry-pi-3-with-ssh/)
・[【ターミナル（Linux,Mac）】scpコマンドでサーバとファイルのやり取りをする
](https://qiita.com/nnahito/items/8f019aa92e5f008a1946)

#最後に
サーバ構築というと凄く難しく聞こえますが、実際にやってみると意外にできちゃいます。
IT系ってこのような難しいそうに思えるけど、実際にやってみると簡単って言うことが凄く多くある気がします。
こういったことが多々あるので、難しく思えても挑戦していきたいと思いました！
後、このサーバ構築はセキュリティ面のことを一切考えていません。全て自己責任でお願いします。
また、セキュリティについて詳しい方がいたらこの設定は大丈夫なのかどうか教えて欲しいです。
最後の最後に、このサーバを構築し24時間稼働をしているのですが、なぜか1週間か2週間ほどでサーバがダウンします。
原因が不明で悩んでます。分かる方いたら教えて欲しいです！
以上、ここまで記事を読んでいただきありがとうございました。よければ、いいねお願いします笑