Angularjs html5mode обновить страницу получить 404

Я создал приложение, использующее AngularJS с GAE (Google App Engine - Java).

Я хочу преобразовать его в соответствие с SEO.

index.html

  • <meta name="fragment" content="!" />
  • <base href="/">

и тело загружается динамически через <div ui-view></div>.

app.js

$locationProvider.html5Mode(true);

URL-адрес работает нормально, но когда я обновляю страницу, я получаю ошибку 404.

Есть ли у вас какая-то идея, что это значит?

ОТВЕТЫ

Ответ 1

Я уверен, что вы уже решили это, но для кого-то другого, сталкивающегося с этой проблемой:

В основном AngularJS $locationProvider.html5mode(true) использует HTML5 history.pushState(), который искусственно изменяет URL истории пользователя и адресной строки без перезагрузки страницы. Если вы создаете маршрут (Angular) для /about, но у вас нет соответствующего маршрута на сервере, вы столкнетесь с проблемой, при которой перезагрузка страницы выявит тот факт, что она не существует на сервере. Самое простое решение - отобразить точку входа для вашего приложения (/index.html?) Для всех маршрутов, доступных вашему приложению.

Смотрите: fooobar.com/questions/19820/...

Ответ 3

Попробуйте добавить ниже раздел в разделе промежуточного программного обеспечения для файла cookie файла.

livereload: {
        options: {
          open: true,
          middleware: function (connect) {
            return [
              connect.static('.tmp'),
              connect().use(
                '/bower_components',
                connect.static('./bower_components')
              ),
              connect().use(
                '/app/styles',
                connect.static('./app/styles')
              ),
              connect().use(
                '/apply',
                connect.static('./app/index.html')
              ),
              connect.static(appConfig.app)
            ];
          }
        }
      }  
   }

Ответ 4

Для приложения Java, работающего на GAE, вы можете использовать

Фильтр перезаписи URL

Вы найдете файл XML с именем urlrewrite.xml. Поместите все свои маршруты в этот xml и настройте его таким образом, чтобы при получении запроса, например:

  • /местоположение/редактировать/120211

он будет перенаправлен на

  • #/местоположение/редактировать/120211

и ваше приложение будет иметь время для загрузки и запуска маршрутизации

Ответ 5

для меня, исправить следующую строку в качестве первой строки внутри тега вашей индексной (главной) страницы:

<base href="/">

Кроме того, вам необходимо настроить правило перезаписи IIS следующим образом: (убедитесь, что вы сначала установите iis rewrite extension)

 <system.webServer>
<rewrite>
  <rules>
    <rule name="AngularJS Routes" stopProcessing="true">
      <match url=".*" />
      <conditions logicalGrouping="MatchAll">
                    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
                    <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
                    <add input="{REQUEST_URI}" pattern="(api)" negate="true" />
                    <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
      </conditions>
      <action type="Rewrite" url="/" />
    </rule>
  </rules>
</rewrite>
    <caching enabled="false" enableKernelCache="false" />

Ответ 6

Прошло некоторое время, так как люди искали этот ответ, но сегодня я нуждался в нем. Я сделал рабочий пример с GAE, angularJS и ng-Route, который имеет довольно отформатированные ссылки.

Вот ссылка на пример GitHub