0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

EC2でExpressサーバーとNginxを使用したリバースプロキシの作成

Last updated at Posted at 2024-09-06

アジェンダ

Expressサーバーを作成し、Nginxからそのサーバーにリクエストをプロキシしてレスポンスを返すまでの手順を簡単にまとめます。
Nginxはリバースプロキシとして動作し、外部からのリクエストをExpressサーバーに転送します。

1. Expressサーバーの作成

まず、EC2インスタンス上でNode.jsとExpressをセットアップし、簡単なExpressサーバーを作成します。

Node.jsとnpmのインストール

sudo apt update
sudo apt install nodejs
sudo apt install npm

Expressサーバーの作成

mkdir my-express-app
cd my-express-app
npm init -y
npm install express

app.jsファイルの作成

次のコマンドでapp.jsファイルを作成し、vimエディタを使用して編集します:

vim app.js

app.jsというファイルを作成し、次のコードを記述します:

const express = require('express');
const app = express();

app.get('/', (req, res) => {
  res.send('Hello from Express!');
});

const port = 3000;
app.listen(port, () => {
  console.log(`Server is running on port ${port}`);
});

エディタを保存して終了するには、:wで保存し、:qでvimを終了します。

Expressサーバーの起動

node app.js

これで、http://localhost:3000でExpressサーバーが稼働しているはずです。

2. Nginxの設定

次に、Nginxをリバースプロキシとして設定し、Nginx経由でExpressサーバーにリクエストが届くようにします。

Nginxのインストール

sudo apt install nginx

Nginxの設定ファイルを編集

設定ファイルは/etc/nginx/sites-available/defaultにあります。以下のようにリバースプロキシの設定を追加します。

sudo vim /etc/nginx/sites-available/default

serverブロックに以下を追加します:

server {
    listen 80;

    server_name your_server_domain_or_IP;

    location / {
        proxy_pass http://localhost:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

ここで、your_server_domain_or_IPはEC2インスタンスのパブリックIPやドメインに置き換えます。

Nginxの再起動

設定を有効にするためにNginxを再起動します。

sudo systemctl restart nginx

3. 動作確認

ブラウザでEC2インスタンスのパブリックIPにアクセスし、NginxがExpressサーバーからのレスポンスを正しくプロキシしているか確認します。

http://your_ec2_public_ip

Hello from Express!と表示されれば成功です。

最終的なWebサーバーインスタンス内のディレクトリ構成

/home/ubuntu/my-express-app
├── app.js               # Expressサーバーのエントリーポイント
├── node_modules/         # npmモジュール
├── package.json          # npmプロジェクトの設定ファイル
└── package-lock.json     # 依存関係の詳細

Nginxの設定は次の場所にあります:

/etc/nginx/sites-available/default  # Nginxのリバースプロキシ設定

補足

  • NginxとExpressの役割: Nginxはリバースプロキシとして動作し、クライアントからのリクエストをExpressに転送し、Expressのレスポンスをクライアントに返します。
  • リバースプロキシの理由: Nginxは高性能なリクエスト処理ができ、セキュリティや負荷分散、SSLターミネーションなどの機能を提供するため、Node.jsのアプリケーションを直接公開するのではなく、Nginx経由で運用するのが一般的です。
0
1
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
1

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?