POST変数がURL文字列に表示されるのはなぜですか？

Question

ボタンクリックに基づいてajax投稿機能を実装しました。コードは、私は、変数がURL経由で見えるようにしたくないので、私は、POSTメソッドを指定

$.ajax({ 
    type: "POST", 
    url: "includes/phpscripts?action=manage", 
    data: {location: loc, lat: latitude, lon: longitude, heading: head, filename: file}, 
    success: function(){ 
     $("#panoInfo").html("<div id='message'></div>"); 
     $("#message").html("Valid Submission"); 
    } 
}); 

です。しかし、彼らはそうです。投稿する前に

私のテストのURLは

http://localhost/JMCTour/buildtour.php 

その後

http://localhost/JMCTour/buildtour.php?filename=1-prefix_blended_fused.jpg&location=Start+of+Tour&lat=43.682211&long=-70.450705&heading=100&submit=Save 

のはなぜですか？ docs for jQuery.ajax（強調鉱山）から

Answer 1

：

データサーバに送信する

データ。まだ文字列でない場合は、クエリ文字列に変換されます。これはGETリクエストのURLに追加されています。 この自動処理を防止するには、processDataオプションを参照してください。オブジェクトはキー/値のペアでなければなりません。 valueが配列の場合、jQueryは従来の設定値（後述）に基づいて同じキーで複数の値をシリアル化します。

したがって：

processDataBoolean

デフォルト：trueデフォルトで

、オブジェクトとしてデータオプションに渡されたデータ（技術的には、文字列以外のもの）が処理され、デフォルトのコンテンツタイプ "application/x-www-form-urlencoded"に適合するクエリ文字列に変換されます。 DOMDocumentやその他の未処理データを送信する場合は、このオプションをfalseに設定します。

Answer 2

ここでは、質問の情報が不足しているため、ここでかなりの仮定をしています。

<form> 
    <input type="text" name="lon" /> 
    <input type="text" name="lat" /> 
    <input type="text" name="heading" /> 
    <input type="file" name="image" /> 

    <input type="button" id="submit" value="Submit" /> 
</form> 

はすぐに我々は問題を抱えている、あなたのファイル入力：より詳細

はおそらく、あなたのフォームは次のようになります。ファイルは、jQueryのajaxメソッドを使ってajax経由で送信することはできません。バックグラウンドで正しく処理するプラグインを追加したり、隠しiframeやその他のメソッド（html5？flash？）にコードを書き込む必要がありません。

ファイル入力を無視して、ここに元の問題があります。

$("#submit").click(function(){ 
    $.ajax(...); 
}); 

私はajaxオプションが無関係であるため省略しました。問題は、フォームのボタンがフォームの最後の入力であり、送信ボタンがないため、デフォルトアクションを妨げない限り、送信ボタンのように動作しフォームを送信することです。そのデフォルトアクションを防止しないと、フォームにタイプを設定しなかったため、デフォルトタイプの "GET"でフォームが送信されます。

のいずれか、クリックイベントのデフォルトのアクションを防ぐfalseを返す、またはファイル入力の問題を修正event.preventDefault()

$("#submit").click(function(event){ 
    event.preventDefault(); 
    $.ajax(...); 
}); 

を使用するには、おそらくすでにいくつかの他のSOの質問に答えています。

Answer 3

フォームタグがmethod='POST'

<form method='POST'> 
... 
</form>