How to get Json data from backend node js to frontend html

Question

From the below code, I am trying to access the JSON data to display on frontend screen. I exported it in node js and trying to import it in script tag in frontend html but I am not getting the data. Is there any way to access this data?

  
        app.post('/login', async (req, res) => {

        let payload = {
           "params":{"db":"ExampleDB","login":req.body.email, "password":req.body.password}
            };
        let result = await axios.post('http://example.net:8088/authenticate', payload);
                             
                        
            try{
            if (result.data.result.message = 'success') {
                res.sendFile(path.join(__dirname,'./public/timesheets.html'))
                if (result.data.result.data.is_officer == true){
                    flag = 1;
                }
               
            }
           
        }
        catch(ex){
            res.send(`<div align ='center'></div><br><br><br><div align ='center'><a 
          href='./login.html'>Invalid Email or Password Please try again</a></div><br><br> 
       <div align='center'></div>`);
        }
        
        
    
});

I am trying to fetch this json data is_officer into my frontend html code. How can I get this data in the frontend? The json api response is as follow

   {

    "jsonrpc": "2.0",

    "id": null,

    "result": {

        "message": "Success",

        "code": 200,

        "data": {     

           "is_officer": true,

            "department_id": [

                false,

                false

            ]

        }

    }

}

What line of code need to write in node js and html to get this on the frontend html?

Answer 1

use Axios to bring JSON from backend to front end

official website: https://axios-http.com/

Cdn: https://cdn.jsdelivr.net/npm/axios/dist/axios.min.js

import axios from "axios";
axios.get('/users')
  .then(res => {
    console.log(res.data);
  });```