[Vuejs]-"data" field not populated in axios response from express server

1๐Ÿ‘

I am not clear whether you are not getting axios response or response from your node server. If you have problem in getting axios response here is the code.

I have used request npm for making a get request.

const request = require('request');

apiUrl = "http://gentle-bastion-49098.herokuapp.com/api/filters"

request.get(
    {
        url: apiUrl,
        json: true
    },
    function (error, response, body) {
        if (error) {
            console.log("Error Occurred :", error);
        }
        console.log("Response Data :", body)

    }
);

The above code will give you response as :

{
   "ID":"CONV_DATA@IVA",
   "ApplicationName":"InterationsView",
   "Type":"FILT_DETAIL",
   "filters":[
      {
         "Name":"ChannelType",
         "Values":[
            "Phone",
            "Web-Chat",
            "Google-Assistant"
         ]
      },
      {
         "Name":"sessionType",
         "Values":[
            "nlu-voice",
            "nlu-text"
         ]
      },
      {
         "Name":"Direction",
         "Values":[
            "In"
         ]
      },
      {
         "Name":"Status",
         "Values":[
            "Complete",
            "Started"
         ]
      },
      {
         "Name":"statusReason",
         "Values":[
            "END"
         ]
      }
   ],
   "minDuration":9.7,
   "maxDuration":154.2,
   "minData":"2019-08-29T22:28:47.029UTC",
   "maxDate":"2019-08-29T22:28:49.578UTC"
}

which is same as what you get in browser when you visit the link http://gentle-bastion-49098.herokuapp.com/api/filters

If you are using axios the code will be :

const axios = require('axios');

apiUrl = "http://gentle-bastion-49098.herokuapp.com/api/filters"

axios.get(apiUrl)
    .then(function (response) {
        console.log("Response Data :", response.data);
    })
    .catch(function (error) {
        console.log("Error Occurred :", error);
    })

and it will give same response as above.

Even your written code is giving response :

Response Screenshot

๐Ÿ‘คVipulw

0๐Ÿ‘

Try with these changes:

 getFilterData().then(response => {
          console.log('filter', response.data)
 })
  .catch(err => {
          alert('Could not get filters ' + err.message.toString())
 })

In your server code, send the response back to client using res.send() as shown below:

 app.get('/api/filters', function(req, res) {
    let filtersResponse = {
        "ID": "CONV_DATA@IVA",
        "ApplicationName": "InterationsView",
        "Type": "FILT_DETAIL",
        "filters": [{
                "Name": "ChannelType",
                "Values": uniqueFilters.ChannelType,
            },
            {
                "Name": "sessionType",
                "Values": uniqueFilters.sessionType,
            },
            {
                "Name": "Direction",
                "Values": uniqueFilters.Direction,
            },
            {
                "Name": "Status",
                "Values": uniqueFilters.Status,
            },
            {
                "Name": "statusReason",
                "Values": uniqueFilters.statusReason,
            },
        ],
        "minDuration": uniqueFilters.minDuration,
        "maxDuration": uniqueFilters.maxDuration,
        "minData": "2019-08-29T22:28:47.029UTC",
        "maxDate": "2019-08-29T22:28:49.578UTC"
    };

    // Respond with filters
 res.send(
    filtersResponse
  )
 });

Leave a comment