기타/캡스톤

[Flask] FLASK multipart 이미지 주고받기

지수쓰 2020. 4. 14. 13:23
반응형

원래는 안드로이드 - > 이미지 -> FLASK -> OCR 및 자연어 처리 -> 텍스트 -> 안드로이드

이렇게 되는데 일단은 서버 임시로 구현하느라고 리액트로 통신해봤다.

 

# multipart formdata 받아오기 (참고 https://velog.io/@inyong_pang/Flask-%ED%8C%8C%EC%9D%BC-%EC%97%85%EB%A1%9C%EB%93%9C-%EC%97%94%EB%93%9C%ED%8F%AC%EC%9D%B8%ED%8A%B8)

   // react.js
   post=()=>{
        console.log(this.state.image);
        if(this.state.image!==null){
            const formData = new FormData();
            formData.append("file",this.state.image);
            axios.post('http://0.0.0.0:5000/file',formData)
            .then(res=>{
                console.log(res);
            })
            .catch(error=>{
                console.log(error);
            })
        }
    }
@app.route('/file',methods=['POST'])
def getFile(file=None):
    if request.method == 'POST':
        if 'file' not in request.files:
            return 'File is missing', 404
    
        pic_data = request.files['file']
        filename = secure_filename(pic_data.filename) # 업로드 된 파일의 이름이 안전한가를 확인해주는 함수이다. 해킹 공격에 대해 보안을 하고자 사용되기도 한다.
        print(pic_data)
        print(filename)
    return 'ok'