Creating Audio elements via JS / accessing files with relative links in JS

Kirby 3 Questions 🤔
1

Hey all! I’m currently struggling with getting my Kirby page online in the same state as on localhost.

I’m using the following line to get an audio element…
const play_sound = new Audio("../../content/3_about/play.wav");

…and play it on hover via JS:

$(".ix-container").hover(function () {
      play_sound.play();
      play_sound.currentTime = 0;
});

This works great on localhost. But on my live site I get the following error for the audio file:

Failed to load resource: the server responded with a status of 404 ()

All other media is loaded via the Kirby syntax like this:

<?php if($image = $page->image('myimage.jpg')): ?>
      <img src="<?= $image->url() ?>" alt="">
<?php endif ?>

I’m assuming there is something different in how files can be accessed on localhost versus after publishing? Is there a way to make this work?

Any help is appreciated. Thank you so much!

2

Access to files in the content folder is blocked by .htaccess. Don’t know what you are running on localhost, maybe the .htaccess isn’t used there.