@Rubix
Люблю кодить, разрабатываю проекты в разных сферах

Можно ли получить картинку с ресурса без CORS A-C-A-O?

Когда пытаюсь нарисовать на Canvas картинку по ссылке с ресурса без заголовка CORS "Access-Control-Allow-Origin", пишет соответствующую ошибку в консоли. Картинка уже отрисована в теге img, мы ее просто заново отрисовываем на канвасе, чтобы преобразовать ее в строку base64, и как раз в последний момент происходит ошибка.
function imgToBase64(img) {
  const canvas = document.createElement('canvas');
  const ctx = canvas.getContext('2d');
  canvas.width = img.width;
  canvas.height = img.height;

  img.crossOrigin = 'anonymous';

  ctx.drawImage(img, 0, 0);

  return canvas.toDataURL();
}

let res = imgToBase64( document.getElementById('pic') );
console.log(res);

Конечно, некоторые картинки (в основном, значки) успешно выдают строку, но бОльшая часть не пропускается. Можно ли все-таки получить через JS, или придется рисовать картинку через PHP?
  • Вопрос задан
  • 61 просмотр
Решения вопроса 1
@Rubix Автор вопроса
Люблю кодить, разрабатываю проекты в разных сферах
get.php
<?php
$path = $_GET['url'];
$type = pathinfo($path, PATHINFO_EXTENSION);
$data = file_get_contents($path);
$base64 = 'data:image/' . $type . ';base64,' . base64_encode($data);

echo $base64;
?>


script.js
function getImgData(url, callback) {
	fetch('get.php/?url=' + url).then((data) => {
		data.text().then(callback);
	});
}
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы