FormData를 사용하여 Axios의 서비스에 데이터를 전달하는 방법은 무엇입니까?

Axios의 서비스에 데이터 전달

브라우저에서 데이터를 전송할 때 Axios는 자동으로 특정 요청 본문 형식을 처리하고 적절한 Content-Type 헤더를 설정합니다. 데이터를 multipart/form-data로 보내고 Content-Type 헤더를 수동으로 구성하려면 FormData 인스턴스를 요청 본문으로 전달하면 됩니다. Axios는 자동으로 헤더를 multipart/form-data로 설정합니다. 경계=${form._boundary}.

<code class="javascript">import axios from 'axios';

const form = new FormData();
form.append('email', 'user@example.com');
form.append('password', 'secretpassword');

axios.post('user/login', form)
  .then((response) => {
    // Handle response
  })
  .catch((error) => {
    // Handle error
  });</code>

Node.js에서 FormData 처리

Node.js에서 Axios를 사용할 때 FormData에서 Content-Type 헤더를 자동으로 추론하지 않습니다. 인스턴스. 이 문제를 해결하려면 요청 인터셉터를 사용할 수 있습니다.

<code class="javascript">axios.interceptors.request.use((config) => {
  if (config.data instanceof FormData) {
    Object.assign(config.headers, config.data.getHeaders());
  }
  return config;
}, null, { synchronous: true });</code>

또는 요청 시 헤더를 수동으로 병합할 수 있습니다.

<code class="javascript">axios.post('user/login', body, {
  headers: {
    'X-Any-Other-Headers': 'value',
    ...body.getHeaders(),
  },
});</code>

결론

결론적으로 FormData 인스턴스를 사용하고 요청 옵션을 적절하게 구성하면 loginService.js에서 Services/index.js로 데이터를 전달하고 multipart/form-data 요청을 원활하게 처리할 수 있습니다.

위 내용은 FormData를 사용하여 Axios의 서비스에 데이터를 전달하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!