[解決済み】Fetch GETリクエストでクエリ文字列を設定する。

質問

新しい Fetch API :

を作っています。 GET のようにリクエストします。

var request = new Request({
  url: 'http://myapi.com/orders',
  method: 'GET'
});
fetch(request);

しかし、クエリ文字列をどのように GET をリクエストしてください。理想を言えば GET へのリクエストは URL のようなものです。

'http://myapi.com/orders?order_id=1'

で jQuery を渡せばできるのですが {order_id: 1} を data のパラメータは $.ajax() . 新しい Fetch API ?

解決方法は？

2017年3月の更新情報です。

URL.searchParams のサポートは Chrome 51 で正式に導入されましたが、他のブラウザではまだ ポリフィル .

は オフィシャル は、クエリパラメータをURL上に追加することで、クエリパラメータを使用することができます。以下はその例です。 仕様書 これはその一例です。

var url = new URL("https://geo.example.org/api"),
    params = {lat:35.696233, long:139.570431}
Object.keys(params).forEach(key => url.searchParams.append(key, params[key]))
fetch(url).then(/* … */)

しかし、Chrome が searchParams プロパティを使用する必要があります。 サードパーティライブラリ または ロールユアオウンソリューション .

2018年4月更新。

を使用することで URLSearchParams コンストラクタ 2次元配列やオブジェクトを代入して、それを url.search すべてのキーをループして追加する代わりに

var url = new URL('https://sl.se')

var params = {lat:35.696233, long:139.570431} // or:
var params = [['lat', '35.696233'], ['long', '139.570431']]

url.search = new URLSearchParams(params).toString();

fetch(url)

参考までに URLSearchParams は、NodeJSでも利用可能です

const { URL, URLSearchParams } = require('url');