html5 파일 업로드 예제

안녕하세요 마티우스, `파일선택`기능에주의를 기울이기. 허용되는 형식은 여기에 나열됩니다. HTML5의 DOM에 추가된 파일 API를 사용하면 웹 콘텐츠에서 사용자에게 로컬 파일을 선택한 다음 해당 파일의 내용을 읽도록 요청할 수 있습니다. 이 선택은 HTML 요소를 사용하거나 끌어서 놓기로 수행할 수 있습니다. AwsmUploader를 사용하면 드래그 앤 드롭(기본 제공)을 통해 파일을 쉽게 업로드하거나 자체 소스의 파일(예: 일반 파일 입력)으로 파일을 공급할 수 있습니다. 그것은 일반 자바 스크립트, HTML5 및 PHP를 사용하여 지어졌습니다 (필요한 전부입니다). 오늘은 HTML 5를 사용하는 방법, 사용자가 선택한 파일에 대한 정보를 읽고 서버에 파일을 업로드하는 방법을 설명합니다. 죄송합니다. 나는 1 개의 파일을 업로드하기 위해 작동하지만 mulitiple을 얻을 수 있습니다. 양식을 제출할 때 파일을 업로드하는 다른 php 파일에 연결하지만 여러 파일을 업로드 할 수 있기를 원합니다.

다른 형식의 파일을 같은 방법으로 조작할 수 있습니다. 업로드된 비디오를 미리 보기 하는 방법은 다음과 같습니다: 파일 API를 사용하면 사용자가 선택한 파일을 나타내는 파일 개체가 포함된 FileList에 액세스할 수 있습니다. Gecko 2.0 (파이어 폭스 4 / 썬더 버드 3.3 / SeaMonkey 2.1)에서 시작하여, 당신은 틀림없이 추한 파일 요소를 숨기고 파일 선택기를 열고 사용자가 선택한 파일이나 파일을 표시하기위한 자신의 인터페이스를 제시 할 수 있습니다. 입력 요소를 display:none으로 지정하고 요소에서 click() 메서드를 호출하여 이 작업을 수행할 수 있습니다. 몇 가지 옵션은 사용자가 프로세스를 더 견딜 수 있도록 하는 것으로 나타났습니다. SWFUpload와 같은 일부 플래시 기반 요소를 사용하는 것과 같은 일부 대안은 클라이언트 기반이었습니다. 다른 대안은 아약스의 핀치와 NGINX의 mod_uploadprogress를 활용하는 등, 서버의 측면에 더 배치. 그러나, 왜 독점 기술을 피할 수있는 솔루션이 없는지, 최소한의 번거 로움이 필요하거나 멀리 가져온 해킹이 없는 이유에 대한 질문이 여전히 있었습니다.

개체 URL은 File 개체를 식별하는 문자열입니다. 당신이 창을 호출 할 때마다. URL.createObjectURL() 해당 파일에 대한 개체 URL을 이미 만든 경우에도 고유한 개체 URL이 만들어집니다. 이들 각각은 해제되어야 합니다. 문서가 언로드될 때 자동으로 해제되지만 페이지가 동적으로 사용하는 경우 창을 호출하여 명시적으로 해제해야 합니다. URL.evokeObjectURL(): 온로드 메서드는 콘텐츠가 이벤트와 같은 개체에 의해 읽은 후 호출된 다음 파일의 콘텐츠가 이미지 src 특성인 aImg.src = e.target.result에 할당됩니다. File 개체에서 제공하는 세 가지 특성에는 파일에 대한 유용한 정보가 포함되어 있습니다.

Kommentarer inaktiverade.