質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.50%
JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

Q&A

解決済

2回答

9026閲覧

[javascript/ajax] GETリクエストでリクエストボディに値を含めたい

tomoyuki123

総合スコア273

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

jQuery

jQueryは、JavaScriptライブラリのひとつです。 簡単な記述で、JavaScriptコードを実行できるように設計されています。 2006年1月に、ジョン・レシグが発表しました。 jQueryは独特の記述法を用いており、機能のほとんどは「$関数」や「jQueryオブジェクト」のメソッドとして定義されています。

Ajax

Ajaxとは、Webブラウザ内で搭載されているJavaScriptのHTTP通信機能を使って非同期通信を利用し、インターフェイスの構築などを行う技術の総称です。XMLドキュメントを指定したURLから読み込み、画面描画やユーザの操作などと並行してサーバと非同期に通信するWebアプリケーションを実現することができます。

0グッド

1クリップ

投稿2019/04/18 08:15

編集2019/04/18 09:30

このようにするとクエリストリングで?name=John&time=2pmと値がURLにくっついてリクエストされると思います。

javascript

1$.get("test.php", { name: "John", time: "2pm" } );

今回リクエストパラメータがかなり大きくリクエストボディに値を含めたいです。
POSTリクエストにすればいいのですが、事情でGETリクエストを使わないといけません。

PHPで同様のことをやる方法はあるようなのですが、javascriptで実現する方法がわかりません。
cURLでbody付きのGETリクエスト

どなたか教えていただけないでしょうか?

[追記]
kei344さんに教えていただいたfetchでGETを使うとうまくいかないようです。

javascript

1var url = '/hoge/'; 2var data = {large_param: large_param}; 3fetch(url, { 4 method: 'GET', 5 body: JSON.stringify(data), 6 headers: { 7 'Content-Type': 'application/json' 8 } 9}).then(function (response) { 10 // do something 11}).catch(function (error) { 12 console.log(error); 13});
TypeError: Failed to execute 'fetch' on 'Window': Request with GET/HEAD method cannot have body.

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

x_x

2019/04/18 08:34

サーバー側で受け取れることは確認済みなのでしょうか?
tomoyuki123

2019/04/18 09:27

はい、POSTの場合は確認しました。
yambejp

2019/04/18 09:35

長くてもパラメーター渡しをすればいいような気がしますが なにかまずい理由でもあるのでしょうか? (昔のIEには確かに長さの上限がありましたけど)
yambejp

2019/04/18 09:49

その場合サーバー側の制限となると、ご提示されているPHPで やる方法で本当につながりますか? むしろ何をやっても無駄な可能性はありますが・・・
tomoyuki123

2019/04/18 09:56

提示しているPHPは適当な例です。(実際これに近いものでリクエストしていますが) ajaxでPOSTでリクエストボディに値を入れた状態でリクエストを送ると正常に動きます。
yambejp

2019/04/18 10:02

いやそうではなく、サーバー側がGETの総量を規制しているなら body的な手段をしても無駄ではないか?ということです phpなどでajaxでは送れないデータがほんとに送れるなら やりようはあるかもしれませんけど、phpで引っかかるなら そもそも命題じたい解決方法がありません
tomoyuki123

2019/04/18 10:06

そういうことなんですね。 URLとヘッダは16KBまでとのことだったので、リクエストボディに値を含めれば解決かと思っていました。
x_x

2019/04/19 03:29

> はい、POSTの場合は確認しました。 GET で body が取れるのか確認しなければ意味ないですが。 取得できるかどうかはサーバー依存のようですよ? ここが解決しなければいくらクライアントで送れるように考えても仕方ありません
guest

回答2

0

ベストアンサー

仕様上、GET 時の body は null に設定されます。
https://xhr.spec.whatwg.org/#the-send()-method

If the request method is GET or HEAD, set body to null.

生の XHR で実際に送れませんでしたので、ラッパーに過ぎない jQuery では当然送れません。
もしかしたら昔の IE なら送れる可能性もあるかもしれませんが、期待しないほうがいいでしょう。

投稿2019/04/18 09:11

x_x

総合スコア13749

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

x_x

2019/04/18 09:16

残るは Cookie ですか? POST にできればいいんですが
tomoyuki123

2019/04/26 02:50

みなさまありがとうございました。 とりあえずAPIをPOSTにしていただいたので掲題の件は解決しました。
guest

0

Fetch なら送れそうな気がします。

【Fetch を使う - Web API | MDN】
https://developer.mozilla.org/ja/docs/Web/API/Fetch_API/Using_Fetch

【fetch documentation】
https://github.github.io/fetch/#options

投稿2019/04/18 08:26

kei344

総合スコア69364

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

x_x

2019/04/18 08:41

Chromeなら "TypeError: Failed to execute 'fetch' on 'Window': Request with GET/HEAD method cannot have body." Firefoxなら "TypeError: HEAD or GET Request cannot have a body." となりいずれも失敗します。 手段があるのでしょうか?
tomoyuki123

2019/04/18 09:30

ありがとうございます。 ただ私も試したのですがx_xさんと同じエラーメッセージが出ました。
kei344

2019/04/18 10:22

To: x_xさん いえ、試していませんのでわかりません。「できない」と書かれていないようだったので「もしかしたら」程度で回答しています。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.50%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問