Website für Projekt erstellen?
Hallo, wir planen aktuell ein Projekt von der Schule. Ich sollte eine Anmelde-Website erstellen, aber habe Schwierigkeiten.
Anforderungen:
- Es soll 60 unterschiedliche, feste Codes geben, die eingegeben werden können und sollen dann auf Zettel gedruckt werden, um eben auf die Infos auf der Website zuzugreifen.
- Sobald die ersten 25 Codes ( egal welche ) benutzt worden sind, sollen alle anderen verfallen und ungültig werden.
- Sobald ein Code verwendet wurde, soll dieser ebenfalls ungültig werden
- Die 25 ersten können dann ein Anmeldeformular ausfüllen und absenden und bekommen dann etliche Infos.
Bestenfalls kann man es auch Zeitsteuern, sodass erst an einem bestimmten Datum oder Uhrzeit es sich freischaltet, ist aber absolut nicht nötig.
Bisher hatte ich mein Glück mit Google Forms versucht. aber bin kläglich gescheitert. Falls davon jemand Ahnung hat, oder eventuell sogar spezifische man Programmierkenntnisse braucht, so bin ich ratlos.
5 Antworten
Ich sollte eine Anmelde-Website erstellen
Da stellt sich doch primär die Frage, welche Optionen der Server bietet, auf dem diese Webseite laufen soll.
Wenn du nicht weisst, was der Server unterstützt, wie willst du dann eine Webseite dafür konzipieren und bauen? Woher weisst du, ob das Ding PHP, ASP, JSP unterstützt, ob du Funktionen via CGI umsetzen musst, ob du eine Datenbank für deine Codes zur Verfügung hast oder deine Codes inkl. Verfallskennzeichen etc. über JSON- oder Textdateien speichern musst?
Solange völlig unbekannt ist, was der Server bietet, ist auch völlig offen, welche Technik du zur Umsetzung überhaupt anwenden kannst.
Das hat nichts mit fachsimpeln zu tun. Das sind einfach die Minimalinfos, die wir brauchen, um dir helfen zu können. Der Server muss ja irgendwie speichern können, welche Codes benutzt wurden. Dafür muss er programmierbar sein und Xandros0506 will einfach nur wissen, welche Art der Programmierung der Server bietet. Am häufigsten werden PHP, ASP.Net oder irgendwelche Dinge, die auf Node.js basieren (z.B. React, Vue, Angular) benutzt. Am besten sollte man auch Zugriff auf eine Datenbank, wie z.B. MariaDB oder PostgreSQL haben.
Oder darfst du deinen persönlichen Laptop als Webserver benutzen und kannst da irgendwas beliebiges als Webserver drauf installieren?
Das Projekt lässt sich halt nicht als statische Website nur mit HTML und CSS umsetzen.
Zumindest für die Codeprüfung wirst du eine eigene Webanwendung implementieren müssen, die die verfügbaren Codes persistent speichert und einen Endpunkt zur Verfügung stellt, welcher einen übergebenen Code auf seine Validität testet.
Das bedeutet im Umkehrschluss, dass du Programmierkenntnisse benötigst. Zu welcher Programmiersprache (PHP/JS mit Node.js/Python/...), ist von der Webserverkonfiguration abhängig.
Es wäre an der Stelle sinnvoll, mit deinem Lehrer zu sprechen, um zu ermitteln, welche Ressourcen die Schule bereits stellt oder welche Ressourcen noch wo angelegt werden müssen. Des Weiteren wäre das auch der Zeitpunkt, den Lehrer darauf aufmerksam zu machen, wenn dich diese Aufgabe überfordert, damit alternative Lösungswege gefunden werden können. Als Anfängerprojekt würde ich es jedenfalls nicht einstufen.
Für die Webanwendung wird ein Webserver sowie eine angebundene Domain benötigt. Sofern es seitens deiner Schule keine Vorgabe gibt, würde ich empfehlen, nach Webhostingpaketen mit PHP-Support zu suchen, denn PHP ist im Vergleich zu anderen Programmiersprachen recht einfach erlernbar. Zudem gibt es zahlreiche passende Anbieter (z.B. 000webhost, InfinityFree, Ionos, netcup, Strato, usw.).
Zur Verwaltung der Codes könntest du eine Datenbank verwenden. Eine MySQL-Datenbank ist in Hostingpaketen in der Regel enthalten. Andernfalls tut es eine Datei (z.B. im CSV-Format) natürlich auch. Ich werde mich folgend dennoch nur auf erstgenannte Lösung fokussieren.
Die genutzten Codes würde ich in der Datenquelle entsprechend markieren. Das heißt man würde je Code zwei Informationen speichern: Den Code selbst und die Information, ob er bereits aktiviert wurde (0/1).
SQL-Tabelle:
CREATE TABLE codes (
code VARCHAR(255),
activated BIT(1)
);
Bei einem Login-Versuch müsste erst geprüft werden, ob es noch mehr als 35 inaktive (oder weniger als 25 aktive) Codes gibt.
-- count number of inactive codes
SELECT COUNT(code) FROM codes WHERE activated = 0
Wenn dem nicht so ist, kann in der Tabelle nach dem Code gesucht werden. Sollte er existieren (und noch ungenutzt sein), wird er aktiviert.
-- search for code
SELECT code FROM codes WHERE code = '...' and activated = 0
-- activate code
UPDATE codes SET activated = 1 WHERE code = '...'
Diese Kommunikation mit der Datenbank (Abschicken der SQL-Queries und Auswertung des Ergebnisses) übernimmt deine Webanwendung (Endpunkt), nachdem sie den Code vom Formular empfangen hat. In manchen Programmiersprachen gibt es bereits ein Standardmodul, über welches man sich mit einer MySQL-Datenbank verbinden kann (in PHP beispielsweise MySQLi). Andernfalls müsstest du dich nach einer externen Bibliothek umschauen.
Achte im Übrigen darauf, für Queries, die äußere Eingaben (wie den Code) beinhalten, immer ein prepared statement und für den Datentransport eine UTF-8-Zeichenkodierung (MySQL: utf8mb4) zu nutzen. So schützt du deine Anwendung vor äußeren Einfluss (Stichwort: SQL-Injection).
Wenn die Prüfung erfolgreich war, sollte ein entsprechender Wert in den Response Body geschrieben werden (z.B. "success"). Der Aufrufer kann auf diesen Wert dann prüfen.
Bezüglich Google Forms müsstest du schauen, ob du via Apps Script/Trigger einen onSubmit-Handler integrieren kannst, der diesen Endpunkt aufruft (s. UrlFetchApp.fetch, Datenübergabe bestenfalls via POST-Methode) und je nach Ergebnis auf die nächste Seite (Section/Page Break) weiterleitet. Beachte, dass die einzelnen Formularschritte nicht separat via URL aufrufbar sein dürfen, da das bedeuten würde, dass der Loginprozess übersprungen werden könnte. Für den letzten Schritt wäre es vermutlich auch einfacher, die Informationen via E-Mail zu verschicken.
Alles in allem benötigst du hierfür JavaScript-Kenntnisse. Die API-Referenz für Google Forms-Skripte findest du hier.
Solltest du für Google Forms keine geeignete Lösung finden, würde ich weitere Teile in der eigenen Webanwendung lösen. Das Loginformular lässt sich rasch mit HTML umsetzen (für ein individuelles Styling müsstest du CSS einbinden).
Beispiel:
<!doctype html>
<head>
<title>Anmeldung</title>
<meta charset="utf-8">
</head>
<body>
<form action="URL to endpoint" method="post">
<label for="code">Code</label>
<input id="code" name="code">
<input type="submit">
</form>
</body>
Das action-Attribut des form-Elements müsste auf den Endpunkt verweisen. Dessen Implementation müsstest du im Anschluss noch etwas anpassen:
- Bei erfolgreichem Login sollte eine HTTP Session gestartet werden. So lange sie existiert, ist der Nutzer angemeldet.
- Statt ein Ergebnis in den Response Body zu schreiben, sollte auf eine Seite weitergeleitet werden. Entweder auf die nächste Seite mit dem zweiten Formular oder zurück auf die Seite mit dem Loginformular.
Jede Folgeseite, für die der Nutzer angemeldet sein müsste, muss bei Aufruf schauen, ob die begonnene Session existiert. Sollte dem nicht so sein, muss eine Weiterleitung zurück zum Login erfolgen.
Das von dir erwähnte zweite Formular birgt im Übrigen vielleicht noch weitere Komplexität, je nachdem, welchem Zweck es tatsächlich dient.
Wenn es einfach nur Daten erfasst, kann man es noch recht einfach handhaben. Entweder nutzt man Google Forms oder man baut sich ein eigenes HTML-Formular und schreibt die Daten über einen zweiten Endpunkt in eine extra Datenbanktabelle (beachte in beiden Fällen die DSVGO).
Sollten die erfassten Informationen jedoch dazu dienen, dass sich der Nutzer über diese später erneut anmelden kann, dann müsstest du den ersten Endpunkt und sicherlich auch die Loginseite noch erweitern. Die Nutzerdaten würde ich in einer extra Datenbanktabelle sichern.
Ich sollte eine Anmelde-Website erstellen, aber habe Schwierigkeiten
Dafür wäre zunächst die Information wichtig, in welchem Fach ihr das machen sollt.
Wenn es in Informatik ist, bin ich mir sicher, dass ihr die notwendigen Themen bereits behandelt habt, um das selbst umsetzen zu können.
Guten Morgen, es ist ein Smp-Projekt. Also kein Schulfach
Und was ist das? Davon habe ich noch nie gehört... Wird das benotet oder ist das ein freiwilliges Projekt, das ihr euch selbst überlegt habt?
Nein, es ist von ( bei uns ) Ksj Freiburg. Jede Stadt oder Schule hat eine Schülermentoren Gruppe. Wir wurden auf einen Kurs mit neuen Mentoren aus anderen Orten in ein Haus gepackt und dort wurde uns das dann beigebracht, was bltig und was man beachten muss. Dort bekamen wir dann die Aufgabe ein Projekt umzusetzen, Unsere Gruppe entschied sich für eine Übernachtung. Und nun die registrierungen sollten nun über eine Website laufen die ich hochziehen soll.
Das wird ohne entsprechende Programmierkenntnisse sehr schwer bis unmöglich
also ich würde sagen das man eine datenbank hat in der die codes gespeichert werden. wenn einer benutzt wird wird der eintrag auzs der datenbank gelöscht, und ein counter wird erhöht. wenn dieser bei 25 ist wird die gesamte datenbank gelöscht
Gebe das mal bei Chat GBT ein, der kann auch Code ausgeben.
Hab ich schon, aber der war leider nicht hilfreich. Danke aber
Warum denkt jeder Ki kann jetzt alles?!? Ki kann nicht logisch denken und ist somit noch nicht in der Lage so etwas komplexes zu coden
Fachsimpeln kann ich auch, aber Danke