我正在尝试使用新的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}作为$.ajax()的数据参数来做到这一点。在新的Fetch API中，是否有等效的方法来做到这一点?
当前回答
正如前面所回答的，这在fetch-API中是不可能实现的。但我必须指出:
如果你在node上，有querystring包。它可以stringify/解析对象/查询字符串:
var querystring = require('querystring')
var data = { key: 'value' }
querystring.stringify(data) // => 'key=value'
.．.然后把它附加到url请求。
然而，上面的问题是，您总是必须在前面加上一个问号(?)。所以，另一种方法是使用解析方法从节点url包，并做如下:
var url = require('url')
var data = { key: 'value' }
url.format({ query: data }) // => '?key=value'
参见https://nodejs.org/api/url.html#url_url_format_urlobj查询
这是可能的，因为它内部是这样做的:
search = obj.search || (
obj.query && ('?' + (
typeof(obj.query) === 'object' ?
querystring.stringify(obj.query) :
String(obj.query)
))
) || ''
其他回答
我知道这是非常明显的陈述，但我觉得有必要加上这个作为答案，因为它是所有答案中最简单的:
const orderId = 1;
fetch('http://myapi.com/orders?order_id=' + orderId);
也许这样更好:
const withQuery = require('with-query');
fetch(withQuery('https://api.github.com/search/repositories', {
q: 'query',
sort: 'stars',
order: 'asc',
}))
.then(res => res.json())
.then((json) => {
console.info(json);
})
.catch((err) => {
console.error(err);
});
let params = {
"param1": "value1",
"param2": "value2"
};
let query = Object.keys(params)
.map(k => encodeURIComponent(k) + '=' + encodeURIComponent(params[k]))
.join('&');
let url = 'https://example.com/search?' + query;
fetch(url)
.then(data => data.text())
.then((text) => {
console.log('request succeeded with JSON response', text)
}).catch(function (error) {
console.log('request failed', error)
});
模板文字在这里也是一个有效的选项，并提供了一些好处。
你可以包括原始字符串，数字，布尔值等:
let request = new Request(`https://example.com/?name=${'Patrick'}&number=${1}`);
你可以包含变量:
let request = new Request(`https://example.com/?name=${nameParam}`);
你可以包括逻辑和函数:
let request = new Request(`https://example.com/?name=${nameParam !== undefined ? nameParam : getDefaultName() }`);
至于构造较大查询字符串的数据，我喜欢使用连接到字符串的数组。我发现它比其他一些方法更容易理解:
let queryString = [
`param1=${getParam(1)}`,
`param2=${getParam(2)}`,
`param3=${getParam(3)}`,
].join('&');
let request = new Request(`https://example.com/?${queryString}`, {
method: 'GET'
});
你可以从query-string中使用stringify。
import { stringify } from 'query-string';
fetch(`https://example.org?${stringify(params)}`)
