Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 18.03.2018, 16:16
Интересующийся
Отправить личное сообщение для Dan_net Посмотреть профиль Найти все сообщения от Dan_net
 
Регистрация: 04.03.2018
Сообщений: 10

Отправка картинки в SVG на email
Нужно при нажатии на кнопку отправить SVG файл в базу, а затем передать на почту.

<figure id="imapc" class="changeSide-1">
                            <object data="{{asset($product_slug->svg_url)}}" type="image/svg+xml" id="imap">
                                <p>К сожалению, вы используете устаревшую версию браузера, который не поддерживает интерактивную карту.</p>
                            </object>
                        </figure>

<form action="{{route('send-form')}}" method="post" enctype="multipart/form-data">
                                    {{ csrf_field() }}
                                    <input type="text" class="email" placeholder="Enter your email" name="email">
                                    <input type="text" class="hidden-form-front" name="product_front" value="">
                                    <input type="text" class="hidden-form-back" name="product_back" value="">
                                    <button class="send-button">Send</button>
                                </form>


$('.send-button').click(function (e) {
        var getFront = document.getElementById("imap").contentDocument.lastChild.outerHTML;
        var imgsrc = 'data:image/svg+xml;base64,' + btoa(getFront);
       
        $('.hidden-form-front').val(imgsrc);

    });



При этом коде, в базу приходит закодированный в base файл, но на почту приходит пустой img.
<img alt="">

Последний раз редактировалось Dan_net, 18.03.2018 в 16:20.
Ответить с цитированием
  #2 (permalink)  
Старый 18.03.2018, 16:48
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

https://css-tricks.com/a-guide-on-svg-support-in-email/

Попробуйте так:

<embed type="image/svg+xml" src="data:image/svg+xml;base64,PHN2ZyB4bW......

не знаю на всех ли почтовых клиентах прокатит такое. И вообще, не ожидайте от почтовых клиентов и серверов такой поддержки как HTML.
Ответить с цитированием
  #3 (permalink)  
Старый 18.03.2018, 23:12
Интересующийся
Отправить личное сообщение для Dan_net Посмотреть профиль Найти все сообщения от Dan_net
 
Регистрация: 04.03.2018
Сообщений: 10

Спасибо, не получилось
Ответить с цитированием
  #4 (permalink)  
Старый 19.03.2018, 08:56
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Конвертируйте в графический формат, ибо с почтовыми клиентами на моб. устройствах еще печальнее будет.
Ответить с цитированием
  #5 (permalink)  
Старый 19.03.2018, 12:21
Интересующийся
Отправить личное сообщение для Dan_net Посмотреть профиль Найти все сообщения от Dan_net
 
Регистрация: 04.03.2018
Сообщений: 10

Вот мой код за конвертацию в png

var getFront = document.getElementById("imap").contentDocument.lastChild.outerHTML;
        var imgsrc = 'data:image/svg+xml;base64,' + btoa(getFront);

        var canvas = document.querySelector("canvas"),
            context = canvas.getContext("2d");
        canvas.setAttribute('width', 526);
        canvas.setAttribute('height', 233);
var image = new Image;
        image.src = imgsrc;
        image.onload = function () {
            context.drawImage(image, 0, 0);
            var canvasdata = canvas.toDataURL("image/png");
            canvas.parentNode.removeChild(canvas);
            $('.hidden-form-front').val(canvasdata);
        };


Но теперь в базу ничего не приходит.
Ответить с цитированием
  #6 (permalink)  
Старый 19.03.2018, 12:39
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от Dan_net
Но теперь в базу ничего не приходит.
А что вы в нее записываете?
Ответить с цитированием
  #7 (permalink)  
Старый 19.03.2018, 15:10
Интересующийся
Отправить личное сообщение для Dan_net Посмотреть профиль Найти все сообщения от Dan_net
 
Регистрация: 04.03.2018
Сообщений: 10

ссылку в base64. Вот такого вида: data:image/png;base64,iVBORw0KGgoAAA...
Ответить с цитированием
  #8 (permalink)  
Старый 19.03.2018, 15:16
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от Dan_net
ссылку в base64. Вот такого вида: data:image/png;base64,iVBORw0KGgoAAA...
Зачем? И вообще откуда у клиента возникает этот SVG, от сервера так, а значит зачем же его туда сюда гонять? Можно на сервер отправлять "указатель" на выбранный SVG, сервер его конвертирует (imageMagick) и сохранит как картинку на диск, ну и отправит почтой (можно не как вложение, а внедренное в тело почтового отправления).

Если на сервере нечем конвертировать SVG, пусть будет клиентом, но получая это как base64, сохраняйте ее как картинку на диск, зачем забивать базу картинками?
Ответить с цитированием
  #9 (permalink)  
Старый 19.03.2018, 17:18
Интересующийся
Отправить личное сообщение для Dan_net Посмотреть профиль Найти все сообщения от Dan_net
 
Регистрация: 04.03.2018
Сообщений: 10

Как сохранить картинку на диск? Через
<input type="file">
мне не подходит.
У меня на сайте есть картинка в SVG, пользователь может поменять цвет этой картинки на самом сайте, а затем уже отредактированная картинка должна быть отправлена на email.

Последний раз редактировалось Dan_net, 19.03.2018 в 17:24.
Ответить с цитированием
  #10 (permalink)  
Старый 19.03.2018, 17:29
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Сообщение от Dan_net
Как сохранить картинку на диск?
Если приходит изображение как base64 и язык сервера РНР, то изображение, это

$img = base64_decode($_POST['product_front']);


Конечно и удостоверится нужно, что это изображение. Можно и не сохранять на диск, если SVG, это рабочий формат, а изображение только для отправки почтой, то $img и отправлять, без сохранения на диск.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Отправка файла на email при помощи Ajax vah-smile AJAX и COMET 7 19.11.2016 16:41
отправка формы через ajax на разные email Smike AJAX и COMET 7 12.11.2014 08:58
Изменение цвета заливки у SVG картинки при наведении мыши? akkond Общие вопросы Javascript 2 15.04.2014 13:04
Отправка формы на Email Donny Работа 4 26.07.2011 09:04
Сохранение таблицы с сайта и отправка на email martinss Events/DOM/Window 5 29.12.2010 12:39