[fetch] url form data 예시
본문 바로가기

Network&etc/HTTP

[fetch] url form data 예시

 

https://blog.joyfui.com/1206

 

fetch url form data는

"no=1&name=blabla" 이러한 형태임 json이랑 다른형태

 

사용시 주의해야할점! 기존에 json으로 되어있지않은지 점검

'Content-Type': 'application/x-www-form-urlencoded'

 

res.status성공(200)이면 return res.json() 안해도됨

function create_seeker() {
	let strURL = '/api/주소'
	let form = document.forms[0]
	let form_data = new FormData(form)
	let url_form_data = new URLSearchParams(form_data)
	
	const init = {
		method: 'POST',
		headers: {
			'Content-Type': 'application/x-www-form-urlencoded',
			'credentials': 'same-origin'
		},
		body: url_form_data
	}

	fetch(strURL, init)
		.then(res => {
			if (res.status == 200) {
				alert('탐색기 추가 완료')
				리스트api호출()
			} else {
				console.error(`HTTP ERROR! status${res.status}`)
			}
		})
		.catch(err => {
			console.log(err)
		})
}
 

[JavaScript] fetch로 form data 보내기

최근에 jQuery로 만든 부분을 바닐라 JS로 바꾸고 있는데 이 과정에서 한 삽질 하나를 기록할 겸 글로 남긴다. jQuery에서 사용하던 $.ajax 를 fetch 로 바꿨다. 예를 들어 아래와 같은 코드가 있다면 $.aj

blog.joyfui.com

 

+

formdata로 추출한 데이터를 url_form_data로 바꾸기

	let form = document.forms[0]
	let form_data = new FormData(form)
	let url_form_data = new URLSearchParams(form_data)

 

반응형