Uncaught (in promise) TypeError: Cannot read property 'protocol' of undefined

I have an error trying to move the request URL into a separate file called service.js

If i make the request directly in the file that also displays the data - reports.vue with the code below the data is retrieved successful and displays

import axios from 'axios'

const API_URL = 'http://localhost:5000/reports/'

   export default {
    data(){
      return{
        reports: []
      }
    },

    created: function()
    {
      this.fetchItems()
    },

    methods: {
      fetchItems()
      {
        axios.get(API_URL).then((response) => {
          this.reports = response.data
        });
      },

but if I move the BASE_URL to a service.js file the data is not retrieved and the error is

Uncaught (in promise) TypeError: Cannot read property 'protocol' of undefined
isURLSameOrigin.js?3934:57 Uncaught (in promise) TypeError: Cannot read property 'protocol' of undefined
    at isURLSameOrigin (isURLSameOrigin.js?3934:57)
    at dispatchXhrRequest (xhr.js?b50d:109)
    at new Promise (<anonymous>)
    at xhrAdapter (xhr.js?b50d:12)
    at dispatchRequest (dispatchRequest.js?5270:59)

The request looks like

import ReportService from '../ReportService'
import axios from 'axios'

  export default {
    data(){
      return{
        reports: []
      }
    },

    created: function()
    {
      this.fetchItems()
    },

    methods: {
      fetchItems()
      {
        axios.get(ReportService.API_URL).then((response) => {
          this.reports = response.data
        });
      },

any help on the error would be appreciated!

I have same error! Know I try to find decision and if I do it I say u!

GuyyyyyyyyyyyyyyyyyyyyyyyyyYYYYYYYYYYYYYYYYYYYYYYYYYYYyyyyyyyyyyyyyyyyyyyyyyyyyyyS

just use this 4 line code and DONE !

import Vue from ‘vue’
import axios from ‘axios’
import VueAxios from ‘vue-axios’ ### this line is important for destroy :slight_smile: ‘protocol’ ERROR ###

Vue.use(VueAxios, axios)

.
.
.
JUST DO THIS !!!

1 Like

thanks!!
Tip:
Also I realized that my app only works fine with “vue-axios”: “^2.1.5” version