YouTube嵌入iframe无法正常展示广告问题咨询

常见触发原因 #

• 视频权限限制：你所嵌入的两个视频的上传者未开启嵌入场景的广告变现权限，或视频本身因版权问题、内容合规问题不支持投放广告，部分创作者会主动关闭第三方嵌入场景的广告展示。
• 配置项缺失：第一种API调用方案未显式开启广告加载配置，第二种iframe嵌入方案的权限声明缺少广告相关的授权，部分浏览器会因权限不足拦截广告资源。
• 测试环境限制：本地file://协议打开页面时，YouTube广告组件会因安全限制无法加载；测试设备开启广告拦截插件、浏览器自带广告拦截功能、或IP所在地不对应视频的广告投放区域，也会导致广告不展示。
• 账号身份限制：若你是视频所有者本人测试，系统默认不会给内容创作者展示自有视频的广告，可切换普通账号或无痕模式验证。

可落地修复方案 #

• 基础校验：首先确认目标视频已开启嵌入场景广告权限，测试时关闭所有广告拦截工具，将页面部署到HTTPS公网域名下测试，禁止使用本地文件协议调试。
• 调整嵌入代码：
  1. 修复后的YouTube Iframe API调用代码：

  <html>
    <body>
      <div id="video"></div>
    </body>
  
    <script>
      var tag = document.createElement("script");
      tag.src = "https://www.youtube.com/iframe_api";
      var firstScriptTag = document.getElementsByTagName("script")[0];
      firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
  
      function onYouTubeIframeAPIReady() {
        video = new YT.Player("video", {
          height: 360,
          width: 640,
          videoId: "rfYydagxcJI",
          playerVars: {
            fs: 0,
            modestbranding: 1,
            playsinline: 1,
            rel: 0,
            ads: 1
          },
        });
      }
    </script>
  </html>
  

  2. 修复后的iframe直接嵌入代码：

  <iframe width="560" height="315" src="https://www.youtube.com/embed/goSiidPyiYA" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; advertisement" allowfullscreen></iframe>
  

• CSP适配：如果你的站点配置了内容安全策略，需要添加YouTube广告相关域名的放行规则，避免策略拦截广告资源加载。

内容的提问来源于stack exchange，提问作者MUHAMMED IQBAL