+ Start a Discussion
Duncan_IdahoDuncan_Idaho 

Cross-origin image load denied by Cross-Origin Resource Sharing policy.

	function postImage(imageURL){
		
		var image = document.createElement('img');
	        var canvas = document.createElement('canvas');
		
		image.onload = function(e){
		  	console.log('Attempting image post');		  	

		    canvas.width = image.width;
		    canvas.height = image.height;		  
	
		    var ctx = canvas.getContext("2d");
		    ctx.drawImage(image, 0, 0);		  	
		    var dataURL = canvas.toDataURL("image/png");		
		    dataURL = dataURL.replace(/^data:image\/(png|jpg);base64,/, "");
		    console.log('length of image blob: ' + dataURL.length);
		  	
		    ht_ccRemotes.postPinnedImage(dataURL,function(result,event){
		    	
		        if(event.type == 'exception'){
		            console.log('Error pinning image: ' + event.message);
		        }else{
		        	console.log('Successful image pin');
		        }
		    });   
	    }
	    
		image.crossOrigin = 'anonymous';
		image.src=imageURL;	 
   }

Within visualforce, the above javascript results in the error "Cross-origin image load denied by Cross-Origin Resource Sharing policy." when fed an image url for an external domain, even though I'm setting the crossOrigin attribute to anonymous. Does Salesforce have any special CORS restrictions?