web-dev-qa-db-ja.com

バックエンドプロジェクトとフロントエンドプロジェクトが別々の場合、どのようにデプロイしますか？

私は小さなチームでWebアプリケーションを開発していますが、少し調べて調べたところ、バックエンドプロジェクトとフロントエンドプロジェクトを分離することをお勧めします。したがって、バックエンドをREST APIとhapijsおよびmysqlデータベースを使用して開発し、フロントエンドをangularjsを使用して開発します。

しかし、実稼働環境では、それらは同じサーバーにある必要がありますよね？それらが別々のリポジトリにある場合、どのようにそれらを同じサーバーにデプロイしますか？

私たちはかなり新しいチームであり、Web開発の冒険を始めているので、物事を正しくするために多くのことを研究しています。

私たちのテクノロジースタックは次のようになります。

  • Webサーバー用のHapijs
  • ormの続編
  • チャット機能用のsocket.io
  • ユニットテスト用のモカ
  • フロントエンドのangularjs

WebアプリのホスティングにはMicrosoftAzureを使用します。

答えと助けてくれてありがとう。

node.jsrestfrontendbackendhapijs
9
Victor Silva Do Nascimento

それらは同じサーバーにある必要はありません。バックエンドを別のサーバーに配置することはまったく問題ありません。バックエンド/フロントエンドをスケーリングする必要があるが、他のサーバーはスケーリングする必要がない場合にも便利です。

いくつかの可能性があります：

  • RabbitMQ のようなメッセージブローカーを使用して、2つのマイクロサービス間で通信できます。

  • フロントエンドアプリがバックエンドのURLを公開する可能性があり、それをAJAXリクエストで使用します。これには、バックエンドで有効にする必要があります [〜＃〜] cors [〜＃〜] 。このアプローチのファンではありません。

  • フロントエンドで相対URLを使用してから、特定のパターン（/ api/*など）でリクエストをバックエンドにパイプします。 AngularJsアプリはNode.jsサーバーによって提供されていますか、それともHapi.jsサーバーによって提供されていますか？ Node.jsが次のような場合

：

app.all(['/api/*', '/fe/*'], function(req, res) {
    console.log('[' + req.method + ']: ' + PROXY + req.url);
    req.pipe(request({
        url: PROXY + req.url,
        method: req.method,
        body: req.body,
        rejectUnauthorized: false,
        withCredentials: true
    }))
    .on('error', function(e) {
        res.status(500).send(e);
    })
    .pipe(res);
});

どこ PROXY_URLはバックエンドサーバーのURL/IPです。 hapi.jsでそれを行っていませんが、可能であるはずです。

私はもっ​​と多くのオプションがあると確信しています、それらは私が精通しているものです。

6
nbermudezs

皆さんが今始めているので、hapiで2つのサーバーインスタンスを作成することでこれを処理できると思います。これは、本番環境にサーバーを1つだけ持つという要件に対応します。

const server = new Hapi.Server();
server.connection({ port: 80, labels: 'front-end' });
server.connection({ port: 8080, labels: 'api' });

これは実装が非常に簡単ですが、欠点があります。更新をロールアウトするたびに、クライアントアプリとサーバーアプリの両方からダウンタ​​イムを受け入れる必要があります。

この投稿で詳細を見つけることができます： https://futurestud.io/blog/hapi-how-to-run-separate-frontend-and-backend-servers-within-one-project

デプロイに関しては、リリースのビルドに使用するもの（継続的インテグレーションツール、手動スクリプトなど）をAzureにgitプッシュできます： https://Azure.Microsoft.com/en-us/documentation/ articles/website-publish-source-control 。たとえば、手動スクリプトは、2つの別々のリポジトリ（フロントエンドとバックエンド）からコードをフェッチし、関連するファイルをコピーし、構成値を更新して、最終結果をgitにプッシュします。

0
Andre Gallo