L'application fonctionne correctement dans l'environnement local dans tous les navigateurs (y compris IE 11).
Mais après le déploiement, elle ne charge pas la page principale dans IE sauf qu'elle navigue vers la page d'erreur par défaut. Ça se passe seulement dans IE 11.
La seule chose que j'ai remarqué que IE supprime la barre oblique de fin dans la version déployée.
http: // localhost: 4200 / - fonctionne bien dans IE mais http://myapplication.com/main/ ne fonctionne pas dans IE, il affiche la page d'erreur.
Module de routage d'application
const customerRoutes: Routes = [
  {
    path: '',
    component: CustomerComponent,
    children: [
      {path: '', component: OnboardingComponent},
      {path: '**', component: ErrorpageComponent, data: {name: 'noMatch'}}
    ]
  }
];
Module client
const routes: Routes = [
  {path: '', loadChildren: './modules/customer/customer.module#CustomerModule'},
  {path: '**', component: ErrorpageComponent, data: {name: 'noMatch'}},
];
Dans IE après le déploiement, il se redirige toujours vers ErrorPageComponent . Tout en s'exécutant en local, il fonctionne également très bien dans IE.
Toute aide sera appréciée.
J'ai oublié de mentionner que "myapplication.com/main/" est ajouté depuis nginx (côté serveur). Côté client, nous n'ajoutons pas main .
J'ai essayé en exécutant également l'application en mode prod ng serve --prod , et cela fonctionne bien dans IE. Après le déploiement sur Dev, cela ne fonctionne pas
3 Réponses :
Je suppose que vous aimez voir le OnboardingComponent si vous accédez à myapplication.com/main/ . Dans ce cas, vous devez ajouter main au chemin de votre OnboardingComponent.
{path: 'main', component: OnboardingComponent},
Bien sûr, vous devrez l'utiliser dans votre local environemnt aussi avec localhost:4200/main/.
désolé, j'ai oublié de mentionner que "myapplication.com/main/" est en train d'ajouter depuis nginx (côté serveur). côté client, nous n'ajoutons pas de main
Ah ok. Les autres navigateurs fonctionnent-ils? C'est vraiment seulement IE qui ne peut pas gérer la version déployée? Et si tel est le cas, qu'entendez-vous exactement par IE supprime la barre oblique finale
Oui seulement dans IE cela se produit. La seule différence que je peux voir IE est la suppression de la barre oblique finale. Pas sûr que ce soit la cause.
Vous voulez dire ` myapplication.com/main ` (IE) au lieu de ` myapplication.com/main/ ` (autres navigateurs)?
oui dans IE: -myapplication.com/main autre parcourir myapplication.com/main/
Je n'ai pas pu reproduire ce comportement avec IE11. Probablement un problème avec un détail de configuration de votre serveur.
Vous devrez peut-être inclure les polyfills IE. Ceux-ci peuvent être trouvés dans src / polyfills.ts et vous pouvez décommenter ce qui suit:
/** IE9, IE10 and IE11 requires all of the following polyfills. **/ import 'core-js/es6/symbol'; import 'core-js/es6/object'; import 'core-js/es6/function'; import 'core-js/es6/parse-int'; import 'core-js/es6/parse-float'; import 'core-js/es6/number'; import 'core-js/es6/math'; import 'core-js/es6/string'; import 'core-js/es6/date'; import 'core-js/es6/array'; import 'core-js/es6/regexp'; import 'core-js/es6/map'; import 'core-js/es6/weak-map'; import 'core-js/es6/set';
Enfin, j'ai trouvé le problème et résolu, le partage ici car cela peut aider les autres. J'ai ajouté un chemin relatif dans app.module et il a commencé à fonctionner dans IE.
Appmodule
providers: [{
  provide: APP_BASE_HREF,
  useFactory: getBaseHref,
}],
....
export function getBaseHref(): string {
  return window.location.pathname;
}