ホームページ > 記事 > ウェブフロントエンド > ajax_javascript スキルの説明、使用法、get と post の違い
ajax_javascript スキルの説明、使用法、get と post の違い
- WBOYオリジナル
- 2016-05-16 17:45:41965ブラウズ
私はこれまで ajax をあまり注意深く勉強したことがなく、問題を見つけて解決策を見つけたときに使用しました。
1. Ajax Get と Post の違いについて説明します
Get メソッド:
get メソッドを使用して単純なデータを送信しますが、サイズは通常 1KB に制限されます。が URL に追加されます。送信 (HTTP ヘッダー送信)。つまり、ブラウザーは、各フォーム フィールド要素とそのデータを、URL パラメーターの形式でリクエスト ラインのリソース パスの末尾に追加します。最も重要なことは、クライアントのブラウザによってキャッシュされるため、他の人がブラウザの履歴からアカウント番号やパスワードなどの顧客データを読み取ることができるということです。したがって、場合によっては、get メソッドが重大なセキュリティ問題を引き起こす可能性があります。
Post メソッド:
POST メソッドを使用すると、ブラウザは各フォーム フィールド要素とそのデータを、HTTP メッセージのパラメータとしてではなく、HTTP メッセージのエンティティ コンテンツとして Web サーバーに送信します。 URL アドレスの送信。POST メソッドを使用した場合、送信されるデータ量は GET メソッドを使用した場合よりもはるかに大きくなります。
つまり、GET メソッドは送信するデータ量が少なく、処理効率が高く、セキュリティが低く、キャッシュされますが、POST ではその逆が当てはまります。
get メソッドを使用する場合は、次の点に注意してください。 :
1 get リクエスト (または URL に渡されたパラメータを含むもの) の場合、渡されたパラメータは最初に encodeURIComponent メソッドによって処理される必要があります。例: var url = "update.php?username=" encodeURIComponent(username) "&content=" encodeURIComponent
(content) "&id=1" ;
Post メソッドを使用する場合は注意してください :
1. ヘッダーの Context-Type を application/x-www-form-urlencode に設定して、サーバーがエンティティにパラメーター変数があることを認識できるようにします。通常は SetRequestHeader("Context-Type", "application) XmlHttpRequest オブジェクトの /x-www-form-urlencoded" が使用されます ;")。例:
xmlHttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
2. パラメーターは、名前と値が 1 対 1 で対応するキーと値のペアです。たとえば、var name=abc&sex=man&age=18 と var name=?abc&sex=man&age=18 を使用します。 =18 はどちらも誤りです。
3. パラメーターは Send (パラメーター) メソッドで送信されます。例: xmlHttp.send(name); 4. サーバー側のリクエスト パラメーターは、Get と Post を区別します。 get メソッドの場合は $username = $_GET["username"]; post メソッドの場合は $username = $_POST["username"]; Post メソッドと Get メソッドは次のとおりです。
:
1. Post がデータを送信する場合、URL にデータを表示する必要はありませんが、Get メソッドは URL に表示する必要があります。
2.Post は 2M に達する大量のデータを送信しますが、Get メソッドは URL の長さの制限により約 1024 バイトしか転送できません。
3.Post は、名前が示すように、送信することを目的としています。 Get がサーバー セグメントにデータを送信できる理由は、http リクエストの内容としてどのような種類のデータが必要であるかをサーバーに伝えるためだけです。 Get は送信される Http ヘッダーに含まれます。 get メソッドは、Request.QueryString["strName"] を使用して受信します。post メソッドは、Request.Form["strName"] を使用して受信します。
注:
2 つの送信メソッドは統合できますが、 , Request("strName ") を使用して送信されたデータを取得しますが、これはプログラムの効率に影響するため、お勧めできません。
一般に、フォームの送信に Get メソッドの使用は避けてください。セキュリティ上の問題が発生する可能性があります。
AJAX コードの文字化けの問題
コードの文字化けの原因:
1. xtmlhttp が返すデータのデフォルトの文字エンコーディングは utf-8 です。クライアントページが gb2312 などのエンコードされたデータの場合、文字化けが発生します
2. 投稿で送信されたデータのデフォルトの文字エンコーディングメソッドは utf-8 です。サーバーが gb2312 である場合、または他のエンコードされたデータでは文字化けが発生します。解決策は次のとおりです。: 1。クライアントが gb2312 エンコードの場合、出力を指定します。サーバー上のストリームエンコーディング
2. サーバー側はクライアントとクライアントの両方で utf-8 エンコーディングを使用します
gb2312:header('Content-Type:text/html;charset=GB2312'); header('Content-Type:text/html;charset=utf -8');
注: 上記のメソッドを実行しても文字化けが返される場合は、メソッドが get リクエスト (またはその他) であるかどうかを確認してください。パラメータを渡すURLを含む)、渡されたパラメータは最初にencodeURIComponentメソッドで処理される必要があります。encodeURIComponentで処理されないと文字化けも発生します。
以下は私が見つけた例です。私が書いたものは比較的簡単で、あまり標準的ではないので、他の人が書いたものを参照する方が良いです（笑）。
コードをコピー
コードは次のとおりです:
var http_request = false;
function makePOSTRequest(url, パラメータ) {
http_request = false;
if (window.XMLHttpRequest) { // Mozilla、Safari、...
http_request = new XMLHttpRequest();
if (http_request.overrideMimeType) {
// 予想されるコンテンツ タイプに応じてタイプを設定します
//http_request.overrideMimeType('text/xml');
http_request.overrideMimeType('text/html');
}
} else if (window.ActiveXObject) { // IE
try {
http_request = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e) {
try {
http_request = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e) {}
}
}
if (!http_request) {
alert('XMLHTTP インスタンスを作成できません');
false を返します。
}
http_request.onreadystatechange =alertContents;
http_request.open('POST', url, true);
http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http_request.setRequestHeader("コンテンツの長さ", パラメーター.長さ);
http_request.setRequestHeader("接続", "閉じる");
http_request.send(パラメータ);
}
関数alertContents() {
if (http_request.readyState == 4) {
if (http_request.status == 200) {
//alert(http_request.responseText);
結果 = http_request.responseText;
document.getElementById('myspan').innerHTML = 結果;
} else {
alert('リクエストに問題がありました。');
}
}
}
function get(obj) {
var poststr = "mytextarea1=" encodeURI( document.getElementById("mytextarea1").value )
"&mytextarea2= " encodeURI( document.getElementById("mytextarea2").value );
makePOSTRequest('post.php', poststr);
}
post.php
一超大文本框textarea里面有量の数据，ajax通过URL请求サービス返结果，URLここにはさまざまなパラメータが含まれていますが、当然、以前の超大規模なテキスト ボックスのコンテンツも含まれています。 以前にリリースされた Firefox では、テキストエリアにある 4000 の長さの文字列が URL 要求でまったく問題ありませんでした。回答しました。IE の下で、テキストエリアの文字の長さが 2000 (大まかなデータ) を超えているときに、JS 認証が行われ、ajax がフロント 台に戻り値を返しませんでした。元のコードを参照してください。 >
复制代
ajax.send(null);
試してください
{
eval("var s = " ajax.responseText);
s を返します。
}
catch(e)
{
null を返す;
}
}
関数 getData(){
var url="BlacklistService.do?datas=" datasvalue;
var result = getJsonData(url);
}
ネット上での Google 公開解決法: 変更された使用する XMLHttp の要求は POST になり、パラメーターと URL が分離されます。 >
复制代码
代码如下:
{
eval("var s = " ajax.responseText);
s を返します。
}
catch(e)
{
null を返す;
}
}
function getData(){
var url="BlacklistService.do";
var para="datas=" データ値;
var result = getJsonData(url,para);
}
================================
get リクエスト メソッドと post リクエスト メソッドの類似点と相違点Ajax 2008 年 10 月 4 日土曜日 02:37 pm Ajax では、get リクエストと post リクエストをよく使用します。では、答える前に、まず get と post の違いを理解します。
1. Get は、送信されたフォームの ACTION 属性が指す URL にパラメーター データ キューを追加します。値はフォームの各フィールドに 1 対 1 で対応します。 URLで見れます。 Post は、HTTP post メカニズムを使用して、フォーム内の各フィールドとそのコンテンツを HTML HEADER に配置し、それを ACTION 属性が指す URL アドレスに送信します。ユーザーはこのプロセスを見ることができません。
2. get メソッドの場合、サーバー側は Request.QueryString を使用して変数の値を取得します。 post メソッドの場合、サーバー側は Request.Form を使用して送信されたデータを取得します。どちらの方法でもパラメータはリクエストを使用して取得できます。
3. get によって送信されるデータの量は少なく、2KB を超えることはできません。郵便で送信されるデータの量は比較的多く、通常はデフォルトでは制限がありません。ただし、理論上はサーバーごとに異なります。
4. get のセキュリティは非常に低いですが、post のセキュリティは高くなります。
5.