Session History Management

Eintrag zuletzt aktualisiert am: 06.02.2017

Session History Management ist eine im Rahmen des HTML5-Standards (https://www.w3.org/TR/2011/WD-html5-20110113/history.html) spezifizierte Funktion, die es modernen Single Page Applications erlaubt, einzelne Zustände der Seite durch eine normale URL mit einem Slash / Schrägstrich (http://server/pfad) ansprechbar zu machen. Normalerweise würde der Aufruf einer solchen URL zu einem Roundtrip des Browsers zum Server führen. Mit history.pushState() kann aber die SPA einen Zustand in die Browserhistorie legen, die auf die SPA verweist.

ltere Browser lösen bei einer URL mit Schrägstrich immer einen Rundgang zum Server aus. Hier muss die SPA einen die relativen URLs per Hash abtrennen (http://server/#/pfad), was auch in älteren Browser keinen Rundgang auslöst.

Session History Management in Angular

Die URL bildet der Router im Webframework Angular (ab Version 2.0) im Standard mit der PathLocationStrategy mit dem Schrägstrich (http://server/pfad) ab, was aber nur in modernen Browser funktioniert, die das Session History Management mit history.pushState() unterstützen (siehe caniuse.com). Ältere Browser und auch aktuelle Versionen von Opera Mini lösen bei einer URL mit Schrägstrich immer einen Rundgang zum Server aus. Für diese Fälle können Entwickler in Angular die LocationStrategy auf HashLocationStrategy setzen und damit die relativen URLs per Hash abtrennen (http://server/#/pfad), was auch in älteren Browser keinen Rundgang auslöst.

Für das Umstellen auf Hash-basierte URLs muss man in app.module.ts die für LocationStrategy zu benutzende Klasse auf HashLocationStrategy umstellen:

import {
LocationStrategy,
HashLocationStrategy
} from '@angular/common';
...
@NgModule({
imports: [...], // Komponenten
bootstrap: [AppComponent], // Startkomponente
providers: [ // Depdendency Injection
{ provide: LocationStrategy, useClass: HashLocationStrategy }, ... ]
})
export class AppModule { }