当前位置：文江博客话题详情

通过电子邮件发送在 HTML5 画布上创建的图像

发布于 2024-11-10 11:57:12 字数 252 浏览 0 评论 0原文

我有一个画布，用户可以通过交互来更改设计。现在，用户完成更改后，可以提交他的设计及其电子邮件 ID。但为了提交设计，我使用 http://www.nihilogic.dk/ 将画布转换为图像labs/canvas2image/

现在我想将此图像与用户的电子邮件 ID 一起发送。我如何直接发送此图像而不让用户将其保存在本地系统上。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

不爱素颜 2024-11-17 11:57:12

我认为您需要一些 javascript 魔法，并且因为您已经使用 HTML5 canvas，所以这应该不是问题。

因此，提交按钮上的 onclick 事件将向您的后端 php 邮件程序脚本发出 ajax 请求。

var strDataURI = oCanvas.toDataURL();  
// returns "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACt..."

您只需将 strDataURI 作为参数传递即可。
现在，我认为您还应该将这些保存在数据库中，以便电子邮件可以在其中包含此图像标签：

<img src="http://www.yourdomain.com/generate_image.php?id=2" alt="Design #2" />

并且generate_image.php脚本将执行类似这样的操作

<?php

header('Cache-control: max-age=2592000');
header('Expires: ' . gmdate('D, d M Y H:i:s \G\M\T', time() + 2592000));

// connect to db here .. 
// $id = (int)$_GET['id']; "SELECT youtable WHERE id = '{$id}'"
// and the $image variable should contain "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACt..."

list($settings, $encoded_string) = explode(',', $image);
list($img_type, $encoding_method) = explode(';', substr($settings, 5))

header("Content-type: {$img_type}");

if($encoding_method == 'base64')
    die(base64_decode($encoded_string)); // stop script execution and print out the image

else { // use another decoding method
}

I'm thinking you need some javascript magic, and because you already use HTML5 canvas, that shouldn't be a problem.

So, an onclick event on the submit button that will make an ajax request to your backend php mailer script.

var strDataURI = oCanvas.toDataURL();  
// returns "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACt..."

You just have to pass the strDataURI as a parameter.
Now, I think you should also save these in your database, so that the email can just contain this image tag inside:

<img src="http://www.yourdomain.com/generate_image.php?id=2" alt="Design #2" />

And that the generate_image.php script will do something like this

<?php

header('Cache-control: max-age=2592000');
header('Expires: ' . gmdate('D, d M Y H:i:s \G\M\T', time() + 2592000));

// connect to db here .. 
// $id = (int)$_GET['id']; "SELECT youtable WHERE id = '{$id}'"
// and the $image variable should contain "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMgAAADICAYAAACt..."

list($settings, $encoded_string) = explode(',', $image);
list($img_type, $encoding_method) = explode(';', substr($settings, 5))

header("Content-type: {$img_type}");

if($encoding_method == 'base64')
    die(base64_decode($encoded_string)); // stop script execution and print out the image

else { // use another decoding method
}

回复收藏 0 原文

何以笙箫默 2024-11-17 11:57:12

 if(!empty($_POST['email'])){
    $email=$_POST['email'];
    $image=$_POST['legoImage'];
    $headers="From:".$email."\r\n";
    $headers .= "MIME-Version: 1.0\r\n"; 
    $headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
    list($settings, $encoded_string) = explode(',', $image);
    list($img_type, $encoding_method) = explode(';', substr($settings, 5));

    if($encoding_method == 'base64'){
       $file=fopen("images/newLego.png",'w+');
       fwrite($file,base64_decode($encoded_string)) ;
       fclose($file);
    }
    $my_file = "newLego.png";
    $my_path = "images/";
    $my_subject = "My Design";
    $my_message = "Designed by ".$email;
    mail_attachment($my_file, $my_path, "[email protected]", $email, $email, $email, $my_subject, $my_message);        
}

我选择了 mail_attachment() 函数这里。

 if(!empty($_POST['email'])){
    $email=$_POST['email'];
    $image=$_POST['legoImage'];
    $headers="From:".$email."\r\n";
    $headers .= "MIME-Version: 1.0\r\n"; 
    $headers .= "Content-Type: text/html; charset=ISO-8859-1\r\n";
    list($settings, $encoded_string) = explode(',', $image);
    list($img_type, $encoding_method) = explode(';', substr($settings, 5));

    if($encoding_method == 'base64'){
       $file=fopen("images/newLego.png",'w+');
       fwrite($file,base64_decode($encoded_string)) ;
       fclose($file);
    }
    $my_file = "newLego.png";
    $my_path = "images/";
    $my_subject = "My Design";
    $my_message = "Designed by ".$email;
    mail_attachment($my_file, $my_path, "[email protected]", $email, $email, $email, $my_subject, $my_message);        
}

I picked up the mail_attachment() function here.

回复收藏 0 原文