我在<audio>
标签中有一个MP3和一个M4A文件。MP3文件在Safari和Chrome中播放良好,M4A文件在Chrome中播放正常,但M4A在Safari中不播放。我可以在Safari中看到M4A的音频控件。我点击播放图标,但什么也没发生。
即使是在Safari中播放良好的MP3文件,当我单击"网络"选项卡时,我也会在"预览"选项卡中看到一条"加载资源时出错"的消息。
MP3响应-Safari:
HTTP/1.1 200 OK
Content-Type: audio/mpeg
Content-Disposition: inline; filename=Audio.mp3
X-XSS-Protection: 1
Transfer-Encoding: Identity
Date: Sat, 04 Apr 2020 00:10:29 GMT
Connection: keep-alive
X-Content-Type-Options: nosniff
Accept-Ranges: bytes
X-Frame-Options: SAMEORIGIN
X-Powered-By: Express
X-RequestID: undefined
X-Permitted-Cross-Domain-Policies: none
Strict-Transport-Security: max-age=3600
M4A响应-Safari:
Response
HTTP/1.1 200 OK
Content-Type: audio/mp4
Content-Disposition: inline; filename=Audio.m4a
X-XSS-Protection: 1
Transfer-Encoding: Identity
Date: Sat, 04 Apr 2020 00:10:29 GMT
Connection: keep-alive
X-Content-Type-Options: nosniff
Accept-Ranges: bytes
X-Frame-Options: SAMEORIGIN
X-Powered-By: Express
X-RequestID: undefined
X-Permitted-Cross-Domain-Policies: none
Strict-Transport-Security: max-age=3600
M4响应-Chrome
Accept-Ranges: bytes
Connection: keep-alive
Content-disposition: inline; filename=Audio.m4a
Content-Type: audio/mp4
Date: Sat, 04 Apr 2020 00:15:02 GMT
Strict-Transport-Security: max-age=3600
Transfer-Encoding: chunked
X-Content-Type-Options: nosniff
X-Frame-Options: SAMEORIGIN
X-Permitted-Cross-Domain-Policies: none
X-Powered-By: Express
X-RequestID: undefined
X-XSS-Protection: 1
我把两个源URL放在音频标签上解决了这个问题;相同的URL具有不同的读取编码的方式:
<audio controls>
<source src="{.URL}" type="audio/ogg">
<source src="{.URL}" type="audio/mp4">
</audio>
提供响应的服务器应该具有Accept Ranges标头,以传输由多个部分组成的文件块。你可以在这个答案上看到更多:iPhone/iPad Safari需要';接受范围';视频标题?
我希望这能有所帮助。