HTML에서 accept 속성은 서버가 허용할 파일 형식을 지정하는 데 사용됩니다. 이 속성은 반드시 <input type="file"> 요소와 함께만 사용해야 하며, 다른 입력 유형에는 적용되지 않습니다.
accept 속성 예제
다음 코드를 실행하면 accept 속성이 어떻게 동작하는지 확인할 수 있습니다:
<!DOCTYPE html>
<html>
<head>
<title>파일 업로드 박스</title>
</head>
<body>
<form>
<input type = "file" name = "fileupload" accept = "image/*" />
</form>
</body>
</html>capture 속성의 올바른 이해
capture 속성은 불리언(boolean) 속성으로, 지정할 경우 미디어를 기기에서 직접 캡처하는 것이 선호된다는 것을 나타냅니다.
여기서 많은 개발자들이 혼동하는 부분이 있습니다. capture 속성은 대화상자(dialog)에 카메라 옵션을 추가하기 위한 것이 아니라, 웹캠이나 카메라에서 직접 캡처하는 방식이 우선적으로 사용되기를 바란다는 의도를 전달하는 용도입니다.
따라서 파일 선택 시 카메라 옵션이 나타나지 않는다고 해서 코드가 잘못된 것은 아닙니다. 올바르게 작성된 코드는 다음과 같습니다:
<input type = "file" accept = "image/*">
핵심 정리
- accept 속성: 업로드 가능한 파일 형식(예: image/*, video/* 등)을 브라우저에 알려줍니다.
- capture 속성: 모바일 기기 등에서 파일 선택 대신 카메라로 직접 촬영한 미디어를 받기를 선호한다는 힌트를 제공합니다.
- 두 속성은 브라우저 및 운영체제에 따라 동작 방식이 다를 수 있으므로, 실제 기기에서 테스트해 보는 것이 좋습니다.