본문 바로가기
이과/HTML,CSS,JS

HTML_파일보내기

by 코딩초밥 2021. 5. 9.
반응형

안녕하세요!코딩초밥입니당

 

하루의 시작이 너무 기분좋다. 아무이유없다. 😋

 


※ 파일보내기

웹브라우저에서 중요한 작업중하나가 파일을 보내는것이다.

자신의 파일을 서버에 올리거나 하는 작업들은 컴퓨터를 공부하지않는다 하여도 모두다 해봤을것이다. html안에서는 어떤 방식으로 파일을 주는지 방법을 뜯어 보자.

 

※ 알아두기

텍스트를 웹서버에 보내서 띄우는건 하나의 텍스트이기때문에

어렵지 않았습니다. 허나 파일의 경우 몇만 바이트의 덩어리입니다 POST 배열로 받고 주는건

비효율적입니다. 그리고 파일을 png, jpg인지 웹서버는 인식을하지못합니다.

그래서 파일을보낼때 안에 파일정보를 설명하는 5가지의정보를 배열로 보냅니다 (header문서)

#이렇게 파일을 설명하는 데이타는 메타데이타라 읽컷습니다.

웹서버는 이렇게 데이타 뭉치가 왔을떄 데이타는 tmp(임시폴더)에 저장합니다.

그리고 header문서는 web으로 갑니다.

그리고 header문서 안에 5개의 요소를 읽고 임시파일을에 저장되있는 데이터를 읽는것방식입니다. 이미지로 설명드리겠습니다.

 

 

▶간단예제

html.작성

<!DOCTYPE html>
<html>
    <head>
        <title>input ex 2</title>
        <meta charset="utf-8">
    </head>

<body>
    <!-- file 선택기  enctype은 무조건 써야하는 값이다. multipart/form-data로 파일을보낸다. 
    안드로이드도 이 기능이 적용되었음.-->
   
<form action="./file2.php" method="POST" enctype="multipart/form-data">
   <input type="file" name="bbb[]" multiple>
   

<!-- multiple을 쓰면 파일을 여러게 잡는것이가능하다. -->
    

    <input type="submit">
    </form>
    
</body>
</html>

결과창.

※ PHP파일작성

<?php
$title= $_POST['title'];
$files= $_FILES['bbb'];

$fileNum= count( $files['name']);
for($i=0; $i<$fileNum; $i++){
    $srcName= $files['name'][$i]; //원본파일명
    $tmpName= $files['tmp_name'][$i]; //임시저장소 경로
    $type= $files['type'][$i]; //파일타입
    $size= $files['size'][$i]; //파일사이즈

    echo $srcName ."<br>";
    echo $tmpName ."<br>";
    echo $type ."<br>";
    echo $size ."<br>";
    echo "=============<br>";

    //임시저장소로 파일 이동 하는 코드입니다.
    $dstName= "./tmp/". date('Ymdhis') . $srcName; 
    // 위 코드의 뜻은 tmp파일에 현재 시간을 가져와서 원본파일명으로 합쳐 파일이름을
    // 만드는것입니다. 통상적으로 많이 사용하며 이러면 파일이름은 절때 겹치지않고 
    //파일이름을 매번만드는 번거러움은 없어지며 언제 저장했는지까지 알수있겠죠?  
   
     move_uploaded_file($tmpName, $dstName);
     //파일을 임시저장소로 옮긴다는 코드입니다.


}

?>

 

반응형

'이과 > HTML,CSS,JS' 카테고리의 다른 글

HTML_서버와 통신 GET,POST  (1) 2021.05.11
HTML_다양한 입력Type  (14) 2021.05.10
HTML_버튼,콤보박스,fieldset  (1) 2021.05.08
CSS_속성,폰트,텍스트  (1) 2021.05.07
HTML_오디오,비디오 div, span  (2) 2021.05.06

댓글