フォームにおけるコンソール上での変数の値の変更を避ける方法について
解決済
回答 1
投稿
- 評価
- クリップ 0
- VIEW 559
前提・実現したいこと
HTMLでフォームを作りJavaScriptでバリデーション、Ajaxでデータの送信を行おうとしています。
データは表示用のデータとデータベースに送信するデータを別にし、
バリデーションでエラーが見つかった場合は表示用のメニューや確認画面が出ないようにしています。
発生している問題・エラーメッセージ
ここで、データベースに送るべきデータにコンソール等で不正な変更が行われた時にそれを検知、或いはエラーを返すことができないので
それをできるようにしたいのですがやり方の検討がてんで付きません。
該当のソースコード
現在の状況は以下のようになっています。
<div id="hoge_valid"></div>
<div id="hoge">
<input type="radio" name="hoge_a" value="2" id="D"><label for="D">D</label><br><br>
<input type="radio" name="hoge_a" value="1" id="E"><label for="E">E</label><br><br>
<input type="radio" name="hoge_a" value="0" id="F"><label for="F">F</label><br><br>
</div>
<!-- ↑収集する値は文字列。 -->
<div id="choice">
<input type="checkbox" name="piyo" value="0" id="piyo0"><label for="piyo0">piyo0</label><br><br>
<input type="checkbox" name="piyo" value="1" id="piyo1"><label for="piyo1">piyo1</label><br><br>
<input type="checkbox" name="piyo" value="2" id="piyo2"><label for="piyo2">piyo2</label><br><br>
<input type="checkbox" name="piyo" value="3" id="piyo3"><label for="piyo3">piyo3</label><br><br>
<!-- 以下同様 -->
</div>
<!-- ↑収集する値は配列。後で文字列にします。 -->
<p>hoge:<span class="hoge_echo"></span></p>
<p>piyo:<span class="piyo_echo"></span></p>
<p><input type="button" value="check" id="is_it_OK"></p><!-- 確認画面を開くボタン -->
var $hoge="";
var $piyo="";
var $error_hoge_="";
var $hoge_echo_="";
var $error_piyo_="";
var $piyo_echo_="";
function valid_hoge($hoge)
{
$error_hoge="";
if ((!$hoge&&$hoge!=0)) {
$error_hoge = "<div id=\"hoge_valid\"><p style=\"color:#ff2800;\">"+"入力されていません。"+"</p></div>";
} else if ((parseInt($hoge)<0||parseInt($hoge)>2)&&!isNumeric($hoge)) {
$error_hoge = "<div id=\"hoge_valid\"><p style=\"color:#ff2800;\">"+"不正なPOSTです。"+"</p></div>";
}else{
$error_hoge="<div id=\"hoge_valid\"></div>";
}
return $error_hoge;
}
function valid_hoge_echo($hoge)
{
$hoge_array =[/*配列の中身*/];
$hoge_echo ="";
$error_hoge ="";
$error_message=valid_hoge($hoge);
if ($error_message === "<div id=\"hoge_valid\"></div>") {
$hoge_echo = $hoge_array[parseInt($hoge)];
}
return $hoge_echo;
}
function valid_piyo($piyo){
$error_piyo="";
$piyo2 =[/*配列の中身*/];
if ($piyo.length==0) {
$error_piyo = "<div id=\"piyo_valid\"><p style=\"color:#ff2800;\">"+"入力されていません。"+"</p></div>";
}else{
for ($i = 0; $i <$piyo.length ; $i++) {
if (((parseInt($piyo[$i])<0||parseInt($piyo[$i])>($piyo2).length-1)||!Number.isInteger(parseInt($piyo[$i]))||!Array.isArray($piyo))&&parseInt($piyo[$i])==$piyo[$i]) {
$error_piyo = "<div id=\"piyo_valid\"><p style=\"color:#ff2800;\">"+"不正なPOSTです。"+"</p></div>";
break;
}
}
$error_piyo="<div id=\"piyo_valid\"></div>";
}
return $error_piyo;
}
function valid_piyo_echo($piyo)
{
var $piyo_echo = "";
$error_message = valid_piyo($piyo);
$piyo2 =[/*配列の中身*/];
var $array= new Array();
if ($error_message==="<div id=\"piyo_valid\"></div>") {
for(var i=0;i<$piyo.length;i++){
if($piyo_echo!=="") $piyo_echo+=",";
$piyo_echo+=$piyo2[parseInt($piyo[i])];
};
}
return $piyo_echo;
}
/*確認画面を開かせる前にエラーメッセージが出ているかで判断していますがコンソールなどで値を変えられるとこの関数ではどうにもならないです。*/
$(function(){
$("#piyo input").change(function(){
ary=document.getElementsByName('piyo');
$piyo=new Array();
if (ary.length>1) {
for (var i = 0; i <ary.length; i++) {
if (ary[i].checked) {
$piyo.push($(ary[i]).val());
}
}
}
$error_piyo_=valid_piyo($piyo);
$piyo_echo_=valid_piyo_echo($piyo);
$('#piyo_valid').html(valid_piyo($piyo));
});
$("#hoge input").change(function(){
$hoge=$("#hoge input:checked").val();
$('#hoge_valid').html(valid_hoge($hoge));
$error_hoge_=valid_hoge($hoge);
$hoge_echo_=valid_hoge_echo($hoge);
});
$('#is_it_OK').on('click', function() {
$('span.hoge_echo').text($hoge_echo_);
$('span.piyo_echo').text($piyo_echo_);
});
});
-
気になる質問をクリップする
クリップした質問は、後からいつでもマイページで確認できます。
またクリップした質問に回答があった際、通知やメールを受け取ることができます。
クリップを取り消します
-
良い質問の評価を上げる
以下のような質問は評価を上げましょう
- 質問内容が明確
- 自分も答えを知りたい
- 質問者以外のユーザにも役立つ
評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。
質問の評価を上げたことを取り消します
-
評価を下げられる数の上限に達しました
評価を下げることができません
- 1日5回まで評価を下げられます
- 1日に1ユーザに対して2回まで評価を下げられます
質問の評価を下げる
teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。
- プログラミングに関係のない質問
- やってほしいことだけを記載した丸投げの質問
- 問題・課題が含まれていない質問
- 意図的に内容が抹消された質問
- 過去に投稿した質問と同じ内容の質問
- 広告と受け取られるような投稿
評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。
質問の評価を下げたことを取り消します
この機能は開放されていません
評価を下げる条件を満たしてません
質問の評価を下げる機能の利用条件
この機能を利用するためには、以下の事項を行う必要があります。
- 質問回答など一定の行動
-
メールアドレスの認証
メールアドレスの認証
-
質問評価に関するヘルプページの閲覧
質問評価に関するヘルプページの閲覧
checkベストアンサー
+5
無理です。
極端な話、フォームを全く使わず、不正な値に書き換えたAjaxリクエストを投げることすらできてしまうので、最終的なバリデーションはサーバサイドで行わなくてはなりません。
投稿
-
回答の評価を上げる
以下のような回答は評価を上げましょう
- 正しい回答
- わかりやすい回答
- ためになる回答
評価が高い回答ほどページの上位に表示されます。
-
回答の評価を下げる
下記のような回答は推奨されていません。
- 間違っている回答
- 質問の回答になっていない投稿
- スパムや攻撃的な表現を用いた投稿
評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。
15分調べてもわからないことは、teratailで質問しよう!
- ただいまの回答率 88.21%
- 質問をまとめることで、思考を整理して素早く解決
- テンプレート機能で、簡単に質問をまとめられる