# Routing per '/' ohne Raute-Zeichen ("Anchor") und rein clientseitig - wie geht das?



## ruutaiokwu (26. Jun 2019)

Hallo zusammen

Ich frage mich immer wieder, wie clientseitiges Routing (z.b. bei Angular) über *meinserver.com/xyz* geht, auch wenn ich auf dem Server

*a.) *Weder ein Pfad namens "xyz"

noch 

*b.) *eine entsprechende Regel z.B. per .htaccess/mod_rewrite besteht?


Wie ich bisher gemeint habe (falsch?) geht doch zuerst immer alles an der Server, was hinter dem Domainname nach einem '/' aufgerufen wird??

Ich könnte es ja noch nachvollziehen wenn ein "Separator" (z.B. '#', der "Anchor", welcher das clientseitig über ein <a ...>-Tag regelt) verwendet werden würde.

Oder hat die Weiterleitungsregel in JavaScript mit *meinserver.com/xyz* einfach ne höhere Priorität, geht also zuerst Clientseitig rein und wird dann dort verarbeitet so dass es gar nie soweit kommt dass ein GET-Request auf dem Server abgesetzt wird...?

Jedenfalls widerspricht das allem, was ich bisher zu wissen geglaubt habe...

Vielen Dank für die Feedbacks!


----------



## mihe7 (26. Jun 2019)

Ich würde mal sagen, mit einem ServiceWorker, der im Prinzip als Proxy fungiert.


----------



## thecain (26. Jun 2019)

Durch die HTML5 History API. Siehe: https://docs.angularjs.org/guide/$location#html5-mode


----------



## mihe7 (26. Jun 2019)

thecain hat gesagt.:


> Durch die HTML5 History API


Hm... die dient aber nur dazu, die URL in der Adressleiste zu ändern, oder?


----------



## thecain (26. Jun 2019)

Es unterdrückt auch den Reload. Standardmässig hat AngularJs damals auf jeden Fall noch keine Serviceworker eingesetzt.



> Note that in this mode, AngularJS intercepts all links (subject to the "Html link rewriting" rules below) and updates the url in a way that never performs a full page reload.


----------



## ruutaiokwu (26. Jun 2019)

Danke für die Feedbacks. Das mit dem Service Worker scheint mir aufschlussreich zu sein.

*"Es unterdrückt auch den Reload. Standardmässig hat AngularJs damals auf jeden Fall noch keine Serviceworker eingesetzt."*

...wie soll das gehen, wenn ich die URL im Browser von Hand manipuliere und /abc und /xyz immer das gleiche Resultat ergeben?

AngularJS ist vom Konzept her ist was komplett anderes als Angular..


----------



## thecain (26. Jun 2019)

Gar nicht. Angular navigiert intern und ändert die URL via API. Eine Änderung von dir in der URL führt immer zu einem Reload der Seite, das regelt der Browser.


jmar83 hat gesagt.:


> AngularJS ist vom Konzept her ist was komplett anderes als Angular..


Tut hier aber nichts zur Sache


----------



## mihe7 (26. Jun 2019)

thecain hat gesagt.:


> Es unterdrückt auch den Reload.


Ja, habe ich unglücklich formuliert, das war mit dem "nur die URL in der Adressleiste" ändern gemeint.


----------



## ruutaiokwu (26. Jun 2019)

Hat sich erledigt, die Ursache war eine serverseitige Regel, welche der NodeJS-Dev-Server sich "einfach so" erlaubt einzusetzen...:-(

(Mea culpa - aber wie schräg ist denn sowas??)


----------



## mrBrown (26. Jun 2019)

Nicht schräg, sondern dabei völlig normal 

Die sind üblicherweise entsprechend konfiguriert (meist durch die CLI-Tools, die man zum Projekt aufsetzen nutzt), bei anderen Servern muss man es selbst machen.


----------



## ruutaiokwu (15. Feb 2020)

Vielen Dank, kann ja kaum anders sein!  

Aber wie funktioniert es denn genau, wenn ich die kompilierte (oder eher "transpilierte") Angular-Anwendung ins Apache htdocs-Verzeichnis kopiere?

Jedenfalls muss ich da selbst nicht mit irgendwelchen mod_rewrite-Regeln einrichten?

Und das, was mir dabei transpiliert wird, ist doch rein Client-seitiger Code, nix was auf den Server läuft, somit auch kein `.htaccess`...?


----------



## thecain (15. Feb 2020)

The Three Pillars of the Angular Router — Router States and URL Matching - Angular inDepth
					

In the introductory article for this series, we glanced over the architecture of Angular’s router, and defined three pillars of the router: router states, navigation, and lazy loading.




					indepth.dev


----------



## ruutaiokwu (15. Feb 2020)

Vielen Dank!! 

Dass ist doch mal ein fundierter Artikel zum Thema, welchen ich aber erst durchlesen muss...

Ob das ganze jetzt nun Client- oder Server-seitig erfolgt, auf auf den ersten Blick nicht erkenntlich - aber sicher darin enthalten.


----------



## ruutaiokwu (19. Mrz 2020)

Also wenn ich in diesem Text nach den Begriffen "Server" oder "htaccess" suche, dann finde ich keinen Eintrag.

Es wird erklärt, wie Angular das Client-Seitig handhabt, aber es wird nicht erklärt was auf dem Server passiert.

Irgendwas muss ja auf dem Server passieren um die URL's aufzulösen (es existiert ja auch keine Verzeichnisstruktur, welche auf dem Server 1:1 mit der URL übereinstimmt)

Und der NodeJS-Entwicklungsserver auf Port 4200 verwendet dabei sicher ne andere Technologie als der Apache mit seinen .htaccess-Dateien...

Also immer noch völlig unklar, wie das Ganze funktionieren soll. Und über JavaScript (=URL History) geht's ja auch nicht, da manipuliert ja nur die URL in der Browser-Bar ohne dabei Requests an den Server zu senden...


----------



## ruutaiokwu (19. Mrz 2020)

Ist das korrekt?

*Wenn man keine Server-seitigen Regeln verwenden will, dann muss man den "Anchor" akzeptieren - und zwar in diesem Verzeichnis, wo die index.html-Datei sitzt. Also:*

http://SERVER_NAME/#/BlaBla ...

oder

http://SERVER_NAME/verzeichnis_mit_index_html/#/BlaBla ...


-> Wenn man den Anchor aber weghaben will, dann muss man Server-seitig nachhelfen?

Richtig? Oder vielleicht teilweise richtig?

Danke für die Feedbacks.


----------



## mihe7 (19. Mrz 2020)

jmar83 hat gesagt.:


> (es existiert ja auch keine Verzeichnisstruktur, welche auf dem Server 1:1 mit der URL übereinstimmt)


Muss auch nicht. 

Nehmen wir mal die URL http://meinserver.com/xyz, dann wird als erstes mal der Name zu IP-Adresse aufgelöst, eine Socket-Verbindung gen Port 80 hergestellt und der HTTP-Request abgesetzt, der im Wesentlichen die Request-Methode (z. B. GET), den Rest der URL (Pfad, Query) und den angefragten Host zweck SNI enthält:


```
GET /xyz HTTP/1.1
Host: meinserver.com
```

Was der Server daraus macht, spielt keine Rolle. 



jmar83 hat gesagt.:


> Wenn man keine Server-seitigen Regeln verwenden will, dann muss man den "Anchor" akzeptieren - und zwar in diesem Verzeichnis, wo die index.html-Datei sitzt. Also:


Das basiert auch auf einer serverseitigen Regel, nämlich, dass / auf /index.html bzw. /# auf index.html# abgebildet wird. Die dürfte allerdings bei den Webservern Standard sein 

Eine URL ist einfach eine besondere URI, die Angaben darüber enthält, wo im Netzwerk etwas zu finden ist und wie es abzurufen ist.


----------



## ruutaiokwu (19. Mrz 2020)

*"Die dürfte allerdings bei den Webservern Standard sein "*

Ich denke damit ist nun so ziemlich alles geklärt, vielen vielen Dank!!


----------

