ITReturns TrackerEinrichtung & Handoff
Interne Dokumentation · für IT / Entwicklung

Hochladen — und
es läuft.

Das Portal ist so gebaut, dass es ohne jede Einrichtung auf einem normalen Webserver funktioniert: Ordner hochladen, fertig. Die gemeinsamen Team-Daten übernimmt ein mitgeliefertes Mini-Backend (api.php). Diese Seite beschreibt den einfachen Standard-Weg — und optional die spätere Aufrüstung auf echte Microsoft-Anmeldung.

A Empfohlen: Ordner auf einen PHP-Webserver laden

Das genügt für ein komplett funktionierendes, team-weit geteiltes Portal — ohne Datenbank, ohne Cloud-Konto, ohne Programmierung. Voraussetzung ist nur ein klassisches Webhosting mit PHP (Standard bei Strato, IONOS, 1&1, Hetzner, fast jedem Apache-Server).

  1. Alle Dateien dieses Projekts per FTP/SFTP oder Datei-Manager in das Web-Verzeichnis hochladen (z. B. /htdocs oder /public_html) — inklusive api.php.
  2. Portal aufrufen über die Web-Adresse (z. B. https://deine-domain.de/Portal.html). Beim ersten Speichern legt api.php automatisch einen Ordner data/ für die gemeinsamen Daten an.
  3. Fertig. Returns Tracker, Fristenprotokoll und Dokumente sind jetzt für alle gleich — jeder Browser sieht denselben Stand, automatisch alle paar Sekunden abgeglichen.

Was dabei automatisch passiert

  • Team-Sync ansync.js & fristen-sync.js zeigen bereits auf das lokale api.php. Board & Protokoll spiegeln sich serverseitig.
  • Dokumente zentral — Uploads landen im Ordner data/docs/ auf dem Server statt nur im Browser. Die Seite erkennt das selbst und zeigt oben „Team-Ablage".
  • Geschützter Datenordnerdata/ bekommt eine .htaccess, die direkten Web-Zugriff sperrt; Daten nur über api.php.
  • Kein PHP da? Kein Problem — ohne PHP fällt alles still auf den bisherigen lokalen Modus (pro Browser) zurück. Nichts geht kaputt.

Optionaler Schlüssel: Wer den Zugriff auf das Backend zusätzlich absichern will, trägt oben in api.php einen Wert bei $API_KEY ein und denselben Wert bei headers: { 'x-app-key': '…' } in sync.js / fristen-sync.js. Leer = aus.

Schreibrechte: Falls beim ersten Speichern eine Fehlermeldung erscheint, dem Web-Verzeichnis (bzw. dem entstehenden data/-Ordner) Schreibrechte geben — meist chmod 775. Das war's.

Die folgenden Schritte (B) sind optional und nur für später gedacht: echte Microsoft-Anmeldung statt Demo-Passwort. Für den Start nicht nötig.

B Optional: Microsoft-Anmeldung (Entra ID / Azure AD)

Damit sich Mitarbeiter automatisch mit ihrem Windows- bzw. Microsoft-365-Konto anmelden — ohne Passwort-Abfrage, mit echtem Namen und Profilbild — wird im Microsoft-Entra-Admin-Center eine App-Registrierung angelegt. Das ist kostenlos, dauert wenige Minuten und braucht keinen eigenen Server und kein Geheimnis (moderne SPA-/PKCE-Anmeldung).

Schritte für die IT

  1. Im Microsoft Entra Admin CenterApp-RegistrierungenNeue Registrierung anlegen. Name z. B. „Returns Tracker".
  2. Als Plattform Single-Page-Anwendung (SPA) wählen und als Redirect-URI die Web-Adresse eintragen, unter der diese Seite läuft.
  3. Unter API-Berechtigungen die delegierte Microsoft-Graph-Berechtigung User.Read hinzufügen (Standard, genügt für Name + Profilbild).
  4. Die Application (client) ID und die Directory (tenant) ID kopieren.
  5. Beides in die Datei auth.js eintragen — fertig.

Im Kopf von auth.js stehen genau diese Felder:

/* >>> HIER EINTRAGEN <>> */
const AUTH_CONFIG = {
  clientId: '11111111-2222-3333-4444-555555555555',  // aus Entra
  tenantId: 'organizations',   // oder die Tenant-ID
  admins:   ['denis.tschope'],  // wer Admin-Rechte hat
};

Sobald die Client-ID gesetzt ist, ersetzt die echte Microsoft-Anmeldung automatisch die simulierte. Der angemeldete Windows-Benutzer wird erkannt, sein echtes Profilbild aus Microsoft 365 geladen und lokal zwischengespeichert. Wer in admins steht, bekommt Vollzugriff (z. B. Standard-Kategorien bearbeiten).

C Optional: anderes Backend statt api.php

Das mitgelieferte api.php deckt geteilte Daten bereits vollständig ab. Wer stattdessen eine bestehende Cloud-Infrastruktur nutzen möchte, kann die Adresse in sync.js / fristen-sync.js auf einen eigenen Endpunkt umbiegen. Verlangt wird nur derselbe, denkbar einfache Vertrag:

Der Vertrag — nur zwei Aufrufe

GETliefert { "rev": <Zahl>, "state": { … } } — den aktuellen Board-Stand
PUTempfängt dasselbe Format und speichert es (neuere rev gewinnt)

Die Adresse wird in sync.js eingetragen:

/* >>> HIER EINTRAGEN (leer = nur lokal) <>> */
const SYNC_CONFIG = {
  url:    'https://meinservice.example.com/api/board',
  pollMs: 6000,        // alle 6 Sek. nach Updates schauen
  headers: { 'x-api-key': '…' },  // optional
};

Empfohlene Backends

Microsoft-nah

Azure Static Web Apps

Eine kostenlose Azure-Function + Tabelle. Passt ideal, wenn ohnehin Microsoft 365 genutzt wird, und teilt sich die Entra-Anmeldung.

Schnell

Supabase / Firebase

Fertige Datenbank mit REST-Schnittstelle in Minuten. Kostenloses Kontingent genügt für ein Team locker.

SharePoint

SharePoint-Liste

Wenn alles in M365 bleiben soll: eine Liste als Speicher, angebunden über Microsoft Graph.

Empfehlung: Anmeldung (Teil 1) und gemeinsame Daten (Teil 2) zusammen über Azure umsetzen — dann gilt eine Identität für beides, und Berechtigungen (wer darf was) lassen sich serverseitig sauber absichern.

! Wichtiger Hinweis zur Sicherheit

Der aktuelle Passwortschutz der Seiten (Portal) hält neugierige Blicke fern, ist aber rein im Browser umgesetzt. Inhalte liegen damit prinzipiell im Gerät vor. Für echten Schutz sensibler Daten gehören Anmeldung und Datenhaltung auf den Server — genau das leisten die beiden Schritte oben. Erst danach sind die Inhalte serverseitig abgesichert und team-übergreifend konsistent.

Portal · Einrichtung & Backend · Stand 2026 Standard: einfach hochladen (PHP) · api.php