Как получить аудио URL со страницы .ejs для использования с Wavesurfer, js - PullRequest
Новая
       17

Как получить аудио URL со страницы .ejs для использования с Wavesurfer, js

0 голосов
/ 14 марта 2019

Я создаю сайт с динамическим музыкальным портфолио, который отображает различные аудио композиции с использованием Node, Express, EJS и MongoDB. Фактические аудиофайлы находятся на сервере Amazon S3. Страница индекса прекрасно работает, используя HTML-аудио с URL-адресом аудиофайла в качестве переменной EJS, но на странице «Показать» для каждой песни я хочу использовать Wavesurfer.js вместо стандартного HTML-аудио для отображения визуальной формы волны.

Поскольку Wavesurfer требует, чтобы я загружал аудио (либо с URL, либо с локально сохраненным файлом) в файл javascript, есть ли способ передать динамически сгенерированный аудио URL со страницы show.ejs: 

<div class="container">

  <h1><%= song.title %></h1>
  <img src="<%= song.image %>" alt="">

  <!-- This is the Wavesurfer visual waveform -->
  <div id="waveform" class=""></div>

  <!-- This is a play button for the audio -->
  <p><i id="play-button" class="play-pause-text fas fa-play"></i></p>

  <!-- ******The audio URL is stored as song.audio ****** -->

  <p><%= song.description %></p>
  <p>
    <a class="btn btn-success" href="/music/<%= song._id %>/comments/new">Add New Comment</a>
  </p>
  <% song.comments.forEach(function(comment) { %>
    <p>
      <strong><%= comment.author %></strong> says: <%= comment.text %>
    </p>
  <% }); %>

</div>

в мой файл JavaScript: 

let playButton = document.getElementById("play-button");

var wavesurfer = WaveSurfer.create({
  container: "#waveform"
});

wavesurfer.load("this-url-comes-from-song.audio");

playButton.addEventListener("click", function() {
  wavesurfer.play();
});

???

Спасибо за помощь, и извините, если это слишком много для начинающего.

...