Подтвердить что ты не робот

Настройте статический сайт Amazon S3 с помощью Angular JS ui.router html5Mode (true) на странице обновления

Как настроить статическую веб-страницу Amazon S3 для правильного маршрутизации маршрутов Angular ui.router html5Mode? При обновлении страницы он сделает запрос на файл, который не существует, и Angular не может его обработать. В документах они рекомендуют менять свои перезаписи URL-адресов на сервере.

https://github.com/angular-ui/ui-router/wiki/Frequently-Asked-Questions#how-to-configure-your-server-to-work-with-html5mode

Однако S3 является хранилищем и не предлагает одинаковые параметры перенаправления Я пытаюсь использовать встроенные правила перенаправления, такие как

<RoutingRules>
    <RoutingRule>
        <Condition>
            <HttpErrorCodeReturnedEquals>404</HttpErrorCodeReturnedEquals >
        </Condition>
        <Redirect>
             <HostName>[[ your application domain name ]]</HostName>
             <ReplaceKeyPrefixWith>#/</ReplaceKeyPrefixWith>
        </Redirect>
    </RoutingRule>
</RoutingRules>

Однако это просто приводит к циклу перенаправления.

Любые предложения?

4b9b3361

ОТВЕТЫ

Ответ 1

В принципе есть 3 варианта, используйте экземпляр EC2 для выполнения фактических перезаписываний сервера для настроенных маршрутов HTML5 или, как и предлагается, используйте резервный режим и перезаписывайте запросы, чтобы использовать #! hashbang. Наконец, вы можете просто использовать стандартные маршруты angular, с которым я пошла. Меньше хлопот, и когда angular 2.0 рулон, вы можете обновить его.

fooobar.com/questions/43526/...

В действительности проблема с маршрутизацией не решена.

Ответ 2

В Часто задаваемые вопросы они переписывают почти все, чтобы обслуживать страницу index.html. Для резервный режим HTML5 вам нужно использовать #!/ (hashbang).

Вы можете изменить это:

  <ReplaceKeyPrefixWith>#/</ReplaceKeyPrefixWith>

с

  <ReplaceKeyPrefixWith>#!/</ReplaceKeyPrefixWith>

Подробнее об этом ответе: fooobar.com/questions/43526/...

Вам также может понадобиться настроить приложение для использования этого префикса:

angular.module(...)

...

.config(function($locationProvider) {
  $locationProvider.html5Mode(true).hashPrefix('!');
})

Ответ 3

Убедитесь, что указательный маршрут настроен для вашего веб-сайта. В основном это index.html Удалить правила маршрутизации из S3-конфигураций Поместите Cloudfront перед вашим ведром S3. Настройте правила страницы ошибки для вашего экземпляра Cloudfront.

В правилах ошибки укажите:

Http error code: 404 (and 403 or other errors as per need)
Error Caching Minimum TTL (seconds) : 0
Customize response: Yes
Response Page Path : /index.html
HTTP Response Code: 200