반응형
📌 번역 기능 추가하기 (Google Translate API 사용)
번역을 추가하려면, Google Translate API를 사용해서 변환된 텍스트를 원하는 언어로 번역하면 돼.
🛠 Google Translate API 키 받기 (필요)
1. Google Cloud Console에서 Google Cloud Translation API를 활성화
2. API 키를 발급받아 프로젝트에서 사용
🚀 React Native에서 번역 추가한 코드 (STT + 번역 + TTS)
import React, { useState } from "react";
import { Button, Text, View } from "react-native";
import Voice from "@react-native-voice/voice";
import Tts from "react-native-tts";
// Google Translate API 호출 함수
const translateText = async (text, targetLang = "ko") => {
const API_KEY = "YOUR_GOOGLE_TRANSLATE_API_KEY"; // 여기에 API 키 입력
const url = `https://translation.googleapis.com/language/translate/v2?key=${API_KEY}`;
const response = await fetch(url, {
method: "POST",
headers: {
"Content-Type": "application/json",
},
body: JSON.stringify({
q: text, // 번역할 원본 텍스트
target: targetLang, // 번역할 대상 언어 (예: "ko"는 한국어)
}),
});
const result = await response.json();
return result.data.translations[0].translatedText;
};
export default function App() {
const [text, setText] = useState("");
const [translatedText, setTranslatedText] = useState("");
// 음성 입력 (Speech-to-Text)
const startListening = async () => {
Voice.onSpeechResults = async (event) => {
const originalText = event.value[0]; // 음성 → 텍스트 변환
setText(originalText);
// 번역 수행
const translated = await translateText(originalText, "ko");
setTranslatedText(translated);
};
await Voice.start("en-US"); // 영어로 음성 인식 시작
};
// 번역된 텍스트 음성 출력 (Text-to-Speech)
const speak = () => {
Tts.speak(translatedText, { language: "ko-KR" }); // 한국어로 읽기
};
return (
원본: {text}
번역: {translatedText}
);
}
🔗 코드 설명
1️⃣ Voice.start("en-US") → 영어로 음성을 입력받음 (STT)
2️⃣ translateText(originalText, "ko") → 영어 → 한국어 번역 수행
3️⃣ Tts.speak(translatedText, { language: "ko-KR" }) → 한국어로 음성 출력 (TTS)
반응형
'Mobile' 카테고리의 다른 글
| expo 전역/ 로컬 (0) | 2025.02.24 |
|---|---|
| Expo CLI 설치를 전역에? (0) | 2025.02.24 |
| React 개발자 도구 사용 (0) | 2025.02.24 |
| React 개발자 도구 사용 (0) | 2025.02.24 |
| [RN] Pressable (0) | 2025.02.23 |