#javascript
#javascript
Вопрос:
Я придумал функцию, которая преобразует ширину и высоту изображения в новые значения,
function imageToDataUri(src, width, height) {
// create an off-screen canvas
var img=new Image();
img.src=src;
var canvas = document.createElement('canvas');
var ctx = canvas.getContext('2d');
// set its dimension to target size
canvas.width = width;
canvas.height = height;
// draw source image into the off-screen canvas:
ctx.drawImage(img, 0, 0, width, height);
var d = ctx.getImageData(0, 0, width, height);
console.log('de from transformation is');
console.log(d);
return canvas.toDataURL();
}
Входными данными для функции является строка base64, а выходные данные такие же, но иногда вышеуказанная функция дает мне полное черное изображение, когда я использую свое входное изображение. Может кто-нибудь сказать мне, есть ли что-то, чего мне не хватает в моих кодах?
Комментарии:
1. вы не можете сделать это с изображениями, которые вам не принадлежат (межсайтовые изображения)… эти изображения испорчены, никаких данных, с которыми вы можете играть. Это по соображениям авторского права.
2. какой тогда будет альтернатива?
3. размещайте свои собственные изображения или прокси-запросы через ваш сервер, на котором работает ваш сайт. речь идет о нарушении авторских прав, следите за своими требованиями.
4. Я совсем не уверен, связано ли это с межсайтовыми изображениями, поскольку я не получаю никаких ошибок в журнале по этому поводу .. и когда-нибудь моя функция работает..
5. речь идет о испорченном холсте. это работает, когда вам разрешено рисовать изображения со своего сайта или с других сайтов. Это не так, когда вам не разрешено. Здесь нет никакой магии. developer.mozilla.org/en-US/docs/Web/HTML/CORS_enabled_image