밤하늘공작소
세계역사이야기 오디오북 사이트 (개발 일지) 본문
세계역사이야기 오디오북 사이트
사용한 기술 : Django(python), Javascript( + Django Template)
사용한 패키지(app) : django-widget-tweaks, django-allauth
추가 사용 : djang generic view, media(static)
Hosting : Pythonanywhere
최근에 어머니가 진행하는 세계역사이야기(한글판)를 읽고 정리하는 수업을 듣고 있습니다. 그러던 도중 어머니가 세계역사이야기 오디오북을 들을 수 있는 오디오북 사이트를 만들어 보는 것이 어떻겠냐는 제안으로 웹사이트를 만들게 되었습니다.
수업을 듣고 계신 분들 중에서 오디오북 성우를 모집해 녹음 파일을 받았습니다. 웹사이트에서는 녹음 파일을 업로드(관리자 계정으로만)와 듣기를 할 수 있습니다.
1. 홈 페이지
홈페이지에는 책 사진과 오디오북 듣기, 오디오북 업로드 버튼과 최근 업로드된 오디오들을 나열해 놓았습니다.
2. 오디오 업로드
오디오 업로드에는 기본적으로 제목 장 첨부파일 카테고리(책)가 있다. 제목으로 정렬도 가능하지만, 그러면 10장부터 정렬이 엉키기 때문에 정렬을 위해서 장을 추가했습니다. views.py에서 LoginRequiredMixin과 UserPassesTestMixin를 이용해서 로그인한 관리자 계정으로만 접근이 가능하게 했습니다.
3. 오디오 듣기
이곳에는 고대, 중세, 근대, 현대1, 현대2 으로 나뉘어 있습니다. 버튼을 눌러서 들어가면 오디오 목록을 볼 수 있습니다.
4. 오디오 목록
오디오 목록에는 오디오들이 있습니다. 오디오의 장, 제목, 성우 이름이 있습니다.
5. 오디오 플레이어
오디오 플레이어에서는 플레이 버튼, 음소거 버튼, 배속 설정 버튼이 있습니다. 오디오의 시간을 이동하려 할 때 시간이 처음으로 변하는 현상이 생겨서 Javascript의 문제인 줄 알았습니다. 하지만 사실 http header에 Accept-Ranges라는 속성이 없었기 때문인데, Django에서 기본적으로 이것을 설정해주지 않기 때문에 stackoverflow에서 찾은 코드(https://stackoverflow.com/questions/14324250/byte-ranges-in-django)를 적용하니 작동했습니다. (하지만 pythonanywhere에 배포 이후 코드가 잘 작동이 안 돼서 아직도 해결 중입니다...ㅠㅠㅠ 혹시 도와주실 수 있는 분?)
6. 프로필 페이지
프로필 페이지에는 이름, 이메일, 활성화 상태 여부, 비밀번호 및 회원 정보 수정 페이지로 가는 버튼을 만들었습니다. 활성화 상태는 기본 Abstractuser에 불린 값 하나를 더 추가해, 회원가입을 한 사람을 활성화시킬 수 있게 했습니다.
사이트 url : https://gohistory.pythonanywhere.com/
(현재는 운영되지 않고 있습니다)