2017-02-06 17 views
1

amozonウェブホスティングで私にangular 2アプリを配備しようとしています。 インデックスページは正常に機能しますが、/usersのような他のページにアクセスしようとすると、404 not foundエラーが発生します。角度2とaws、経路が見つかりません

私はこの投稿に従うことを試みますConfigure Amazon S3 static site with Angular JS ui.router html5Mode(true) on page refresh成功なし。答えを

ここに私のアプリhttp://ugram-team-7.s3-website-us-east-1.amazonaws.com/

感謝。

答えて

4

ハッシュ#

const routes: Routes = [ 
    // routes here 
]; 

@NgModule({ 
    imports: [ 
    ... other imports 
    RouterModule.forRoot(routes, { useHash: true }) // .../#/users/ 
    ], 
    ... 
}) 
export class SomeModule { } 

または以下のルールを追加、ドメインのS3コンソールの編集リダイレクションルールセクションではS3

の設定に使用するアプリのルートを設定:

<RoutingRules> 
    <RoutingRule> 
    <Condition> 
     <HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals> 
    </Condition> 
    <Redirect> 
     <HostName>domain.com</HostName> 
     <ReplaceKeyPrefixWith>#/</ReplaceKeyPrefixWith> 
    </Redirect> 
    </RoutingRule> 
</RoutingRules> 

これをindex.htmlに入れます

<script language="javascript"> 
if (typeof(window.history.pushState) == 'function') { 
    window.history.pushState(null, "Site Name", window.location.hash.substring(2)); 
} else { 
    window.location.hash = window.location.hash.substring(2); 
} 
</script> 
+0

ありがとうございます! – Lilrom

+0

私は助けてうれしい! –

1

問題を解決しても、URL書き換えを使用できます。

まず、S3から直接あなたのウェブサイトを配布するのではなく、その前にCloudFrontディストリビューションを置いてください。

以下でCloudFrontの分布にカスタムエラーページのルールを作成します

  • HTTPエラーコード:404
  • エラーのキャッシング最小TTL(秒):0
  • カスタマイズエラー応答:はい
  • 応答ページのパス:/index.htmlが
  • HTTP応答コード:200

さらに詳しい説明はtake a look at my guideをご覧ください。

関連する問題