Zwięzłe podejście ES6:

fetch('https://example.com?' + new URLSearchParams({
    foo: 'value',
    bar: 2,
}))

Funkcja URLSearchParams toString() przekonwertuje zapytanie args do ciągu znaków, który może być dołączony do adresu URL. W tym przykładzie metoda ToString () jest wywoływana domyślnie, gdy zostanie połączona z adresem URL. Prawdopodobnie będziesz chciał jawnie wywołać ToString (), aby poprawić czytelność.

IE nie obsługuje URLSearchParams (lub fetch), ale istnieją polyfills dostępne .

Jeśli używasz node, możesz dodać fetch API poprzez pakiet node-fetch . URLSearchParams jest dostarczany z węzłem i można go znaleźć jako obiekt globalny od wersji 10. W starszej wersji można ją znaleźć pod adresem require('url').URLSearchParams.

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)
  });

Jak już odpowiedziałem, jest to na spec nie możliwe z fetch - API, jeszcze. Ale muszę zauważyć:

Jeśli jesteś na node, jest querystring Pakiet. Może on stringify / parse objects/querystrings:

var querystring = require('querystring')
var data = { key: 'value' }
querystring.stringify(data) // => 'key=value'

...następnie po prostu dołącz go do adresu url, aby zażądać.

Problem z powyższym polega jednak na tym, że zawsze trzeba przedłożyć znak zapytania (?). Innym sposobem jest użycie metody parse z pakietu nodes url i zrobienie tego jako następuje:

var url = require('url')
var data = { key: 'value' }
url.format({ query: data }) // => '?key=value'

Zobacz query w https://nodejs.org/api/url.html#url_url_format_urlobj

Jest to możliwe, ponieważ robi to wewnętrznie tylko to :

search = obj.search || (
    obj.query && ('?' + (
        typeof(obj.query) === 'object' ?
        querystring.stringify(obj.query) :
        String(obj.query)
    ))
) || ''

Możesz użyć #stringifyz ciągu zapytania

import { stringify } from 'query-string';

fetch(`https://example.org?${stringify(params)}`)

EncodeQueryString-kodowanie obiektu jako parametrów querystring

/**
 * Encode an object as url query string parameters
 * - includes the leading "?" prefix
 * - example input — {key: "value", alpha: "beta"}
 * - example output — output "?key=value&alpha=beta"
 * - returns empty string when given an empty object
 */
function encodeQueryString(params) {
    const keys = Object.keys(params)
    return keys.length
        ? "?" + keys
            .map(key => encodeURIComponent(key)
                + "=" + encodeURIComponent(params[key]))
            .join("&")
        : ""
}

encodeQueryString({key: "value", alpha: "beta"})
 //> "?key=value&alpha=beta"

Może tak będzie lepiej:

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);
});

Wiem, że jest to absolutna oczywistość, ale uważam, że warto dodać to jako odpowiedź, ponieważ jest najprostsza ze wszystkich:

const orderId = 1;
fetch('http://myapi.com/orders?order_id=' + orderId);

Rozwiązanie bez zewnętrznych pakietów

Aby wykonać polecenie GET używając API fetch pracowałem nad tym rozwiązaniem, które nie wymaga instalacji pakietów.

// encode to scape spaces
const esc = encodeURIComponent;
const url = 'https://maps.googleapis.com/maps/api/geocode/json?';
const params = { 
    key: "asdkfñlaskdGE",
    address: "evergreen avenue",
    city: "New York"
};
// this line takes the params object and builds the query string
const query = Object.keys(params).map(k => `${esc(k)}=${esc(params[k])}`).join('&')
const res = await fetch(url+query);
const googleResponse = await res.json()

Skopiuj ten kod i wklej go na konsolę, aby zobaczyć, jak to działa!!

Wygenerowany adres url to coś w stylu:

https://maps.googleapis.com/maps/api/geocode/json?key=asdkf%C3%B1laskdGE&address=evergreen%20avenue&city=New%20York

To właśnie szukałem zanim postanowiłem to napisać, enjoy: D

Literały szablonów są również ważną opcją tutaj i zapewniają kilka korzyści.

Możesz zawierać surowe ciągi znaków, liczby, wartości logiczne itp.:

    let request = new Request(`https://example.com/?name=${'Patrick'}&number=${1}`);

Możesz dołączyć zmienne:

    let request = new Request(`https://example.com/?name=${nameParam}`);

Możesz dołączyć logikę i funkcje:

    let request = new Request(`https://example.com/?name=${nameParam !== undefined ? nameParam : getDefaultName() }`);

Jeśli chodzi o strukturyzację danych większego ciągu zapytania, lubię używać tablicy połączonej z łańcuchem. Uważam, że jest to łatwiejsze do zrozumienia niż niektóre z innych metod:

let queryString = [
  `param1=${getParam(1)}`,
  `param2=${getParam(2)}`,
  `param3=${getParam(3)}`,
].join('&');

let request = new Request(`https://example.com/?${queryString}`, {
  method: 'GET'
});

Pracowałem właśnie z Fetchmodule Nativescript i wymyśliłem własne rozwiązanie używając manipulacji łańcuchami. Dołącza ciąg zapytania bit po bitu do adresu url. Oto przykład, w którym zapytanie jest przekazywane jako obiekt json (query = {order_id: 1}):

function performGetHttpRequest(fetchLink='http://myapi.com/orders', query=null) {
    if(query) {
        fetchLink += '?';
        let count = 0;
        const queryLength = Object.keys(query).length;
        for(let key in query) {
            fetchLink += key+'='+query[key];
            fetchLink += (count < queryLength) ? '&' : '';
            count++;
        }
    }
    // link becomes: 'http://myapi.com/orders?order_id=1'
    // Then, use fetch as in MDN and simply pass this fetchLink as the url.
}

Przetestowałem to na wielu parametrach zapytania i działało jak urok :) Mam nadzieję, że to komuś pomoże.

Var paramsdate=01+ '%s' + 12+'%s'+2012 + '%s';

Request. get (" https://www.exampleurl.com?fromDate=" + paramsDate;