jQuery 업로드 플러그인 webupload 사용법에 대한 자세한 설명

WebUploader는 Baidu WebFE(FEX) 팀이 HTML5를 기반으로 개발하고 FLASH로 보완한 간단하고 현대적인 파일 업로드 구성 요소입니다. 주류 IE 브라우저를 버리지 않고도 최신 브라우저에서 HTML5의 장점을 최대한 활용할 수 있으며 원래 FLASH 런타임을 사용하고 IE6+, iOS 6+, Android 4+와 호환됩니다. 두 런타임 세트는 동일한 호출 방법을 가지며 사용자가 선택할 수 있습니다. 대용량 파일을 조각으로 동시에 업로드하면 파일 업로드 효율성이 크게 향상됩니다. 이 글은 주로 Jquery 업로드 플러그인 webupload를 사용하는 방법을 자세히 소개합니다. 관심 있는 친구들이 참고하면 도움이 될 것입니다.

이 플러그인은 사용하기 쉽고 더 강력한 기능을 가지고 있습니다. 공식 웹사이트에서 다운로드할 수 있습니다.

현재 프로젝트에서는 이미지 일괄 업로드 기능만 사용됩니다. 공식 예제가 매우 자세하게 작성되었습니다. 공식 예제를 자신의 프로젝트로 마이그레이션하는 방법은 다음과 같습니다.

// 实例化
 uploader = WebUploader.create({
  pick: {
  id: '#filePicker',
  label: '点击选择图片'
  },
  formData: {
  uid: 123
  },
  dnd: '#dndArea',
  paste: '#uploader',
  swf: '../../dist/Uploader.swf',
  chunked: false,
  chunkSize: 512 * 1024,
  server: '../../server/fileupload.php',
  // runtimeOrder: 'flash',

  // accept: {
  // title: 'Images',
  // extensions: 'gif,jpg,jpeg,bmp,png',
  // mimeTypes: 'image/*'
  // },

  // 禁掉全局的拖拽功能。这样不会出现图片拖进页面的时候，把图片打开。
  disableGlobalDnd: true,
  fileNumLimit: 300,
  fileSizeLimit: 200 * 1024 * 1024, // 200 M
  fileSingleSizeLimit: 50 * 1024 * 1024 // 50 M
 });

1. 처리 클래스는 HttpFileCollection files = System.Web.HttpContext.Current.Request.Files;를 통해 플러그인에서 업로드한 이미지를 가져옵니다.

2. 샘플 프로그램은 기본적으로 압축을 활성화합니다. 이미지가 특정 크기보다 큰 경우 압축이 필요하지 않은 경우 압축:false 속성을 추가해야 합니다.

3,

accept: {
  title: 'Images',
  extensions: 'gif,jpg,jpeg,bmp,png',
  mimeTypes: 'image/*'
  },

공식 사진 업로드 예시에서 사진 필터링이 왜 주석 처리되어 있는지 모르겠습니다. 업로드하려는 파일이 사진만 선택할 수 있으면 제거해야 합니다. 댓글

4. 사진의 픽셀 크기에 대한 판단을 추가했습니다. uploadAccept 메소드를 사용하면 이미지가 제출된 후 백그라운드에서 판단됩니다. (더 좋은 방법이 있는지 궁금합니다.) 왜냐하면 파일 클래스 때문입니다. 플러그인 자체가 파일을 처리할 수 있으므로 픽셀 속성을 별도로 가져오지 않습니다. 예:

 uploader.on('uploadAccept', function (object, ret) {
 
  var resJson = $.parseJSON(ret._raw);
  if (resJson.result == "error") {
   alert(object.file.name + "象素太低，请检查上传！");
   return false;
  }
 
  });

이 메서드가 false를 반환하면 이미지 업로드가 실패하므로 배경이 픽셀을 결정하고 변경합니다 백그라운드에서 반환된 상태를 통해 이미지 업로드 상태를 확인합니다.

관련 권장 사항:

jQuery의 webupload 업로드 플러그인 사용 예

webuploader가 예제 코드를 업로드하는지 확인

10 webuploader에 대한 콘텐츠 권장 사항

위 내용은 jQuery 업로드 플러그인 webupload 사용법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!