> 웹 프론트엔드 > JS 튜토리얼 > Axios를 사용하여 양식 데이터를 전달하는 방법: _boundary를 수동으로 설정해야 합니까?

Axios를 사용하여 양식 데이터를 전달하는 방법: _boundary를 수동으로 설정해야 합니까?

Mary-Kate Olsen
풀어 주다: 2024-11-04 05:37:01
원래의
336명이 탐색했습니다.

How to Pass Form Data with Axios: Should I Set _boundary Manually?

Axios 서비스에 데이터 전달

이 시나리오의 목표는 loginService 구성 요소에서 서비스/색인 구성 요소로 양식 데이터를 전달하는 것입니다. Axios 인스턴스 헤더의 _boundary에 액세스합니다. 이를 달성하는 열쇠는 HTTP 클라이언트가 요청 본문을 처리하는 방법을 이해하는 데 있습니다.

HTTP 요청 본문 처리

FormData로 HTTP 요청을 수행할 때 클라이언트는 자동으로 Content-Type 헤더를 multipart/form-data로 변환하고 적절한 경계 토큰을 포함합니다. 마찬가지로 URLSearchParams의 경우 Content-Type을 application/x-www-form-urlencoded로 설정합니다.

Axios 문제 해결

귀하의 경우에는 다음을 수행하고 싶습니다. 헤더에 _boundary를 수동으로 설정하세요. 그러나 이미 FormData를 사용하고 있으므로 런타임이 이를 자동으로 처리합니다. Axios v0.27.1 이하를 사용하는 경우 이 단계를 건너뛸 수 있습니다.

Node.js 고려 사항

Node.js에서 Axios를 사용하는 경우 FormData 헤더가 유추되지 않습니다. 자동으로. 해결 방법으로 요청 인터셉터를 사용할 수 있습니다.

<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>
로그인 후 복사

또는 요청하는 동안 헤더를 수동으로 병합합니다.

jQuery 고려 사항

jQuery의 $.ajax() 또는 $.post()와 같은 편의 메서드를 사용하는 경우 자동 직렬화를 방지하고 FormData 형식을 유지하려면 contentType 및 processData를 false로 설정하는 것이 중요합니다.

<code class="javascript">$.ajax({
  url,
  method: "POST",
  data: body,
  contentType: false,
  processData: false
})</code>
로그인 후 복사

Axios 버전 0.27.1 및 1.0.0을 피하세요.

이 특정 Axios 버전에는 FormData를 처리하는 데 알려진 문제가 있습니다. 대신 Fetch, got 또는 ky를 사용하는 것이 좋습니다.

위 내용은 Axios를 사용하여 양식 데이터를 전달하는 방법: _boundary를 수동으로 설정해야 합니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php.cn
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿