Using $location.protocol() and $location.host() in Vuejs application

Question

I have one application in angularJs where I use $location.protocol() + '://' + $location.host() when I'm dealing with API calls.

Example:

return $http({
    method: 'GET',
    url: $location.protocol() + '://' + $location.host() + '/rest/api/category/category',
    headers: {
        'Jwt-token': store.get('jwt')
    }
})

Now I'm building another application in VUEjs and i also wan't to use same "$location" logic to call API, but I don't know how.

My current implementation is hardcoding url

Example:

getCategories() {
    fetch(`http://myapp.test/rest/api/category/category`, {
        method: 'GET'
    })
    .then(response => response.json())
    .then(json => this.categories = json)
}

How to properly "translate/convert" the code ($location.protocol() + '://' + $location.host()) from my Angular app to VueJs? If you need any additional information's please let me know and I will provide! Thank you!

Answer 1

Use can use the DOM api inside Vue applications:

• document.location.protocol for protocol
• document.location.host for the current host
• or just document.location.origin for protocol+'://'+host