This is how I upload images:

function loadSourcesImage(sources) { function getBase64Image(img) { var canvas = document.createElement("canvas"); // remove? canvas.width = img.width; canvas.height = img.height; var ctx = canvas.getContext("2d"); ctx.drawImage(img, 0, 0); return canvas.toDataURL(); } return $q(function(resolve, reject) { var promises = []; angular.forEach(sources, function(source) { promises.push($q(function(resolve, reject) { var imageObj = new Image(); imageObj.crossOrigin = "anonymous"; imageObj.onload = function() { source.photo = getBase64Image(imageObj); resolve(); }; imageObj.src = source.photo; })); }); $q.all(promises).then(function() { resolve(); }); }); }

But periodically, not for all pictures, such an error falls out:

Access to Image at ' https://pp.vk.me/c837437/v837437845/740e/jErhvWmSCW8.jpg ' from origin ' https://pp.vk.me ' has been blocked by CORS policy: No 'Access-Control -Allow-Origin 'header is present on the requested resource. Origin ' http: // localhost: 8000 ' is therefore not allowed access.

How can you get rid of it?

    1 answer 1

    Good day!

    It looks like you are performing a cross-domain query. At the same time, you access the VK server, which does not return the Access-Control-Allow-Origin header (for security reasons). But it is not clear why it only sometimes does not work for you. Read more about cross-domain requests. Article on MDN