Canvas - Невозможно создать URL изображения

0

Я создал скрипку с двумя изображениями. Я не понимаю, почему изображение A) не подходит, для меня источник похож на источник изображения B).

js скрипка

HTML

A)<img src="http://img.ui-portal.de/uim/Coop/monster-beratung_140x115.jpg" />

  B)<img src="http://i0.gmx.net/images/258/18821258,pd=2,h=250,mxh=600,mxw=800,w=480.jpg"  />


    <h4> Display images above with dataURL as source: </h4>

        <div id="converted" ></div>

JS

//create canvas-image from A)

var imgA = new Image();

imgA.crossOrigin = "anonymous"; 

imgA.src = "http://img.ui-portal.de/uim/Coop/monster-beratung_140x115.jpg";

            imgA.onload = function(){

            var canvasA = document.createElement('canvas');
            canvasA.width = imgA.width;
            canvasA.height = imgA.height;
            var ctxA = canvasA.getContext('2d');
            ctxA.drawImage(imgA, 0, 0);
            var imgURl = canvasA.toDataURL();
                console.log("die url: "+ imgURl)
                $("#converted").append("<img src="+imgURl +" />");
            }


 //create canvas-image from B)

var imgB = new Image();

imgB.crossOrigin = "anonymous"; 

imgB.src = "http://i0.gmx.net/images/258/18821258,pd=2,h=250,mxh=600,mxw=800,w=480.jpg";

            imgB.onload = function(){

            var canvasB = document.createElement('canvas');
            canvasB.width = imgB.width;
            canvasB.height = imgB.height;
            var ctxB = canvasB.getContext('2d');
            ctxB.drawImage(imgB, 0, 0);
            var imgURl = canvasB.toDataURL();
                console.log("die url: "+ imgURl)
                $("#converted").append("<img src="+imgURl +" />");
            }
Теги:
canvas

1 ответ

3
Лучший ответ

первое изображение защищено Владельцем.

см. сообщение отладчика

Image from origin 'http://img.ui-portal.de' 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://fiddle.jshell.net' is therefore not allowed access.
  • 0
    где я могу найти сообщение отладчика в Chrome?
  • 1
    нажмите F12 и затем Esc или нажмите на вкладку Console .

Ещё вопросы

Сообщество Overcoder
Наверх
Меню