iOS设备中从Instagram跳转至Next.js网站时Cloudinary视频首次加载失败的问题求助

大家好，我最近在Next.js项目里碰到了个挺棘手的视频加载问题，想请各位帮忙分析分析：

当用户从Instagram页面跳转访问我的网站时，Cloudinary托管的视频会加载失败，但这个问题只在iOS设备上出现。而且情况有点特殊：只有首页首次渲染的时候会出问题，如果先导航到其他页面再返回首页，视频就能正常加载播放了。

我目前生成Cloudinary视频URL的代码是这样的：

const url = getCldVideoUrl(
    {
      width: 1920,
      height: 1080,
      src: 'https://res.cloudinary.com/CLOUD_NAME/VIDEO_SRC.mp4',
      quality: 'auto',
    },
    {
      cloud: {
        cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME,
        apiKey: process.env.CLOUDINARY_API,
        apiSecret: process.env.CLOUDINARY_API_SECRET,
      },
    },
  );

页面中渲染video组件的代码如下：

<video
  src={url}
  autoPlay
  loop
  muted
  playsInline
  controls={false}
  className="absolute inset-0 size-full object-cover"
>
  Your browser does not support the video tag.
</video>

我已经确认Cloudinary的环境变量配置是正确的，视频本身在其他场景（比如直接访问网站、Android设备从Instagram跳转）都能正常加载，唯独卡在iOS+Instagram跳转的首次渲染这个场景。有没有朋友遇到过类似问题，或者能给我一些排查方向？

备注：内容来源于stack exchange，提问作者unrecognized2304