フロントエンドのAjaxの方法とバックエンドのデータの相互作用
学習の面でフロントエンドの場合は、CSS + HTML + JavaScriptは自己学習の場合にマスターする学習されているハードではないですが、あなたは試験の終了は、指針がないの損失になる前と後のデータ交換を実現したいです。そして、私はどのようなデータのインタラクティブな方法の前後端に来てみましょう。
フロントエンドとバックエンドのWebはどのように接続されています。
サイトのデータ処理は3層に分かれています。
HTMLコードの一部、などを実装するためのCSS / Javascriptのコードであってもよい第一層、プレゼンテーション層、。ページレイアウトやデザインは、フロントエンドコードによって実現されてもよいです。この層は表示層と呼ばれることができます。それはあなたがブラウザを表示するには、ページを開いて、です。
第二の層はサービス層で、この層は、データを処理する責任があります。一般的に使用されるコード言語ようにPHP、JSP、Javaとがあります。これらの言語のバックグラウンド処理アルゴリズムにより、フォアグラウンドデータ処理が戻りました。必要に応じてデータベースを操作するときは、その結果は、フロントページに戻ります。
第3の層は、このデータベースは、データを格納するために使用される、データ層です。CRUDデータベース操作は、ビジネスレイヤを操作することによって達成することができます。
①このページは、プレゼンテーション層に属していると、あなたが公開され、このページでは、一般的にCSS / JavaScriptを達成するためのHTMLタグで構成されています。今度は、データを入力する必要があります。
②その後、あなたが提出するトリガーバックグラウンド処理機構を押して、この時間は、データはバックエンドのコードが処理されて送信されます。このコードは、サイトによってはPHPなど、JSP、JAVAを有効にします。データベース操作に対応するコードは、プログラマ後のデータ処理に格納されたデータ等が予め設定されたアルゴリズムを受信することになります。
③データベース操作が正常に完了し、再度、フォームの成功に必要事項を記入あなたを通知するリターン命令であるサイドプレゼンテーション層を表示するビジネス層のコードの後
A.方法は、後端に向かって前端からパラメータを渡します
あなたが背景にデータを送信するために、送信ボタンをクリックして、フォーム1.フロントエンドの形、
2.フロントエンドの後端が応答を要求する、データ、データ処理を受け、その後、フロントエンドに戻します。
II。アヤックスから渡されたパラメータ、AJAX取得し、ポスト（ここでは、我々はAJAXを説明する）には二つの方法があります
アヤックスは何ですか
1、Ajaxの非同期JavaScriptとXML、または非同期のJavaScript + XMLの略です。
技術的な解決策ではなく、新しい技術である2、。
3、それは既存のCSS / HTML / JavaScriptに依存し、のコアは、ブラウザが提供するXMLHttpRequestオブジェクトに依存しています。このオブジェクトは、サーバーに要求を送信し、サーバの応答を解析するとスムーズなインターフェースを提供し、ブラウザは、HTTPリクエストとHTTPレスポンスの受信を行ったページの場合には、データ交換のために実装し、サーバーが更新されない可能
AjaxとXMLHttpRequestの間の関係を：私たちは、Ajaxリクエストを送信するためにXMLHttpRequestオブジェクトを使用します。
Ajaxの長所と短所について：
取得し、二つの方法で投稿：
主にデータを主に用いGETを受信し、データを送信するために使用される1.POST、
セキュリティ2.PSOT良好送信データ、およびGetが悪い;
3.POST送信データのサイズが限定されるものではなく、大きさが限られたGET 2〜100Kです。
GETとPOSTを使用する場合：データ収集における運用データでなければなりませんPOSTメソッドを使用して、GETメソッドを使用して。
Ajaxを使用
1。Varの AJAX = 新しい新規のXMLHttpRequest（）; 2 .AJAX.open（' GET '、' データ/ test.json '、真の）; 最初のパラメータ：POST || GET 第二パラメータ：リクエストURLに 最初三つのパラメータ：ブール値を受け入れるには、道尋ねることにしました 。サーバー要求は、スクリプトの実行サーバーsend（）メソッドの結果を待たずに、つまり、非同期ですが、スクリプトコードを実行し続けて、trueにする 偽でありますタイムアウトの待機時間は、その後、何の待ち時間は、スクリプトコードの後ろに進んでいない場合は、サーバー、サーバー要求が同期している、すなわち、スクリプトの実行send（）メソッドが返すの実行結果を待っています！ 3 .ajax.onreadystatechange = 関数（）{ IF（ajax.readyState == 4 && ajax.statusの== 200です）{ func_succ（ajax.responseText）。 } それ以外の 場合（ajax.readyState == 4 && ajax.status =！200 ）{ // 警告（ "AJAX faildのreadyState：" + ajax.readyState + "状態：" + ajax.status）。 } }。 4 .ajax.send（NULL）。
ajax.readystate