この記事では、cPanel を使用して Namecheap の共有ホスティング サーバーで Node.js アプリをホストする方法について説明します。この記事では、Web アプリのデータベース サーバーや React フロント エンドの設定については説明しません。代わりに、共有ホスティング環境で Node アプリを実行する際に直面する可能性のある課題に焦点を当てたいと思います。
== 遅れないで、今日ホストしましょう! ==
Web アプリの開発に取り掛かる前に、安定したバージョンをオンラインに置くことをお勧めします。これは、実稼働環境、または実稼働環境に類似したステージング環境にある可能性があります。ほとんどの人は、オンラインでホストする前に、アプリがほぼ完成するまで待ちます。これは、最初の React および Node Web アプリを開発したときに行ったことです。しかし、その時点で Node API サーバーを稼働させるには多くの課題があり、React アプリにも多くの変更を加える必要がありました。そのため、コードを書きすぎる前に調整できるように、早い段階でバージョンをオンラインにすることをお勧めします。
== 共有ホスティング サービスの使用 ==
Namecheap の共有ホスティング サーバーは、コントロール パネル インターフェイスとして cPanel を使用して Apache サーバーを管理します。これらの手順は、A2 Hosting や GoDaddy などの cPanel で共有ホスティング サービスを使用しているすべての人にも役立ちます。
また、Namecheap サーバーに SSL 証明書を設定し、cPanel はデフォルトですべての HTTP トラフィックを HTTPS にリダイレクトします。したがって、サーバーへのすべてのトラフィックは安全です。
DigitalOcean などの VPS (Virtual Private Server) ホスティング サービスでノード アプリをホストする方法を説明するガイドが多数あります。ゼロから始めている場合は、そのようなサービスを使用してホスティングすると、より多くの制御が可能になります。ただし、通常、共有ホスティングよりも高価です。私の場合、すでに Namecheap 共有ホスティング サービスの料金を支払っていました。
cPanel と共有ホスティングを使用する利点:
- シンプルな Web 管理コンソールで管理
- 設定が簡単
- 特にサイト/ドメインをすでにホストしている場合は安価です
- さまざまなテクノロジーを検討している場合は、PHP などの他のテクノロジーを使用して動的な Web サイトを簡単にセットアップできます
いくつかの欠点:
- 基礎となるオペレーティング システムにアクセスできないため、コントロールが少なくなります。
- スケーラブルではない
== すべてはどこへ行く? ==
最初に、Node アプリのすべてのソース ファイル用のフォルダーを作成する必要があります。 /home/username ディレクトリに ãâ¢ãâãânodejsãâ¢ãâãâ というフォルダーを作成し、このフォルダー内に各アプリのサブフォルダーを作成します。ここで、すべてのソース ファイルをこのサブフォルダーにアップロードします。 package.json ファイルも必ず含めてください。パッケージ マネージャーで作成されるため、「node_modules」フォルダーはアップロードしません。後で。
Web アプリ アーキテクチャの例では、Node API サーバーをホストしているだけであることを思い出してください。 Node を使用して React アプリをホストすることはしません (このトピックについては次の記事で詳しく説明します)。
httpsdavenewman.tech/wp-content/uploads/2020/06/Diagram-5_1.jpg フォルダー レイアウトは、/home/username/nodejs/mynodeapi フォルダーの下の Node ソース ファイルを示しています。 /home/username/public_html/myapi フォルダー内の .htaccess ファイル
== 問題 「ノード アプリがポートにアクセスできない」 ==
最大の課題は、Node API アプリを実行することでした。問題は、Namecheap のサポート ドキュメントに記載されているサンプル コードが機能しないことでした。ポート 80 でリッスンする httpserver とポート 443 でリッスンする http **s** サーバーを作成しようとします。それらのポートを使用するには。
== ソリューション ノードはポートにアクセスする必要はありません! ==
最終的に、別のホスティング コントロール パネルである Plesk に関するスレッドでユーザー SibProgrammer のコメントを読んで解決策を見つけました。 cPanel は、Plesk と同様に、Phusion Passenger アプリケーション サーバーを使用して Node アプリをホストします。要約すれば：
ブラウザーからリクエストを送信すると、リクエストは Apache サーバーに送られ、次に Phusion Passenger、そして Node アプリに送られます。 Node アプリは、Apache および Phusion Passenger アプリケーション サーバーによってさらに上流で処理されるため、ポートを所有する必要はありません。
これにより、www.js (または app.js) ファイルで httpserver を作成するためのコードが簡素化されます。
* www.js * Namecheap の http サーバーの作成をテストしています。 * Dave */ const http = require('http http.createServer(function(request, response) { response.writeHead(200, {'Content-Type': 'text/html response.endh1>Hello Worldh1 listen(process.env) .PORT); console.log('アプリは実行中です
注意すべき点がいくつかあります。
- process.env.PORT をリッスンします (80 または 443 を手動で設定する代わりに)。テスト中に、process.env.PORT が定義されていないことに気付きました。しかし、興味深いことに、この場合は問題ではありません。
- SSL が設定されている場合でも、http サーバーを使用します。 cPanel は、すべての HTTP トラフィックを HTTPS にリダイレクトするように Apache を構成し、その結果、すべてのリクエストに HTTPS で応答するようにしました。 Node アプリを手動で構成して https サーバーをセットアップし、SSL 証明書を読み込む必要はありません。
== Node API サーバーの最終ステップ ==
これで、指示に従ってノード アプリをセットアップするという比較的簡単なプロセスになるはずです。
httpsdavenewman.tech/wp-content/uploads/2020/06/Diagram-5_2.jpg cPanelãâ¢ãâãâ の Node.js 構成ページのスクリーンショット
- 適切なバージョンの Node.js とアプリケーション モードを選択します (Production をお勧めします)。
- ãâ¢ãâãâApplication rootãâ¢ãâãâ は、以前にソース ファイルをアップロードしたフォルダになります (ãâ¢ãâãâ上記の例では、nodejs/mynodeapiãâ¢ãâãâ)。
- ãâ¢ãâãâApplication URLãâ¢ãâãâ は、API へのアクセスに使用される URL になります (ãâ¢ãâãâmyapiã â¢ãâãâ 例)。このボックスに入力した名前は、/home/username/public_html フォルダーにサブフォルダーを作成するために使用されます。アプリケーション ルートのフォルダと同じ名前である必要はありません (ただし、なることが多い）。
- ãâ¢ãâãâApplication スタートアップ ファイルは、Node アプリの作成方法に応じて、www.js または app.js になります。
- Passenger ログ ファイルをどのように構成するかは、ユーザー次第です。
- アプリを作成すると、「NPM インストールを実行する」ボタンが表示されます。 â¢ãâãâ。これを実行すると、アプリが必要とするすべての依存モジュールを含む ãâ¢ãâãânode_modulesãâ¢ãâãâ フォルダーが作成されます。
Node アプリをセットアップして開始すると、/home/public_html フォルダーにサブフォルダーが作成されます。そのフォルダーに移動して .htaccess ファイルを編集し、次の行を追加する必要があります。
RewriteEngine オフ
これにより、Apache サーバーが、API サーバーにそのまま送信する必要がある要求を書き換え (またはリダイレクト) することを防ぎます。
そして、それだけです！これで、Node API アプリが起動して実行され、API 呼び出しに応答するはずです。
== では、次は何ですか? ==
Node API サーバーをセットアップしたので、開発環境の React フロントエンドをこの API サーバーを指すように変更できます。または、Postman を使用して API 呼び出しをテストすることもできます。
次の記事では、Namecheap と cPanel で React アプリをホストする方法について説明します。
Dave
