I've been unable to successfully pull the popular timeline from vine using JQuery to make the REST call.
When I used this code :
$.ajax({
type: "GET",
crossDomain: true,
dataType: "json",
url: "https://api.vineapp.com/timelines/popular",
success: function(data){
document.getElementById("#site-wrapper").innerText=data;
},
error: function(jqXHR, textStatus, errorThrown){
var json = JSON.stringify(jqXHR, null, 4);
document.getElementById("#site-wrapper").innerText=json;
}
});
I get this error:
XMLHttpRequest cannot load https://api.vineapp.com/timelines/popular. No 'Access-Control-Allow-Origin' header is present on the requested resource.
After a bit of research I found about the cross domain issue and to make a long story short I ended up changing the code to this.
New code:
$.ajax({
type: "GET",
dataType: "jsonp", //changed data type to jsonp
url: "https://api.vineapp.com/timelines/popular",
success: function(data){
poke = data;
document.getElementById("#site-wrapper").innerText=data;
},
error: function(jqXHR, textStatus, errorThrown){
poke = jqXHR;
var json = JSON.stringify(jqXHR, null, 4);
document.getElementById("#site-wrapper").innerText=json;
}
});
This change allowed me to get past the cross domain issue but introduced this error:
Uncaught SyntaxError: Unexpected token :
Now I understand why I got this error. Its due to the fact that Vine returns JSON data not JSONP data(which i understand is basically JSON but wrapped around a function or something).
Is there a away to fix the cross domain issue while also returning JSON data? I've tried different variations of making this call and non of them work. Any help would be awesome, thanks in advance.
Vine has released an oEmbed API
It states:
Unfortunately it seems JSONP is not supported. Using a server side proxy is a valid alternative (well Twitter, Vine owner, suggests this approach).