編集: Cheekysoft がコメントで指摘しているように、書かれているこのコードは安全ではなく、悪意のあるユーザーがアプリを通じて任意の電子メール コンテンツを送信できるようになります。
つまり、以下のコードをそのまま使用しないでください。
最終的には、jQuery と PHP を組み合わせて使用することになりました。
- 調査ページに、ユーザーの電子メール アドレスを収集するための小さなフォームを追加しました。
- jQueryを使用して、このフォームとページのラッパー タグの内容を PHP スクリプトに POST しました。
- その PHP スクリプトでは、Emogrifierを使用して、jQuery から渡された HTML にスタイルシートを参照としてインライン タグを追加しました ( Gmail を含むほとんどの電子メール クライアントは、リンクされた styleheets の使用を許可していないため)。
- 次に (まだ PHP スクリプトで) SwiftMailer (指摘してくれてありがとう、Marc B) と Google Apps アカウントの SMTP 機能を使用して実際のメールを送信しました。
よく働く!
将来誰かに役立つ場合に備えて、PHPスクリプト(サニタイズ済み)は次のとおりです。
<?php
/***** INITIALIZE *****/
/* Import libraries */
require_once 'swiftmailer/swift_required.php';
require_once 'emogrifier/emogrifier.php';
/* Email stylesheet location */
$stylesheet = 'http://example.com/email.css';
/* SMTP Account Info */
$smtpusername = "sender@gmail.com";
$smtppassword = "senderpassword";
$smtpserver = "smtp.gmail.com";
$smtpport = 465;
$smtpsecurity = "ssl";
/***** RETRIEVE THE DATA *****/
/* Retrieve the passed-in variables */
/* HTML for the email body */
$html = $_POST['content'];
/* Recipient mail address */
$address = $_POST['address'];
/* Recipient name */
$name = $_POST['name'];
if ($name==NULL || $name=="") {
$name = "You";
}
/***** MODIFY THE HTML *****/
// Get stylesheet contents as a string
$css = file_get_contents($stylesheet);
// Convert stylesheet into in-line styles using Emogrifier - http://www.pelagodesign.com/sidecar/emogrifier/
$converter = new Emogrifier($html, $css);
$content = $converter->emogrify();
/***** CREATE THE MESSAGE *****/
/* Create the message */
$message = Swift_Message::newInstance()
//Give the message a subject
->setSubject("Results for $name")
//Set the From address with an associative array
->setFrom(array('sender@gmail.com' => 'Sender Name'))
//Set the To addresses with an associative array
->setTo(array($address => $name))
//Give it a body
->setBody($content, 'text/html')
;
/***** SEND THE EMAIL *****/
//Create the Transport
$transport = Swift_SmtpTransport::newInstance($smtpserver, $smtpport, $smtpsecurity)
->setUsername($smtpusername)
->setPassword($smtppassword)
;
//Create the Mailer using your created Transport
$mailer = Swift_Mailer::newInstance($transport);
//Send the message
$result = $mailer->send($message);
if ($result == "1") {
echo "<span class='sendstatus success'>Email sent successfully. </span>";
} else {
echo "<span class='sendstatus failure'>An error occurred. Result code: $result </span>";
}
?>
そして、ここに jQuery フォームがあります (少し単純化されています):
<div id="emailresults">
<form id="emailRecsForm" action="http://example.com/emailresults/emailrecs.php"> <!-- THIS PAGE WHERE THE PHP ABOVE IS LOCATED -->
<h3><img src="email-icon.png" /> Email Your Results</h3>
<label for="name">Name</label><input type="text" id="name" name="name" placeholder="Recipient's name (optional)" />
<label for="address">Email address</label><input type="text" id="address" name="address" class="required email" placeholder="recipient@address.org" />
<div id="submitdiv"><input type="submit" class="submit" value="Send Results" /></div>
</form>
<!-- the result of the send will be rendered inside this div -->
<div id="result"></div>
</div>
<script>
/* attach a submit handler to the form */
$("#emailRecsForm").submit(function(event) {
/* stop form from submitting normally */
event.preventDefault();
$( "#submitdiv" ).empty().append('<span class="sendstatus working"><img src="/images/loadwheel.gif" alt="Sending..."></img></span>');
/* get some values from elements on the page: */
var $form = $( this ),
name = $form.find( 'input[name="name"]' ).val(),
address = $form.find( 'input[name="address"]' ).val(),
html = $('.container').html(),
url = "http://example.com/emailrecs.php";
/* Send the data using post and put the results in a div */
$.post( url, { name: name, address: address, content: html },
function( data ) {
$( "#submitdiv" ).empty().append('<br />').append( data ).append('<input type="submit" class="submit" value="Send Results" />');
$form.find( 'input[name="name"]' ).val("");
$form.find( 'input[name="address"]' ).val("");
}
);
});
</script>