[js] fetch() query 전송, 사용법

Edward Hyun·2022년 4월 21일
0

app&web-dev

목록 보기
107/178
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) });
var data = { "KEY" : "VALUE" };
var url = new URL("http://site.com/API");
for (let k in data) { url.searchParams.append(k, data[k]); }
fetch(url);

fetch 결과를 json() or test() 처리를 해 줘야 한다. 그리고 await를 해 줘야 promise 객체가 벗겨진 값이 변수에 들어간다.

const result = await fetch("http://site.com/API")
.then((res) => res.json())

출처:
https://tristan91.tistory.com/611
https://code-boxx.com/javascript-fetch-get-query-params/
https://developer.mozilla.org/ko/docs/Web/API/Fetch_API/Using_Fetch

profile
앱&웹개발(flutter, vuejs, typescript, react), 인공지능(nlp, asr, rl), 백엔드(nodejs, flask, golang, grpc, webrtc, aws, msa, nft, spring cloud, nest.js), 함수형 프로그래밍(scala, erlang)을 공부하며 정리합니다.

0개의 댓글