Преобразование в png <image> или base64 из canvas не работает

0

На самом деле у меня есть элемент div grid с количеством тегов html, таких как <div>, <p>, <img> и преобразование его в холст, а затем base64 для сохранения на сервере по php.

может ли кто-нибудь помочь мне избавиться от этой проблемы. вот мой код https://jsfiddle.net/manish1706/ujx6rh5j/3/

Я не могу иметь изображения, которые находятся в <img/>.

Теги:
image
canvas

2 ответа

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

Отсюда:

Все изображения, используемые сценарием, должны находиться под одним и тем же происхождением

Так как ваше изображение является кросс-началом, Html2Canvas не может получить к нему доступ.


Здесь описывается использование прокси для этого.

0

Сначала спасибо @Justinas за то, что я указал на проблему с перекрестным происхождением, я использовал

html2canvas($(".frameGrid"),
        {
            useCORS: true,
            "proxy":"http://xxxxxx.com/xxxx/timthumb.php", // optional (and if you are not writing this so have to all origin by server side)
            onrendered: function(canvas) {
            var img = canvas.toDataURL("image/png");
            $('#img-out').append('<img src="'+img+'"/>');
        }
    });

и для будущего использования я использовал

header('Access-Control-Max-Age:' . 5 * 60 * 1000);
header("Access-Control-Allow-Origin: *");
header('Access-Control-Request-Method: *');
header('Access-Control-Allow-Methods: OPTIONS, GET');
header('Access-Control-Allow-Headers: *');
header("Content-Type: application/javascript");

в моем php файле на стороне сервера.

Ещё вопросы

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