「自動でメールを送るよりも、ボタンを押したらメーラーが立ち上がるようにして欲しい」
ある日のクライアントの鶴の一声・・。
これまではCakePHPのCakeEmailを使ってメールを自動送信するようにしていたんですが、そうもいかなくなりました。
ということで、今回JavaScriptで作った処理をメモしておきます。(地味に苦戦したのは内緒です)
書いた処理としては以下の通り。
# index.html <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>メール送信テスト画面</title> <link rel="stylesheet" href=""> <script src="javascript/index.js" type="text/javascript" charset="utf-8" ></script> </head> <body> <input type='hidden' id='hidden_data' value='送信したい情報をここに記載'> <button id='mail'>メール送信</button> </body> </html>
# index.js /** * メーラーを起動してメールを送信する */ window.onload = function() { /** * メールに記載する情報を格納する変数 */ var address, subject, body, hiddenData; var sendmail = document.getElementById('mail'); sendmail.onclick = function() { // メールに記載したい情報をhiddenタグから取得 hiddenData = document.getElementById('hidden_data').value; address = '~@co.jp'; subject = '件名'; body = '本文' + hiddenData; location.href = 'mailto:' + address + '?subject=' + subject + '&body=' + body; }; };
画面上の「メール送信」ボタンを押下すると、メーラーが立ち上がる動きをします。 JS内でhiddenタグのvalueを拾って、メールの本文に載るようにしています。
ちなみに 「宛先にCCを追加」「メール内で改行を行う」という2つの処理を追加した場合は以下のようになります。
# index.js /** * メーラーを起動してメールを送信する */ window.onload = function() { /** * メールに記載する情報を格納する変数 */ var address, ccAddress, subject, body, hiddenData; var sendmail = document.getElementById('mail'); sendmail.onclick = function() { // メールに記載したい情報をhiddenタグから取得 hiddenData = document.getElementById('hidden_data').value; address = '~@co.jp'; ccAddress = 'sub@co.jp'; subject = '件名'; body = '本文' + '%0D%0A' + hiddenData; // 「'%0D%0A'」を入れて改行 // 「'?cc='」部分でCC追加 location.href = 'mailto:' + address + '?cc=' + ccAddress + '&subject=' + subject + '&body=' + body; }; };
こんな感じでメーラー起動処理を実装できました。
同じ事で悩んでいる人の参考になれば幸いです。