1. ホーム
  2. アンギュラー

[解決済み】Angular 2:ブラウザから更新すると404エラーが発生する【重複あり

2022-04-10 08:54:55

質問

私はAngular 2の初心者です。私はシングルページのアプリケーションをサーバーの "myapp" という名前のフォルダに保存しています。ベースのURLを次のように変更しました。 http://example.com/myapp/` .

私のプロジェクトには2つのページがあります。そこで、Angular 2のルーティングを実装しました。私はデフォルトのページをログインとして設定しました。私がタイプするとき http://example.com/myapp/ に自動的にリダイレクトされます。 http://example.com/myapp/login . しかし、そのページをリフレッシュすると 404 というエラーが発生します。 http://example.com/myapp/login が見つかりません。

しかし、ライトサーバーを使用してプロジェクトを実行すると、すべてがうまくいきます。この場合、index.htmlのベースURLは次のようになります。 "/" . どうすれば直るのでしょうか?

どのように解決するのですか?

実際、ブラウザ内の実際のアドレスは更新されているので、アプリケーションを更新したときに404エラーが発生するのは正常です(# / hashbangのアプローチもありません)。Angular2では、デフォルトでHTML5の履歴が再利用されます。

404 エラーを修正するには、サーバーを更新して index.html ファイルを定義した各ルートパスに対して作成します。

HashBang方式に変更する場合は、この設定を使用する必要があります。

import {bootstrap} from 'angular2/platform/browser';
import {provide} from 'angular2/core';
import {ROUTER_PROVIDERS} from 'angular2/router';
import {LocationStrategy, HashLocationStrategy} from '@angular/common';

import {MyApp} from './myapp';

bootstrap(MyApp, [
  ROUTER_PROVIDERS,
  {provide: LocationStrategy, useClass: HashLocationStrategy}
]);

この場合、ページを更新すると再び表示される(ただし # をアドレスに追加してください)。

このリンクもお役に立てるかもしれません。 ウェブサイトを更新すると404が表示されます。これは、Angular2とfirebaseを使用した場合です。 .

お役に立てれば幸いです。 ティエリー