150 votes

Comment configurer IIS pour la réécriture d'URL d'une application AngularJS en mode HTML5?

J'ai le AngularJS projet de semences et j'ai ajouté

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

à l'app.js fichier. Je veux configurer IIS 7 pour acheminer toutes les demandes de

http://localhost/app/index.html

de sorte que cela fonctionne pour moi. Comment dois-je faire?

Mise à jour:

Je viens de découvrir, téléchargé et installé le module de Réécriture d'URL IIS, espérant que ce sera facile et évident pour atteindre mon objectif.

Mise à jour 2:

Je suppose que cela résume ce que je suis en train de réaliser (prises à partir de la AngularJS la documentation du Développeur):

L'utilisation de ce mode nécessite la réécriture d'URL sur le côté serveur, fondamentalement, vous avez de réécriture de tous vos liens vers le point d'entrée de votre application (par ex. index.html)

Mise à jour 3:

Je travaille encore sur ce point et je me rends compte que je dois PAS de redirection (ont des règles de réécriture) certains des Url de la forme

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

donc tout ce qui est dans le css, js, lib ou partiels des répertoires n'est pas redirigé. Tout le reste devra être redirigé vers app/index.html

Quelqu'un sait comment réaliser cela facilement, sans avoir à ajouter une règle pour chaque fichier?

Mise à jour 4:

J'ai 2 règles de trafic entrant définis dans le module de Réécriture d'URL IIS. La première règle est la suivante:

IIS URL Rewrite Inbound Rule 1

La deuxième règle est la suivante:

IIS URL Rewrite Inbound Rule 2

Maintenant, quand je navigue à localhost/app/vue1 il charge la page, cependant, la prise en charge de fichiers (ceux dans le css, js, lib et partiels, les répertoires) sont également réécrit à l'app/index.html page - si tout est de retour comme le index.html page de n'importe quelle URL est utilisée. Je suppose que cela signifie que ma première règle, qui est censé prévenir ces Url en cours de traitement par la deuxième règle, n'est-ce pas de travail.. des idées? ...quelqu'un? ...Je me sens si seule... :-(

311voto

Yagiz Ozturk Points 1113

J'écris une règle dans web.config après que $locationProvider.html5Mode(true) est défini dans app.js .

Hope, aide quelqu'un.

   <system.webServer>
    <rewrite>
      <rules>
        <rule name="AngularJS" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
          </conditions>
          <action type="Rewrite" url="/" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>
 

Dans mon index.html, j'ai ajouté ceci à <head>

 <base href="http://stackoverflow.com/">
 

N'oubliez pas d'installer le programme de réécriture d'URL pour IIS sur le serveur.

De plus, si vous utilisez Web Api et IIS, cette URL de correspondance ne fonctionnera pas, car elle modifiera vos appels à l'API. Jouez autour de match regex(.*) qui change toutes les URL et interrompt les appels api

40voto

Dean Points 1124

Les règles entrantes IIS, comme indiqué dans la question, fonctionnent. Je devais vider le cache du navigateur et ajouter la ligne suivante en haut de ma section <head> de la page index.html:

 <base href="http://stackoverflow.com/myApplication/app/" />
 

En effet, j’ai plus d’une application dans localhost et les demandes adressées à d’autres partiels ont donc été prises en compte à localhost/app/view1 au lieu de localhost/myApplication/app/view1

Espérons que cela aide quelqu'un!

12voto

Josh C Points 374

Dans mon cas, je continuais à obtenir un 403.14 après avoir configuré les règles de réécriture correctes. Il se trouve que j'avais un répertoire qui portait le même nom que l'un de mes itinéraires d'URL. Une fois la règle de réécriture IsDirectory supprimée, mes itinéraires ont fonctionné correctement. Existe-t-il un cas où la suppression de la négation de répertoire peut poser des problèmes? Je ne peux pas penser à aucun dans mon cas. Le seul cas auquel je peux penser est si vous pouvez parcourir un répertoire avec votre application.

 <rule name="fixhtml5mode" stopProcessing="true">
  <match url=".*"/>
  <conditions logicalGrouping="MatchAll">
    <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
  </conditions>
  <action type="Rewrite" url="/" />
</rule>
 

0voto

he-man Points 1

cela ne fonctionne pas si vous voulez naviguer sur votre site en utilisant l'IP de votre box et pas seulement localhost

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X