Site d'echange de texte en ligne sans authentifictaion

Just1bidon Messages postés 5 Date d'inscription   Statut Membre Dernière intervention   -  
 toto -

Bonjour,

Je cherche à faire un site avec une zone de texte dans laquelle tout le monde pourrais écrire/effacer ce qu'il y a écrit dedans. Mais je voudrais donc que n'importe qui qui ce connecte depuis son appareil puisse écrire sans restriction. Voici mon code actuel :

<!DOCTYPE html>
<html>
<head>
  <title>Zone de texte synchronisée avec Firebase</title>
</head>
<body>
  <textarea id="myTextArea" rows="4" cols="50"></textarea>
  <button onclick="saveText()">Enregistrer</button>

  <script type="module">
    // Import the functions you need from the SDKs you need
    import { initializeApp } from "https://www.gstatic.com/firebasejs/9.22.1/firebase-app.js";
    import { getAnalytics } from "https://www.gstatic.com/firebasejs/9.22.1/firebase-analytics.js";

    // Your web app's Firebase configuration
    // For Firebase JS SDK v7.20.0 and later, measurementId is optional
    const firebaseConfig = {
      apiKey: "VOTRE_API_KEY",
      authDomain: "VOTRE_AUTH_DOMAIN",
      projectId: "VOTRE_PROJECT_ID",
      storageBucket: "VOTRE_STORAGE_BUCKET",
      messagingSenderId: "VOTRE_MESSAGING_SENDER_ID",
      appId: "VOTRE_APP_ID",
      measurementId: "VOTRE_MEASUREMENT_ID"
    };

    // Initialize Firebase
    const app = initializeApp(firebaseConfig);
    const analytics = getAnalytics(app);

    // Référence à la base de données de Firebase
    const database = app.database();
    const textRef = database.ref('savedText');

    // Récupérer le contenu du texte enregistré depuis la base de données
    textRef.on('value', function(snapshot) {
      const savedText = snapshot.val();
      if (savedText) {
        document.getElementById('myTextArea').value = savedText;
      }
    });

    // Enregistrer le contenu de la zone de texte dans la base de données
    function saveText() {
      const text = document.getElementById('myTextArea').value;
      textRef.set(text)
        .then(function() {
          alert("Le texte a été enregistré avec succès !");
        })
        .catch(function(error) {
          console.log(error);
        });
    }
  </script>
</body>
</html>

J'utilise netlify pour mettre en ligne mon site, et firebase pour avoir une base donnée.

Le problème actuel est que lorsque j'écris du texte dans la zone et que j'enregistre, le texte ne se réaffiche pas si j'actualise la page.

Je ne sais pas si mon message est très clair mais merci de votre aide

PS : bien évidemment les clés comme « VOTRE_API_KEY » sont modifiées par les valeurs que firebase me donne

A voir également:

1 réponse

Réponse 1 / 1
toto
 

Salut,

non pas très clair votre question. Si vous voulez que quelque chose soit enregistré/persiste sur votre site il faudra utiliser une base de données qui est la seule solution valable pour enregistrer quelque chose et le fournir ensuite au réseau.

C'est même cette partie là qui est la plus importante car la base du site, voir aussi ce qu'est un système d'information.

Pour plus de généralités regardez le fonctionnement des pages dynamiques et l'architecture 3 tiers qui est la norme(et seule possibilité réelle) pour les pages web:

https://fr.wikipedia.org/wiki/Page_web_dynamique

https://fr.wikipedia.org/wiki/Architecture_trois_tiers

Ce qui implique donc :

Une partie statique et locale: HTML/CSS, JavaScript éventuellement pour l'interactivité

Une partie programme serveur: qui va faire la liaison entre la page et la base de données, concrétement fournir les données à afficher dans la page et à enregistrer sur la base de données.

Une partie base de données: On parle avant tout de définir un modèle conceptuel de données(MCD) qui permet d'organiser des entités ou regroupement fonctionnel. Puis de le mettre en oeuvre dans un modèle logique de données(MLD qui correspond au tables de données)

Si vous ne vous sentez pas d'apprendre à faire par vous-même l'analyse et la conception d'un système d'information et les langages associés(SQL, PHP par exmeple)commencez par comprendre les principes de base du web et pages web et ensuite aller faire un tour du côté des CMS comme Wordpress qui font ça très bien d'où leur nom(Content Management System ou en français : système de gestion de contenus).
-1

Discussions similaires

C'est quoi le site qui remplace coco chat
TP3 -
bazfile -

2 réponses