React Native calling for TTS help

API
1

Dear all, I wish someone can help me here. I am new to api and most importantly I am trying to call the openai from mobile as I am testing something from ios device with React Native (EXPO) but used prebuild (development build) in EXPO framework. Everything worked fine, such as my test app runs on ios simulator can perform ‘speech recognise’ while I press button to talk and I can see text both in console log and on screen’s text component. My testing app also can uses tts EXPO voice to speak out my text but just sounds very computer and dull. What I want now is to make openai API call to generate audio that return from openai and I can playback that audio file to user. I can see there is even node js example code from openai API reference, but I cannot run it due to react native dose not support ‘fs’, and path.resolve since they are not react native components, but if someone has rewritten this into EXPO filesystem, please can you share with me your working version here. Thank you very much.

import OpenAI from "openai";
import { apiKey } from '../constants';
import * as FileSystem from 'expo-file-system';

const openai = new OpenAI({
  apiKey: apiKey
});

async function generateTTSAudio() {
  try {
    const response = await openai.audio.speech.create({
      model: "tts-1",
      voice: "alloy",
      input: "Today is a wonderful day to build something people love!",
    }, { responseType: 'arraybuffer' });

    const audioBuffer = Buffer.from(response.data);

    const fileUri = FileSystem.documentDirectory + 'speech' + Date.now() + '.mp3';
    await FileSystem.writeAsStringAsync(fileUri, audioBuffer.toString('base64'), { encoding: FileSystem.EncodingType.Base64 });

    console.log('Audio file saved at:', fileUri);
  } catch (error) {
    console.error('Error generating TTS:', error);
  }
}

export default generateTTSAudio;

There are error message:
Error generating TTS: [ReferenceError: Property ‘Buffer’ doesn’t exist]

2

You need to import Buffer.

import { Buffer } from 'buffer'
3

@asihan.khang did you figure it out in the end? I ended up creating an npm package openai-react-native that supports file upload using the expo file system and chat completion streaming using react native sse. The client does not currently support the audio endpoint because I was not using, but I could add very quickly if you still needed it