Показать сообщение отдельно
  #1 (permalink)  
Старый 13.09.2017, 21:33
Профессор
Отправить личное сообщение для dima85 Посмотреть профиль Найти все сообщения от dima85
 
Регистрация: 14.03.2010
Сообщений: 194

SecurityError грузим картинки с других сайтов
У меня достаточно большой код, покажу самое главное.
img.addEventListener('click', function(e){
  // chrome
  if(e.offsetX) {x=e.offsetX;y=e.offsetY;}
  // firefox
  else if(e.layerX) {x=e.layerX;y=e.layerY;}
  useCanvas(canvas,img,function(){
   // get image data
   var p = canvas.getContext('2d').getImageData(x, y, 1, 1).data;
   if (valID){val(valID, rgbToHex(p[0],p[1],p[2]));}
  });
 },false);
function useCanvas(el,image,callback){
 el.width = image.width;
 el.height = image.height;
 el.getContext('2d').drawImage(image, 0, 0, image.width, image.height);
 return callback();
}


С картинками которые на сервере скрипт работает хорошо, но когда я пытаюсь загрузить картинку с другого сайта появляется ошибка SecurityError: The operation is insecure.
В этой строчке:
var p = canvas.getContext('2d').getImageData(x, y, 1, 1).data;

Заменил useCanvas на вот такую функцию:
function useCanvas(el,image,callback){
 image.crossOrigin = "anonymous";  // This enables CORS
 image.onload = function (event) {
   el.width = image.width;
   el.height = image.height;
   el.getContext('2d').drawImage(image, 0, 0, image.width, image.height);
   return callback();
 }
};

Теперь ошибок нет, но как только я нажимаю на эту фото, оно пропадает. Что я делаю не так?

Последний раз редактировалось dima85, 13.09.2017 в 22:05.
Ответить с цитированием