jQuery で Ajax でデータを POST 送信する際にオブジェクトで値を渡すと自動的にエンコードしてくれる

私は jQuery で Ajax を使ってデータを POST で送信する際に以下のようにコードを書いていて躓きました。

1
2
3
4
5
6
7
8
9
10
11
12
var hoge = 'str&ing';
var fuga = 'string';
 
var data = 'hoge=' + hoge + '&fuga=' + fuga;
$.ajax({
	type: "POST",
	url: "/ajax/add",
	data: data,
	success: function() {
		alert('success');
	}
});

4行目に注目します。このように文字列で値を渡してしまうと、値に & が含まれている場合において、値が途中で切れてしまいますね。

1
2
3
4
5
6
7
8
9
10
11
12
var hoge = 'str&ing';
var fuga = 'string';
 
var data = {hoge:hoge, fuga:fuga};
$.ajax({
	type: "POST",
	url: "/ajax/add",
	data: data,
	success: function() {
		alert('success');
	}
});

こうすると自動的にエスケープされて送信されます。

コメント

コメントは受け付けていません。