Jak skonfigurować usługi IIS do przepisywania adresów URL aplikacji AngularJS w trybie HTML5?

Mam projekt AngularJS seed i dodałem

$locationProvider.html5Mode(true).hashPrefix('!');

Do aplikacji.plik js. Chcę skonfigurować usługę IIS 7 tak, aby przekierowywała wszystkie żądania do

http://localhost/app/index.html
Żeby to zadziałało na mnie. Jak to zrobić?

Update:

Właśnie odkryłem, Pobrałem i zainstalowałem Moduł IIS URL Rewrite , mając nadzieję, że to ułatwi i ułatwi osiągnięcie mojego celu.

Aktualizacja 2:

Myślę, że to podsumowuje to, co próbuję aby osiągnąć (zaczerpnięte z dokumentacji programisty AngularJS):

Korzystanie z tego trybu wymaga przepisania adresu URL po stronie serwera, zasadniczo musisz przepisać wszystkie swoje linki do punktu wejścia twojego zastosowanie (np. indeks.html)

Aktualizacja 3:

Wciąż nad tym pracuję i zdaję sobie sprawę, że nie muszę przekierowywać (mieć reguł, które przepisują) pewnych adresów URL, takich jak

http://localhost/app/lib/angular/angular.js
http://localhost/app/partials/partial1.html

Więc wszystko, co znajduje się w katalogach css, js, lib lub partials nie jest przekierowany. Wszystko inne będzie musiało zostać przekierowane do app/index.html

Ktoś wie jak to łatwo osiągnąć bez konieczności dodawania reguły dla każdego pliku?

Aktualizacja 4:

Mam 2 reguły przychodzące zdefiniowane w module IIS URL Rewrite. Pierwsza zasada brzmi:

Przepisywanie adresu URL usługi IIS przychodzącej reguły 1

Druga zasada brzmi:

Przepisywanie adresu URL usługi IIS przychodzącej reguły 2

Teraz, gdy przechodzę do localhost / app/view1 ładuje stronę, jednak pliki pomocnicze (te w css, katalogi js, lib i partials) są również przepisywane do App / index.strona html - czyli wszystko wraca jako indeks.strona html bez względu na adres URL. Chyba oznacza to, że moja pierwsza reguła, która ma zapobiegać przetwarzaniu tych adresów URL przez drugą regułę, nie działa.. jakieś pomysły? ...ktokolwiek? ...Czuję się taka samotna... :-(

Author: Dean, 2012-09-27

5 answers

Piszę regułę w sieci.config po ustawieniu {[2] } w app.js.

Hope, pomaga komuś.
  <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" />
          </conditions>
          <action type="Rewrite" url="/" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>

W moim indeksie.html dodałem to do <head>

<base href="/">

Nie zapomnij zainstalować IIS URL Rewrite na serwerze.

Również jeśli używasz Web API i IIS, będzie to działać, jeśli Twoje API jest w www.yourdomain.com/api ze względu na trzecie wejście (trzecia linia warunku).

 252
Author: Yagiz Ozturk,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-06-16 09:28:49

Zasady IIS przychodzące, jak pokazano w pytaniu działają. Musiałem wyczyścić pamięć podręczną przeglądarki i dodać następujący wiersz w górnej części mojej <head> sekcji indeksu.strona html:

<base href="/myApplication/app/" />

Dzieje się tak dlatego, że mam więcej niż jedną aplikację w localhost i dlatego żądania do innych częściowych były pobierane do localhost/app/view1 zamiast localhost/myApplication/app/view1

Miejmy nadzieję, że to komuś pomoże!

 35
Author: Dean,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2012-10-25 00:09:47

W moim przypadku otrzymywałem 403.14 po skonfigurowaniu poprawnych reguł przepisywania. Okazuje się, że miałem katalog o tej samej nazwie, co jedna z moich tras URL. Po usunięciu reguły przepisywania IsDirectory Moje trasy działały poprawnie. Czy istnieje przypadek, w którym usunięcie negacji katalogu może powodować problemy? W moim przypadku nic nie przychodzi mi do głowy. Jedyny przypadek, o którym mogę myśleć, to możliwość przeglądania katalogu za pomocą aplikacji.

<rule name="fixhtml5mode" stopProcessing="true">
  <match url=".*"/>
  <conditions logicalGrouping="MatchAll">
    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
  </conditions>
  <action type="Rewrite" url="/" />
</rule>
 9
Author: Josh C,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2014-07-23 21:51:45

Problem z spełnianiem tylko tych dwóch warunków:

  <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
  <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />

Jest to, że działają tylko tak długo, jak długo {REQUEST_FILENAME} istnieje fizycznie na dysku . Oznacza to, że mogą istnieć scenariusze, w których żądanie niepoprawnie nazwanego widoku częściowego zwróciłoby stronę główną zamiast 404, co spowodowałoby dwukrotne Ładowanie angular (a w niektórych scenariuszach może to spowodować paskudną nieskończoną pętlę).

Dlatego zaleca się pewne bezpieczne Zasady "awaryjne", aby uniknąć tych trudnych do rozwiązywanie problemów:

  <add input="{REQUEST_FILENAME}" pattern="(.*?)\.html$" negate="true" />
  <add input="{REQUEST_FILENAME}" pattern="(.*?)\.js$" negate="true" />
  <add input="{REQUEST_FILENAME}" pattern="(.*?)\.css$" negate="true" />

Lub warunek, że pasuje do dowolnego pliku zakończonego :

<conditions>
  <!-- ... -->
  <add input="{REQUEST_FILENAME}" pattern=".*\.[\d\w]+$" negate="true" />
</conditions>
 7
Author: Ciprian Teiosanu,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2015-11-25 20:30:21

Najprostszym sposobem, jaki znalazłem, jest przekierowanie żądań wyzwalających 404 do klienta. Można to zrobić poprzez dodanie hashtagu nawet wtedy, gdy $locationProvider.html5Mode(true) jest ustawione.

Ta sztuczka działa w środowiskach z większą liczbą aplikacji internetowych na tej samej stronie internetowej i wymaga ograniczeń integralności URL (np. zewnętrznego uwierzytelniania). Oto krok po kroku jak to zrobić

Indeks.html

Ustaw <base> element poprawnie

<base href="@(Request.ApplicationPath + "/")">

Www.config

Najpierw przekieruj 404 na stronę niestandardową, dla przykład "Strona główna / błąd"

<system.web>
    <customErrors mode="On">
        <error statusCode="404" redirect="~/Home/Error" />
    </customErrors>
</system.web>

Home controller

Zaimplementuj prosty ActionResult, aby "przetłumaczyć" dane wejściowe w trasie po stronie klienta.

public ActionResult Error(string aspxerrorpath) {
    return this.Redirect("~/#/" + aspxerrorpath);
}

To najprostszy sposób.


Jest to możliwe(wskazane?) aby ulepszyć funkcję błędu z ulepszoną logiką przekierowania 404 do klienta tylko wtedy, gdy adres URL jest prawidłowy i pozwól 404 wyzwalać się normalnie, gdy nic nie zostanie znalezione na kliencie. Załóżmy, że masz te kątowe trasy

.when("/", {
    templateUrl: "Base/Home",
    controller: "controllerHome"
})
.when("/New", {
    templateUrl: "Base/New",
    controller: "controllerNew"
})
.when("/Show/:title", {
    templateUrl: "Base/Show",
    controller: "controllerShow"
})

Sensowne jest przekierowanie URL do klient tylko wtedy, gdy zaczyna się od "/ New " lub "/ Show / "

public ActionResult Error(string aspxerrorpath) {
    // get clientside route path
    string clientPath = aspxerrorpath.Substring(Request.ApplicationPath.Length);

    // create a set of valid clientside path
    string[] validPaths = { "/New", "/Show/" };

    // check if clientPath is valid and redirect properly
    foreach (string validPath in validPaths) {
        if (clientPath.StartsWith(validPath)) {
            return this.Redirect("~/#/" + clientPath);
        }
    }

    return new HttpNotFoundResult();
}

To tylko przykład ulepszonej logiki, oczywiście każda aplikacja internetowa ma inne potrzeby

 1
Author: Naigel,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/doraprojects.net/template/agent.layouts/content.php on line 54
2016-06-30 12:34:20