Spaces:
Runtime error
Runtime error
// src/App.js | |
import React, { useState } from 'react'; | |
import axios from 'axios'; | |
function App() { | |
const [generatedCaption, setGeneratedCaption] = useState(''); | |
const [audioPath, setAudioPath] = useState(''); | |
const handleImageUpload = async (event) => { | |
const formData = new FormData(); | |
formData.append('image', event.target.files[0]); | |
try { | |
// ทำ HTTP request ไปยัง Flask API | |
const response = await axios.post('/generate_caption', formData); | |
// Extract ข้อมูลจาก response | |
const { generated_caption, audio_path } = response.data; | |
// ใช้ข้อมูลที่ได้จาก Flask API | |
setGeneratedCaption(generated_caption); | |
setAudioPath(audio_path); | |
} catch (error) { | |
console.error('Error uploading image:', error); | |
} | |
}; | |
return ( | |
<div> | |
<input type="file" onChange={handleImageUpload} /> | |
<p>Generated Caption: {generatedCaption}</p> | |
<audio controls src={audioPath} /> | |
</div> | |
); | |
} | |
export default App; | |