无法播放来自 Google 云存储的音频

Cannot play audio from Google Cloud Storage

请帮忙。我无法播放我的音频文件。它托管在 Google 云存储中,如果我只是在本地主机服务器上运行它,但当我使用上传的服务器时,它就可以工作。我经常收到 (failed)net::ERR_CONTENT_DECODING_FAILED

下面是我如何在我的 VueJS 中使用我的音频文件

<template>
    <v-btn @click="triggerSound">Trigger Sound</v-btn>
    <audio id="notif" src="adn.wxt.com/zhuanchu.wav" />
</template>

<script>
    mounted() {
        this.notifyAudio = document.getElementById('notif')
    },
    methods: {
        async triggerSound() {
            this.notifyAudio.play()
        }
    },
</script>

更新

出现此错误的原因有很多。

当 HTTP 请求的 headers 声称内容是 gzip 编码时会发生此错误,而实际上它不是(请参阅下面的内容以获取更多解释)。可以通过在您使用的浏览器中关闭 gzip 编码来修复此错误。

如果这没有解决您的问题,请尝试添加此标志 -> gcloud alpha storage cp gs://bucket/file.gz . --no-gzip-encoding

我最后的解决方案是通过 gsutil -h --header-download "Accept-Encoding: gzip"


关于错误的更深入的解释

冗余行为

您不应将元数据设置为冗余报告 object:

的压缩
gsutil setmeta -h "Content-Type:application/gzip" \
-h "Content-Encoding:gzip"

这意味着您正在上传 gzip-compressed object 已经 gzip-compressed 第二次 通常情况并非如此。当在这样一个错误报告的 object 上发生解压缩转码时,object 被提供身份编码,但请求者认为他们收到了一个 object,它仍然有一个与之相关的压缩层。 尝试解压缩 object 将失败。

不属于 gzip-compressed 的文件不应使用 Content-Encoding: gzip 上传。这样做会使 object 看起来符合转码条件,但是当对 object 发出请求时,转码尝试失败。

双重压缩

一些 object,例如许多视频、音频和图像文件,更不用说 gzip 文件本身,已经被压缩了。在这样的 object 上使用 gzip 几乎没有任何好处:在几乎所有情况下,由于 gzip 开销,这样做会使 object 变大。因此,通常不鼓励对压缩内容使用 gzip,这可能会导致意外行为。

例如,虽然 Cloud Storage 允许“双重压缩”objects(即 objects gzip-compressed 但也有一个基础 Content-Type本身是压缩的)上传和存储,它不允许 object 以双重压缩状态提供服务,除非它们的 Cache-Control 元数据包含 no-transform。相反,它删除了外部 gzip 压缩级别,删除 Content-Encoding 响应 header,并提供结果 object。即使对于 Accept-Encoding: gzip 的请求也会发生这种情况。因此,客户端收到的文件与上传和存储在云存储中的文件不具有相同的校验和,因此任何完整性检查都会失败。