jcloud_frontend/legal/user-consent/de/index.html

<!DOCTYPE html>
<html lang="de">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <meta name="jcloud-consent-version" content="d7a1c10b59b544c8a82b93a23d8f0323">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <title>Zustimmung</title>
        <style>
            :root {
                --primary-color: #328cef;
                --darker-than-primary-color: #106acd;
            }
            body {
                display: flex;
                justify-content: center;
                align-items: center;
                height: 100vh;
                margin: 0;
                font-family: sans-serif;
            }
            main {
                border: 1px solid #ccc;
                border-radius: 30px;
                overflow: auto;
                height: 90vh;
                width: 80vh;
            }
            h1 {
                margin: 0;
            }
            .content {
                margin: 30px;
            }
            #consent-list {
                list-style-type: disc;
                margin: 50px;
                padding: 0;
            }
            #consent-form {
                display: flex;
                justify-content: right;
                gap: 20px;
                margin: 30px;
            }
            button {
                padding: 10px 20px;
                font-size: 16px;
                border: none;
                border-radius: 8px;
                cursor: pointer;
            }
            #consent {
                background-color: var(--primary-color);
                color: white;
            }
            #consent:hover {
                background-color: var(--darker-than-primary-color);
            }
            #decline {
                background-color: transparent;
                color: #555;
            }
            #decline:hover {
                background-color: transparent;
            }
            #version {
                margin: 20px;
                text-align: right;
            }
            @media (max-width: 768px) {
                main {
                    width: 100vw;
                    height: 100vh;
                    border-radius: 0;
                    border: none;
                }
                #consent-list {
                    margin: 30px;
                }
                #consent-form {
                    flex-direction: column;
                    align-items: center;
                    gap: 5px;
                }
            }
        </style>
    </head>
    <body>
        <main>
            <div class="content">
                <div id="version"><<CONSENT-VERSION>></div>
                <h1>Bevor Sie fortfahren</h1>
                <article>
                    <p>
                        Indem Sie diese Website benutzen, stimmen Sie Folgendem zu:
                        <ul id="consent-list">
                            <li>
                                <h2>Speicherung von Logs</h2>
                                <p>
                                    jCloud speichert Logs über Zugriffe auf die Website und API. In diesen Logs sind die IP-Adresse, der Zeitstempel, die HTTP-Methode, die angeforderte Ressource, der HTTP-Statuscode, den User-Agent, die Sprache des Benutzers, die Antwortzeit und die Version des Servers enthalten. Nach 30 Tagen werden diese Logs anonymisiert, indem die letzten 8 Bit der IP-Adresse entfernt werden.<br/>
                                    <h3>Zwecke der einzelnen Informationen</h3>
                                    <ul>
                                        <li>
                                            <strong>IP-Adresse:</strong> Wird verwendet, um die Quelle des Datenverkehrs zu identifizieren und potenzielle Sicherheitsbedrohungen zu erkennen und im Fall eines Missbrauchs den Zugriff zu entziehen.
                                        </li>
                                        <li>
                                            <strong>Zeitstempel:</strong> Mit Hilfe des Zeitstempels kann der genaue Zeitpunkt eines Zugriffs nachvollzogen werden, was zur Analyse von Angriffen und frühzeitigem Erkennen von Ineffizienzen oder Überlastungen erforderlich ist.
                                        </li>
                                        <li>
                                            <strong>HTTP-Methode und angeforderte Ressource:</strong> Die Speicherung der HTTP-Methode und die angeforderte Ressource dienen dazu, die Nutzungsmuster zu verstehen und auf Grund derer die Website und die API zu verbessern.
                                        </li>
                                        <li>
                                            <strong>HTTP-Statuscode:</strong> Auf Grund des HTTP-Statuscodes kann die Benutzerfreundlichkeit der Website und API bewertet werden (z. B. irreführende Links, die Fehlercodes hervorrufen) und anschließend verbessert und die Zuverlässigkeit der Dienste überwacht werden.
                                        </li>
                                        <li>
                                            <strong>Antwortzeit:</strong> Die Antwortzeit wird gemessen, um die Leistung der Website und API zu überwachen und Engpässe zu identifizieren, die die Benutzererfahrung beeinträchtigen könnten.
                                        </li>
                                        <li>
                                            <strong>User-Agent:</strong> Diese Information wird verwendet, um die Kompatibilität der Website und API mit verschiedenen Browsern und Betriebssystemen sicherzustellen und die Benutzererfahrung zu optimieren.
                                        </li>
                                        <li>
                                            <strong>Sprache des Benutzers:</strong> Die Sprache des Benutzers wird gespeichert, um die Lokalisierung und Internationalisierung der Website und API zu verbessern.
                                        </li>
                                        <li>
                                            <strong>Version des Servers:</strong> Die Version des Servers wird gespeichert, um Probleme bestimmter Versionen zu identifizieren und die Wartung und Aktualisierung der Server-Software zu erleichtern.
                                        </li>
                                    </ul>
                                </p>
                            </li>
                            <li>
                                <h2>Speicherung von Cookies in Ihrem Browser</h2>
                                <p>
                                    Um die optimale Funktionalität der Website zu gewährleisten, speichert jCloud Cookies in Ihrem Browser.<br/>
                                    <h3>Gespeicherte Cookies und deren Zwecke:</h3>
                                    <ul>
                                        <li>
                                            <strong>"User":</strong> Dieses Cookie enthält den aktuell angemeldeten Benutzer. Sofern Sie bei der Anmeldung die Option "Angemeldet bleiben" ausgewählt haben, läuft dieses Cookie nach 20 Tagen ab. Andernfalls läuft das Cookie nach Beendung der Sitzung ab. Dieses Cookie ist notwendig, um Sie während Ihrer Sitzung zu identifizieren und Ihnen den Zugriff auf Ihre Daten zu ermöglichen.
                                        </li>
                                        <li>
                                            <strong>"Auth":</strong> Dieses Cookie enthält ein Token, das zur Authentifizierung Ihrer Anfragen an die API verwendet wird. Sofern Sie bei der Anmeldung die Option "Angemeldet bleiben" ausgewählt haben, läuft dieses Cookie nach 20 Tagen ab. Andernfalls läuft das Cookie nach Beendung der Sitzung ab. Dieses Cookie ist notwendig, um Ihre Anfragen zu authentifizieren und Ihnen den Zugriff auf Ihre Daten zu ermöglichen.
                                        </li>
                                        <li>
                                            <strong>"signed_in":</strong> Dieses Cookie zeigt an, ob Sie angemeldet sind. Falls Sie bei der Anmeldung die Option "Angemeldet bleiben" ausgewählt haben, läuft dieses Cookie nach 20 Tagen ab. Andernfalls läuft das Cookie nach Beendung der Sitzung ab. Dieses Cookie ist notwendig, um Ihnen eine nahtlose Benutzererfahrung zu bieten.
                                        </li>
                                        <li>
                                            <strong>"user_consent":</strong> Mit Hilfe dieses Cookies wird gespeichert, dass Sie dieser Einwilligung zugestimmt haben. Es läuft nach 365 Tagen ab. Dieses Cookie ist notwendig, um sicherzustellen, dass Sie über die Datenerfassungspraktiken informiert sind und Ihre Zustimmung gegeben haben.
                                        </li>
                                    </ul>
                                </p>
                            </li>
                        </ul>
                    </p>
                </article>
                <form action="https://jcloud-services.ddns.net:1024/consent" method="POST" id="consent-form">
                    <input type="hidden" name="redirect_uri" id="redirect-uri" />
                    <button type="button" id="decline">Ablehnen und zurück</button>
                    <button type="submit" id="consent">Zustimmen und fortfahren</button>
                </form>
            </div>
        </main>
        <script>
            'use strict';
            const url = new URL(window.location.href);
            const search = Object.fromEntries(url.searchParams.entries());
            for (let key in search) {
                const input = document.createElement('input');
                input.type = 'hidden';
                input.name = key;
                input.value = search[key];
                document.querySelector('form').appendChild(input);
            };
            document.querySelector('#redirect-uri').value = 'https://jcloud-services.ddns.net' + url.pathname + url.hash;
            document.querySelector('#decline').addEventListener('click', function () {
                window.history.back();
            });
        </script>
    </body>
</html>