우리팀의 프로덕트는 지금 python flask 서버와 CRA 클라이언트로 이루어진 웹서비스이다.
문제는 서버의 영상분석 & JSON파싱 계산량이 너무 많고, 게다가 그걸 굳이 서버가 할 필요도 없다는 것
다른 한명의 백엔드 팀원은 AWS 배포를 진행중이지만, 줄인다고 줄인 사용량으로도 좀 버거운 것 같다.
하지만 이걸 electron을 이용한 데스크톱 앱으로 다시 개발해서 배포 방향을 튼다면 대부분의 문제가 해결된다
각각의 영상 분석 프로세스를 유저의 컴퓨터로 떠넘기면
서버는 로그인, DB와의 중계 정도만 해주니 정말 쾌적할거고
컴퓨터 성능도 우리 AWS 프리티어 서버보단 당연히 좋으니 더 빠를거고...
유저는 서버에 줄을 설 필요도 없고
영상을 자르는 exe를 줄지 영상을 다운로드해줄지 고민할 필요도 없는게,
그냥 로컬에 있는 파일 불러와서, 그 파일에 대해 FFmpeg cut명령을 내리면 잘릴 것
구현만 된다면 정말 여러모로 크게 발전한다
그래서 구현하기 전에 먼저 확인해봐야 할 것들을 체크
1. CRA를 electron에 올리기
> 이게 되면, 적어도 프론트의 모든것은 electron으로 이동이 가능하다.
하지만 우리 flask서버와 통신하는 electron 데탑앱이 될테니까 아직은 아무 의미도 없다.
조사해보니, 웹앱을 데탑앱으로 바꿔주는 프레임워크인 만큼 당연히 CRA도 되는 것 같다. 예제대로 따라해보니 익숙한 리액트 메인페이지를 electron 창에서 띄우는데에 성공했다
2. electron 기반 앱에서의 python 실행
> 이게 가능하면 우리 flask 서버에서 데이터 교환을 위한 통신을 담당하는 부분은 버리고 로직을 담당하는 부분은 스크립트화하는 것으로 앱 안으로 가져올 수 있다.
url 링크를 입력하면 채팅과 영상을 분석하고 데이터를 return하는 스크립트, 채팅로그 파일을 만들고 읽는 스크립트 등등 서버 api가 요청을 받아 수행하던 부분을 전부 하나하나의 파일로 만들고, 클라에서 서버로 요청을 보내던 axios문은 전부 직접 python을 실행하는 코드로 바꾸면 될 것
검색해보니 JS에는 python-shell이라는 라이브러리가 있다. nodeJS 서버에서는 이걸 이용해서 파이썬으로 짠 스크립트를 실행하는게 자주 있는 일이라고 한다.
그런데 프론트의 CRA에서도 저게 되는지는 별개의 문제...
상식적으로 생각해봐도 그냥 nodeJS로 서버를 하나 파서 API로 결과를 주고받으면 훨씬 편한데,
우리처럼 굳이 클라이언트에서 실행하려는 사람은 별로 안보여서 검색에 한참 애를 먹었다.
한참을 찾다보니 CRA에서 파이썬 스크립트를 실행하는 레포지토리를 발견해서 따라해봤다
근데 안됨ㅋㅋ
분명 하라는대로 했는데 그냥 안된다...
서너시간의 검색과 삽질의 반복 후 얻은 결론
웹팩 버전 문제
대체 왜...
데탑앱이면 웹팩 안쓰는거 아닌가
구글링을 해도 제대로 안나와서 대충 비슷한 다른 에러의 원인과 비교해봤을 때
webpack이 파이썬셸 라이브러리 함수의 resolve를 못한다는 것 같다
파이썬셸 github의 이슈에도 해당 문제가 있었는데 개발자의 대답은
"파이썬셸은 그저 서브프로세스고 웹팩과는 관계가 없다"
자기꺼도 아닌데 자기가 못알아먹는다고 에러뱉는게
문법적으로 문제없는데 commit 못하게 막는 husky만큼 짜증나네...
해당 함수에 예외적으로 넘어가도록 webpack config를 작성하는 것으로 무시가 가능하다는데,
config를 만들어도 반응이 없다...
검색해보니 CRA는 이미 작성된 config가 있는데 eject로 드러내기 전까진 숨어있다고 함
그래서 eject 후 그 어마어마하게 긴파일중 어딘가를 고쳐봤지만 그래도 통하질 않는다.
근데 내가 참고한 저 레포지토리는 왜 되나 싶어서 npm list를 해보니
웹팩의 버전이 내꺼보다 낮다
웹팩을 다운그레이드해보니 잘 돌아간다.
다운그레이드를 권장하지 않는다는 것 같지만, 다른 방법도 없으니 어쩔수없다...
아무튼 검증결과
1. 일렉트론에선 CRA가 올라간다
2. 이렇게 올린 데탑앱에서 파이썬이 돌아간다
-> 로컬에서 파이썬 스크립트가 돌아가는 일렉트론 데탑앱을 만들 수 있다.(아마도)
이게 이렇게 시간이 많이 걸릴 일이었을까...
'나만의 무기 : HIGHLIGHTING > 개발 일지' 카테고리의 다른 글
Day 31 : Client를 일렉트론으로 (0) | 2022.03.06 |
---|---|
Day 30 (2) : 썸네일 스프라이트 이미지 생성 로직 (0) | 2022.03.06 |
Day 25 ~ 29 : 발표준비, 마무리 발표 (0) | 2022.03.05 |
Day 24 (3) : cutTool 다운로드 기능 (0) | 2022.02.27 |
Day 24 (2) : 북마크 구간 영상분할 프로그램 생성 (0) | 2022.02.27 |