音频元素的 Blob Url 适用于 http，但不适用于 https答案

【问题标题】：Blob Url for Audio element is working for http, but, not working for https音频元素的 Blob Url 适用于 http，但不适用于 https
【发布时间】：2022-11-30 04:15:53
【问题描述】：

以下是 React.js 组件的一部分

const response = await fetch(path, { 
    method: 'POST',
    headers: {
        'Content-Type': 'application/json'
    },
    body: JSON.stringify({ avatarId: currentAvatar, text })
});

const responseBlob = await response.blob()

const objectURL = URL.createObjectURL(responseBlob);
setUrl(objectURL);

<audio id="audioclip" controls>
  <source src={url} type="audio/mpeg" />
</audio>

正在为 http（为本地主机工作）加载 Blob url，但是，它没有为生产站点中的“https”加载。

任何帮助将不胜感激。

上面的代码在 http://localhost:3000 中运行。音频 blob url 在开发中正确加载。但是，这在使用 https 的生产站点中不起作用。我在 Chrome 浏览器中尝试过。

【问题讨论】：

此问题与 AWS API Gateway 相关。我已通过将媒体类型添加到二进制媒体类型部分并重新部署 API 来更新 API 网关设置。它解决了这个问题。

标签： html reactjs html5-audio

【解决方案1】：

此问题与 AWS API Gateway 相关。我已通过将媒体类型添加到二进制媒体类型部分并重新部署 API 来更新 API 网关设置。它解决了这个问题。

添加的二进制媒体类型：

音频/mpeg 文本/html

【讨论】：