Unable to play m4a on Windows

Question

I have an audio file recorded from the iPhone's Voice Memos app (.m4a, compressed). I'm trying to get it to play on any device using the audio tag.

<audio ...>
  <source src={file.href} type="audio/x-m4a" />
</audio>

The file is saved on the backend where the mimetype shows as audio/x-m4a.

This was working when the page is opened from an Apple device like an iPhone. But on a Windows machine, Chrome can't play it - the controls are grayed out like it was unable to load the file.

I found this answer and it seems like I need to use audio/mp4 for m4a files. I created a utility function:

static fixMimeType = (mimeType: string) => {
  if (mimeType.toLowerCase() === 'video/quicktime') {
    // Use video/mp4 for .mov files
    // https://stackoverflow.com/a/44858204/5530965
    return 'video/mp4';
  }

  if (mimeType.toLowerCase() === 'audio/x-m4a' || mimeType.toLowerCase() === 'audio/m4a') {
    // Use audio/mp4 for .m4a files
    // https://stackoverflow.com/a/58551410/5530965
    return 'audio/mp4';
  }

  return mimeType;
};

But even if I change the mimetype to audio/mp4 it still doesn't play on Windows, but it's still fine on iPhone.