Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

Faire une base de données locale


Sujet :

JavaScript

  1. #1
    Rédacteur/Modérateur

    Faire une base de données locale
    la communauté,


    J'espère tout d'abord que tout le monde va bien.

    Voici mon petit problème : je me suis fait une page web très simple qui n'est destinée qu'à fonctionner en local. Dans cette page, j'ai un formulaire lui aussi très simple avec 4 ou 5 <input>.
    A coté de cette page, je souhaite avoir un fichier comportant une liste de meubles (chaise, bureau, table, ...) ainsi que leurs principales caractéristiques (hauteur, largeur, poids, matériaux, ...).

    L'idée, vous l'aurez compris, est de lister les meubles qui répondront aux critères renseigner dans le formulaire. Le tout devant rester local.
    Je me demande alors quelle pourrait être la meilleure façon de faire ceci.

    Dans l'absolu si je pouvais avoir une base sqlite et lancer des requêtes SQL je serai le roi du monde. Mais sans serveur je crois que c'est mal barré.
    J'ai pensé à de l'AJAX, mais le protocole file n'est pas pris en charge (à moins de lancer chrome d'une certaine manière et j'ai pas encore envisagé ceci).
    Plus largement consulter un fichier XML ou JSON mais j'aurai le même souci qu'AJAX non ?

    Pour le moment, la seule solution que je vois, c'est de tout mettre sous forme de tableau dans un autre fichier JS et de me palucher une belle fonction de recherche. Mais je me dis aussi que je passe peut-être à coté de quelque chose de plus simple.

    Avez-vous une astuce ?


    D'avance merci à tous.


    Bye.

    J
    Initiation à Qt Quick et QML : Partie 1 - Partie 2
    En cas de besoin, pensez à la
    Mon site et mes tutoriaux sur Developpez.com
    Pas de question technique par MP... Les forums sont là pour ça

  2. #2
    Membre expert
    salut,

    le plus simple que je vois, c'est in input type = file, et tu vas chercher un .json
    une fois le fichier "recupere" par le navigateur, tu peux en faire ce que tu veux, et donc le parser et le sauvegarder dans le localstorage (par exemple, si tu ne veux pas aller chercher le fichier.json a chaque refresh)

    [edit]
    j'ai fais un petit script d'exemple
    fichier .json :
    Code json :Sélectionner tout -Visualiser dans une fenêtre à part
    1
    2
    3
    {
    "toto":"youpi"
    }

    input
    Code html :Sélectionner tout -Visualiser dans une fenêtre à part
    <input type="file" accept=".json" onchange="loadFile(event)">

    script
    Code javascript :Sélectionner tout -Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    function loadFile(e) {
            const input = e.target;
            const fr = new FileReader();
            fr.readAsText(input.files[0]);
            fr.onload = () => {
                console.log(JSON.parse(fr.result));
                //sauvegarde dans le localstorage
            };
        }
    La forme des pyramides prouve que l'Homme a toujours tendance a en faire de moins en moins.

    Venez discuter sur le Chat de Développez !

  3. #3
    Rédacteur/Modérateur




    Avant tout désolé pour la réponse un peu tardive et surtout merci beaucoup pour ton aide.
    Cette façon de faire est assez proche de ce que j'avais en tête en chargeant un objet Javascript, solution que je voulais mettre un peu de coté car pour moi un *.js n'est pas là pour stocker des data comme à la mode JSON ou XML.

    Ce qui me gène par contre c'est le fait de devoir charger manuellement le fichier JSON. Il y a des manières de rendre ça +/- automatique mais ça rajoute quelques lignes de codes. Rien d'extraordinaire, mais je veux rester le plus concis possible.

    Dans un premier temps je vais donc peut-être revenir sur l'idée de mettre mes data dans un dictionnaire lui-même stocké dans un *.js à part. C'est un peu dérouter le truc, mais bon.


    Juste au cas où, plutôt que d'utiliser des document.getElementById ou JQuery pour rendre cette page web un tant soit peu dynamique, j'utilise Vue.js (V3). J'ai parcouru rapidement la doc en espérant trouver quelque chose dans l'API de Vue pour la lecture de fichier locaux mais rien. Si jamais je suis passé à coté d'un truc qui te sauterai aux yeux n'hésite pas .

    Une nouvelle fois merci à toi, car dans tous les cas, ton petit bout de code va me servir pour un autre projet .

    [EDIT]
    En farfouillant sur la toile, je suis tombé là-dessus... ça semble assez correspondre à mes besoins. D'autant que je n'aurai jamais 10 000 enregistrement dans ma base .

    Quelqu'un a un retour sur les dernières versions ?


    Ciao.


    J
    Initiation à Qt Quick et QML : Partie 1 - Partie 2
    En cas de besoin, pensez à la
    Mon site et mes tutoriaux sur Developpez.com
    Pas de question technique par MP... Les forums sont là pour ça

###raw>template_hook.ano_emploi###