为什么 iframe 仅在 iOS 中是空白的?

Vie*_*wed 5 html iframe google-apps-script ios ios14

有一个 html 页面可以在任何 Windows 和 Android 上正常工作(显示 iframe 的内容)。由 Github Pages 托管。它适用于 iOS 版本12.5.1,但不适用于14.6(Chrome、Safari、Opera上的空白页面)。为什么?

  • src维基百科试过- 一切正常。问题归结为 iframe 和src应用程序脚本的组合(分别正确打开)
  • 假设问题是http/https根据post混合。只是http风格http://www.w3.org/2000/svg,我改为https(甚至删除了所有风格)。没有效果。
  • 没有日志错误,只有空白页。似乎试图加载,但中断并停止。我没有要调试的 ios 设备。反馈用户。

如果您有 iOS 14,可以尝试打开此站点。你看到什么空白页或访问错误?

像下一个错误是正确的。它告诉你没有访问。

拒绝在框架中显示“accounts.google.com/...”,因为它将“X-Frame-Options”设置为“DENY”

如果您登录Google 帐户并重试,则 Google 云端硬盘会出错。我在隐身模式下的任何平台上都拥有这一切。不要关注他们。

对空白屏幕/停止加载的情况感兴趣,如下面的截图

iOS 14.6

在此处输入图片说明

视窗

在此处输入图片说明

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Goofy</title>
    <style>
        html, body, iframe { width: 100%; height: 100%; margin: 0; border: 0; }
    </style>
</head>
<body>
    <iframe src="https://script.google.com/macros/s/AKfycbzmAfVL_ozEP69vpYvMo3t1Qlc4orPfk7eV5rWT/exec"></iframe>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

Apps 脚本呈现页面 XFrameOptionsMode.ALLOWALL

<!DOCTYPE html>
<html lang="ru">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Goofy</title>
    <style>
        html, body, iframe { width: 100%; height: 100%; margin: 0; border: 0; }
    </style>
</head>
<body>
    <iframe src="https://script.google.com/macros/s/AKfycbzmAfVL_ozEP69vpYvMo3t1Qlc4orPfk7eV5rWT/exec"></iframe>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)

Vie*_*wed 4

现在默认情况下会阻止跨站点资源的 Cookie(iOS 13+)。来源。其他平台(iOS 12、Windows、Android)则不这样做。此类 cookie 需要github.io通过iframegoogle验证用户src。这就是为什么我在 iOS 14 上看到空白页面。

解决方法是转到浏览器设置并允许第 3 方 cookie。

谢希瓦姆的回答