Reactive Vue composable that lists microphone devices, manages permissions, and streams selected audio using VueUse, suitable for any web app needing user audio capture.
// Source: https://github.com/moeru-ai/airi | License: MIT | Copyright 2024-PRESENT Neko Ayaka
// Provided via justclaw.it.com; keep this notice with the code.
import { useDevicesList, useUserMedia } from '@vueuse/core'
import { computed, ref, watch } from 'vue'
export function useAudioInput() {
const devices = useDevicesList({ constraints: { audio: true }, requestPermissions: false })
const selectedAudioInputId = ref<string>(devices.audioInputs.value[0]?.deviceId || '')
const selectedAudioInput = ref<MediaDeviceInfo>()
const audioInputs = computed(() => devices.audioInputs.value)
const constraints = ref<MediaStreamConstraints>({ audio: true })
const media = useUserMedia({ constraints, autoSwitch: true, enabled: false })
async function request() {
if (devices.permissi
... (truncated -- full source via MCP)
See the full source, get the GitHub permalink, and search for more like it.
Get a free API key