[javascript-only] How to get twitter profile image content (not url)


#1

Hello,

I am working on a page, and i must retrieve the user’s profile image from js, client side. I want the image content so i can use it within canvas.

After searching the docs it seems i cannot retrieve a profile image using pure js client site.
The reason is cross domain origin security policy.

Could someone confirm that, or enlighten me on how to achieve this ?

Here is what i tryed and not worked because of browser security:

$.ajax({
url : ‘http://a0.twimg.com/profile_images/2596092158/afpecvf41m8f0juql78p_normal.png’,
cache : false,
success : function ( image ) {
console.log( image );
console.log( “^^twitter” );
},
error: function ( e ) {
console.log(“ERROR:”);
console.log( e );
},
type: ‘GET’
});


#2

I am having the same issue here where I needed to retrieve the profile image using JavaScript and put it into a canvas. However, I got the following error due to cross-domain issue.

Image from origin ‘http://pbs.twimg.com’ has been blocked from loading by Cross-Origin Resource Sharing policy: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘http://localhost:63342’ is therefore not allowed access.

The code I used is

var img = new Image;
img.crossDomain = 'Anonymous';
img.src = 'URL';

Any help is appreciated