Nodejs/HapiJs z Angular.js

Question

Czy ktoś może mi wyjaśnić jak połączyć nodejs (serwer hapi) z AngularJs? Pomyślałem, że mogę tylko złapać każdą prośbę złożoną do mojego serwera Hapi i reagować na te żądania za pomocą tras angularjs/REST itp ...

Serwer działa i serwuje mi mój index.html, jak się spodziewam, ale jednak mam głupi, żeby wepchnąć mój app.js do kanciastych rzeczy. Myślę, że moje podejście jest całkowicie błędne.

Hapi

server.route({ 
    method: 'GET', 
    path: '/{p*}', 
    handler: function (request, reply) { 
     reply.file('public/index.html'); 
    } 
}); 

index.html (nagłówek)

<script src="CDN/angular.min.js"></script> 
<script src="./app.js"></script> 

kod Inline angularjs w moim index.html działa prawidłowo. Jestem wdzięczny za każdą odpowiedź lub pewne zasoby, na które mogę spojrzeć.

Answer 1

Twoje podejście dotyczy interfejsu API, a nie obsługi plików statycznych. Server statyczne pliki takie jak ten:

// static file 
server.route({ 
    method: 'GET', 
    path: '/{param*}', 
    handler: { 
     directory: { 
      path: Path.join(__dirname, 'public/app') 
     } 
    } 
}); 

zobaczyć więcej informacji tutaj http://hapijs.com/tutorials/serving-files

Answer 2

Twoje przypuszczenie jest prawidłowe. Jeśli chcesz współpracować z Hapi i AngularJS, zalecanym sposobem byłoby uczynienie twojej aplikacji Hapi usługą RESTful przy użyciu JSON do przesyłania danych, a Twoja aplikacja AngularJS byłaby twoim interfejsem sieciowym.

W ten sposób możesz wykorzystać najlepsze z obu stron. AngularJS użyłby swoich usług ($http, $resource), aby uzyskać dane z twojej usługi internetowej i przedstawić je poprzez prawidłowe widoki dla twoich ścieżek aplikacji.

Wszystko to jest w zasadzie MEAN stack, ale użyjesz Hapi zamiast Express.

Answer 3

Chociaż sugestia Lugga z pewnością zadziała, będzie miała zastosowanie tylko wtedy, gdy nie masz serwera WWW. Powinieneś zorganizować aplikację kliencką oddzielnie od aplikacji serwera lub przynajmniej umieścić aplikację serwera w folderze nad katalogiem głównym.

Aplikacja kliencka zostanie skonfigurowana jako statyczna strona internetowa. Twój serwer WWW będzie obsługiwał obsługę plików index.html i wszystkich plików Angular. Twój HTML i Angular/Javascript będą obsługiwać żądania części, modułów js itp. W ten sposób zyskasz wszystkie funkcje i moduły serwera WWW.

Strona serwera może następnie służyć do nasłuchiwania żądań interfejsu API i odpowiadania na nie. Nie powinien dostarczać plików aplikacji klienta. Powinien zazwyczaj dostarczać odpowiedzi JSON.

Takie podejście jest prostsze i zapewnia dobrą separację klient/serwer. Dzięki temu serwer koncentruje się na dostarczaniu danych, a strona klienta koncentruje się na obsłudze interfejsu użytkownika. To oddzielenie problemów umożliwia także pisanie innych klientów i komunikowanie się z aplikacją serwera.

Wierzę, że moja odpowiedź jest po prostu rozszerzeniem odpowiedzi na Hodes. Próbowałem nieco bardziej wyrazić moją odpowiedź, ale myślę, że ogólny pomysł jest taki sam.

Answer 4

używam tego kodu do pliku indeksu:

server.route({ 
method: 'GET', 
path: '/{param*}', 
handler: function(request, reply) { 
    return reply.file(path.resolve(__dirname, '..', 'public/index.html')); 
} 
}); 

A to dla innych katalogach:

server.route({ 
method: 'GET', 
path: '/{param*}', 
handler: { 
    directory: { 
    path: path.resolve(path.resolve(__dirname, '..', 'directory_name')) 
    } 
} 
}); 

Dla niektórych wersjach węzła trzeba obojętny wymagają

var Inert = require('inert');