MagicMirror Forum
    • Recent
    • Tags
    • Unsolved
    • Solved
    • MagicMirror² Repository
    • Documentation
    • 3rd-Party-Modules
    • Donate
    • Discord
    • Register
    • Login
    A New Chapter for MagicMirror: The Community Takes the Lead
    Read the statement by Michael Teeuw here.

    Module to Display JSON data from a FILE

    Scheduled Pinned Locked Moved Solved Requests
    21 Posts 3 Posters 5.5k Views 3 Watching
    Loading More Posts
    • Oldest to Newest
    • Newest to Oldest
    • Most Votes
    Reply
    • Reply as topic
    Log in to reply
    This topic has been deleted. Only users with topic management privileges can see it.
    • S Offline
      sdetweil @mhr320
      last edited by sdetweil

      @mhr320 there are at least 3 in the 3rd party list

      you will have to load the file via
      http://localhost:mm_port/… file
      file has to be in the MagicMirror folder tree
      you could use file links to reference a file outside the MagicMirror folder tree

      go to the 3rd party list (in the menu) and put json in the search field

      Sam

      How to add modules

      learning how to use browser developers window for css changes

      1 Reply Last reply Reply Quote 0
      • M Offline
        mhr320 @mhr320
        last edited by

        Thank you for replying. I forgot to put in my post I had searched for this type of module already, by simply searching for json on the modules page. I attempted exactly what you suggested with no results.

        The top of my config file looks like this:

        let config = {
        	address: "0.0.0.0", 	
        	port: 8081,
        	basePath: "/", 	
        	ipWhitelist: [], 
        
        	useHttps: false, 	
        	httpsPrivateKey: "", 
        	httpsCertificate: "", 
        
        	language: "en",
        	locale: "en-US",
        	logLevel: ["INFO", "LOG", "WARN", "ERROR"],
        	timeFormat: 12,
        	units: "imperial",
        

        I have attempted on four different modules [
        MMM-ValuesByNotification,
        MMM-JsonTable,
        MMM-JsonValue,
        MMM-json]

        using all of these paths plus other variations with no loading of localhost json data:

        "http://localhost:8081/MagicMirror/modules/file.json"
        "http://localhost:8081/modules/file.json"
        "localhost:8081/MagicMirror/modules/file.json"
        "localhost:8081/modules/file.json"
        
        "http://0.0.0.0:8081/MagicMirror/modules/file.json"
        "http://0.0.0.0:8081/modules/file.json"
        "0.0.0.0:8081/MagicMirror/modules/file.json"
        "0.0.0.0:8081/modules/file.json"
        

        Respectfully, thank you to anyone who provides advice or help.

        S 1 Reply Last reply Reply Quote 0
        • S Offline
          sdetweil @mhr320
          last edited by

          @mhr320 ok, I put a file in MagicMirror/modules
          fribble.json

          {
           "items":[ {"test":"foo","xyz":"test"}]
          }
          

          and used this URL

          http://localhost:8090/modules/fribble.json
          

          and got this
          Screenshot at 2025-05-21 12-07-02.png

          so the path works…

          using this JsonTable module,
          then config would be

          {
            module: 'MMM-JsonTable',
            position: 'top_right',
            header: 'HouseDB Sevensegment',
            config: {
              url: 'http://localhost:8090/modules/fribble.json', // Required
              arrayName: 'items' // Optional
            }
          }
          

          and got this
          Screenshot at 2025-05-21 12-07-58.png

          Sam

          How to add modules

          learning how to use browser developers window for css changes

          S M 2 Replies Last reply Reply Quote 0
          • S Offline
            sdetweil @sdetweil
            last edited by sdetweil

            @mhr320 JsonTable expects a different format…

            I didn’t try the others… some are more flexible, some not

            i did not try with your data

            Sam

            How to add modules

            learning how to use browser developers window for css changes

            M 1 Reply Last reply Reply Quote 0
            • M Offline
              mhr320 @sdetweil
              last edited by

              @sdetweil Ok, I’ll get back to trying it, I must have messed up an entry somewhere.

              1 Reply Last reply Reply Quote 0
              • M Offline
                mhr320 @sdetweil
                last edited by

                @sdetweil So the path does indeed work, what was preventing me from seeing the data was the arrayName in the config. That does have to be set regardless of it saying it is optional.

                So that problem is solved, do you think I can solve the sharing of screen time for each of the three array’s in the json file via css or will that take some javascript? That was really what was important because the information is for my three kids and they each attend a different school.

                I really appreciate your help and patience.

                S M 2 Replies Last reply Reply Quote 0
                • S Offline
                  sdetweil @mhr320
                  last edited by

                  @mhr320 yes , the arrayName has to be set. had the same problem

                  sharing

                  well that gets a bit more complicated . this module doesnt support multiple instances w different urls.

                  if it did, then you could make three files or use different arrayName settings

                  then you could also use mmm-pages and display 1 each per child

                  i can add that support later tonight, pretty easy but. have grandson duty for a while

                  Sam

                  How to add modules

                  learning how to use browser developers window for css changes

                  1 Reply Last reply Reply Quote 0
                  • M Offline
                    mhr320 @mhr320
                    last edited by

                    Enjoy the grandson, i am of no importance! Thank you!

                    S M 2 Replies Last reply Reply Quote 0
                    • S Offline
                      sdetweil @mhr320
                      last edited by

                      @mhr320 rename the MMM-JsonTable folder out of the way
                      and

                      cd ~/MagicMirror/modules
                      git clone https://github.com/sdetweil/MMM-JsonTable.git
                      cd MMM-JsonTable
                      git checkout multiinstance
                      npm install
                      

                      then in config.js
                      you can have multiple instances with the same url
                      and different arrayName (even the same,…)

                      then if you use MMM-Pages

                         {
                              module: "MMM-pages",
                              config: {
                                  rotationTime: 1000 * 20,         // rotate every 20 seconds
                                  modules: [
                                      ["family"],                // page 1
                                      ["kid1 name"], // page 2
                                      ["kid2 name"], // page 3
                                      ["kid3 name"], // page 4
                                  ],
                                  fixed: [                         // modules that are always shown
                                             "fixed"
                                  ],
                              }
                          },
                      

                      then on each other module
                      add, after the module: line
                      classes:“xxxx”
                      xxxx one of the names above, family, kid1, kid2, kid3
                      for modules on every page use classes:“fixed”

                      above config has 20 seconds on each page… you can change that

                      Sam

                      How to add modules

                      learning how to use browser developers window for css changes

                      1 Reply Last reply Reply Quote 0
                      • M Offline
                        mhr320 @mhr320
                        last edited by

                        Absolutely Brilliant! Since I downloaded the multi-instance version of MMM-JsonTable from you, I assume it will not be available when updating. I will diff the original from yours and learn what you did to make it multi-instance and send that off to the author of MMM-JsonTable as a feature request. I really appreciate your help. It was nice to have a pleasant experience in a forum for a change, does not always go that way.

                        S 2 Replies Last reply Reply Quote 0
                        • M mhr320 has marked this topic as solved on
                        • M mhr320 has marked this topic as solved on
                        • S Offline
                          sdetweil @mhr320
                          last edited by

                          @mhr320 I submitted pull request
                          https://github.com/timdows/MMM-JsonTable/pull/98

                          Sam

                          How to add modules

                          learning how to use browser developers window for css changes

                          S 1 Reply Last reply Reply Quote 0
                          • S Offline
                            sdetweil @mhr320
                            last edited by

                            @mhr320 said in Module to Display JSON data from a FILE:

                            It was nice to have a pleasant experience in a forum for a change, does not always go that way.

                            I am glad to hear that it worked out, and sad to hear the other.
                            as the moderator here, I am interested in feedback on how to make it better most of the time…

                            Sam

                            How to add modules

                            learning how to use browser developers window for css changes

                            M 2 Replies Last reply Reply Quote 0
                            • M Offline
                              mhr320 @sdetweil
                              last edited by

                              @sdetweil Hard to say how to improve things from our interaction. 5/5 Stars. I am new-ish to actively using this forum and wanted to give you props for your efforts, not sure if I did through any formal process, I tried to show the answer as the solution and attempted to upvote, but not sure if I did. But if you are the mod and jumped in to help me, that is a great way to make the forum better. Take care and enjoy the grandchild!

                              S 2 Replies Last reply Reply Quote 1
                              • S Offline
                                sdetweil @mhr320
                                last edited by

                                @mhr320 no… you said in " a " forum for a change, does not always go that way.

                                I wanted to know what that was… was that HERE?

                                we try hard to make sure everyone gets supported in some way

                                Sam

                                How to add modules

                                learning how to use browser developers window for css changes

                                1 Reply Last reply Reply Quote 0
                                • S Offline
                                  sdetweil @mhr320
                                  last edited by

                                  @mhr320 said in Module to Display JSON data from a FILE:

                                  and attempted to upvote, but not sure if I did

                                  upvote/downvote are restricted to user that have reputation 2 or above (means someone liked/upvoted your contribution twice)
                                  this was we know reputation is not tainted with transient (mostly down) voters…

                                  same as having all posts reviewed before live posting, til you rep is 2 or above.

                                  Sam

                                  How to add modules

                                  learning how to use browser developers window for css changes

                                  1 Reply Last reply Reply Quote 0
                                  • M Offline
                                    mhr320 @sdetweil
                                    last edited by

                                    @sdetweil Oh, in “a forum” was relative to another forum, this is the first time, in a long time, i’ve used this forum. HERE has been great every time so far, sorry for the misunderstanding.

                                    M 1 Reply Last reply Reply Quote 1
                                    • S Offline
                                      sdetweil @sdetweil
                                      last edited by

                                      @mhr320 the author accepted my change request

                                      so you could go to the old folder (if you just renamed it) and git pull to get the update
                                      then swap(rename) the folders and retry with his code again
                                      and then delete mine

                                      Sam

                                      How to add modules

                                      learning how to use browser developers window for css changes

                                      T 1 Reply Last reply Reply Quote 0
                                      • M Offline
                                        mhr320 @mhr320
                                        last edited by

                                        Whoa, that was fast on both of your parts. I went to his github page and saw several old open “issues” i figured he’d be asleep on the project, but wow! It worked, great job sir! I really look forward to my next issue.

                                        1 Reply Last reply Reply Quote 0
                                        • T Offline
                                          timdows @sdetweil
                                          last edited by

                                          @sdetweil

                                          Thanks for the PR

                                          Just approved the it, it did fail some prittier checks that I’ll fix later
                                          Hope you’ll find it usefull over here!

                                          https://github.com/timdows/MMM-JsonTable

                                          S 1 Reply Last reply Reply Quote 0
                                          • S Offline
                                            sdetweil @timdows
                                            last edited by sdetweil

                                            @timdows you should add a git pre-commit hook to run prettier for whoever…

                                            here is mine
                                            .pre-commit

                                            #!/bin/sh
                                            FILES=$(git diff --cached --name-only --diff-filter=ACMR "*.js" "*.jsx *.json" | sed 's| |\\ |g')
                                            [ -z "$FILES" ] && exit 0
                                            
                                            # Prettify all selected files
                                            echo "$FILES" | xargs ./node_modules/.bin/prettier --write
                                            
                                            # Add back the modified/prettified files to staging
                                            echo "$FILES" | xargs git add
                                            
                                            exit 0
                                            

                                            and an npm postinstall script to copy to the git folder

                                            #!/bin/bash
                                            #echo copying git pre-commit hook 
                                            cp .pre-commit .git/hooks
                                            

                                            package.json

                                              "scripts": {
                                                "postinstall":"whatever you call it"
                                            

                                            Sam

                                            How to add modules

                                            learning how to use browser developers window for css changes

                                            1 Reply Last reply Reply Quote 0

                                            Hello! It looks like you're interested in this conversation, but you don't have an account yet.

                                            Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.

                                            With your input, this post could be even better 💗

                                            Register Login
                                            • 1
                                            • 2
                                            • 1 / 2
                                            • First post
                                              Last post
                                            Enjoying MagicMirror? Please consider a donation!
                                            MagicMirror created by Michael Teeuw.
                                            Forum managed by Sam, technical setup by Karsten.
                                            This forum is using NodeBB as its core | Contributors
                                            Contact | Privacy Policy