私は伝統的なバックエンドから来ましたJava/Spring
学ぶための環境Angular 2 framework
、そして基本的な概念の多くを理解するのに苦労しています。
私はマニングブックを読んでいますAngular 2 Development with TypeScriptと書いてあり、HTTP-server
を実行するにはSAP'
s。何故ですか?
Angular
はクライアントマシンで実行すると思いました。それでは、サーバーの正確な機能は何ですか? HTML
を開いただけでは、Angular
は魔法をかけません。
実際、AngularアプリケーションはHTTPプロトコルを使用してアクセスすることを想定しているため、開発にはHTTPサーバーを使用することをお勧めします。「同じ条件」になります。これにより、いくつかの制限と制限があります:
file://
プロトコルではうまく機能せず、ブラウザによってはセキュリティ制限が適用される場合があります。これらの問題の詳細については、次のリンクを参照してください。
Webサーバーの選択に関して、静的WebサーバーはAngularアプリケーションに十分であり、この目的のためにいくつかの軽量HTTPサーバーがあります:
http-server
- https://github.com/indexzero/http-serverlite-server
- https://github.com/johnpapa/lite-server興味深い機能(lite-server
など)は、ライブリロードにあります。サーバーは、コンテンツ(HTML、JavaScript、CSS)の更新を検出し、対応するページをブラウザーに自動的に再読み込みします。これにより、アプリケーションを実装する際の効率を高めることができます。
最後に、クライアント(Angular)側とサーバー側の両方を実装する場合、これらの部分は異なるサーバーで実行する必要があります(開発環境では、本番環境などの他の環境では異なる可能性があります)。というのは:
これらの2つのサーバーがあるため、CORS(クロスオリジンリソースシェアリング)を有効にして、AngularアプリケーションがサーバーアプリケーションでAJAXリクエストを実行できるようにする必要があります。実際、あなたは同じドメインに属していません。これは、ブラウザーがリクエストでOrigin
ヘッダーを送信したときにCORSヘッダーを返すようにサーバー側で構成する必要があるものです。詳細については、これらのリンクを見てください:
Angularのルーティング機能を使用する場合に注意すべきもう1つの点は、HTML5履歴モードが「実際の」アドレスをシミュレートすることですが、この場合、Webサーバーに設定をロードして各ルートに対応する各URLのindex.html(エントリポイントファイル)。詳細については、この回答を参照してください: Webサイトを更新すると、404が表示されます。これは、Angular2とfirebase 。
考慮すべき最後のポイントは、本番環境用のアプリケーションのパッケージ化です。アプリケーションを効率的にする必要があります(要素の縮小、JavaScriptファイルの連結、テンプレートのプリロードなど)。このレベルでは、2つの別個のサーバーを保持する必要はなく、Angularパーツはサーバー側アプリケーション内にパッケージ化できます。この場合、後者はいくつかの統計ファイルを提供できる必要があります。
それがあなたを助けることを願っています、ティエリー
AngularJS 1.3のようなものであれば、HTMLテンプレートを取得するためにAJAXリクエストを作成します。そのためには、少なくとも実際のHTTPサーバーが必要です。
現在AngularはデフォルトでPathLocationStrategy
を使用しますが、これにはリダイレクトを行うサーバーが必要です(例 Angular 2.0ルーターがブラウザのリロードで機能しない)を参照 ) HashLocationStrategy
を使用する必要はありません。通常、ブラウザアプリケーションをHTTPサーバーからロードします。Angularを適切に構成すれば、これで実行できます。
ブラウザには、ファイルから直接読み込むときに許可される制限があるため、開発中はサーバーが必要です。
静的ファイルを提供するにはライトサーバーが必要です。
この背後にある理由はセキュリティです。
ブラウザは、ファイルシステムへの直接リクエストを許可しません。
Lite-serverがインストールされないことがわかりました。
angular-http-serverは私にとって箱から出して完璧に機能しました: