This topic was automatically generated from Slack. You can find the original thread here.
Could someone help me with responding a readable stream? In the documentation, it’s written that I can use $.respond() with the body set to a readable stream, but when I try it, it seems the steps wait for the the entire stream to be buffered before sending back the response. The readable stream is from elevenlabs stream endpoint, which returns an audio stream. The documentation link to an example workflow but unfortunately the link seems broken.
Here’s my code:
import axios from 'axios';
export default defineComponent({
async run({ steps, $ }) {
class ElevenLabsAPI {
constructor(apiKey) {
this.apiKey = apiKey;
this.baseURL = 'https://api.elevenlabs.io/v1';
}
async textToSpeech(voiceId, text) {
const endpoint = `${this.baseURL}/text-to-speech/${voiceId}/stream`;
const headers = {
'xi-api-key': this.apiKey,
'Content-Type': 'application/json'
};
const data = {
text: text,
model_id: "eleven_multilingual_v2",
voice_settings: {
stability: 0.3,
similarity_boost: 0.35,
style: 0.4,
use_speaker_boost: true
}
};
try {
const response = await axios.post(endpoint, data, {
headers: headers,
responseType: 'stream'
});
await $.respond({
status: 202,
headers: { 'Content-Type': 'audio/mpeg' },
body: response.data
});
} catch (error) {
await $.respond({
immediate: true,
status: 502,
body: `ElevenLabs API error: ${error.message}`
});
console.log(error);
}
}
}
const voiceId = '1NJX0B85u1WnhL6ZkG2n';
const articleContent = (steps.python && steps.python.$return_value) ? steps.python.$return_value : steps.trigger.event.body.html;
const api = new ElevenLabsAPI(process.env.ELEVENLABS_API_KEY);
await api.textToSpeech(voiceId, articleContent);
},
});