JavaScript - Pixastic - Ошибка: эта операция небезопасна

Question

Я пытаюсь обесцветить изображение, используя Pixastic. Я загрузил сценарий из официального website и проверил только необходимые вещи (ядро, плагин jquery и эффект desaturate).

Я попытался использовать тот же код, что они показывают в демо, за исключением того, что я оградил его внутри .ready функции JQuery, но это не должно вызывать проблем:

(function($) { 
    $(document).ready(function() { 
     var img = new Image(); 
     img.onload = function() { 
      // document.body.appendChild(img); // Ialso tried putting this here. 
      Pixastic.process(img, "desaturate", {average : false}); 
     }; 
     document.body.appendChild(img); 
     img.src = "http://127.0.0.1/some_path/Wallpapers/ (10).jpg"; // This URL does point to the image file. 
    }); 
})(window.jQuery); 

Но я всегда получить ту же ошибку: эта операция небезопасна. ошибка происходит от Pixastic файла на расслоение плотной линии 374:

prepareData : function(params, getCopy) { 
      var ctx = params.canvas.getContext("2d"); 
      var rect = params.options.rect; 
      var dataDesc = ctx.getImageData(rect.left, rect.top, rect.width, rect.height); // 374 
      var data = dataDesc.data; 
      if (!getCopy) params.canvasData = dataDesc; 
      return data; 
     }, 

Я разрабатываю на локальном сервере WAMP.

Любая идея о том, что я делаю неправильно? Спасибо за помощь! :)

Answer 1

Нашли проблему:

я должен был использовать 127.0.0.1 вместо Localhost в адресной строке браузера. Если кто-то знает точную причину, не стесняйтесь редактировать.

Answer 2

URL-адрес изображения в коде должен соответствовать URL-адресу, который используется для обслуживания страниц. Я бы использовал относительный URL-код в коде. Если изображение поступает из другого домена, сервер, обслуживающий изображение, должен поддерживать CORS (http://en.wikipedia.org/wiki/Cross-origin_resource_sharing), чтобы это работало.