Skip to content

Adjuntos ​

Pasa objetos File, FileList o FilePart a sendMessage. Los archivos se leen como data URLs y se guardan como partes file en el mensaje del usuario.

vue
<script setup lang="ts">
const { messages, input, sendMessage } = useChat({ provider: ai, model: 'gpt-4o' })
const files = ref<FileList>()

async function submit() {
  await sendMessage({ text: input.value, files: files.value })
  input.value = ''
  files.value = undefined
}
</script>

<template>
  <input type="file" multiple @change="files = ($event.target as HTMLInputElement).files ?? undefined">
  <input v-model="input" @keydown.enter="submit">
</template>

El texto es opcional: sendMessage({ files }) envía solo los adjuntos.

Las URLs remotas se saltan el paso de subida:

ts
sendMessage({ text: 'Describe this', files: { type: 'file', mediaType: 'image/png', url: 'https://example.com/cat.png' } })

Compatibilidad por proveedor ​

ProveedorImágenesPDFAudioTextoURLs remotas
OpenAI✓✓wav, mp3insertado como textosolo imágenes
Anthropic✓✓—✓ (document)imágenes, PDF
Google✓✓✓✓URIs fileData
Ollama✓——insertado como texto—

Las combinaciones no compatibles lanzan un error descriptivo antes de enviar la petición.

Helpers ​

ts
import { fileToDataURL, convertFilesToParts } from 'vue-llm'

const url = await fileToDataURL(blob)
const parts = await convertFilesToParts(input.files) // FilePart[]

Publicado bajo la licencia MIT.