> 웹 프론트엔드 > JS 튜토리얼 > jQuery를 사용하여 Blob을 서버에 업로드하는 방법은 무엇입니까?

jQuery를 사용하여 Blob을 서버에 업로드하는 방법은 무엇입니까?

DDD
풀어 주다: 2024-11-05 17:43:02
원래의
827명이 탐색했습니다.

How to Upload a Blob to a Server Using jQuery?

JavaScript에서 Blob 업로드

HTML5 API를 사용하여 녹음된 오디오 또는 비디오 데이터와 같은 데이터 Blob을 서버에 업로드하는 것은 웹 애플리케이션에서 일반적인 작업입니다. 이 문서에서는 JavaScript, 특히 jQuery를 사용하여 Blob을 서버에 업로드하는 방법을 보여줍니다.

jQuery 파일 업로드 방법

제공된 코드 조각에 사용되는 jQuery post() 메서드는 Blob과 같은 바이너리 데이터를 업로드하는 데 적합하지 않습니다. 대신 FormData API를 사용하는 것이 좋습니다.

FormData 객체 생성

FormData를 사용하려면 새 FormData 객체를 생성하고 필요한 데이터를 여기에 추가하세요. 제공된 예에서 파일 이름과 blob 데이터를 FormData 개체에 추가합니다.

<code class="javascript">var fd = new FormData();
fd.append('fname', 'test.wav');
fd.append('data', soundBlob);</code>
로그인 후 복사

jQuery를 사용한 AJAX 요청

다음으로 jQuery의 $.ajax() 메서드를 사용하여 Multipart/form-data 요청인 FormData 개체입니다. 요청 유형, URL 및 데이터를 지정하고 processData 및 contentType을 false로 설정합니다.

<code class="javascript">$.ajax({
    type: 'POST',
    url: '/upload.php',
    data: fd,
    processData: false,
    contentType: false
}).done(function(data) {
       console.log(data);
});</code>
로그인 후 복사

이 코드는 파일 이름과 함께 Blob 데이터를 /upload.php의 서버측 PHP 스크립트로 보냅니다. , 그리고 응답을 기록합니다.

위 내용은 jQuery를 사용하여 Blob을 서버에 업로드하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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