2016-02-17 8 views
6

Ich entwickle eine Web-Anwendung mit einem kleinen Team, und nachdem wir etwas recherchiert und studiert haben, haben wir festgestellt, dass es eine gute Methode ist, Back-End- und Front-End-Projekte zu trennen. Also werden wir das Backend als eine REST API mit hapijs und mysql Datenbank und das Frontend mit angularjs entwickeln.Wie stellen Sie Backend- und Frontend-Projekte bereit, wenn diese separat sind?

Aber in der Produktionsumgebung müssen sie auf dem gleichen Server sein, oder? Wie stellen wir sie auf demselben Server bereit, wenn sie sich in separaten Repositories befinden?

Wir sind ein ziemlich neues Team, wir beginnen unsere Abenteuer in der Web-Entwicklung, also studieren wir viel, um die Dinge richtig zu machen.

Unsere Technologie-Stack wird:

  • Hapijs für den Webserver
  • sequelize für ORM
  • socket.io Chat-Funktionen
  • Mokka für Unit-Tests
  • AngularJS für Frontend

Wir werden Microsoft Azur für h verwenden osting unsere Web-App.

Vielen Dank für die Antworten und Hilfe.

Antwort

6

Sie müssen nicht auf dem gleichen Server sein. Es ist vollkommen in Ordnung, das Backend auf einem anderen Server zu haben, es ist auch praktisch, wenn Sie Ihr Backend/Frontend skalieren müssen, aber nicht das andere.

Es gibt ein paar Möglichkeiten:

  • Sie einen Message-Broker wie RabbitMQ zwischen den beiden Mikro-Dienste

  • Ihre Frontend-App die URL Ihrer Backend aussetzen könnte und Sie kommunizieren können Wenn Sie dies in Ihren AJAX-Anfragen verwenden, muss Ihr Backend CORS aktivieren. Kein Fan dieses Ansatzes.

  • Verwenden Sie relative URLs in Ihrem Frontend und leiten Sie dann die Anfragen mit einem bestimmten Muster (wie/api/*) zu Ihrem Backend. Wird Ihre AngularJs-App von einem Node.js-Server oder auch von einem Hapi.js-Server bedient? Wenn Node.js so etwas wie

:

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); 
}); 

Wo PROXY_URL ist die URL/IP Ihres Backend-Server. Hab es nicht in hapi.js getan, aber es sollte auch möglich sein.

Ich bin mir sicher, es gibt mehr Optionen, das sind diejenigen, die ich kenne.

+1

Hallo @nbermudezs, danke für deine schnelle Antwort. Das Problem, sie auf separaten Servern zu halten, sind die Kosten. Wir müssen zwei Server bezahlen, was für uns nicht machbar ist. –

+0

Wenn Sie sie als separate Instanzen behalten möchten, aber nur einen Server verwenden möchten, können Sie etwas wie [docker] (https://www.docker.com/) verwenden, natürlich beinhaltet es noch mehr lernen zu Ihrem Abenteuer. – nbermudezs

+0

Wenn Docker nicht für Sie geeignet ist, müssen Sie mit Bash - Skripten herumspielen, um in das Frontend - Projekt zu cd zu gehen, alle Befehle auszuführen, die Sie ausführen müssen, um dist - Dateien zu erzeugen (verkleinerte Dateien) Hauptprojekt, wahrscheinlich in einen öffentlichen Ordner und starten Sie schließlich Ihren Bereitstellungsprozess. – nbermudezs

0

Wie Sie jetzt beginnen, denke ich, dass Sie damit umgehen können, indem Sie zwei Server-Instanzen mit hapi erstellen.Dies richtet sich Ihre Anforderung nur ein Server in der Produktion zu haben:

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

Das ist wirklich einfach zu implementieren, aber es kommt mit einem Nachteil: Sie brauchen Zeit, Form anzunehmen unten sowohl die Client- und Server-Anwendung, wenn Sie Roll-Out Aktualisierung.

Sie können weitere Informationen in diesem Beitrag finden: https://futurestud.io/blog/hapi-how-to-run-separate-frontend-and-backend-servers-within-one-project

In Bezug auf die Bereitstellung, was auch immer Sie Release (Continuous Integration Tools, manuelle Skripte, etc.) verwenden, um zu bauen sein git azur geschoben: https://azure.microsoft.com/en-us/documentation/articles/web-sites-publish-source-control. Zum Beispiel würde ein manuelles Skript Ihren Code aus den zwei separaten Repositories (Front-End und Back-End) holen, die relevanten Dateien kopieren, die Konfigurationswerte aktualisieren und das Endergebnis auf git setzen.