Nachladen des Contents für eine Single Page Application

[Forumsgast]

Hi,


Ich bin gerade dabei die Alpha Version meiner Web Applikation zu schreiben und habe die letzten 20 Stunden damit verbracht eine Lösung für mein Problem zu finden. Wie man bereits aus dem Beitrag entnehmen kann, ohne Erfolg aber wie Thomas Edison sagte „Ich habe nicht versagt, ich habe nur 1000 Wege gefunden die nicht funktionieren.“

Ich habe mein Projekt bislang so programmiert, dass ich den Inhalt der einzelnen Seiten auf die Hauptseite nachgeladen habe.

Für das bessere Verständnis: Ich habe eine Sidebar welches mein Navigationsmenü darstellt. In der Sidebar befinden sich buttons welche beim anklicken durch ein Ajax request den kompletten Inhalt der angeforderten Seite als Response auf der Hauptseite durch ein innerHTML einfügen. Seit gestern bin ich mir im klaren darüber, dass dies eine riesige Sicherheitslücke darstellt. Vor allem auch deswegen weil ich Bereiche mit Nutzer Eingaben über innerHtml lade.


Ich habe mir jetzt überlegt Funktionen zu schreiben die ausschließlich für den Aufbau der Html Struktur verantwortlich sind. Die notwendigen Daten zum füllen der Elemente würde ich mir wieder über Ajax holen (diesmal innerText) und sie in die einzelnen Elemente einfügen.


Bevor ich aber leichtsinnig losschreibe wollte ich die Experten um Rat bitten.

1. Habe ich allgemein einen Logikfehler?
2. Gibt es eine bessere Lösung dafür?
3. Wäre das ganze nicht eine immense Belastung für den Client da dieser bei jedem Aufruf die komplette Seite „neu aufbauen“ muss?
4. Zu Punkt 3 möchte ich hinzufügen das es eine Suchfunktion gibt wodurch eine sehr große Anzahl an request entstehen kann. Der Content ist komplett dynamisch aufgebaut man hat einen Container {width: 30%} mit den Ergebnissen und einen 2ten Container {width: 65%} für den Preview der einzelnen Ergebnisse und sobald man auf eines Ergebnisse klickt wird im 2ten Container die Detail Seite mit allen Informationen über diesen Eintrag geladen.

Vielen Dank im Voraus an die ganze Community

[Forumsgast]

Ich mag etwas übersehen, aber ich sehe die riesige Sicherheitslücke nicht so ganz. Per AJAX rufst Du doch ein Serverscript auf. Dort musst Du die eingehenden Daten validieren/prüfen, dann verarbeiten und die Ausgabe an den Client zurückgeben. Die Gefahr liegt aus meiner Sicht Server seitig. Ein fremdes Script in den AJAX-Request zu flanschen ist jetzt auch keine Grundlagenübung, die jeder Anfänger hinbekommt. Und wenn doch, erhält der Client ( sein eigener! ) den Response, kein anderer.

Aber wie gesagt, vielleicht übersehe ich etwas...

[Forumsgast]

Ich sehe auch kein Sicherheitsproblem. Es ist doch vollkommen irrelevant, ob der HTML-Inhalt über AJAX oder als normaler Seitenaufruf geladen wird.

Als kleiner Ausblick über den Tellerrand: Single Page Applications werden heutzutage in der Regel nicht mehr am Server gerendert, sondern am Client. Dafür gibts dann auch Frameworks wie Angular, Vue und React, hinter denen jeweils eine große Community steht und für die es sehr viele fertige Komponenten gibt. Der Server stellt dann nur mehr eine API sowie die statischen Inhalte zur Verfügung und muss sich nicht mehr mit HTML-Rendering herumschlagen (Ausnahme server-side Pre-rendering, aber das ist nur ein optionales Zusatzfeature).

[Forumsgast]

Einen schönen Guten morgen und vielen Dank für die Antworten.

ich habe gelesen das das direkte nachladen von Html Elementen wie z.b. Input Tags etc.. eine Lücke für XXS Angriffe darstellt. Da ich innerhalb der response auch input Felder für Accountdaten sowie Profildaten etc. bereitstelle und diese angeblich manipuliert werden können.

Anbei der Link zu dem besagten Artikel, wobei ich nach dem durchlesen des Artikels etwas tiefer in die Materie gegangen bin und weitere ähnliche Artikel über innerHtml sowie deren Sicherheitsrisiken gefunden habe.

https://gomakethings.com/preventing-...la-javascript/

[Forumsgast]

ich habe gelesen das das direkte nachladen von Html Elementen wie z.b. Input Tags etc.. eine Lücke für XXS Angriffe darstellt. Da ich innerhalb der response auch input Felder für Accountdaten sowie Profildaten etc. bereitstelle und diese angeblich manipuliert werden können.

Anbei der Link zu dem besagten Artikel, wobei ich nach dem durchlesen des Artikels etwas tiefer in die Materie gegangen bin und weitere ähnliche Artikel über innerHtml sowie deren Sicherheitsrisiken gefunden habe.

https://gomakethings.com/preventing-...la-javascript/

Da steht aber:

If you’re inject your own markup into a page, there’s little cause for concern. The danger comes from injecting user and third-party markup into the DOM.

[Forumsgast]

I
Als kleiner Ausblick über den Tellerrand: Single Page Applications werden heutzutage in der Regel nicht mehr am Server gerendert, sondern am Client. Dafür gibts dann auch Frameworks wie Angular, Vue und React, hinter denen jeweils eine große Community steht und für die es sehr viele fertige Komponenten gibt.

Nur der vollsrtändigkeit halber sei noch erwähnt, daß es auch in grauer Vorzeit die Möglichkeit gab im Client zu rendern bspw. handlebars
https://handlebarsjs.com/
oder ein router im client zu nutzen bspw. backbone
https://backbonejs.org/
was möglicherweise einen Umstieg auf state-of-the-art produkte wie angular vereinfacht, weil nicht alles auf einmal neu gemacht werden muss.

[Forumsgast]

@hellbringer
@Arne Drews

Ihr habt meinen Tag gerettet ))

Gott segne Php.de