微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Google 协作平台代码嵌入模块中的图像未显示在 iOS 设备上

如何解决Google 协作平台代码嵌入模块中的图像未显示在 iOS 设备上

我在 Google 协作平台的嵌入式代码字段中使用了以下代码来在我的网站上显示图像,在我的 Windows、Linux 和 Android 设备上一切正常,但它们没有显示在 iPhone 上(无论是使用 Chrome 或 Safari)!

一些上下文/约束: 我正在从我的 Google Drive 中提取我的图片。它们是 ~80kb JPEG。 我正在使用 HTML 表单,因为我有其他元素(按钮、字段),我已从下面的代码摘录中删除了这些元素,以关注该问题。我需要保留这张表格。

您以前遇到过这个问题吗?

<form name="submit-to-google-sheet">
   <img id="img1" width=163 height=227>
</form>

<script>
    const img1 = document.getElementById('img1');
    img1.src = "https://docs.google.com/uc?export=view&id={imageGoogleDriveID}";
</script>

PS:我已经探索了 Base64 格式,它允许在 iOS 操作的设备上显示图像。如果我只是将图像源设置为 Base64 字符串,它就可以工作。但是我不能像 JPEG 一样方便地从 Drive 调用 Base64 文件。我正在处理 250 多个图像,因此我不能在代码中间使用 base64 字符串,因为它太大而无法使用。我尝试使用 this example 之后的 base64_encode 函数对图像进行编码,但没有设法显示任何内容。我已经钻了这么多,我实际上想知道这是否是正确的方法

解决方法

我们刚刚找到了适用于 iOS 的修复程序:当第三方 cookie 和跨站点跟踪被阻止时,图像不会加载。 here 解释了要切换的设置。

Base64 不是解决方案,因为问题来自从我的 Google Drive 中提取图像,即与我的网站不同的域。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。