ＪａｖａＳｃｒｉｐｔ講座(Vol.27)

ＪａｖａＳｃｒｉｐｔ講座
（メールマガジン編）

２／２２日発行　ヨッシーの”ホームページを作ろう！（JavaScript編）”★Vol.27★

フォームを使ったメール送信

ホームページを作っていると、ページに来てくれている人に感想などのメールをもらいたくなるよね。
また、アンケートなども取ってみたい。でも、わざわざメールソフトを起動してメールを送るのは面倒臭いという人もいると思うので、そのような人のために、ページ上で気軽にメールを送れるフォームを設置してみよう。(IE4以上、NE3以上対応)
(※これはHTML講座でも少し解説しています。また、パソコンやメールソフトによっては不安定な動きをする場合があります。一度実際に自分のパソコンで試してみてください。)

★ 基本的なメール送信フォーム ★

まず、フォームを使ったメールの送信の基本的な命令をやっておこう。

◆フォームを使ったメール送信◆

これがフォームを使っメール送信のためのプログラムの枠組みだよ。
まず、
・name="フォーム名"
これはフォーム全体に名前を付けてフォームを操作できるようにしているんだね。
・method="POST"
これはデータを渡す方法を指定しているんだ。
これにはもう1つ、GETという方法があるけど、これは送るデータ量に制限があるんだ。
たいていの場合はPOSTが使えるはずなのでPOSTで覚えておいても大丈夫だと思うよ。
※POSTでうまくいかない場合はGETにする
・action="mailto:メールアドレス"
これは、このフォームの内容をメールアドレスに送るための命令。
だから、この部分は自分のメールアドレスになるわけだね。
・enctype="text/plain"
これは送信するデーターの方式を指定しているんだ。
データーはいろいろな方法で送ることができるんだ。（暗号化したデーターなど）
メール用には暗号化されていないそのままのデーターを送ることになっている。
(つまり、セキュリティの面ではあまり安全ではない。重要なデーターはこれでは送らない方がいいだろう)
メールの送信はこれを使うと覚えておくこと。

けれど、実はこれだけではメールは送れないんだ。
(だって、文字を書くスペースもボタンもないよね)
じゃあ、実際にメールを送るいちばん簡単な命令をやってみよう。

◆フォームを使ったメール送信◆

とりあえず、これでメールを送れるようになっているはずだよ。
けれど、やってみるとわかると思うけどこれだけではいろいろなページからアンケートを取ったりするときなどは不便なところがでてくる。
次にそれを解消する方法をやっていこう。
※ちなみにname=commentという部分。これは次にもやるけれどここに書かれた文章はメールではcomment="コメント"という形になる。

★ メールに情報を付加する ★

メールが送れるようにはなったんだけど、アンケートや感想などいろいろなメールをもらいたい時にメールに題名がついていないと、何についてのコメントかわからないよね。
できれば、何についてのコメントかがわかったほうが当然便利だよね。
それと、どのページから送ってくれたか等も知りたいときがあるよね。
そんなときに、メールを送る人が題名などを書かなくても特定の情報と一緒に自分の所にメールを受信できる方法があるんだ。
とりあえず、どのようにするかをやってみよう。
メールと一緒に好きな情報を自分のところに送りたい時は、

◆メールに情報を付加する◆

<FORM>～</FORM>に以下のタグを入れる。
<INPUT TYPE="hidden" name="名前" value="一緒に送りたい情報">

このようにすればよい。
このとき、送られてきたメールには、
    名前=送りたい情報
        (name = value の関係)
という情報が入っているはずだよ。
だから、メールの中にタイトル=感想という一文を入れたい場合は、
<INPUT TYPE="hidden" name="タイトル" value="感想">
という１文を入れてやればよい。
name=タイトル　value=感想　になっているので
    name=value
    タイトル=感想
になるよね。
これで、このフォームから送られたメールには全て”タイトル=感想”というのが
入っているので、これは感想用のフォームから送られてきたっていうことが一目でわかるようになるね。
(hiddenというのは隠されたという意味がある。
つまり、勝手に隠れて送られるので、わざわざ送信者が題名を書かなくても、
あらかじめ題名を決めておいてそれを一緒に送るようにすればメールが来たときに何についてかがわかるんだね。)

さらに、メールの題名に関しては次のような方法がある。

◆メールに題名を付加する◆

<FORM>中にあるaction=""の部分に追加
action="mailto:メールアドレス?Subject=題名"

このようにすればよい。
ここに書いた題名は、メールの一番上の題名の欄に表示されるよ。
題名に関してはこっちを使った方がいいかもね。

じゃあ、最後に感想を送ってもらうためのフォームを作ってみよう。

--感想用フォーム--

<HTML>
<HEAD>
<TITLE>感想用フォーム</TITLE>
</HEAD>
<BODY>
<FORM name="mail_form" method="POST" action="mailto:メールアドレス?
Subject=ページを見た感想" enctype="text/plain">
名前：<INPUT type="text" name="名前"><p>
感想：<br>
<TEXTAREA rows="8" cols="40" name="感想">
</TEXTAREA><BR>
<INPUT type="submit" value="送信">
<INPUT TYPE="reset">
</FORM>
</BODY>

--解説--

これで、
    <INPUT type="text" name="名前">
には名前を入れてもらって、
    <TEXTAREA rows="8" cols="40" name="感想">
    </TEXTAREA>
には、感想を書いて送るフォームができたよ。
ちなみにそれぞれ、name="名前",name="感想"になっているから、
送られてきたメールには、
    名前＝・・・・・
    感想＝・・・・・
という形になっている。
さらに、
　mailto:メールアドレス?Subject=ページを見た感想
なので、メールの題名欄には"ページを見た感想"という文字が書かれているはずだよ。

ちなみに、このフォームで送る方法はこのままだと送信ボタンを押しても画面上では何も起きないんだ。
実際はキチンと送れているんだけれど、画面上ではなにも起こらないから何も知らない人は送れていないと思って何度も何度もボタンを押してしまうかもしれないね。
それを防ぐためには、送信ボタンにonclickなどで他のページへ行く命令を入れておいて、感想などを送った時にお礼のページなどに移動させてあげるといいよね。