見出し画像

自作のHTMLをインターネットで配信する方法

こんにちはMsAです👩🏻‍🦰

今回はnginxについて勉強したので、nginxを使って超簡単なhtmlをインターネットに公開する方法を書いておきます。
(MsAは、さくらのVPS上のDebianを使っているため、自分のMacにはダウンロードしていません)

Nginx(エンジンエックス)とは

(幾つかのサイトを参考にしています)
htmlを配信するWebサーバのソフトのひとつのこと。(他にもWebサーバのソフトには「Apache」や「IIS」など、いくつか種類がある。)
主に静的なコンテンツを提供する。(一応動的なコンテンツも提供できるが、他のWebアプリケーションサーバーとの連携が必要になる)
nginxの設計は、マルチスレッドを使わずに、イベント駆動のアーキテクチャを採用したため、C10K問題を回避できる設計になっている。
他にもリバースプロキシの機能があるため、負荷を分散を行うことができる。

参考サイト: 
https://heartbeats.jp/hbblog/2012/01/nginx01.html
https://wa3.i-3-i.info/word12859.html

Nginxのインストール方法

私はsshでさくらのVPSに繋いで、Macのターミナル画面でおこないました。

1,DebianにNginxをインストールする。

$ sudo apt-get install nginx 

2,新しいバージョンがいいので、パッケージの公開鍵をダウンロードしてapt-keyで追加する。

$ wget "http://nginx.org/keys/nginx_signing.key"
$ sudo apt-key add nginx_signing.key

3,nginxのサイトをリポジトリに追加する.

$ sudo vim /etc/apt/sources.list

4,開いたファイルに以下を追加する。

$ deb http://nginx.org/packages/debian/ squeeze nginx
$ deb-src http://nginx.org/packages/debian/ squeeze nginx

5,登録を反映して最新版をインストールする。

$ sudo apt-get update
$ sudo apt-get install nginx

6,ブラウザの検索バーにアクセスして、「Welcome to nginx!」と表示されたら成功。
(http://サーバー名/ と入力してアクセス!)

参考サイト:
http://nomnel.net/blog/install-nginx-in-debian-using-apt-get/
https://blog.goo.ne.jp/moonycat/e/8b471fe34d751b06e051d41334ccb141

表示されるHTMLの場所を確認する

ブラウザに「Welcome to nginx!」と表示されているhtmlがどこにあるのかがわかれば、そこに新しいhtmlをおいてブラウザに表示させることが出来ます。
Nginxをインストールしたので、設定ファイルをみて確認してみます。

Nginx の設定ファイル /etc/nginx/nginx.conf の中をvimで見てみる。

 include /etc/nginx/sites-enabled/*;

↑の行は、/etc/nginx/sites-enabled/* を読み込むと書いてあるので、/etc/nginx/sites-enabled/default(lsで確認したらこれしか入ってなかった)をvimで確認すると、

 root /var/www/html;

と書いてある。つまり、ブラウザに表示させるには、/var/www/html 以下にhtmlファイルを置けばいいことが分かった。
早速 /var/www/html の中をlsで見てみる。

$ ls /var/www/html/
index.nginx-debian.html 

「Welcome to nginx!」と表示されているhtmlが見つかった!
念の為、index.nginx-debian.htmlをvimで開いて中を書き換えてみたら、ちゃんとブラウザの方にも反映されていたので間違いないことが分かった。

参考サイト:
http://hir-aik.hatenablog.com/entry/2014/04/16/160659

HTMLを配信する

では、 /var/www/html/ 内にvim で新しくhtmlを作る。
(名前は、index.sample.htmlにする。) 

$ vim /var/www/html/index.sample.html 

超簡単なHTMLを書いて保存する。

<DOCTYPE HTML>
<html lang="ja">
<head>
 <meta charset="UTF-8">
 <title>MSAのサンプルHTML</title>
</head>
<body>
	 <h1>MSAのNginx用サンプル</h1>
	 <p>すごくサンプルです。すごくサンプルです。すごくサンプルです。</p>

</body>
</html>

ブラウザの検索バーに、
http://サーバー名/index.sample.html と入力する。

画像1

ブラウザ上に作ったHTMLのページが配信される。

これでインターネットにHTMLを配信できます。
今回はここまでにします😊


この記事が参加している募集

この記事が気に入ったらサポートをしてみませんか?