웹페이지를 제작하면서 사용자의 이메일이나 연락처같은 정보를 받는 문의페이지를 만든적이있는데,
관리쪽에서 첨부파일도 받았으면 좋겠다는 이야기가 있어 추가했었습니다. 참고해주세요.
입력받는 부분입니다.
데이터는 form태그로 감싸 ajax로 전달하는 형식으로 제작했기 때문에 <input type="file">을 하나 추가했고
<input type="file" name="fileToUpload" id="fileToUpload" hidden accept=".jpg,.pdf,.gif,.png,.jpeg,.bmp" onchange="fileTypeCheck(this)">
파일형식을 체크해줍니다.
function fileTypeCheck(obj) {
pathpoint = obj.value.lastIndexOf('.');
filepoint = obj.value.substring(pathpoint+1,obj.length);
filetype = filepoint.toLowerCase();
if(filetype=='jpg' || filetype=='gif' || filetype=='png' || filetype=='jpeg' || filetype=='bmp' || filetype=='pdf') {
// 파일명 추출, 삽입
var fileTarget = $('#fileToUpload');
var fileLabel = $('#file_name');
for( var i=0; i<fileTarget.length; i++ ){
if( fileTarget[i].files.length > 0 ){
for( var j = 0; j < fileTarget[i].files.length; j++ ){
console.log(fileTarget[i].files[j].name); // 파일명 출력
// 추출한 파일명 삽입
$(fileLabel).text(fileTarget[i].files[j].name);
document.querySelector('#file_label').classList.toggle('active');
}
}
}
} else {
alert('jpg,jpeg,gif,png,bmp,pdf만 가능합니다!');
parentObj = obj.parentNode
node = parentObj.replaceChild(obj.cloneNode(true),obj);
return false;
}
}
전달받은 파일을 사이즈로 확인하고 파일명을 바꿔서 업로드합니다.
<?php
//파일이 업로드 되었는지 확인
if ($_FILES['fileToUpload']['size'] == 0) {
$changeName = "";
} else {
//업로드할 위치
$uploaddir = './uploads/connect/'.$dir.'/';
//확장자
$ext = end(explode(".",strtolower($_FILES["fileToUpload"]["name"])));
// 파일 이름
$original_file = $_FILES["fileToUpload"]["name"];
// 파일 이름을 contact_랜덤글자.확장자로 변경
$changeName = "contact_". generateRandomString(4) .".". $ext ;
//디렉토리가 없다면 생성
if (!file_exists($uploaddir)) {
//권한변경
mkdir($uploaddir, 0777, true);
}
//파일 용량이 20mb이상일 경우 에러처리
if($_FILES["fileToUpload"]["size"][$i] > (20*1024*1024)){
throw new Exception('size error', $_FILES["fileToUpload"]["size"]);
echo "용량";
exit;
}
//실제 파일 업로드부분
move_uploaded_file($_FILES['fileToUpload']['tmp_name'], $uploaddir . $changeName);
}
?>
별로 어려울건 없다고 생각합니다.
'개발메모 > 웹' 카테고리의 다른 글
핸드폰 정규식 체크 및 하이픈 넣기 (0) | 2022.12.22 |
---|---|
애플 페이지처럼 스크롤 효과 비슷하게 따라하기-1 (1) | 2022.12.22 |