expresar punto final :

 app.get('/test', (request, response) => { response.sendFile("/absolute/path/to/file/myfile.mp3"); });

Prueba.vue :

 <template> <div> <p>test {{text}}</p> <audio controls="controls" src="./myfile.mp3"> </audio> </div> </template> <script> import axios from "axios"; export default { name: 'Test', data: function () { return { text: 'hello', audio: "" } }, created() { this.$watch( () => this.$route.params, () => { alert("fetching") this.fetchData() }, { immediate: true } ) }, methods: { fetchData() { axios.get('http://localhost:3000/test', { params: { } }) .then((response) => { alert("done") alert(JSON.stringify(response)); const url = URL.createObjectURL(response); alert(url); }); } } } </script>

Cuando cargo el Test.vue obtengo:

primera alerta :

segunda alerta :

tercera alerta :

y luego aparece la página:

Sé que necesito conectar la respuesta recibida de express al elemento <audio> , pero no estoy seguro de cómo hacerlo. Y noté que la alert(url) nunca se muestra (no aparece ninguna ventana de alerta).

Express está en localhost:3000 y Vue está en localhost:8080 . Cuando voy a http://localhost:3000/test , obtengo la página con el archivo de audio reproducible, por lo que Express backend hace su trabajo: