Ajax를 사용하여 대용량 파일 업로드 기능을 구현하는 방법

이번에는 ajax를 사용하여 대용량 파일을 업로드하는 기능을 구현하는 방법과 ajax를 사용하여 대용량 파일을 업로드할 때 어떤 노트가 있는지 살펴보겠습니다.

PHP에는 파일 업로드에 제한이 있다는 것은 누구나 알고 있습니다. php.ini 파일을 수정하지 않은 경우 기본 업로드 크기 제한은 2M입니다. 그렇다면 대용량 파일을 업로드하려면 어떻게 해야 할까요? , 대용량을 사용하실 수 있습니다. 파일을 자르고 업로드하시면 문제가 해결됩니다.

대용량 파일 자르기 및 업로드란 무엇인가요?

원리: HTML5의 새로운 기능을 사용하여 파일 콘텐츠를 바이너리 정보 세그먼트로 자른 다음 매번 하나의 세그먼트를 서버에 업로드합니다. 서버는 매번 업로드하는 바이너리 정보만 통합하고 저장하면 됩니다. 파일을 선택한 다음 마지막 파일이 업로드된 파일입니다.

php.ini의 기본 업로드 크기는 2M이므로 배치당 2M씩 업로드하면 테스트하는 데 시간이 오래 걸립니다. 여기서는 크기를 20M로 제한하고 최대 게시물 데이터는 28M입니다. 테스트에 편리합니다. 실제 개발 중에 매개변수를 수정할 수 없는 경우 각 배치에 업로드되는 데이터는 최대 한도를 초과할 수 없습니다.

post_max_size = 28M 
upload_max_filesize = 20M

nginx에 업로드했기 때문에 여전히 Nginx구성 파일을 수정해야 합니다/etc/nginx/nginx.con

//在http{} 里面加即可 
client_max_body_size 50m　　　#客户端最大上传大小 50M

JavaScript의 파일 개체

이 API는 이전 기사에서 이미 사용했습니다. File 개체는 파일

Blob 개체의 크기, 이름, 유형 및 기타 정보를 JavaScript

에 저장합니다. Blob 개체는 바이너리 개체이며 File 개체의 상위 클래스이기도 합니다. 매우 중요한 메서드가 있습니다. Blob 객체: Slice() 메소드에서 이 메소드를 사용하여 파일 내용을 이진 정보로 잘라낼 수 있습니다. Slice() 메소드는 시작 오프셋, 종료 오프셋, 선택적 MIME 유형의 세 가지 매개변수를 허용합니다. MIME 유형이 설정되지 않은 경우 새 Blob 객체는 상위 객체와 동일한 MIME 유형을 갖습니다.

업로드 페이지 index.php:

nbsp;html> 
 
 
  <meta> 
  <meta> 
  <title>大文件切割上传</title> 
  <link> 
  <script> 
    function selfile(){ 
      const LENGTH = 1024 * 1024 * 10;//每次上传的大小 
      var file = document.getElementsByName(&#39;video&#39;)[0].files[0];//文件对象 
      var filename=document.getElementsByName(&#39;video&#39;)[0].files[0].name; 
      var totalSize = file.size;//文件总大小 
      var start = 0;//每次上传的开始字节 
      var end = start + LENGTH;//每次上传的结尾字节 
      var fd = null//创建表单数据对象 
      var blob = null;//二进制对象 
      var xhr = null;//xhr对象 
      while(start < totalSize){ 
        fd = new FormData();//每一次需要重新创建 
        xhr = new XMLHttpRequest();//需要每次创建并设置参数 
        xhr.open(&#39;POST&#39;,&#39;upload.php&#39;,false); 
        blob = file.slice(start,end);//根据长度截取每次需要上传的数据 
        fd.append(&#39;video&#39;,blob);//添加数据到fd对象中 
        fd.append(&#39;filename&#39;,filename); //获取文件的名称 
        xhr.send(fd);//将fd数据上传 
 
        //重新设置开始和结尾 
        start = end; 
        end = start + LENGTH; 
 
      } 
 
    } 
  </script> 
 
 
<h1 id="大文件切割上传">大文件切割上传</h1> 
<input> 
 

데이터 수신 페이지 upload.php:

<?php  
/** 
 * 大文件切割上传，把每次上传的数据合并成一个文件 
 */ 
 
$filename = &#39;./uploads/&#39;.$_POST[&#39;filename&#39;];//确定上传的文件名 
//第一次上传时没有文件，就创建文件，此后上传只需要把数据追加到此文件中 
if(!file_exists($filename)){ 
 move_uploaded_file($_FILES[&#39;video&#39;][&#39;tmp_name&#39;],$filename); 
}else{ 
 file_put_contents($filename,file_get_contents($_FILES[&#39;video&#39;][&#39;tmp_name&#39;]),FILE_APPEND); 
} 
?>

테스트 전 업로드 폴더를 먼저 생성해주세요

리눅스 시스템이라면 업로드 권한을 꼭 주셔야 한다는 점

sudo chmod -R 777 uoloads/  //赋予uploads文件夹 777 权限  -R 递归子文件

믿겠습니다 이 기사의 사례를 읽었습니다. 더 흥미로운 정보를 보려면 PHP 중국어 웹사이트의 다른 관련 기사를 주목하세요!

추천 자료:

Ajax를 사용하여 사용자 이름이 중복되었는지 비동기적으로 확인하는 방법

ajax를 사용하여 json 데이터를 정의되지 않은 상태로 가져오는 방법

위 내용은 Ajax를 사용하여 대용량 파일 업로드 기능을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!