デル株式会社

フォームのSubmit無効化 のすすめ

これはJavaScriptが絡んでくる場合だけの話です。
普通に送信するだけならSubmitは有効にしないと意味が無いです。

フォームのSubmitは、送信前チェックや送信制限などをonSubmit=" 関数() "でつけても、 そのチェック用関数等でエラーがでたり、ブラウザの差異でうまく動かずに途中で無効になる場合は 関数の戻り値に関係なく送信されてしまいます。
『送信前の単なる補助』としてチェック用関数を用意してるのであればこれでも良いですが、 『必ずチェックを通す』と言うのであれば中途半端です。

『必ずチェックを通す』場合はJavaScriptが無効の場合は送信できなくしてしまう必要もあります。 この辺は『どういったフォームとチェックなのか?』を明確に考えておく必要があります。

ま、フォーム、JavaScriptはソースも送信先も見えるので、 セキュリティ的なチェックをJavaScriptで完璧にする事は元々無理です。 最終的には受け取るCGI等でのチェックが必要になります。
が、悪戯などを別にしてフォームチェックを確実に通すかどうか?は明確な意図をもってやっておくべきです。

詳 細


例1:
<form action="url" onsubmit=" return CheckForm(this) ">
<input type="submit">
</form>
※ Checkform(this) はフォームの内容チェック (戻り値:true、false)
よく使われがちな方法ですが、このベーシックな初心者向けの教科書のような方法は、 ただの おまけチェック だと考えてください。
JavaScriptがOFFになっていれば送信されますし、 チェック用関数CheckForm()内に、ブラウザが理解できない記述があればエラーまたはスルーになり、 明確にfalseが戻らない場合は送信を中断させる事はできません。

例2:
<form action="url">
<input type="button" onclick="SendForm(this.form)" >
</form>
Submitボタンを外しbuttonにして onclickでチェックする事で、 関数が正しく結果を出せる場合のみ送信させる事ができます。
SendForm(this.form) はチェックをして条件に合う場合のみ 引数this.formに対して submit() メソッドを実行する関数。
この方法はJavaScriptがOFFまたは、SnedForm()関数内のJavaScriptレベルが通じない古いブラウザでは、送信できなくなります。 が、必ずチェックしてから通すと言う方法になります。
例3:
<form onsubmit=" return false;">
<input type="submit" onclick="SendForm(this.form)" >
</form>
Submitボタンは思わぬ操作(変換のつもりで思ってEnterキーを押してしまう等)で送信が実行されてしまう場合がありますが、 それでもキーボードだけで操作する時などに便利なSubmitボタンの特性(フォームへのフォーカスと同時にフォーカスが当たる)も持っています。 そこでSubmitボタンは残して、チェックはonclickから行う場合はこの様にします。
Submitがあっても送信自体は無効にする為に onsubmit="return false;" を付けて置きます。 JavaScriptがOFFだと return falseの意味が無いので、actionを外して送信できなくします。

SendForm(this.form) はチェックをして条件に合う場合のみ、 引数this.formに対して actionをつけてあげて、submit() メソッドを実行する関数。

こうする事で、Submitボタンの特性を使いながら、チェックを必ず通す事ができます。

ブラウザを選ばず誰でも送信できる方が本当は良いです。
こうなってくるとJavaScriptでのチェックは例1の補助役程度が結果的にはプラスで、 あとはCGI側できちんとチェックをすると言う本来あるべきの姿に戻ってしまいますね(笑)


■悪戯防止
下手にHPにフォームをつけてしまって外人の迷惑送信のターゲットになると、 毎日何度もどんどん送信されてしまいます。

JavaScript単体ではこれを防ぎきる事はまず無理です。
フォームを経由していればJavaScriptでチェックはできますが、 直接フォームの送信先に対して送信されているのでJavaScriptの出番がありません。
CGI側と連携させて行う必要があります。

画像生成などを使わない簡易方法としては
<input name="pwd" type="text"> 全角数字で『はちにさんご』と入れてください
このような日本語フォントが使えて理解できる人にだけが入れられるテキストボックスを作ります。 この例の『はちにさんご』はもし翻訳させても『蜂に珊瑚』の様に文章に変換されてしまいやすい工夫をします。
あるいは日本人なら誰でも知ってる考えずに済む謎々の答えを要求とか。 個人サイトであればこの程度の物を使って、この値をCGI側でチェックしていく事で十分でしょう。
もちろん外人の自動スパムプログラム対策としてのみ有効です。

もっと本格的にきちんとやるなら画像認証式、セッション式、などや連続投稿禁止処理などが必要になってきますね。
最近の日本人も『儲かります系』と『アダルト系』のスパムもしつこいのがいます。 これらに関してはもっと本格的なスパム排除が必要になりますので、JavaScriptの出番ではないです。 CGI側でしっかりしたチェック方法を作り、proxyを排除し、IPを取り・・・と言った感じでしょうか。


専用ページから申し込むと
So-netより高い3万円CB

案ずるより産むが易し
使ってみれば疑問も解決

XREA+ (plus) 206円/月
( お試し7日間 )

CORE SERVER 428円/月
( お試し15日間 )

ロリポップ 270円/月
( お試し期間10日間 )

ヘテムル 1620円/月
( お試し期間15日間 )

さくら 129円/月
( お試し期間2週間 )

無駄な高額ドメイン管理料金払ってませんか?

バリュードメイン
ムームードメイン