통계 위젯 (화이트)

271495
8881
2514304

저작권

Do not be afraid to fail. Be afraid not to try. Pain is temporary, suck is forever. Keep it small and simple.

카카오 광고







Text to Speech, 영어 및 한국어 샘플 자바 스크립트 만들기 by 미친병아리

한국어와 영어 TTS 샘플 기능을 만들어 보려고 조사를 좀 해봤는데 카카오와 구글 API가 가장 좋음

카카오로 전부 하려고 했는데 카카오 API의 영문 읽어 주는 기능은 너무 구려서 구글 API로 교체

카카오던 구글이던 자바스크립트 샘플 찾는데 졸라 삽질함. 다들 도움말이 어찌나 불친절한지. 둘 다 데모페이지가 있긴 했지만, 그 소스를 가져다 만드는건 너무 오버스펙에 복잡. curl 사용 샘플 보고 그냥 직접 만드는게 가장 빠른 방법.




한글 읽어주는 샘플 사이트


영문 및 한글 대사는 넷플릭스로 드라마 보면서 수집
REST API 사용법은 아래 문서 중 curl 호출하는 부분을 참고


드라마 정보와 대사 정보는 일일히 휴먼 터치로 타이핑하여 json 데이터로 생성.
DB가 있으면 좋긴 하지만, netlify 사이트는 정적 파일만 올릴 수 있으니 json 데이터로 관리.




영문 읽어주는 샘플 사이트


기사 정보를 가져오는 것은 아래 사이트에서.
python으로 크롤링 해서 json 데이터로 저장.

영문 읽어주는 기능은 구글 TTS API 사용



2021.06.21 추가

참고사항
처음엔 jQuery를 이용해 ajax 호출을 했는데, 카카오 API가 mp3 바이너리를 바로 리턴을 하는데 이걸 처리하지 못해 온갖 삽질.

결국 XMLHttpRequest() 로 바꿔서 호출해보니 아주 잘 됨. 분명 jQuery ajax 콜도 가능할건데, 의외로 검색으로 찾아내기 힘들어서 그냥 XMLHttpRequest()로 바꿈. 구글 API는 아마 jQuery로 호출이 가능할 것 같았지만, 카카오 API 호출에 사용한 코드 그냥 재활용.

카카오나 구글이나 친절한 자바스크립트 샘플은 제공을 해주지 않는다.
데모사이트는 멋지게 만들어 놨는데, 그거 그냥 공개해주면 안되나?

문서에도 자바스크립트 샘플은 없어서 curl 호출 샘플을 보고 자바 스크립트로 코딩.


[에버키] Atlas S15 아틀라스 S15 EKP121S15, 본상품선택 BOSE QC35 II 2세대 노이즈 캔슬링 헤드폰, 블랙, QuietComfort 35 II Apple 2020년 맥북 프로 13 (M1 칩셋 8코어 CPU 8코어 GPU), 8GB, SSD 256GB, 스페이스 그레이 키크론 K6 무선 기계식키보드 WHITE LED 핫스왑 갈축, 혼합색상 마이크로소프트 모바일 마우스 KGY-00060, 포피레드 한성컴퓨터 39.62cm FHD DEX 포터블 HDR 멀티터치 휴대용 모니터, TFX156T
쿠팡 파트너스 활동의 일환으로, 이에 따른 일정액의 수수료를 제공받을 수 있습니다.

카카오 광고