Opt-in Cookies

  • Guten Morgen,


    ich habe ein kleines Anliegen zum Thema Cookies. Für meine Webseite möchte ich Opt-In Cookie verwenden, die gespeichert, ausgelesen und gelöscht werden können. Außerdem möchte ich dem Nutzer gerne eine Mitteilung erscheinen lassen, mit dem Hinweis in dem der Name des Besuchers gespeichert wurde. Ich habe es ein bisschen in JavaScript versucht, erzeuge aber nicht das gewünschte Ergebnis. Ich bekomme auch keine Cookies in den Applications der Webseite angezeigt. Java Script ist relativ neu für mich, ich kenne mich also noch nicht so gut aus. Wie kann ich nun die Cookies für meine Webseite erzeugen? Mit dem nachgeführten Beispiel klappt es nicht. Die vorgefertigte Architektur habe ich von der Seite Cookie Consent.


    schönen Tag und sonnige Grüße

  • Hey Fabia,


    du kannst einfach 2 Buttons mit je 1 Id erstellen. Dann auf beide Buttons den EventListener Click intialisieren.


    Wenn der Seitenbesucher "Nein" klickt wird nur das Popup ausgeblendet und wen er "Ja" klickt wird dieses ausgeblendet und dann die Cookies/Sessions gesetzt.


    Beispiel (Pseudo Code):

    HTML
    1. <section id="cookiePopup">
    2. <button id="accept">Akzeptieren</button>
    3. <button id="decline">Ablehnen</button>
    4. </section>


    Hilft dir das weiter?


    Schöne Grüße

  • Hey, danke schonmal für deine Antwort.


    mit der Cookieconsent implementierung habe ich ja schon einen Button erzeugt, bei dem decline und accept möglich ist. Eben aber nicht in Html. Siehe nochmal wie oben:

    oder soll ich neue Buttons auf der Seite erzeugen?



    viele Grüße

  • Hey,


    mein Beispiel war ohne Osana gedacht.


    Wenn du es mit Osana (Cookieconsent) machen willst:

    Wie kommst du denn an den Namen des Seitenbesuchers? Gibt er diesen irgendwo ein oder wie kann ich mir das vorstellen?


    Ich sehe auch gerade, dass du 1 Funktion in die andere verschachtelt hast. Das ist ein Fehler.

    Du kannst beide Funktionen voneinander einzelt intialisieren. Wo werden diese beiden Funktionen denn aufgerufen? Davon sehe ich nichts.


    Außerdem hast du beide JavaScript Codes in 2 <script></script>-Tags geschrieben. Du brauchst da nur 1 um dem ganzen JavaScript Code. Wobei die beste Variante eine externe JavaScript Datei ist welche man dann über <script src="pfad"></script> einbinden kann. So ist dein Code auch gut getrennt und übersichtlicher.

    Hilft dir das weiter?

    Wenn nicht werde ich mir Osana mal selbst anschauen.


    Schöne Grüße

  • das ist auf jeden Fall schon einmal funktionaler als mein Versuch, danke. Auch für den Hinweis.

    Jetzt bekomme ich mit deinem Code aber immer noch kein Cookie im (Seite) "Untersuchen">> "Anwendungen" Fenster. Ich möchte ja irgendwo sehen , oder einen Beweis, dass Cookies gespeichert sind.


    Das mit dem Namen war eigentlich eher optional gedacht. Also zu Beginn kommt ein Fenster in dem sich der User einträgt und das ist dann die Grundlage für den Cookie. Das war die Idee, wie ich das umsetze, da bin ich eben leider überfragt..


    schönen Abend

  • Guten Morgen,


    ich habe es mal ausgetestet.


    1 Variante:

    Den Accept Button erfasst und den EventListener Click wie bereits im 1 Beitrag von mir beschrieben intialisiert. Wenn dieser Button geklickt wird, wird die Funktion setCookie ausgeführt, welche ein Cookie setzt.


    JavaScript
    1. let allowButton = document.getElementsByClassName("cc-allow");
    2. allowButton[0].addEventListener("click", function(){
    3. setCookie();
    4. });


    2 Variante (Cookie Consent selbst):

    Du brauchst keine eigenen Funktion zu erstellen. Wenn der Besucher auf Allow clickt wird von Cookie Consent automatisch ein Cookie mit dem Wert allow erstellt und wenn der Besucher es ablehnt ein Cookie mit dem Wert deny.


    Bei dem Fenster musst du auch davon ausgehen, dass es jeder Seitenbesucher wegklicken kann. Oder du nimmst es als Pflichtschritt um deine Webseite betreten zu können, was ich jedoch nicht rate.


    Schöne Grüße

  • Morgen,


    reicht hier dein Code aus?


    Code
    1. let allowButton = document.getElementsByClassName("cc-allow");
    2. allowButton[0].addEventListener("click", function(){
    3. setCookie();
    4. });

    Ich bekomme bei "Anwendungen" noch immer kein Cookie angezeigt.


    viele Grüße

  • Du brauchst das alles doch nur zusammen bauen.

    So ungefähr , jenachdem was du genau vor hast mit den Besuchernamen

    https://codepen.io/basti1012/pen/KKVovZB?editors=1000

    kann ich den Namenseintrag auch irgendwie im Cookiepop-up machen?

    Das wäre schön. Der Name soll eigentlich nur kurz gespeichert werden. Also ich will ihn nicht verwenden.

    Aber warum kann ich bei "Anwendungen" immer noch keine Cookies sehen? Ich habe dein Beispiel genommen und auf der Seite konnte ich auch eines identifizieren. Nur bei meiner Seite nicht?!

  • Hey,


    Bei mir werden Cookies gesetzt.


    Liegt es daran, dass das Script geladen wird bevor die Seite komplett geladen ist?

    Füge mal bitte um den JavaScript Code den EventListener Load hinzu. In diesem führst du dann all deinen Code aus.


    Dieser EventListener wartet bis die Seite vollständig geladen ist und führt dann den Code der in diesem steht aus.


    Schöne Grüße

  • Den habe ich eigentlich gesetzt ..


  • versuche mal den load wegzumachen und dann

    Code
    1. document.addEventListener("DOMContentLoaded", function(event) {
    2. bla
    3. });

    zu nutzen.


    Wenn das auch nicht geht machst du zum testen einfach mal ein setTimeout rum

    Code
    1. setTimeout(function(){
    2. bla...
    3. },10000);

    dann siehst du ja was nach 10 Sekunden passiert

  • Du meinst neben den akzeptieren Button ?

    Klar.

    Man könnte das mit Javascript dazu fummeln , oder man bearbeitet das mitgelieferte Script was wahrscheinlich einfacher wäre, dann könnte man den anderen Code auch gleich da bearbeiten

    ich weiß gerade leider nicht, wie ich das umsetzen soll. Wie gesagt, ich bin noch nicht sehr fit mit Java Script.

  • Das ist der gesamte Script Code.

    In der Konsole wird nichts angezeigt, also keine Fehlermeldung

  • Hey,


    hast du denn auch die JS & CSS-Datei von Cookie Consent eingebunden?


    Code
    1. <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.css" />
    2. <script src="https://cdn.jsdelivr.net/npm/cookieconsent@3/build/cookieconsent.min.js" data-cfasync="false"></script>


    Außerdem:

    In der Funktion, des EventListeners Load, soll der ganze JavaScript Code liegen. Du hast immernoch 2 <script>-Tags.

    Wenn du alle Dateien (CSS & JS) korrekt einbindest und der ganze Code in der Funktion des EventListeners Load liegt läuft es. Siehe cookie.png.


    Schöne Grüße

  • mmmh, ja ist alles eingebunden.

    Trotzdem noch kein Cookie..