Simple Webseite mit dynamischen Inhalten für jeden User - wie realisieren?

[Falc410]

Ich bin leider der totale Noob wenn es um Webseiten, Portale, Webservices etc. geht. Daher kann ich nicht einmal mein Problem richtig beschreiben und finde deswegen auch keine passenden Tutorials im Internet. Ich versuche mal zu erklären was ich erreichen will und vielleicht kann mir dann jemand sagen was ich brauche, bzw. was das überhaupt ist.

Ich muss eine Webseite erstellen auf der sich ein Benutzer über ein Textfeld anmeldet (ohne Auth, ohne Passwort, nur Name). Dann gebe ich diesen Namen an ein Backend weiter (das bietet REST Schnittstellen dafür an) und schickt mir per XML (die Antwort vom REST Service) eine Liste mit Einträgen die ich in einer Tabelle dem User anzeigen will. Anschliessend soll der User einzelne Einträge aus der Liste entfernen können (das wird dem Backend dann wieder per GET/POST mitgeteilt).

Das wars schon. Es geht hier überhaupt nicht um Sicherheit, d.h. auch wenn 2x der gleiche Username eingegeben wird, bekommen beide die gleiche Liste dargestellt.

Ich habe in der Vergangenheit mit Spring 2/3 gearbeitet und mir zuerst gedacht das ich es damit umsetze. Nun habe ich aber das Problem, dass die ganzen Tutorials so etwas wie globale Daten erwarten, sprich es gibt nur eine Liste und alle User sehen diese. Klassisches Beispiel ein Gästebuch. Aber ich brauche eine Liste pro User. Das ganze muss nirgendwo gespeichert werden, keine Datenbank oder ähnliches ist von nöten.

Ich weiss nun nicht nach was ich schauen soll. Muss nach Session Handling Tutorials schauen und diese Liste für jeden Browser in seine Session legen damit jeder seine eigene hat? Ich hab mal nach User Portal gesucht dann kamen Portlets raus - aber das scheint auch nicht der richtige Begriff zu sein. Und ein Webservice ist es auch nicht.

Oder anstatt Spring etwas anderes benutzen? Ich würde auch gerne Python anstatt Java nehmen aber da habe ich halt auch noch nie etwas in dieser Art realisiert. Keine Ahnung ob ich da Django oder Web2Py oder ähnliches brauche. PHP hab ich nicht in Betracht gezogen da ich damit noch nie etwas gemacht habe.

Also in der Theorie sollte das Ganze doch ziemlich simpel sein, wenn ich denn wüsste nach was ich suchen muss. Danke schonmal für eure Hilfe.

 

[blackst0rm]

Wenn es ein RESTful-Backend gibt würde sich doch Javascript anbieten. Schau dir mal AngularJS an. Das ist ein JavaScript MVVM-Framework. Ich arbeite momentan damit auch zum ersten mal und finde es sehr angenehm. Auf der Seite gibt es sehr gute Tutorials dazu.

 

[Falc410]

Wenn ich das mit Javascript mache, dann habe ich nur einen normalen Webserver (Apache z.B.) der eine HTML ausliefert und die Berechnung und Kommunikation erfolgt dann direkt vom Client zum Backend, richtig?
Mein Client Browser kann Javascript und sogar HTML5 ist aber sehr langsam, deswegen hatte ich auch zuerst gedacht das ein Server eben die Webseiten "generiert" und sie dann an den Client ausliefert. Aber ich schau mir das mal an, mit Javascript hab ich auch noch nie was zu tun gehabt.

Edit: Wobei die halt im Tutorial wieder vom Standard Use Case ausgehen: Es gibt eine Liste von Handys welche alle Nutzer sehen...das kann doch nicht so schwer sein diesen Teil irgendwie dynamisch zu machen. Aber ich hab keine Ahnung wie ich da auch nur anfangen soll.

 

[HominiLupus]

Ja, Sessions wären eine gute Idee.
Wenn du alles serverseitig machen willst, kannst du ja Java, PHP, Python, Perl, etc nehmen. Dann hast du reines HTML für den langsamen Client.

 

[blackst0rm]

Genau so funktioniert das. Du musst allerdings aufpassen das du die Anfragen an die selbe Domain sendest von der das Skript kam.(Same Prigin Policy) Wir hatten das Problem, dass sich unser Backend innerhalb einer anderen Domain befindet. Das haben wor gelöst indem wir unseren Webserver(nginx) als Reverse Proxy konfiguriert haben der Anfragen an das Backend weiterleitet.

Zu deinem Edit.
Natürlich wird der Standard Use Case behandelt. Sollt aber nicht schwierig sein das für dein Problem zu adaptieren.
Ich weißnich wie euer Backend aussieht aber ich könnte mor folgendes vorstellen l.

User gibt Name ein -> Name wird ans Backend geschickt
Backend antwortet mit Liste von Einträgen für den User->Darstellung auf der Seite
User klickt auf löschen-> Objekt des Eintrags wird an den Server gesendet der das dann aus seiner DB löscht

 

[Falc410]

@Blackstorm: Ja genau so soll das sein.

Nach Python und Sessions habe ich auch schon gegooglet, aber das hilft mir irgendwie auch nicht weiter. Ich bräuchte irgendeinen ähnliche Use-Case für den es Tutorials gibt, aber wie gesagt, alle Anwendungen die mir einfallen haben globale Daten und nicht unterschiedliche.

Ich hatte schon in Erwägung gezogen das über URLs zu realisieren, ich glaube mit Spring 3 müsste das gehen. Also das ich dann einfach habe:

projekt/UserA/list.html
projekt/UserB/list.html

usw. Aber dann steh ich wieder vor dem gleichem Problem, globale Daten. Sprich ich hab dann ein riesiges Datenmodel und muss die einzelnen Listen den Usern zuweisen und beim anzeigen dann immer filtern das nur Daten angezeigt werden die für den entsprechenden User sind.

Kommt mir alles sehr kompliziert vor. Wie gesagt, wenn ich wüsste nach was ich suchen muss wäre das sicher ganz einfach. Aber Gästebuch, Forum, User Portal ist es alles nicht. Und Session Handling / Management hat mir auch nicht weiter geholfen.

 

[djot]

Wenn es eh "völlig egal" ist, wer auf dem "System" rumeiert, wäre es das Einfachste wohl ein simples CRUD-Script. Das zeigt im besten Fall über vordefinierte CSV- (Excel-) Spalten oder eben dem REST-Krams alles in einem tabellarischen Formular an und bietet auch gleich Knöpfchen zum Editieren und wegbeamen.

Da ich befürchte, dass Du selbst nicht mal in der Lage bist, ein Formular zu generieren geschweigedenn die Daten daraus auszuwerten, wäre es vielleicht sinniger, jemanden da ran zu lassen der ein wenig mehr Ahnung als gar keine hat.

Eine gewisse "Sicherheit" sollte das System auch bieten, und identische Nutzernamen sind auch keine gute Idee. Früher oder später wirst Du Dir damit Ärger einhandeln.

Beschränke Dich auf HTML und PHP. Mehr als Formulare anzeigen und die Daten dann irgendwie an den REST-Dienst zu übergeben brauchst Du wohl nicht. Also kein Framework/CMS/Portal und Javascript ist dafür auch nicht nötig.

Ich seh auch nicht wo das Problem ist, für einen Nutzer spezifische Daten anzuzeigen!? Außer, Du erwartest tatsächlich, dass es einen für Dich gemachten fertigen Download gibt

 

[hash2k2]

eine loginseite, nutzer gibt name ein, abgleich mit der datenbank, nutzer bekommt eine id.
diese id wird mit einer tabelle verglichen und alle einträger der tabelle, in denen die id als "besitzer" steht, anzeigen lassen.
php, mysql

 

[DasBoeseLebt]

Du hast ne REST-Schnittstelle, wenn du (ordentlich) funktioniert, dann hast du doch schon alles, was du willst.
Oder liegt darin das Problem, dass diese nicht funktioniert?

 

[Falc410]

Ich kenn mich mit REST nicht aus. Bis jetzt habe ich nur Backend Entwicklung gemacht und nie Frontend. Das Backend wird von wem anders entwickelt und die REST Schnittstelle ist auch noch WiP. Ich hab sonst nur mit Soap, Thrift usw. gearbeitet.

Im Prinzip ist es schon so ähnlich wie hash2k2 das beschreibt, aber ich hab keinen direkten Zugriff auf die Datenbank, das soll ja durchs Backend passieren.

Mein Hauptproblem ist einfach wie ich es schaffe die Daten innerhalb meiner Applikation getrennt zu halten, sprich einzelne Listen für jeden User. Das einzige was mir jetzt einfällt ist, alle Listen in einem großem Datenmodell zu speichern und dann die Ausgabe zu filtern, und nur für den jeweilig relevanten Nutzer die Daten anzuzeigen. Aber ich glaube das ist eine sehr unschöne Lösung, vor Allem wenn ich alle Listen von allen Usern in den Sessioncontext lege.

 

[DasBoeseLebt]

Wenn wer anders das Backend entwickelt, also die RESTSchnittstelle usw., dann brauchst du für deine jetzige Entwicklung durch nur die Schnittstelle zu kennen - die ihr hoffentlich vorher definiert habt.

Ihr könntet die z.b. so definiert haben:
www.DEINEDOMAIN.de/user/:name.json (oder xml)

Jetzt bekommst du alles relevante von den übergebenen Namen. Als Frontend kann es dir doch egal sein, was das Backend dafür leisten muss und wie es funktioniert.

Oder warum machst du dir darüber Gedanken? 0o

 

[Falc410]

Ja ich hab z.B. http://localhost:8080/Backend-0.0.1-SNAPSHOT/webresources/players/create/$username
bzw. http://localhost:8080/Backend-0.0.1-SNAPSHOT/webresources/players/get/$username

Aber da kommt halt eine XML Antwort. Also entweder benutze ich einen REST Client in Java um das in Objekte umzuwandeln, dann müsste ich aber die Datentypklassen haben soweit ich weiss, oder ich parse das XML und bau mir selber ein Objekt - das wäre jetzt mein Ansatz gewesen da ich eh nur 50% des XML Inhaltes brauche. Trotzdem brauch ich doch ein komplettes Frontend drumherum, ich kann ja schlecht nur XML Code anzeigen lassen. Oder steh ich grad voll auf dem Schlauch?

 

[DasBoeseLebt]

Ja, stehst du.

Du lieferst ne statische Seite aus, die sich den Content über die RESTURL holt. Den kannst du dann in die ansonsten statische Seite einfügen (das geht z.b. mit dem Framework Angular ganz gut, aber auch ohne).

Dazu werfe ich einfach mal den Begriff AJAX in den Raum.

Im Prinzip brauchst du nichts weiter als bisschen HTML, CSS und Javascript.

http://www.w3schools.com/Ajax/
http://www.w3schools.com/Ajax/tryit.asp?filename=tryajax_first

 

[Falc410]

Ok danke. Jetzt muss ich nur noch herausfinden ob Ajax von dem Browser unterstützt wird und ob das schnell genug ist das XML zu parsen. Das wollte ich halt den Server machen lassen und nicht den Client. Aber nun weiss ich wenigstens wie Ajax XML parsed und z.b. in einer Tabelle darstellt - da gibts auch eine schöne Demo für.

Aber kann ich die Tabelle dann bearbeiten, also Einträge wieder rauslöschen aus der Anzeige? Der Server wird seine Liste nicht verändern, sondern nur lokal in meinem Browser muss ich einzelne Zeilen entfernen (wenn diese "erledigt" sind).

Ich hab das Gefühl da stoße ich schon wieder an die Grenzen. sigh.

 

[Daaron]

Spätestens, wenn du eines der üblichen Frameworks (jQuery oder Mootools) dazwischen klemmst, ist jeder Browser AJAX-fähig, selbst n IE6. Und wenn die Kiste mit den einfachen Berechnungen nicht klar kommt, dann ist hier einfahc mal neue Hardware fällig. Wenn du nicht gerade drölfzillionen Datensätze hast würde damit sogar eine RaspberryPI klar kommen...

Und ja, Löschanfragen sind einfach. Du machst n Knopf, der n Request an dei REST-Schnittstelle sendet "lösche ID xy". Danach hast du 2 Optionen
1.) du löschst die Zeile direkt bei dir in der Darstellung und hoffst, dass der Server auch alles erledigt hat
2.) du machst noch n AJAX-Request an den Server und holst die neue, überarbeitete Liste

 

[DasBoeseLebt]

AJAX parsed dir nichts, es läd nur die Datei nach. (AJAX ist ja auch nur eine Technik, kein Werkzeug).

^siehe da.

 

[Falc410]

Seite neu laden vom Server ist sehr unschön. Das dauert jetzt mit meinem aktuellen Spring 2 Testprojekt schon so 3-5 Sekunden wenn ich das Formular abschicke - und da wird wirklich nur rein HTML ausgeliefert. Das Teil ist ein Embedded System und einiges langsamer als ein Pi wenn du mich fragst.
Aber ja, ich lösch den Eintrag einfach bei mir aus der Liste und hoffe das der Server das auch erledigt hat, genau so war der Plan. Ich hab eben nur Angst dass das Teil zu lahm für das Javascript Zeugs ist, daher zuerst der Ansatz das meine Serverkomponente das berechnet und nur ein statisches HTML ausliefert.

Dann such ich mir mal ein paar Tutorials zu Ajax raus.

Ergänzung (27. Februar 2014)

So, nachdem ich also ewig gesucht habe bin ich endlich fündig geworden. Hier gibts ein Tutorial das endlich mal beschreibt wie man REST in einer Webanwendung konsumiert: http://blog.miguelgrinberg.com/post/writing-a-javascript-rest-client

Ansonsten habe ich nämlich nur sachen gefunden wie man REST Schnittstellen anbietet. Das schöne ist, hier kommt gleich eine Beispielanwendung mit. Die kann ich gleich mal mit meinem Gerät testen um zu sehen wie die Performance ist.

Die Doku von Angular ist für komplette Einsteiger nicht wirklich hilfreich, ebenso ein google nach jquery und REST.

Wenn ich den Krampf nicht als Webanwendung sondern als iOS oder Android App hätte schreiben dürfen, wäre ich innerhalb von wenigen Stunden fertig. sigh

 

[DasBoeseLebt]

Angular/JQuery und REST stehen auch in keinem Zusammenhang und wird man folglich auch nicht finden. (tl;dr: Du suchst falsch)

Angular und JQuery bieten dir Möglichkeiten an, via Requets Daten zu laden.
Ob auf der anderen Seite ne RESTSchnittstelle steht oder nicht, ist für jedes Framework vollkommen unerheblich.

https://api.jquery.com/jQuery.ajax/
http://docs.angularjs.org/api/ng/service/$http
http://docs.angularjs.org/api/ngResource/service/$resource (besser als $http für REST)

http://stackoverflow.com/questions/13760070/angularjs-passing-data-to-http-get-request
http://stackoverflow.com/questions/...ervices-from-restful-api-in-my-angularjs-page
http://stackoverflow.com/questions/12131659/from-jquery-ajax-to-angular-http

Einfach nen parametisierten Request starten (der Parameter ist der Benutzername) und gut.

 

[Falc410]

Deswegen habe ich den Thread ja erstellt - da ich keine Ahnung hatte nach was ich überhaupt suchen muss.

Ich versteh zwar immer noch nicht ganz warum das in keinem Zusammenhang steht aber das finde ich schon noch raus. Wenigstens hab ich zum ersten Mal ein Tutorial gefunden welches den Server und Client gleichzeitig zeigt. Zumindest die Serverkomponente in Python ist mir sofort klar gewesen und nun sehe ich auch einen darauf abgestimmten Client. Fast alle anderen Tutorials haben entweder nur das eine oder andere gezeigt.

Mein Teamkollege meint zwar das die Geräte das nicht packen werden aber ich hoffe mal das es geht. Werde heute Abend mal Bericht erstatten.

Danke das ihr mich auf die richtige Spur gebracht habt.

 

[DasBoeseLebt]

Um was für ein Gerät handelt es sich den?
Vllt. sollte man dann auch an Backend ansetzen und da optimieren.
(z.b. unnötige Daten halt nicht mitschicken, ein 'freundlicheres' Format wie JSON nehmen usw.)