App HTML con Gemini File API multimodal — ejemplo generado con IA
VISTA DE CÓDIGO
Prompt
Create a single-page HTML app that demonstrates the Gemini File API for multimodal input. The page must: 1) Allow the user to upload an image, audio, or video file. 2) After upload, send the file URI to the Gemini API (use a simulated/placeholder API key) and display the AI's analysis result. 3) Use a clean modern UI with card layout. 4) Include a loading spinner during processing. 5) Handle errors gracefully with a message. Use CDN for Google's Generative AI client library if needed. Make it visually appealing with a gradient background. Output only the HTML with embedded CSS/JS.
このデモはGemini File APIを使ったマルチモーダル入力を紹介します。画像・音声・動画をアップロードし、分析ボタンをクリックするとAIが解釈した結果を表示します。グラデーション背景とカードレイアウトの洗練されたUI、ローディングスピナー、エラーハンドリングを備えています。実際のGemini APIキーに差し替えれば本稼働します。
Resumen del prompt
Esta demo presenta la entrada multimodal utilizando la API de archivos de Gemini. Permite subir imágenes, audio y video, y al hacer clic en el botón de análisis, muestra los resultados interpretados por la IA. Cuenta con una interfaz de usuario sofisticada con fondo degradado y diseño de tarjetas, un spinner de carga y manejo de errores. Si se reemplaza con una clave real de la API de Gemini, funcionará en producción.
¿Te resultó útil este prompt?
Comentarios
Los comentarios aparecen después de la moderación
この記事が役に立ったら投げ銭で応援
Apple Pay / Google Pay / カード (Visa/Mastercard/JCB/Amex) / Link / Alipay / WeChat Pay 対応 · Stripeで安全に決済
開発者が選ぶ最強ツール集
運営者が毎日使っているツール・ガジェット 6選