MacOS上的Safari不显示我的图像，但chrome和safari移动不显示。

Question

在我的Vuejs(2.6.11)应用程序中，我以这种方式显示来自Google Cloud Storage的图片（v-for的结果）。

<img slot="image" class="card-img-top" :src="img_basepath + result.header_img" alt="Card image cap" >

在iOS的Chrome和Safari中一切都很好，但在Safari 13.1中，图像却被破坏了，显示出带问号的蓝色方块。

如果我使用Safari的检查工具检查HTML，它显示如下。

<div class="card-image">
<img src="https://storage.cloud.google.com/heavnt-test/artistes/May2020/xoGD1P848Id9dmSrLJWX.png" alt="Card image cap" class="card-img-top">
</div>

如果检查加载的资源，我得到了这个。

当然，这个链接是有效的(看这里)，而且，本身在Safari中加载正常。

因为这是唯一一个不能使用的浏览器，我不知道该从哪里寻找解决这个问题。

EDIT 240520 @ 14:14

如果我在我的应用程序中使用firebase Auth登录，那么图像加载......不要帮我知道什么是错的，但如果它可以帮助任何人告诉我......。

Answer 1

查出是因为我用了一个桶的形式一样。

https://storage.cloud.google.com/<bucket name>/<file name>

需要用google账户登录，所以在chrome上工作，因为我在Safari上没有登录。

为了正确访问我的云存储公共文件，我需要使用。

https://storage.googleapis.com/<bucket name>/<file name>