Невозможно воспроизвести радиоисточник в формате html5 - PullRequest
0 голосов
/ 07 мая 2018

У меня есть пара радиоисточников:

Радио 1 - http://ice3.securenetsystems.net/CKDX?playSessionID=2F01BCBA-BE9D-2A65-5B280ECE3E397AFE

Радио 2 - http://ice5.securenetsystems.net/CIRV?playSessionID=2EFE4082-EC1E-6FA0-10941E29181F671A

Первоначально они работают нормально, но когда я помещаю эти источники в HTML перед src, они перестают работать, и он не может воспроизводить звук.

Вот мой код:

<link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous">

<div class="container">
        <span class="trigger-audio fa fa-play">
             <audio src="http://ice3.securenetsystems.net/CKDX?playSessionID=2F01BCBA-BE9D-2A65-5B280ECE3E397AFE"
                volume="1.0">
            </audio>
        </span>
        <br>
        <br>
        <br>
         <span class="trigger-audio fa fa-play">
            <audio src="http://ice5.securenetsystems.net/CIRV?playSessionID=2EFE4082-EC1E-6FA0-10941E29181F671A"
                volume="1.0">
                 </audio>
            </span>
            
<script>
const audioButtons = document.querySelectorAll('.trigger-audio')
const buttonToStopAllAudios = document.querySelector('.fa-stop')

const getAudioElementFromButton = buttonElement =>
  buttonElement.querySelector('audio')

const stopAudioFromButton = buttonElement => {
  // Pause the audio
  getAudioElementFromButton(buttonElement).pause()

  // Update element classes
  buttonElement.classList.add('fa-play')
  buttonElement.classList.remove('fa-pause')
}

const playAudioFromButton = buttonElement => {
  // Pause the audio
  getAudioElementFromButton(buttonElement).play()

  // Update element classes
  buttonElement.classList.remove('fa-play')
  buttonElement.classList.add('fa-pause')
}

audioButtons.forEach(audioButton => {
  audioButton.addEventListener('click', () => {
    // I get this first because I have to pause all the audios before doing anything, so I have to know it this audio was paused or not
    const audioElement = getAudioElementFromButton(audioButton)
    const audioIsPaused = audioElement.paused

    // Stop all audios before starting this one
    audioButtons.forEach(stopAudioFromButton)

    audioIsPaused
      ? playAudioFromButton(audioButton) // Play if it's paused
      : stopAudioFromButton(audioButton) // Pause if it's playing
  })
})

buttonToStopAllAudios.addEventListener('click', () => {
  audioButtons.forEach(stopAudioFromButton)
})
</script>

Какой самый простой способ это исправить?

Я новичок, поэтому любая помощь будет оценена. :)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...