16

私は現在、API/JSON に対して動作する HTML5/JS でページ全体を実装する必要がある新しいプロジェクトに取り組んでいます。アプリケーション全体は 1 つの HTML ファイル (index.html) と JS MVC アプリケーション (おそらく backboneJs) のみで構成される必要があるため、SEO とユーザー フレンドリーな URL について考えています。

そこで出会った

window.document.pushstate('','title','/url');

その html5 機能の助けを借りて、実際にページを離れたりリロードしたりせずに URL を定義できます。しかし...パフォーマンス上の理由と低コストのために、アプリケーションをAmazon CloudFount のような CDNにデプロイしたいと考えています。サーバー インフラストラクチャは必要ありません (もちろん、API に必要なもの以外は)

したがって、どの URL が呼び出されても同じ HTML ファイルを提供するように CDN (実際には AWS、Azure、Akamai などの任意の CDN) を構成できますか?

http://www.example.com => index.html を配信

http://www.example.com/any_subpage => index.html を配信

等々 ...

http://html5.gingerhost.comに実例があります。ただし、そのページの作成者は、.htaccess ファイルまたは使い慣れたものを使用して、すべてを同じファイルにマップする場合があります。CDN で同じ機能を提供したいと考えています。

4

9 に答える 9

4

すべての CDN には、オリジン サーバーを定義する機能が必要です。エッジの場所にファイルがない場合、このサーバーは CDN から連絡を受けてファイルを提供します。

幸いなことに、オリジン サーバーは、Apache、Nginx など、Web ページにサービスを提供するものであれば何でもかまいません。これは、任意の種類の書き換えルールを適用できることを意味します。

オリジンサーバーを自分でセットアップしたくない場合は、S3 で (静的) サイトをホストすることを検討できます。最近、同じファイルを別の「エイリアス」で提供するのに役立つWeb リダイレクトが導入されました。それができない場合は、標準エラー ドキュメントの再定義を検討できますが、エラー ステータス コードが引き続き送信されるかどうかはわかりません。

于 2012-11-22T04:50:01.083 に答える
3

CDNは、クライアントに可能な限り最も近い地理的ポイントから静的リソースを提供することにより、静的コンテンツを配信することを目的としています。CDNテクノロジーは、リクエストのリダイレクトまたはサーバー側の処理を行うことを目的としていません。その部分を行うには、ここで何か他のものが必要になります。問題は、それがサーバー側のテクノロジーなのか、それともある種のロードバランサー/ファイアウォールリクエストの書き直しなのかということです（サーバー側のテクノロジーを避けるため）。

これを行うための真にプラットフォームにとらわれない方法はないと思います。サーバー側のテクノロジーまたはロードバランサー/ファイアウォールプラットフォームのいずれかに常に縛られます。しかし、JSON APIをホストする場所が必要なため、すでにこの制約があるように思われますか？プラットフォームを決定していなくても、ほとんどすべてのプラットフォームで基本的なルーティングを実行できるはずです。JSON Httpリクエストを処理できる場合は、ページルーティングも実行できるはずです。

ちなみに、ドメインで可能なすべてのURLから「index.html」を返したいとは思わない。有効なURLと無効なURLのリストが必要になります。その場合、リクエストURLを検証するために、とにかくバックエンドにpingを実行する必要があります。これはさらに、サーバー側のテクノロジがこのタスクに適していることを示唆しており、下位レベルでのブラインド「キャッチオール」リダイレクトよりも適しています。

私の個人的な好みは、お気に入りのMVCフレームワークを使用して、インデックス可能なコンテンツを目的のURL構造（ほぼすべてのページの読み込み）で提供し、JSON APIを使用して、ページの読み込み後にそのコンテンツを処理することです（動的なものを可能にしたい場合）する）。ページの読み込みとAPIの両方をすべて、同じサーバープラットフォーム/環境から提供します。

于 2012-11-22T04:33:50.313 に答える
1

CDNを指す独自のドメインがある場合（CloudFrontでそれが可能になることはわかっています）、CloudFlare（ https://www.cloudflare.com/）をユーザーとCDN間のリバースプロキシとして使用できます。

無料プランのおかげで、すべてをindex.htmlにリダイレクトするルールを作成できます。ご存知のように、CDNは静的な既存のファイルのみを提供するように構成されているため、これが目的を達成する唯一の方法だと思います。

于 2012-11-22T10:34:16.300 に答える
1

SEOとわかりやすいURLを検討している場合はpushState、確かにその一部を使用して達成できます。覚えておいてください：

  • すべてのルートをindex.htmlにリダイレクトすると、検索エンジンがどのURLにアクセスしても、まったく同じhtmlコンテンツが検索エンジンに提供されます。そうすれば、あなたのURLがどれほど「SEOにやさしい」かは問題ではありません。

  • IEのサポートを検討している場合は、History APIをサポートしていないため、IEのより高いレベルの履歴フレームワークまたはその他の回避策が必要になります。そして、それはおそらく#ベースのURLを含むでしょう。したがって、基本的にビューごとに2つの異なるURLがあります。これは、ユーザーがURLを共有するとき、または検索ロボットがサイトへのリンクをどのようにキャッチするかを理解するときに考慮する必要があります。

適切なクラウドホストを見つける前に、次の2つのオプションを検討することをお勧めします。

  1. 一部のデータロジックをバックエンドにオフロードし、ビューごとに少なくとも一部のダイジェスト可能なコンテンツを提供します。アプリ内のコンテンツを削除または解析して、UXを向上させるためにpushstate / jsonAPIを実行することはできますが、検索エンジン、Opera Miniユーザー、その他の不幸なブラウザー用の「真の」スキャン可能なURLがあります。これらの静的ページは、同じ機能やスタイルを提供する必要はありません。最後のフォールバックと考えてください。

  2. アプリのCDNを忘れて、静的ファイル、画像、スクリプトなどにCDNを使用します。アプリ自体にいくつかのフォールバックを設定できますが、サーバーを実際にプルするのはメディアです。そうすることで、アプリとその背後にあるサーバーを制御できるようになりますが、静的コンテンツの提供という本来の目的でCDNを使用することはできます。

于 2012-11-24T22:55:14.600 に答える
1

404 ページをインデックス ページにシンボリック リンクします。そうすれば、要求された URL が Web コンテンツ (あなたの場合に表示されるリンクについて) で見つからない場合、404 ページが提供され、それがインデックス ページ自体になります。

# ln -s index.html 404.html

于 2012-09-09T07:37:40.387 に答える
1

Nginx http サーバーは次のように実行できます。

location /{
    # serve a file
}

または、次のようにリンクをカスタマイズできます

location /my_html{
     # serve html file
}

location /cdn/{
     # serve rest files
}

正規表現でURLをチェックすることもできます

location ~ /cdn/.*\.js${
    # serve cdn
}
于 2012-11-22T00:40:27.050 に答える
1

私はあなたと同じ船に乗っており、cdn は URL の書き換えをサポートしていないようです。次の解決策は、私たちの「問題」を正確に解決するものではありませんが、「プル」CDN プロバイダーを使用している場合、ホスティング費用を節約することに非常に近いものです。

デフォルト ページ (index.html) の最初のロードでは、次のように、基本的に必要最小限の html 構造である html のごく一部が提供されます。

<!doctype html>
<html lang="en">
<head>
    <title>something</title>
    <!-- Load the script "js/main.js" as our entry point -->
    <script data-main="js/main" src="http://mycdn.com/js/libs/require/require.js"></script>
</head>
<body>

</body>
</html>

残りのコードは、require.js などの (非同期) モジュール ローダーを介して読み込まれます。そのコードはすべて、require.js を含む CDN から取得されます。

ただし、プル CDN を使用している場合は、この小さな HTML もすぐに CDN から取得されます。CDN の「プル」プロバイダーは、キャッシュ内に html5 プッシュステート URL のファイルが見つからない場合は常に、このページにアクセスします。

サーバーでは、ファイル拡張子が CDN からこの 1 つのファイルに提供されていないパターンに一致するすべての要求をルーティングするために、何らかのルーティングが必要です。

はい、CDN は新しい URL が検出されるたびにサイトにヒットします (プル CDN を使用している場合) が、それを取得した後、それをキャッシュからすべてのユーザーに配布し、同じためにサイトにヒットすることはありません。再びURL。また、CDN プロバイダーからのサイトへのヒットは、ごくわずかな静的 html を提供しているため、重要ではありません。また、この html ファイルでファイル ヘッダーが期限切れにならないように設定すると (このファイルは実際には変更されないはずです)、ファイルは CDN プロバイダーによって非常に長期間 (プロバイダーによって異なります) 保持されるため、サーバー上のヒット一意の URL ごとに 1 回限りのイベントになります。

于 2012-12-11T03:18:09.313 に答える
0

この男も同様の問題を抱えており、S3 / CloudFront を使用していました。彼のすべての URL は、ステータスコード 200 で index.html にリダイレクトされます。

index.html をエラー ページとして設定する必要があるため、これは回避策です。

詳細を見る：https ://kkob.us/2015/11/24/hosting-a-single-page-app-on-s3-with-proper-urls/

于 2016-10-25T16:59:16.887 に答える