SpringMVCとAJAXの相互作用

実際の開発では、私たちはしばしば、その後springmvcアヤックスとの間の相互作用が、ここでは、前面と背面をやり取りする必要があり、実際の開発で遭遇する問題の詳細を記録します。

jspページ：

1 <フィールドセットID = "ログイン"スタイル= "幅：600PX;ボーダー：1ピクセル固体＃000;ボーダー左：なし;ボーダー右：なし"> 
 2 <凡例スタイル= "">用户登录</凡例> 
 3 <P ALIGN = "センター">账号：<INPUT TYPE = "text"の名= "ユーザ名" /> </ P> 
 4 <P整列= "中心">密码：の<input type = "パスワード" NAME = "パスワード"/> </ P> 
 5 <P ALIGN ="センター">の<input type ="提出」ID = "submit1"値= "登录" /> </ P> 
 6 </フィールドセット>

AJAXリクエストを次のように

<スクリプトタイプ= "テキスト/ JavaScriptを"> 
$（関数（）{ 
$（ "＃Submit1" ）.click（関数（）{ 
VARのJSON = {
 'ユーザ名'：$（ '：INPUT [名=ユーザ名]' ）.val（）、
 'パスワード'：$（ '：INPUT [名=パスワード]' ）.val（）
}; 
// JSON文字列{ "ユーザ名"： "ADMIN"、 "パスワード"： "123456"} 
VAR = JSON.stringify PostDataの（JSON）; // 文字列にJSONのJSONオブジェクト
、アラート（PostDataの）
$アヤックス（{ 
タイプ： 'POST' 、
contentTypeのは： 'ファイルアプリケーション/ JSON'、// ノート型
/ **  
*（默认：オブジェクト（そうでない場合は技術的には、文字列の場合）、オプションデータを通じて渡されたデータを、デフォルトでは）本当、
*ですプロセスは、「既定のコンテンツタイプに合わせて、クエリ文字列に変換され、アプリケーション/ x-www-form-urlencodedで」。
*あなたがDOMツリー情報やその他の情報を送信する場合はfalseに設定し、変換したくありません。
* / 
PROCESSDATA：falseに、
URL： '<％=％パス> / DataBindを/ requestbodybind' 、
データ型： 'JSON' 、
データ：PostDataの、
成功：機能（データ）{ 
アラート（ 'ユーザ名：' data.username + +「\ nPassword： '+ data.password）; 
}、
エラー：関数（）{ 
アラート（ 'エラー... ' ）; 
} 
}）; 
}）;     
}）;
 </ SCRIPT>

ヒント：私たちはcontentTypeのを見ることができます：「アプリケーション/ JSON」の要求を開始し、データ我々は最初に、JSONオブジェクトの代わりにJSON文字列を渡し、私もそれが可能だと思い、直接転写目標誤りのない結果、個人的に試してみたいです。
以下の方法を提供することが望ましいSpringMVC：

@RequestMapping（値= "requestbodybind"、メソッド= {RequestMethod.POST}）
@ResponseBody 
パブリックアカウントrequestBodyBind（@RequestBodyアカウントのアカウント）{ 
するSystem.out.println（ "requestbodybind：" + アカウント）。
リターンアカウント; 
}

それはcontentTypeのだった。「アプリケーション/ JSONは」要求を開始し、我々は値を受け取るための方法としてそれを使用することはできません

@RequestMapping（値= "JSON"、メソッド= {RequestMethod.POST}）
@ResponseBody 
パブリックアカウントJSON（文字列名、文字列のパスワード）{ 
アカウントのアカウント = 新しいアカウント（）。
account.setUsername（ユーザー名）; 
account.setPassword（パスワード）; 
リターンアカウント; 
}

答えはノー、例外がスローされますされ、400不正な要求の
理由がある：contentTypeのは：「アプリケーション/ JSONのデータ送信がModle、ない単一のプロパティをバックに受信されなければならない、と@RequestBodyコメントを追加する必要があります。
我々は、デフォルトのcontentTypeのcontentTypeを交換した場合：「アプリケーション/ X-WWW -体- URLエンコード」それ、フロントとどのように私は書くべきですか？

次のようにAJAXを言葉で表現します：

$（関数（）{ 
$（ "#submit" ）.click（関数（）{ 
$アヤックス（{ 
タイプ： "POST" 、
 / * のcontentType： 'アプリケーション/ x-www-form-urlencodedで' * / 
URL ： '<％=パス％> /データバインド/ JSON' 、
データ型： "JSON" 、
データ：{ユーザー名：$（ '#username' ）.val（）、
パスワード：$（ '#password' ）.val（） }、
成功：関数（データ）{ 
アラート（ 'ユーザ名： '+ data.username +' \ npassword：' + data.password）; 
} 
}）; 
}）; 
}）;

ここでは、データがここに渡すように見えるけれども、我々は、言及する必要がありますJSONオブジェクトはあるが、アプリケーション/ x-www-form-urlencodedでの使用は、最終的には実際には、放火犯で見ることができ、最終パスの過去またはユーザ名=管理者＆パスワード= 123456は、もちろん、あなたが直接、過去に文字列を渡すことができますが、一つのことは、実際のプロジェクトまたはフィールドの特に大きな数が、そのようなスプライシングはかなり退屈することができ、注意することは、私たちは、jQueryのは、$を提供してくれ、私たちが使用するための方法が存在しているはず（ "#login"）。シリアライズ（）直列化された形式。

$（関数（）{ 
$（ "#submit" ）.click（関数（）{ 
VARのparams = $（ "＃ログイン"）シリアライズ（）; // 序列化表单
警報（のparams）; 
$アヤックス（{ 
タイプ： "POST" 、
URL： '<％=パス％> /データバインド/ JSON' 、
データ型： "JSON" 、
データ：パラメータ、
成功：機能（データ）{ 
警告（「ユーザ名： '+ data.username +' \ npassword：「+ data.password）; 
} 
}）; 
}）; 
}）;

背景受信は次のとおりです。

@RequestMapping（値= "JSON"、メソッド= {RequestMethod.POST}）
@ResponseBody 
パブリックアカウントJSON（文字列名、文字列のパスワード）{ 
アカウントのアカウント = 新しいアカウント（）。
account.setUsername（ユーザー名）; 
account.setPassword（パスワード）; 
リターンアカウント; 
}

私は、フィールドを受け入れるために必要な、より具体的には、やるならば、私はまた、20のようなもののパラメータを、書くための方法が必要であることをここに問題を提起するには、まだ消耗しません。
答えはもちろんです

@RequestMapping（値= "/ JSON"、メソッド= {RequestMethod.POST}）
@ResponseBody 
パブリックアカウントJSON（アカウントのアカウント）{ 
のSystem.out.println（アカウント）。
リターンアカウント; 
}

また、一つのことが言及する必要があり、多くの人々はそれが質量参加を受けて持参するモデルを見て、それが@RequestBodyコメントを追加する必要があると考えるべきではない、springmvcは中に入るために、相関値のパッケージをモデル化するのに役立ちます、Iここでは、このアノテーションを使用するだけでなく、そうは思わない、あなたを伝えるために、その目的は、あなたがjson->モデル、XMLベース>モデルの変換を支援することです、あなたのcontentTypeとの良好なフォーム送信、：アプリケーション/ X- www-form-urlencodedで返しますので、なぜこの余分コメントはまだ追加。
要約：

ます。<script type = "text / javascriptの"> 
$（関数（）{ 
$（ "＃のsubmit1" ）.clickに（関数（）{ 
VARのjson = {
 'ユーザ名'：$（ '：入力[名=ユーザ名]' ）.val（）、
 'パスワード'：$（ '：入力[名前=パスワード]' ）.val（）
}; 
// JSON字符串{ "ユーザ名"： "管理者"、 "パスワード"： "123456"} 
VAR POSTDATA = JSON.stringify（JSON）; // JSON对象转换JSON字符串
警告（POSTデータ）; 
$アヤックス（{ 
タイプ： 'POST' 、
contentTypeの： 'アプリケーション/ JSON' 、
 / ** 
*（默认：オブジェクト（そうでない場合は技術的には、文字列の場合）、オプションデータを通じて渡されたデータを、デフォルトでは）本当、 
*は、プロセスに転換されていますクエリ文字列は、既定のコンテンツタイプを一致させます。」ファイルアプリケーション/ x-www-form-urlencodedで。」 
*情報がfalseに設定されたDOMツリーまたは他の望ましくない変換情報を、送信する場合。
* / 
PROCESSDATA：偽、
URL： '<％=パス％> /データバインド/ requestbodybind' 、
データ型： 'JSON' 、
データ：POSTDATA、
成功：機能（データ）{ 
警告（「ユーザ名： '+ data.username +' \ npassword：「+ data.password）。
}、
エラー：関数（）{ 
アラート（ 'エラー...' ）。
} 
}）。
}）;    
}）; 
</ SCRIPT>

contentTypeの中$アヤックス（）の上に：「アプリケーション/ JSON」、データは、モデルパラメータを持つオブジェクトと背景JSON方式に変換する必要があり、そうでなければ、エラーメッセージ400を受け入れる必要があり、パラメータは、背景を受け入れられます。

@RequestMapping（値= "requestbodybind"、メソッド= {RequestMethod.POST}）
@ResponseBody 
パブリックアカウントrequestBodyBind（@RequestBodyアカウントのアカウント）{ 
するSystem.out.println（ "requestbodybind：" + アカウント）。
リターンアカウント; 
}

デフォルト$アヤックス（）のcontentTypeに：「アプリケーション/ X-WWW -体、URLエンコード」データ形式が送信された「XX = YY＆UU = IIである」データサーバのコンテンツの符号化タイプに情報送信されるデータJSONないオブジェクト。
$アヤックス（）が書き込まれていないの下には、デフォルトのタイプ「アプリケーション/ X-WWW-フォームはcontentTypeの -urlencoded」は、パラメータ型のデータは、単一の属性として送信されます。

機能initArrivePerson（divIdは）{ 
VAR jqids = $（ "＃のjqid"）のval（）; // 获得警情ID 
$アヤックス（{ 
タイプ： "ポスト" 、
URL：basePathを + "kscj / findArrivePerson.do" 、
データ：{ "jqid" ：jqids}、
データ型： "JSON" 、
非同期：偽、
キャッシュ：偽、
成功：機能（データ）{ 
$（ "＃" + divIdは）.htmlを（ "" ）; 
VARのarrivePerson = "" ;
 のため（VAR I = 0;私は<data.length;私は++ ）{ 
arrivePerson + = "<スパン>" ;+ = "の<input type = \"チェックボックス\」名= \ "cjrxm \"値= \ ' "+データ[I] .sjybh +" \' /> <スパン> "+データ[I] .sjyxm +" </スパン>」; 
arrivePerson + = "の<input type = \"隠された\ "名= \ "cjdbh \"値= \ ' "+データ[I] .cjdbh +" \' />" 。
arrivePerson + = "</ span>を" ; 
} 
$（ "＃" + divIdは）.append（arrivePerson）。
} 
}）。
}

背景が受け取るパラメータです。

（値= "/ findArrivePersonを" = { "アプリケーション/ JSONを、文字セット= UTF-8"を生成@RequestMapping }）
@ResponseBody 
公衆リスト<TItmpTcsDisposal> findArrivePerson（HttpServletRequestのREQ、HttpServletResponseのRESP、文字列jqid）{ 
リスト <TItmpTcsDisposal> arriveList = titmpGpsLocateinfoService.findNoRepeat（jqid）。
返すarriveListを。
}

彼は加えました：

注釈@RequestParamを使用する場合は、ときに使用しません

我々はすでに、それぞれ限りの方法として書き留め、値の単一種類の基本的なパラメータを受け入れるために、見てきた、と注釈が上を通過するものの値を取得できるようにする必要はありません、そして、なぜそれが@RequestParamこの注釈されている、と見ます多くの場所に使用しています。
実はこの注釈は、その有用性を持っている、それがnullであると文句を言うしない場合は、アノテーションを使用していない場合は、最初のタイプの基本的なパラメータとして、タイムパスから渡された、役に立たないですが、@RequestParamノートを使用する場合、エラーを渡さない場合、このパラメータは、時間は、しかし、依然として必ずしも@RequestParam（値=「ユーザ名」と、コンフィギュレーションを通過させなくてもよいので、通過している、= falseを必要）にも、他に注釈をあなたが値を超える設定することができ、フロントデスクを渡さない場合、そのような@RequestParam（値=「ユーザ名」、などのデフォルト値、与えるはdefaultValue =「のRuOを」）。
あなたは、パラメータは必要ありません渡すと、それが通過する場合は、必要な転送パラメータがデフォルト値を持つことができれば、その後、それを使用してください、それを使用しないでください、追加してください：私は、要約のノートがある作らデフォルト値をDEFAULTVALUE。

オリジナルブログます。https：//blog.csdn.net/u014079773/article/details/52984747