Im not so good with vite and all of this new javascript technologys, im sure this is something very easy to solve but i´ve been stuck a lot.
After hours i´ve manage to install the tts voice cloning.
But now i need to use the API to call a function.
This is the main.js file :
`// script.js
import { client } from "@gradio/client";
document.addEventListener('DOMContentLoaded', (event) => {
document.getElementById("playButton").addEventListener("click", async () => {
try {
// Asume que tienes un archivo de audio local llamado prueba.wav en tu directorio público
const audioURL = '/prueba.wav'; // URL relativa al archivo de audio servido por Vite
const response_0 = await fetch(audioURL);
const exampleAudio = await response_0.blob();
// Usar el prefijo /api que Vite redirigirá al servidor de Gradio
const app = await client("/api");
const result = await app.predict("/handle_recorded_audio", [
exampleAudio, // blob del archivo de audio
"Rogger", // Ejemplo de dato para 'Select Speaker'
"Hello!!", // Ejemplo de dato para 'Add new Speaker'
]);
console.log(result.data);
} catch (error) {
console.error('Error:', error);
}
});
I´ve also configure CORS policy right(i think). But is not working. The error does not say anything. This is what is loged whenever i press the play audio button :
This is the proyect that i´ve manage to set up ziped : mmtt.com.ar/zips/crcosc2.zip
Im not sure what else to try, can someone point out where the error is or give me an example of how to make this work ?
Im not so good with vite and all of this new javascript technologys, im sure this is something very easy to solve but i´ve been stuck a lot.
After hours i´ve manage to install the tts voice cloning.
But now i need to use the API to call a function.
This is the main.js file :
`// script.js import { client } from "@gradio/client";
document.addEventListener('DOMContentLoaded', (event) => { document.getElementById("playButton").addEventListener("click", async () => { try { // Asume que tienes un archivo de audio local llamado
prueba.waven tu directorio público const audioURL = '/prueba.wav'; // URL relativa al archivo de audio servido por Vite const response_0 = await fetch(audioURL); const exampleAudio = await response_0.blob();}); `
I´ve tryed with a file with local and also with the file hosted at the api : https://github.com/gradio-app/gradio/raw/main/test/test_files/audio_sample.wav
I´ve also configure CORS policy right(i think). But is not working. The error does not say anything. This is what is loged whenever i press the play audio button :
main.js:22 Error: {type: 'status', endpoint: '/handle_recorded_audio', fn_index: 1, time: Wed Jan 31 2024 20:49:23 GMT-0300 (hora estándar de Argentina), queue: true, …}code: undefinedendpoint: "/handle_recorded_audio"fn_index: 1message: nullqueue: truestage: "error"success: falsetime: Wed Jan 31 2024 20:49:23 GMT-0300 (hora estándar de Argentina)[[Prototype]]: Objecttype: "status"[[Prototype]]: Objectconstructor: ƒ Object()hasOwnProperty: ƒ hasOwnProperty()isPrototypeOf: ƒ isPrototypeOf()propertyIsEnumerable: ƒ propertyIsEnumerable()toLocaleString: ƒ toLocaleString()toString: ƒ toString()valueOf: ƒ valueOf()__defineGetter__: ƒ __defineGetter__()__defineSetter__: ƒ __defineSetter__()__lookupGetter__: ƒ __lookupGetter__()__lookupSetter__: ƒ __lookupSetter__()__proto__: (...)get __proto__: ƒ __proto__()length: 0name: "get __proto__"arguments: (...)caller: (...)[[Prototype]]: ƒ ()[[Scopes]]: Scopes[0]set __proto__: ƒ __proto__()length: 1name: "set __proto__"arguments: (...)caller: (...)[[Prototype]]: ƒ ()[[Scopes]]: Scopes[0] (anonymous) @ main.js:22This is the proyect that i´ve manage to set up ziped : mmtt.com.ar/zips/crcosc2.zip Im not sure what else to try, can someone point out where the error is or give me an example of how to make this work ?