Vue.js + Vue Resource No 'Access-Control-Allow-Origin'

Question

Cross site ajax request with Vue.js 1.0 and Vue Resource. I get the following error: XMLHttpRequest cannot load http://dev.markitondemand.com/MODApis/Api/v2/Lookup/jsonp?input=NFLX&callback=handleResponse. No 'Access-Control-Allow-Origin' header is present on the requested resource.

I have a basic understanding of the problem but not sure how to add a callback function with the request or if that is the best solution for this example. I put in the full request URL here just to make it easier to follow.

new Vue({
    el: '#stockList',

    data: function() {
        return {
            query: '',
            stocks: []
        };
      },

    ready: function() {
      this.getStocks();

      },

    methods: {
        getStocks: function() {
            this.$http.get('http://dev.markitondemand.com/MODApis/Api/v2/Lookup/jsonp?input=NFLX&callback=handleResponse',
                function(data) {
                  this.stocks = data;
                }
            );
        }
    }
})

Answer 1

I have almost zero understanding of networking, but I was able to get several remote apis to work using:

this.$http.jsonp

instead of

this.$http.get