Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

i am using this lib in reactjs project. but there is a problem with recording tts and user voices both #48

Open
calmness28 opened this issue Jan 13, 2024 · 0 comments

Comments

@calmness28
Copy link

i am using this library to record an audio of user and also tts speech of the device but it is not recording tts voice but it is recording user's voice.

here ho i am using this library in code:
`
onst recorder = new MicRecorder({ bitRate: 128 });

export const startRecording = (isRecording, setIsRecording) => {
// Проверяем поддержку API
if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
console.error("Браузер не поддерживает запись аудио");
setIsRecording({
...isRecording,
isSupported: false,
});
return;
}

// Запрашиваем доступ к микрофону
navigator.mediaDevices
.getUserMedia({ audio: true })
.then((stream) => {
// Начинаем запись
recorder
.start(stream)
.then(() => {
console.log("Запись началась");
setIsRecording({
...isRecording,
isRecording: true,
});
toast("Your voice is being recorded!");
// setIsRecording(true); // Раскомментируйте, если нужно обновить состояние
})
.catch((err) => {
setIsRecording({
...isRecording,
isRejected: true,
});
console.error("Ошибка при начале записи: ", err);
});
})
.catch((err) => {
setIsRecording({
...isRecording,
isRejected: true,
});
console.error("Нет доступа к микрофону: ", err);
});
};

export const stopRecording = (setUrlVal) => {
recorder
.stop()
.getMp3()
.then(([buffer, blob]) => {
const file = new File(buffer, "me-at-thevoice.mp3", {
type: blob.type,
lastModified: Date.now(),
});
setUrlVal(file);
})
.catch((e) => {
alert(
"error is " +
e.message +
" + \nPlease contact us and say what error occured!"
);

  console.error(e);
});

};
`

here is how i am using broser tts api:

`
import { toast } from "react-toastify";
export async function SpeakFunc(data, length = "not") {
await new Promise((resolve) => {
if ("speechSynthesis" in window) {
if (length === "not") {
const synth = window.speechSynthesis;

    const utterThis = new SpeechSynthesisUtterance(data);

    // Set the language to English
    utterThis.lang = "en-US";

    // Set the voice to an English voice

    let letterCount = getLetterCount(data);
    // Set up the onend event handler
    setTimeout(() => {
      resolve();
    }, Math.round(letterCount / 12) * 1000);
    // Resolve the promise when speech ends

    synth.speak(utterThis);
  } else if (length?.is) {
    const synth = window.speechSynthesis;

    const utterThis = new SpeechSynthesisUtterance(data);

    // Set the language to English
    utterThis.lang = "en-US";

    // Set the voice to an English voice

    let letterCount = getLetterCount(data);
    // Set up the onend event handler

    setTimeout(() => {
      resolve();
    }, Math.round(letterCount / 12) * 1000);

    synth.speak(utterThis);
  }
} else {
  toast(
    "Your Browser does not supper our system. Please Open with Chrome or google!"
  );
  console.error("Speech synthesis is not supported in this browser.");
  window.location.href = "/notFound";
}

});
}

const getLetterCount = (data) => {
let real = data
?.trim()
?.split("")
?.filter((el) => {
if (el !== " " && el !== "?" && el !== "." && el !== "," && el !== "-") {
return el;
}
})
?.join("").length;

return real;
};

`

please help to resolve this issue. thank you for your help

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant