>  기사  >  웹 프론트엔드  >  Fetch GET 요청에 쿼리 문자열 매개변수를 추가하는 방법은 무엇입니까?

Fetch GET 요청에 쿼리 문자열 매개변수를 추가하는 방법은 무엇입니까?

Linda Hamilton
Linda Hamilton원래의
2024-10-26 00:46:02940검색

How to add query string parameters to Fetch GET requests?

Fetch GET 요청의 쿼리 문자열 추가

Fetch API의 쿼리 문자열 기능을 탐색하는 동안 개발자는 jQuery의 $와 유사한 메서드를 사용하여 GET 요청에 매개변수를 전달하는 것을 목표로 합니다. .ajax().

솔루션

새로운 Fetch API는 URLSearchParams를 사용하여 쿼리 문자열 추가를 처리합니다. 이 객체는 쿼리 문자열 매개변수를 작성하고 수정하는 편리한 방법을 제공합니다.

<code class="javascript">fetch('https://example.com?' + new URLSearchParams({
    foo: 'value',
    bar: 2,
}).toString())</code>

URLSearchParams.toString() 메소드는 매개변수 객체를 적절한 형식의 쿼리 문자열로 인코딩합니다.

또는 JavaScript는 문자열과 연결될 때 문자열이 아닌 객체를 자동으로 문자열로 강제 변환하므로 .toString() 호출을 생략할 수 있습니다. 이 접근 방식을 사용하려면 JavaScript에 대한 더 깊은 이해가 필요합니다.

전체 예

다음은 쿼리 매개변수가 포함된 포괄적인 예입니다.

<code class="javascript">async function doAsyncTask() {
  const url = (
    'https://jsonplaceholder.typicode.com/comments?' +
    new URLSearchParams({ postId: 1 }).toString()
  );

  const result = await fetch(url)
    .then(response => response.json());

  console.log('Fetched from: ' + url);
  console.log(result);
}

doAsyncTask();</code>

위 내용은 Fetch GET 요청에 쿼리 문자열 매개변수를 추가하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.