Safari Cannot Pause/Play mp3 Files Properly

We use html5 audio to create a program to play audio files on your browser.

Due to the need to play multiple files in a row, files were combined and loaded in a browser, but safari did not play properly from pause.

The mp3 file combination is created by simple combination (linux command below).
$cata.mp3b.mp3>c.mp3

The source code is as follows:

test.js 一部Partial excerpt

var lastSoundFile;// Last played voice (used to stop, play)

// Audio playback processing
functionplaySound(){
    varplaySoundFile=newAudio();
    if(playSoundFile.canPlayType("audio/mpeg")}
        playSoundFile.src='c.mp3';
    }
    // Playback
    playSoundFile.addEventListener('canplay', function(){
        playSoundFile.play();
    }, true);

    // Debugging
    $("body").append($("<div/>").attr('id', 'test'));
    playSoundFile.addEventListener('timeupdate', function(){
    playSoundFile.duration=125.15265306122448;
        $("#test").html('<br>position:'+playSoundFile.currentTime
        +'<br>duration:'+playSoundFile.duration
        +'<br>volume:'+playSoundFile.volume
        +'<br>paused:'+playSoundFile.paused);
    }, true);
    playSoundFile.load();
    lastSoundFile=playSoundFile;
}

// Control
function operation(action) {
    if(action=="pause"){
        lastSoundFile.pause();
    } else if(action=="play") {
        lastSoundFile.play();
    }
}

test.html 一部Partial excerpt

<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script src="test.js"></script>
</head>
<body>
<divid="start">
<a href="javascript:void(0)"onclick="playSound();">start</a>
</div>

<divid="control">
<a href="javascript:void(0)"onclick="operation('play');">Play</a>| 
<a href="javascript:void(0)"onclick="operation('pause');">Pause</a>
</div>
</body>
</html>

Go to the above and press start to hear the sound, pause and play.

Safari access, pause, and play. It works fine when the pre-combination a.mp3 part is playing.
b. If you pause or play mp3 parts while they are playing, they will play from the beginning.

I think the reason is that the duration value shown in the debug is only Safari, but I don't know how to solve this problem.

t know how to solve this problem.

The environment is as follows:
MacOSX 10.10.3
Safari 8.0.6

Thank you for your cooperation.

javascript html5 safari

2022-09-29 22:19

2 Answers

Before attempting to play in Safari, first try to see if the b.mp3 part of the c.mp3 can play in the normal audio player.
~~Perhaps any player, not just Safari, will not be able to play it properly.~~

An audio file in MP3 format cannot be combined with a simple combination like cat
(I mean, cat can only correctly merge plain text files, and
Most files in the format cannot be merged correctly with cat).
The b.mp3 part cannot be played because the file is simply corrupted.
To successfully combine audio files, you can use audio editing software like Audacity.

(Note) According to https://en.wikipedia.org/wiki/MP3, MP3 files are composed entirely of repeating MP3 frames, so they can be reproduced properly even with simple binary combinations.As the questioner pointed out, it is wrong that it cannot be played even if it is combined with cat.

However, for unknown reasons, some players may not be able to play the combined audio file with cat properly, and as far as I have tried, Chrome on Windows has not played properly.This seems to be a problem with the implementation of a particular browser, and the workaround for the time being is to combine it with audio editing software.

2022-09-29 22:19

SoundJS or Web Audio
WindowsSafari doesn't seem to support it

https://github.com/CreateJS/SoundJS/issues/60

2022-09-29 22:19

If you have any answers or tips

Popular Tags

python x 4647

android x 1593

java x 1494

javascript x 1427

c x 927

c++ x 878

ruby-on-rails x 696

php x 692

python3 x 685

html x 656