AngularJSのような単一ページのフレームワークを使用する場合、NodeJSを使用してソーシャル共有と検索エンジンの問題を解決する方法

Question

AngularJSのソーシャル共有の問題について、articleと、Apacheをプロキシとして使用して対処する方法を読んでいます。

このソリューションは、小さなウェブサイトで使用できます。しかし、Webアプリケーションに20以上の異なるページがある場合、それらのすべてのために静的ファイルを作成して作成する必要があります。さらに、PHPとApacheを使って別のスタックがアプリケーションに追加されます。

1. NodeJSをプロキシとして使用してURLを書き直すことはできますか？アプローチは何ですか？
2. スタティックファイルの作成を最小限に抑える方法はありますか？
3. proxy、url-rewrite、およびstaticファイルを一括して削除する方法はありますか？例えば、NodeJSアプリ内でユーザーエージェントをチェックするために、フェイスブックのボットやツイッターなどであればリクエストモジュールを使用してページをダウンロードし、それらのHTMLコードを返すことができます。

Answer 1

通常、誰かがソーシャルネットワークでURLを共有すると、そのソーシャルネットワークはそのページにプレビュー/サムネイル（別名「スクレイプ」）を生成するようにリクエストします。 これらのスクレイパーはjavascriptを実行しないため、そのページの静的なHTMLバージョンが必要です。 Googleと他のユーザーがjavascriptサイトをサポートし始めているにもかかわらず、検索エンジンにも同じことが適用されます。ここで

はまだスクレーパーをサポートするためのSPAのための良いアプローチだ：（。すなわち#なしのURL）にアプリを通してナビゲートするときに仮想のURLを取得するための角度で

• 使用history.pushStateを
• サーバ - 要求URLがファイル拡張子を持っている場合は、おそらく静的リソースです（例えば、このlib https://www.npmjs.com/package/is-botを使用してUser-Agentを確認してください）
• リクエスト（画像、.css、.js）、プロキシで静的ファイルを取得する
• リクエストURLがページの場合、実際のユーザーの場合、URLがページの場合（つまり、静的リソースではない）は常に、あなたの角型アプリケーションをロードするindex.htmlを提供します（プロのヒント：このファイルをメモリにキャッシュします）
• リクエストURLがページの場合、リクエストされたURL javacriptを実行しません）、これは難しい部分です（副作用：ReactJSはこの問題をはるかに単純化します）、https://prerender.io/のようなサービスを使用して角型アプリケーションをロードし、各ページをhtmlとして保存します好奇心をそそられているので、PhantomJSと呼ばれるヘッドレス/バーチャルブラウザを使用して、実際のユーザーが「名前を付けて保存...」をクリックするとシミュレートします）、プリレンダーされたページをリクエストして、ソーシャルネットワークのscrappersのような）。必要に応じて、独自のサーバーでプリレンダリングインスタンスを実行することができます。 https://github.com/prerender/prerender-node/blob/master/index.js （あなたは事前レンダリングを好きではない場合でも、あなたが実装ガイドとしてそのコードを使用することができます）
  ：

はすべて私がこれに実装されている説明このサーバー側のプロセスは、事前レンダリングによりミドルウェアをexpress.js

また、nginxのみを使用した実装例もあります： https://gist.github.com/thoop/8165802