- $.get()と$.post()は別の機能ではありません
- 実際の内部動作
- GETとPOSTの違い(jQueryの話ではない)
- jQueryが自動で行っている処理
- 返り値にも重要な意味がある
- 注意点:$.postはJSON送信ではない
- キャッシュの挙動
- なぜ$.getと$.postが用意されたのか
- まとめ
$.get()と$.post()は別の機能ではありません
結論から書きます。
jQueryの`$.get()`と`$.post()`は専用の通信機能ではありません。
どちらも中身は`$.ajax()`です。
つまり、
- $.get() … GETを指定した$.ajaxのショートカット
- $.post() … POSTを指定した$.ajaxのショートカット
単なる省略記法です。
通信の仕組みが変わるわけではありません。
これを知らないと、「GETは軽くてPOSTは重い」「$.postの方が安全」といった誤解を持ちやすくなります。
実際の内部動作
まず、次のコードを見てください。
$.get("/api/user", function(data){ console.log(data); });
これは内部的にはほぼ次と同じ処理になります。
$.ajax({ url: "/api/user", type: "GET", success: function(data){ console.log(data); } });
`$.post()`も同様です。
$.post("/api/login", {id:"user", pass:"1234"});
内部ではこう変換されます。
$.ajax({ url: "/api/login", type: "POST", data: {id:"user", pass:"1234"} });
つまり`$.get`と`$.post`は、新しい通信手段ではなく、
`$.ajax`の設定を自動で埋めるラッパー関数です。
GETとPOSTの違い(jQueryの話ではない)
ここで重要なのは、違いはjQueryではなくHTTPにあります。
| 項目 | GET | POST |
| 用途 | 取得 | 送信 |
| データ位置 | URLクエリ | リクエストボディ |
| キャッシュ | される | 通常されない |
| 長さ制限 | あり | ほぼなし |
jQueryはこのHTTPメソッドを指定しているだけです。
例えば次のコード:
$.get("/search", {q:"javascript"});
実際にはURLがこうなります。
/search?q=javascript
一方POSTはボディに入ります。
jQueryが自動で行っている処理
`$.get()`と`$.post()`は、次の面倒な処理を自動化しています。
1. クエリ文字列の生成**
{a:1, b:2}
は自動で
a=1&b=2
に変換されます。
2. URLエンコード**
日本語や記号を安全な形式に変換します。
開発者が`encodeURIComponent`を書く必要はありません。
3. Content-Type設定(POST時)**
POSTでは自動的に以下が付与されます。
application/x-www-form-urlencoded
これはサーバ側でフォーム送信として受け取れる形式です。
4. レスポンス解析**
JSONが返れば自動でオブジェクト化されます。
返り値にも重要な意味がある
`$.get()`と`$.post()`の返り値は単なる結果ではありません。
jqXHRオブジェクト(Deferred)です。
つまり次のように書けます。
$.get("/user").done(function(u){ console.log(u); });
ここが普通の関数との違いです。
通信開始と結果取得が分離されています。
注意点:$.postはJSON送信ではない
非常に多い誤解です。
$.post("/api", {name:"taro"});
これはJSON送信ではありません。
フォーム送信です。
サーバにはこう届きます。
name=taro
JSONとして送りたい場合は`$.ajax()`を使います。
$.ajax({ url:"/api", type:"POST", contentType:"application/json", data: JSON.stringify({name:"taro"}) });
ここを間違えるとAPIと通信できません。
jQuery利用時の典型的なトラブルです。
キャッシュの挙動
GETはブラウザキャッシュされます。
そのため、同じリクエストを送っても通信が発生しない場合があります。
jQueryはこれを避けるため、内部で次を追加することがあります。
?_={timestamp}
いわゆるキャッシュバスターです。
開発時に「通信していないように見える」問題の回避策でした。
なぜ$.getと$.postが用意されたのか
理由は可読性です。
当時のWeb開発ではAjax通信が頻繁に書かれていました。
毎回`$.ajax({ type:"GET"... })`と書くのは冗長です。
- 取得 → $.get
- 送信 → $.post
とすることでコードの意図が明確になります。
つまり機能の違いではなく、読みやすさのためのAPIです。
まとめ
`$.get()`と`$.post()`はjQuery独自の通信方式ではありません。
`$.ajax()`の設定を簡略化したショートカットです。
違いはjQueryではなくHTTPの仕様にあります。
そして内部では、クエリ生成・エンコード・ヘッダ設定・レスポンス解析といった多くの処理を自動で行っています。
便利な関数ですが、JSON送信ではない点だけは注意が必要です。
ここを理解すると、jQueryのAjax通信の挙動が一気に読み解けるようになります。