web-dev-qa-db-ja.com

Angularルートのhtaccessリダイレクト

次のような複数のルートを持つangularアプリケーションがあります。

site.com/
site.com/page
site.com/page/4

アンギュラーのhtml5ルーティングモードを使用すると、アプリケーション内からリンクへのリンクをクリックするとこれらは正しく解決されますが、ハードリフレッシュを行うと当然404エラーになります。これを修正するために、基本的なhtaccessリライトを実装してみました。

RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_METHOD} !OPTIONS
RewriteRule ^(.*)$ index.html [L]

これはangularリクエストに対しては機能しますが、次のようにドメイン内でスクリプトをロードしたり、ajax呼び出しを行ったりすると、

<script src="/app/programs/script.js"></script>

このスクリプトはロードされません-要求はリダイレクトされ、.htaccessが要求を再ルーティングする必要があると判断してindex.htmlページをロードしようとします-このファイルが存在することを知らず、リダイレクトの代わりにファイルをロードする必要があります。

解決する必要のある実際のファイルがない場合にのみ、htaccessがindex.html(ビューパラメーターを使用)にリクエストをリダイレクトする方法はありますか?

60
Lucas Penney

次のようなスニペットを使用します。

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]

RewriteRule ^(.*) /index.html [NC,L]

これは実際のリソースがあればそれをスキップし、すべてのAngularJSルートのindex.htmlにスキップします。

126
rajasaur

アプリがdirectiveテンプレートファイルを要求した場合に問題がありますが、ファイルがありません。場合によっては、アプリがindex.html内の複数のスクリプトファイルを要求しました。

ファイルが存在しない場合は、404ファイルの代わりにindex.html応答を送信する必要があります。そこで、単純な正規表現パターンを追加して、欠落しているファイル要求を識別します。

RewriteEngine On
# If an existing asset or directory is requested go to it as it is
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
RewriteRule ^ - [L]

# If the requested pattern is file and file doesn't exist, send 404
RewriteCond %{REQUEST_URI} ^(\/[a-z_\-\s0-9\.]+)+\.[a-zA-Z]{2,4}$
RewriteRule ^ - [L,R=404]

# otherwise use history router
RewriteRule ^ /index.html
20
port115

貧乏人の解決策(mod_rewriteを使用しない):

ErrorDocument 404 /index.html
5
Cito

私の場合、以下のような.htaccessファイルを作成します

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]

RewriteRule ^(.*) ./index.html [NC,L]

ちょうど追加されました。 /index.htmlの前に、そのファイルを https://example.com/subfolder のようにドメインに追加し、正常に動作します

3

このリンクを確認してください: https://stackoverflow.com/a/49455101/5899936 ルートフォルダーに.htaccessファイルを作成し、 .htaccess

 <IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /
  RewriteRule ^index\.html$ - [L]
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule . /index.html [L]
</IfModule>
2
Sumit Jaiswal

あなたがする必要がある場合に備えて、別の詳細なhtaccessファイルを提供します:

  • BaseUrlとデフォルトのインデックスファイルを考慮する
  • :paramsを管理するために先頭のスラッシュを削除します

これは私のhtaccessで、非常に近いですが、より具体的です:

DirectoryIndex index.html
RewriteEngine on
RewriteBase /subDir
RewriteCond %{REQUEST_FILENAME} -s [OR]
RewriteCond %{REQUEST_FILENAME} -l [OR]
RewriteCond %{REQUEST_FILENAME} -d
RewriteRule ^.*$ - [NC,L]
RewriteRule ^(.*) index.html [NC,L]
0
andrea06590