// 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 (
Generated Caption: {generatedCaption}