1

In my database, I got some data that has different media_types. video or image. The one that has the media type video, is altered to image when recieved in Axios get method. To pinpoint the error, I did try with both Angular 7 and Postman, and both of them recieves the correct JSON.

I have a SpringBoot microservice that fetches the daily imahe from the NASA rest API. Stores it in a MongoDB. All the images render perfectly in my own client (Vue), but the video does not show up. Some debugging later, I noticed that it doesn't show up, as it is tagged image instead of a video. I use a v-if / v-else on rendering correct type of html tag ( img or iframe ). To rule out that it is Vue or my SpringBoot application, I did try with Postman, and the JSON from the backend was perfect. I then did try with an Angular 7 project, and yet again, the media type was correct. In Axios, when I console logged the response, it stands image in the media type, and I just don't understand why it is altered or where it gets altered. 

getAll: () => instance.get('dailyimage/').then((response) => {
        console.log(response.data);
        return response.data;
    }),

Axios outcom: Axios outcome

Angular outcome: Angular outcome

The expected result would be that in Axios I still have the media_type correct and not changed as it is now. There is no error messages either which is even harder to know what have happened.

t.niese
  • 39,256
  • 9
  • 74
  • 101
Bjorn Kristensson
  • 55
  • 1
  • 1
  • 6
  • 2
    The `__ob__` in your `Axios` indicates that this data is already processed by Vue. So the reason `media_type` is `image` instead of `video` is most likely related to some code you have written in your Vue component. At some point in your code you probably write `media_type = 'image'` instead of `media_type == 'image'`. (`console.log(response.data)` shows the content of the object at the time you click the arrow and not of the time when it `console.log` was called. See: [console.log() shows the changed value of a variable ...](https://stackoverflow.com/questions/11284663)) – t.niese Aug 24 '19 at 18:04
  • @t.niese Thank you for that kick in the right direction. Found that error in my v-if. Now it worked prefectly. You saved my day here :) – Bjorn Kristensson Aug 24 '19 at 18:09
  • If you want to inspect the value at the point of `console.log(response.data)` you either need to set a breakpoint using the debugger of the browsers dev tools. Or write `debugger` to programmatically trigger a breakpoint. ( `console.log(response.data); debugger;`) That will save you from false assumptions about the content of a variable. – t.niese Aug 24 '19 at 18:19

0 Answers0