Аудио треки iPad HTML5 не сбрасываются - PullRequest
0 голосов
/ 02 апреля 2012

По какой-то странной причине HTML5 Audio API не дает мне доступ к currentTime в iOS 4 и 5 для iPad и iPod.Мне нужно настроить currentTime всякий раз, когда воспроизводится аудиоэлемент, но он действует так, как будто текущее время недоступно.Искал везде ответ на этот вопрос, и я не могу понять это.Мой код ниже прекрасно работает во всех современных браузерах, поэтому я немного озадачен.

Моя HTML-разметка

<p>
    <a class="audio" href="assets/audio/ambient-sounds-1.mp3" data-flash="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/niftyplayer.swf" data-mp3="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/ambient-sounds-1.mp3" data-ogg="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/ambient-sounds-1.ogg">
        Ambient Sounds
        <span class="audio-play">Play</span>
        <audio preload="">
            <source preload="" src="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/ambient-sounds-1.mp3" type="audio/mpeg">
            <source preload="" src="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/ambient-sounds-1.ogg" type="audio/ogg">
        </audio>
    </a>
</p>

<p>
    <a class="audio" href="assets/audio/city_street.mp3" data-flash="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/niftyplayer.swf" data-mp3="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/city_street.mp3" data-ogg="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/city_street.ogg">
        City Street Sounds
        <span class="audio-play">Play</span>
        <audio preload="">
            <source preload="" src="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/city_street.mp3" type="audio/mpeg">
            <source preload="" src="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/city_street.ogg" type="audio/ogg">
        </audio>
    </a>
</p>

<p>
    <a class="audio" href="#" data-flash="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/niftyplayer.swf" data-mp3="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/crash.mp3" data-ogg="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/crash.ogg">
        Loud Crash
        <span class="audio-play">Play</span>
        <audio preload="">
            <source preload="" src="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/crash.mp3" type="audio/mpeg">
            <source preload="" src="http://athens.sierrabravo.net/~ablue/plato/videoplayer/assets/audio/crash.ogg" type="audio/ogg">
        </audio>
    </a>
</p>

Мой JavaScript

AudioPlayer = {
    init: function () {
        var player = this;
        this.audio = $('.audio'); // Save and cache all audio elements so they can be targeted by mass stop()

        player.audio.each( function() {
            // Bind each audio element
            player.bind($(this));
        });
    },

    bind: function (object) {
        var player = this;

        object.bind('touchstart click', function() {

            // get the real DOM element, not the jQuery array
            var audio = $(this).find('audio').get(0);

            if(audio.paused) { // Check if its playing
                player.play(audio);
            }
            else {
                player.stop(audio);
            }

            return false;
        });
    },

    play: function(audio) {
        // Stop all existing audio elements and set them to 0
        this.audio.each( function() {
            var audioOther = $(this).find('audio').get(0);
            audioOther.pause();
        });

        // Play the audio element
        if(audio.currentTime) audio.currentTime = 0;
        audio.play();
    },

    stop: function(audio) {       
        if(audio.currentTime) audio.currentTime = 0;
        audio.play();
    }

};

Ответы [ 3 ]

1 голос
/ 16 апреля 2012

У меня тоже такая же проблема и гуглил потом нашел эту страницу и страницу ниже

http://remysharp.com/2010/12/23/audio-sprites/

этот парень, вероятно, нашел более подробный ответ.

1 голос
/ 24 октября 2012

У меня были такие типы проблем, и я тоже начал использовать этот отчаянный способ решения проблемы, который состоит в воссоздании аудио компонента, перезагрузке источника и так далее.

День или два назад я обнаружил, что источник медиа-контента должен быть "чистым", чтобы иметь возможность успешно использовать его с ipad.

Я хочу выразить «чисто» весь контент, который не «трансмутируется» предыдущим кодом, который может изменить или удалить его метаданные до того, как он достигнет клиента ipad.

В текущем проекте, над которым я работаю, я обнаружил, что с Ipad я не мог ни воспроизводить, ни переходить к mm: ss контенту, находящемуся в папке «документы», но если я получил этот файл и переместился в другое место, он работал отлично , Я мог бы воспроизвести его на своем Ipad, перейти к минуте: секунду, которую я хотел, и так далее.

В моем случае .htaccess заставлял мой сервер apache отправлять запрос "get" через файл "download.php", который проверял разрешения и делал странные вещи и тому подобное, а затем этот download.php отправлял файл клиенту, но не в хорошем смысле или в большей степени, как Ipad.

Я удалил привязки .htaccess, и ipad снова получил хорошую обработку звука. (Этот файл download.php в любом случае был не слишком полезен ...)

1 голос
/ 03 апреля 2012

Существует ответ на вопрос, почему мой код не работает, iOS 4 и 5 требуют полного уничтожения аудиоэлемента (ужасное решение, но оно работает). Вот краткое изложение того, как исправить мою проблему, если вы столкнулись с ней.

  1. Вставьте только 1 элемент на страницу (я вставил свой прямо перед закрывающим тегом).
  2. Нажмите, чтобы воспроизвести новый аудиоэлемент, полностью уничтожьте существующий и восстановите его с нуля с новым треком, который вы хотите воспроизвести.
  3. Позвоните .play на аудиоэлемент, и все будет хорошо.
...