JavaScript【 サンプル 】１０ ～ メール送信
JavaScript の記述方法のサンプルを挙げてみます。
今回は、JavaScript を使用してメール送信を行うサンプルを紹介します。
目次
１．メール送信画面
２．ファイルを添付
１．メール送信画面
JavaScript を使用して、このようなメール送信画面を作成することができます。
上のサンプルのソースコードは次の通りです。
<script type="text/javascript">
<!--
window.moveTo(screen.width/2-150, screen.height/2-150);
window.resizeTo(400, 300);
// CDO.Message オブジェクト生成
var cdoMsg = new ActiveXObject("CDO.Message");
// CDO オブジェクトコンフィグ用名前空間
var schemas = "http://schemas.microsoft.com/cdo/configuration/";
// 送信時にネットワークを利用するための設定（ 2 ： cdoSendUsingPort ）
cdoMsg.Configuration.Fields.Item(schemas+"sendusing") = 2;
// SMTPサーバ設定
cdoMsg.Configuration.Fields.Item(schemas+"smtpserver") = "★smtp-server★";
// SMTPポート設定
cdoMsg.Configuration.Fields.Item(schemas+"smtpserverport") = 25;
// Basic認証設定
cdoMsg.Configuration.Fields.Item(schemas + "smtpauthenticate") = true;
// 認証ユーザ設定
cdoMsg.Configuration.Fields.Item(schemas + "sendusername") = "★username★";
// 認証パスワード設定
cdoMsg.Configuration.Fields.Item(schemas + "sendpassword") = "★password★";
// SSL使用設定
cdoMsg.Configuration.Fields.Item(schemas + "smtpusessl") = true;
// コンフィグ更新
cdoMsg.Configuration.Fields.Update();
// 送信元アドレス設定
cdoMsg.From = "★from-address★";
function send(){
// 送信先アドレス設定
cdoMsg.To = document.getElementById("mail_to").value;
// タイトル設定
cdoMsg.Subject = document.getElementById("mail_subject").value;
// 本文設定
cdoMsg.TextBody = document.getElementById("mail_textbody").value;
try {
// メール送信
cdoMsg.Send();
} catch(e) {
// エラー発生時の処理
alert(e.message);
}
}
//-->
</script>
<div style="background-color : #CCC;">
<table>
<tr>
<td>宛先</td>
<td><input id="mail_to" type="text" placeholder="xxx@yyy.com"></td>
</tr>
<tr>
<td>件名</td>
<td><input id="mail_subject" type="text" placeholder="タイトル"></td>
</tr>
<tr>
<td>本文</td>
<td><textarea id="mail_textbody" cols=35 rows=10 placeholder="本文"></textarea></td>
</tr>
</table>
<input id=send_button type="button" value="送信" onClick="send()">
</div>
このサンプルは、SMTP経由でメールを送信するサンプルです。
ソースコードの中の次の値を、ご自身のメール環境の値に設定すると、実際にメールを送信することができます。
| ★smtp-server★ |
SMTPサーバ |
| ★username★ |
認証ユーザ |
| ★password★ |
認証パスワード |
| ★from-address★ |
送信元メールアドレス |
▲目次へ戻る
２．ファイルを添付
メール送信画面にファイル添付機能を付けることもできます。
上のサンプルのソースコードは次の通りです。
<script type="text/javascript">
<!--
window.moveTo(screen.width/2-150, screen.height/2-150);
window.resizeTo(400, 300);
var cdoMsg = new ActiveXObject("CDO.Message");
var schemas = "http://schemas.microsoft.com/cdo/configuration/";
cdoMsg.Configuration.Fields.Item(schemas+"sendusing") = 2;
cdoMsg.Configuration.Fields.Item(schemas+"smtpserver") = "★smtp-server★";
cdoMsg.Configuration.Fields.Item(schemas+"smtpserverport") = 25;
cdoMsg.Configuration.Fields.Item(schemas + "smtpauthenticate") = true;
cdoMsg.Configuration.Fields.Item(schemas + "sendusername") = "★username★";
cdoMsg.Configuration.Fields.Item(schemas + "sendpassword") = "★password★";
cdoMsg.Configuration.Fields.Item(schemas + "smtpusessl") = true;
cdoMsg.Configuration.Fields.Update();
cdoMsg.From = "★from-address★";
function send(){
cdoMsg.To = document.getElementById("mail_to").value;
cdoMsg.Subject = document.getElementById("mail_subject").value;
cdoMsg.TextBody = document.getElementById("mail_textbody").value;
// ファイルを添付
cdoMsg.AddAttachment(document.getElementById("file1").value);
try {
cdoMsg.Send();
} catch(e) {
alert(e.message);
}
}
//-->
</script>
<div style="background-color : #CCC;">
<table>
<tr>
<td>宛先</td>
<td><input id="mail_to" type="text" placeholder="xxx@yyy.com"></td>
</tr>
<tr>
<td>件名</td>
<td><input id="mail_subject" type="text" placeholder="タイトル"></td>
</tr>
<tr>
<td>本文</td>
<td><textarea id="mail_textbody" cols=35 rows=10 placeholder="本文"></textarea></td>
</tr>
<tr>
<td colspan="2">
<input id="file1" type="file" /><div id="output"></div>/td>
</tr>
</table>
<input id=send_button type="button" value="送信" onClick="send()">
</div>
「 cdoMsg.AddAttachment(document.getElementById(“file1”).value); 」として、CDO.Message オブジェクトのAddAttachment プロパティに、添付ファイルのフルパスを設定します。
▲目次へ戻る
