[Python 인터넷] websocket을 이용한 python server에 대용량 파일 전송하기

websocket을 이용한 python server에 대용량 파일 전송하기

알 수 없는 사용자 2020. 5. 6. 17:15

html에서 파일을 업로드하여 javascript를 이용해 base64로 인코딩을 할때, 파일의 용량이 너무 크면 base64로 변환된 문자열(?)의 길이를 가져오지 못하는 경우를 만났다. 그래서 업로드한 파일 자체의 길이와 분할을 통해서 전송하는 방식으로 전송을 해보았다.

명월님의 블로그를 참고하여 진행하였다.(https://nowonbun.tistory.com/725?category=876375)

server.py

import asyncio;   
# 웹 소켓 모듈을 선언한다.   
import websockets;   

# 업로드 할 때 데이터 정보에 관한 클래스
class Node():
    #생성자
    def __init__(self):
        self.__filename=''; # 받는 파일의 이름
        self.__filesize =0; # 받는 파일의 크기
        self.__data='';     # 받는 파일의 내용(클라이언트에서 정한 버퍼 사이즈 만큼씩 받는다)
        self.__datasize=0;  # 받은 파일의 사이즈

    # filename getter
    @property
    def filename(self):
        return self.__filename;

    # filename setter
    @filename.setter
    def filename(self, filename):
        self.__filename=filename;

    # filesize getter
    @property
    def filesize(self):
        return self.__filesize;

    # filesize setter
    @filesize.setter
    def filesize(self, filesize):
        self.__filesize=int(filesize);

    # data getter
    @property
    def data(self):
        return self.__data;

    # data setter
    @data.setter
    def data(self, data):
        self.__data = data;

    @property
    def datasize(self):
        return self.__datasize;

    @datasize.setter
    def datasize(self, length):
        self.__datasize += length;

    # add data to self.__data
    def add_data(self, data):
        self.__data += data;

    # 파일전송이 끝났는지 확인하는 함수
    def is_completed(self):
        if self.__filesize == self.__datasize:
            return True;
        else:
            return False;
    def save(self, data):
        # 파일을 binary형식, 이어붙이는 모드로 연뒤에 파일을 계속 이어쓴다
        with open("C:/Users/rudwn/scp/"+self.__filename, "ab+") as handle:
            handle.write(data);
        # 받은 datasize를 받은 데이터 size를 더해가며 저장한다(전송 종료 조건에 사용)
        self.__datasize += len(data)


# 클라이언트 접속이 되면 호출된다.   
async def accept(websocket, path):
    node = Node(); # node에 Node() 클래스 할당
    while True:   
        # 클라이언트로부터 메시지를 대기한다.   
        message = await websocket.recv();
        print('message : ' + message + '\n')
        if message == 'START': #클라이언트로부터 'START' 메시지가 날라오면
            await websocket.send("FILENAME"); #파일 이름을 요청
        elif message == 'FILENAME': #파일 이름을 받는다
            node.filename = await websocket.recv();
            await websocket.send("FILESIZE")
        elif message == 'FILESIZE': #파일 사이즈를 받는다
            node.filesize = await websocket.recv();
            await websocket.send("DATA");#데이터를 요청한다
        elif message == 'DATA':#데이터가 오면 저장한다
            node.save(await websocket.recv());
            if node.is_completed() == False:#전송이 끝나지 않았으면 계속 전송
                await websocket.send("DATA");
            else:
                await websocket.close();#전송이 끝났으면 웹소켓을 닫고 종료
                break;

# 웹 소켓 서버 생성.호스트는 localhost에 port는 8080으로 생성한다.    
start_server = websockets.serve(accept, "localhost", 8080);   
# 비동기로 서버를 대기한다.   
asyncio.get_event_loop().run_until_complete(start_server);   
asyncio.get_event_loop().run_forever();

client.html

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
    <script>
        function upload(){
            var file = document.getElementById('file').files[0];// 파일을 받아옴
            var buffersize=1024;// 파일을 전송할 단위인 버퍼사이즈 설정(1024:1byte)
            filename = file.name;// 파일의 이름
            filesize = file.size;// 파일의 크기
            var reader = new FileReader();
            reader.readAsArrayBuffer(file);// file을 ArrayBuffer로 읽어옴
            var rawData = new ArrayBuffer();// 버퍼사이즈 만큼 데이터를 저장할 rawData 설정

            // 파일을 읽으면 요청되는 이벤트
            reader.onload = function(e){
                console.log(e.target.result);
                rawData = e.target.result;
            }

            var pos=0;//파일의 시작위치

            //웹소켓 생성(ip주소 및 포트 설정)
            var ws = new WebSocket("ws://localhost:8080");

            //웹소켓에 접속이 되면, START를 전송
            ws.onopen = function(){
                ws.send("START");
            };

            // START -> FILENAME -> FILESIZE -> DATA -> DATA -> ...
            ws.onmessage = function(message){
                // 메시지 echo
                console.log(message.data);
                ws.send(message.data);

                if(message.data === 'FILENAME'){
                    //파일 이름 전송
                    ws.send(filename);
                }else if(message.data === 'FILESIZE'){
                    //파일 사이즈 전송
                    ws.send(filesize);
                }else if(message.data ==='DATA'){
                    //buffersize만큼 파일을 나누어 전송
                    ws.send(file.slice(pos, pos+buffersize));
                    pos = pos + buffersize;
                    if(pos > filesize){
                        pos = filesize;
                    }
                }
            }

            ws.onclose=function(){
                console.log("disconnected");
            }
        };
    </script>
</head>
<body>
    <input id="file" type="file">
    <button id="uploadbtn" onclick="upload()">파일 업로드</button>
</body>
</html>

html 소스코드에서 buffersize가 1024로 되어있는데, 대용량 파일을 전송하기 위해서는 버퍼사이즈를 크게 설정해주면 된다.
연결 상황에 따라 동적으로 변경되도록 언젠가는 수정해보고 싶다.

 

[출처] https://not-to-be-reset.tistory.com/102

경축! 아무것도 안하여 에스천사게임즈가 새로운 모습으로 재오픈 하였습니다.
어린이용이며, 설치가 필요없는 브라우저 게임입니다.
https://s1004games.com

 

 

 

 

 

본 웹사이트는 광고를 포함하고 있습니다.
광고 클릭에서 발생하는 수익금은 모두 웹사이트 서버의 유지 및 관리, 그리고 기술 콘텐츠 향상을 위해 쓰여집니다.
번호 제목 글쓴이 날짜 조회 수
64 [python][자료구조] "pdf 취소선 검출" How to identify strike-out text from PDF files using Python 졸리운_곰 2024.07.18 544
63 [python][자료구조] 오픈 소스 Python PDF 파서 라이브러리 file 졸리운_곰 2024.07.16 444
62 [python][자료구조] 벡터화 | Vectorization file 졸리운_곰 2023.12.21 330
61 [python][자료구조] Python의 Loop? NO! , Python의 Vectorization? OK!!! file 졸리운_곰 2023.12.21 473
60 [python][자료구조] Python - MySQL 데이터 추가, 삭제, 업데이트 졸리운_곰 2023.05.13 488
59 [python][자료구조] Python의 JSON - 문자열을 JSON으로 변환하는 방법 졸리운_곰 2023.05.06 456
58 [python][자료구조] [Python] Logging to MongoDB (로그 남기기) file 졸리운_곰 2023.03.24 428
57 [python][자료구조] [스파르타 웹 개발 종합] 파이썬으로 크롤링하고 DB에 저장하기(request, bs4, mongoDB 패키지 사용) 졸리운_곰 2023.03.12 461
56 [python][자료구조] [MongoDB] Document Query(조회) – find() 메소드 졸리운_곰 2023.03.08 315
55 [python][자료구조] Python(flask)으로 mongoDB 제어하기 – pymongo file 졸리운_곰 2023.03.08 604
54 [python][자료구조] django sqlite3 MySQL로 전환하기 file 졸리운_곰 2023.03.02 409
53 [python][자료구조] django에서 db.sqlite3 데이터를 mysql로 옮기기 졸리운_곰 2023.03.02 427
52 [python][자료구조] Python - JSON 파일 읽고 쓰는 방법 졸리운_곰 2023.02.04 480
51 [python][자료구조] [인코딩] 유니코드 인코딩 처리 (특히 json 입출력 시) 졸리운_곰 2023.02.04 363
50 [python][자료구조] Dropbox API 사용하기 (with python) 졸리운_곰 2022.12.03 306
49 [Python][자료구조] SQLAlchemy Tutorial(한글) - 2 졸리운_곰 2022.12.03 393
48 [Python]][자료구조] SQLAlchemy Tutorial(한글) - 1 졸리운_곰 2022.12.03 275
47 [python][자료구조] python anaconda 에서 mysql 접속 졸리운_곰 2022.01.25 657
46 [python 자료구조] 림코딩의 파이썬으로 csv 다루기 강좌 (읽기,쓰기,수정,추가) 졸리운_곰 2022.01.16 521
45 python - 읽은 후 kafka 메시지를 삭제하는 방법 졸리운_곰 2021.07.13 900
대표 김성준 주소 : 경기 용인 분당수지 U타워 등록번호 : 142-07-27414
통신판매업 신고 : 제2012-용인수지-0185호 출판업 신고 : 수지구청 제 123호 개인정보보호최고책임자 : 김성준 sjkim70@stechstar.com
대표전화 : 010-4589-2193 [fax] 02-6280-1294 COPYRIGHT(C) stechstar.com ALL RIGHTS RESERVED