Salvatore Raccardi
Salvatore Raccardi

Reputation: 57

Vue does not read the API

I'm making an application with Vue that has to read a bee in real time to get some data. The problem is that it can not read the API data.

With this API it works: API google

With what I did not do: ip my vps = 0.0.0.0 0.0.0.0/api/value

if I try to search for ip using Google Chrome, the data appears. I would like to understand what I am wrong

Template App.vue

 <template>
     <div>
        <h2>{{value}}</h2>
     </div>
   </template>

Script App.vue

Vue.axios.get('IP-MY-VPS/api/value').then((response) => { this.value = response.data; })

<script>
// Imports
import Vue from 'vue'
import axios from 'axios'
import VueAxios from 'vue-axios'

Vue.use(VueAxios, axios)


export default {
    data () {
        return {
               value: ''
        }
    },
    created: function() {
        this.loadQuote();
    },
    methods: {
        loadQuote: function(){
            this.value = ' '
            Vue.axios.get('0.0.0.0/api/value').then((response) => {
               this.value = response.data;
            })
        .catch(function (error){
            this.value = 'Error! ' + error;   
        })
      }
    }
}
</script>

Upvotes: 0

Views: 151

Answers (1)

Manikas
Manikas

Reputation: 31

Best practice is to include http or https protocol.

Also, when running a local server, axios sometimes try to access wrong port. So please try:

Vue.axios.get('http://0.0.0.0:80/api/value').then((response) => {
  this.value = response.data;
})

Upvotes: 2

Related Questions