QnAi로깅

JavaScript에서 Form 데이터를 한꺼번에 전송하는 방법은 다음과 같습니다.

1. Form 데이터를 저장할 FormData 객체를 생성합니다.

javascriptCopy code
const formData = new FormData();

2. FormData 객체에 Form 요소를 추가합니다.

javascriptCopy code
const form = document.querySelector('form');
formData.append('name', form.elements.name.value);
formData.append('email', form.elements.email.value);

3. Axios의 POST 메서드를 사용하여 FormData 객체를 서버로 전송합니다.

javascriptCopy code
axios.post('/api/submit', formData, {
  headers: {
    'Content-Type': 'multipart/form-data'
  }
}).then(response => {
  console.log(response.data);
}).catch(error => {
  console.error(error);
});

위 코드에서는 axios.post() 메서드를 사용하여 FormData 객체를 서버로 전송합니다. 두 번째 인수로 FormData 객체를 전달하고, Content-Type 헤더를 multipart/form-data로 설정하여 서버가 이 데이터를 올바르게 처리할 수 있도록 합니다. 전송에 성공하면 then() 메서드를 호출하여 서버 응답을 처리하고, 실패하면 catch() 메서드를 호출하여 오류를 처리합니다.