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!

Why don't you just use relative urls fetch('/rest/api/category/category')? — nemesv
– nemesv, Commented Dec 29, 2017 at 12:33
Use any of these: (1) relative URLs, (2) Protocol relative URLs (ex: //myapp.test/rest/api/category/category) or (3) window.location.protocol + "://" + window.location.host — Manish
– Manish, Commented Dec 29, 2017 at 12:35
Because this VUE app is running via npm run dev (so localhost:8080), other REST api application is currently runed via MAMP (so via virtualhost myapp.test) — Valor_
– Valor_, Commented Dec 29, 2017 at 12:36

dvnguyen · Accepted Answer · 2017-12-29 12:39:25Z

13

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

edited Dec 29, 2017 at 12:39

answered Dec 29, 2017 at 12:35

dvnguyen

3,0301 gold badge20 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

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

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related