Vue-resource: How can i use the options.root

[Rachelin]

Hi, I set the global option of root, Vue.http.options.root = 'www.domain.net', then i could get the value in the whole project. ok.
While I think that this will help me to add the root to url automatically. Like this code, finally, i could get the url is " http://www.domain.net/differentPartUrl?token=123".

this.$http.get('/differentPartUrl',   {token: '123'}).then((response) => {
            // success callback
        }, (response) => {
            // error callback
            console.log(response)
        }) 

But I tried several times, all failed. It can't help me. In the end, the path is like this "/differentPartUrl".

So I have to set the whole url by myself , like the below：

this.$http.get(this.$http.options.root + '/someUrl?token=123').then((response) => {
            // success callback
        }, (response) => {
            // error callback
            console.log(response)
        })

Luckily, it could work. But I not feel satisfactory, i want to know more.

[nilgradisnik]

I was having the same issue but it turns out if you use protocol prefix http:// or https://, root will be ignored some some reason. See here.

Not sure what the logic behind this limitation is though.

[nilgradisnik]

Actually that's not true, it doesn't work even without the protocol. Seems like a bug.

[LinusBorg]

Not a bug.

When using the root option, don't use a slash at the beginning. Using a slash indicated it should go to <currentdomain>/path

wrong:

this.$http.get('/differentPartUrl',   {token: '123'}).then((response) => {

right:

this.$http.get('differentPartUrl',   {token: '123'}).then((response) => {

[Rachelin]

Yes, thanks @LinusBorg

[airtonix]

not using a slash, url is still going to same domain as client. ergo Vue.http.options.root is being ignored.

With mythical client on http://troll.lullz/ I've tried:

Vue.http.options.root = 'http://foo.io/api/`;
Vue.http.get('baz', handlers.Baz);
// results in request to http://troll.lullz/baz

Vue.http.options.root = 'http://foo.io/api/`;
Vue.http.get('/baz', handlers.Baz);
// results in request to http://troll.lullz//baz

So looks like i'm going to have to do this:

Vue.http.get(`${process.env.API_ROOT}/baz`, handlers.Baz);
// results in request to http://foo.io/api/baz

[LinusBorg]

There is either a typo or the API changed: Vue.url.options.root = ... works.

https://jsfiddle.net/Linusborg/nkx2j0jv/

I'll send in a Pull request later top updater the docs.