macOS上的Safari没有显示我的图像,但是chrome和safari mobile可以显示

马克斯·阿顿

在我的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中正常加载。

由于它是唯一无法正常工作的浏览器,因此我不知道在哪里可以解决此问题。

编辑24/05/20 @ 14:14

如果我使用Firebase Auth登录我的应用程序,则图像会加载..不要帮助我知道出了什么问题,但是如果它可以帮助任何人告诉我...

马克斯·阿顿

找出原因是因为我使用了以下形式的存储桶:

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

要求使用Google帐户登录,因此它在chrome上正常工作,因为我未在Safari上登录。

要正确访问我的Cloud Storage公共文件,我需要使用:

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

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

我的子菜单没有在 safari 中显示,但在 chrome 和 firefox 中显示

Firefox不显示元素,但Chrome和Safari可以显示元素

Safari Mobile和Twitter Bootstrap不显示图像

为什么我的JPEG2000格式(.jp2)图像在Safari中显示,但在Chrome或Brave中却没有显示?

特定字体未显示在Google Chrome上,但Safari可以

CSS显示Flex在Chrome和Safari上无法正常工作

为什么我的图片无法在Safari中显示但可以在Chrome中显示?

CSS 图像没有作为背景显示在 CSS 上,但是当我将其作为图像插入时会出现

仅在chrome和safari上损坏的响应式布局,但是Firefox可以工作

SVG图层图像不以纵向模式显示在Mobile Safari中

OpenTypeFont 未显示在 Firefox 和 Safari 上

css3转换在safari和chrome上的显示方式有所不同

Rails应用仅在Chrome上正确显示。对于Firefox和Safari,所有样式均无法正确加载

为什么我的图像没有显示在我的网页上?

Safari 显示不正确的图像方向,但在 Chrome 上正确

我的图像不会通过Netlify.app网站显示在Safari上

托管时,图像不会在 Chrome 或 Safari 中显示

十六进制颜色在Mac上的Chrome和Safari之间显示不同

我正在使用Toast在ListViewItem单击上显示,但是Toast没有显示

CSS背景url显示带有Bracket的实时预览,但是当直接由Chrome或Safari打开时不起作用

在Safari和Mobile Chrome上以编程方式播放有声视频

PNG格式的图像不会在Mac Safari上显示

图像的边框颜色在 Safari 上显示为红色

显示Flex在Chrome和Safari中的行为有所不同

为什么我的内嵌svg无法在Safari(台式机和移动设备)上正确显示?

Safari和Chrome中未显示单选按钮

显示:flex; 不适用于iPad(Chrome和Safari)

Chrome显示加载gif的方式与Safari和Firefox不同

学习c,我的代码可以运行,但是没有显示打印?